/* BEGIN Light */ @font-face { font-family: 'Open Sans'; src: url("../fonts/Light/OpenSans-Light.eot?v=1.1.0"); src: url("../fonts/Light/OpenSans-Light.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/Light/OpenSans-Light.woff2?v=1.1.0") format("woff2"), url("../fonts/Light/OpenSans-Light.woff?v=1.1.0") format("woff"), url("../fonts/Light/OpenSans-Light.ttf?v=1.1.0") format("truetype"), url("../fonts/Light/OpenSans-Light.svg?v=1.1.0#Light") format("svg"); font-weight: 300; font-style: normal; } /* END Light */ /* BEGIN Light Italic */ @font-face { font-family: 'Open Sans'; src: url("../fonts/LightItalic/OpenSans-LightItalic.eot?v=1.1.0"); src: url("../fonts/LightItalic/OpenSans-LightItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/LightItalic/OpenSans-LightItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/LightItalic/OpenSans-LightItalic.woff?v=1.1.0") format("woff"), url("../fonts/LightItalic/OpenSans-LightItalic.ttf?v=1.1.0") format("truetype"), url("../fonts/LightItalic/OpenSans-LightItalic.svg?v=1.1.0#LightItalic") format("svg"); font-weight: 300; font-style: italic; } /* END Light Italic */ /* BEGIN Regular */ @font-face { font-family: 'Open Sans'; src: url("../fonts/Regular/OpenSans-Regular.eot?v=1.1.0"); src: url("../fonts/Regular/OpenSans-Regular.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/Regular/OpenSans-Regular.woff2?v=1.1.0") format("woff2"), url("../fonts/Regular/OpenSans-Regular.woff?v=1.1.0") format("woff"), url("../fonts/Regular/OpenSans-Regular.ttf?v=1.1.0") format("truetype"), url("../fonts/Regular/OpenSans-Regular.svg?v=1.1.0#Regular") format("svg"); font-weight: normal; font-style: normal; } /* END Regular */ /* BEGIN Italic */ @font-face { font-family: 'Open Sans'; src: url("../fonts/Italic/OpenSans-Italic.eot?v=1.1.0"); src: url("../fonts/Italic/OpenSans-Italic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/Italic/OpenSans-Italic.woff2?v=1.1.0") format("woff2"), url("../fonts/Italic/OpenSans-Italic.woff?v=1.1.0") format("woff"), url("../fonts/Italic/OpenSans-Italic.ttf?v=1.1.0") format("truetype"), url("../fonts/Italic/OpenSans-Italic.svg?v=1.1.0#Italic") format("svg"); font-weight: normal; font-style: italic; } /* END Italic */ /* BEGIN Semibold */ @font-face { font-family: 'Open Sans'; src: url("../fonts/Semibold/OpenSans-Semibold.eot?v=1.1.0"); src: url("../fonts/Semibold/OpenSans-Semibold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/Semibold/OpenSans-Semibold.woff2?v=1.1.0") format("woff2"), url("../fonts/Semibold/OpenSans-Semibold.woff?v=1.1.0") format("woff"), url("../fonts/Semibold/OpenSans-Semibold.ttf?v=1.1.0") format("truetype"), url("../fonts/Semibold/OpenSans-Semibold.svg?v=1.1.0#Semibold") format("svg"); font-weight: 600; font-style: normal; } /* END Semibold */ /* BEGIN Semibold Italic */ @font-face { font-family: 'Open Sans'; src: url("../fonts/SemiboldItalic/OpenSans-SemiboldItalic.eot?v=1.1.0"); src: url("../fonts/SemiboldItalic/OpenSans-SemiboldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/SemiboldItalic/OpenSans-SemiboldItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/SemiboldItalic/OpenSans-SemiboldItalic.woff?v=1.1.0") format("woff"), url("../fonts/SemiboldItalic/OpenSans-SemiboldItalic.ttf?v=1.1.0") format("truetype"), url("../fonts/SemiboldItalic/OpenSans-SemiboldItalic.svg?v=1.1.0#SemiboldItalic") format("svg"); font-weight: 600; font-style: italic; } /* END Semibold Italic */ /* BEGIN Bold */ @font-face { font-family: 'Open Sans'; src: url("../fonts/Bold/OpenSans-Bold.eot?v=1.1.0"); src: url("../fonts/Bold/OpenSans-Bold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/Bold/OpenSans-Bold.woff2?v=1.1.0") format("woff2"), url("../fonts/Bold/OpenSans-Bold.woff?v=1.1.0") format("woff"), url("../fonts/Bold/OpenSans-Bold.ttf?v=1.1.0") format("truetype"), url("../fonts/Bold/OpenSans-Bold.svg?v=1.1.0#Bold") format("svg"); font-weight: bold; font-style: normal; } /* END Bold */ /* BEGIN Bold Italic */ @font-face { font-family: 'Open Sans'; src: url("../fonts/BoldItalic/OpenSans-BoldItalic.eot?v=1.1.0"); src: url("../fonts/BoldItalic/OpenSans-BoldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/BoldItalic/OpenSans-BoldItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/BoldItalic/OpenSans-BoldItalic.woff?v=1.1.0") format("woff"), url("../fonts/BoldItalic/OpenSans-BoldItalic.ttf?v=1.1.0") format("truetype"), url("../fonts/BoldItalic/OpenSans-BoldItalic.svg?v=1.1.0#BoldItalic") format("svg"); font-weight: bold; font-style: italic; } /* END Bold Italic */ /* BEGIN Extrabold */ @font-face { font-family: 'Open Sans'; src: url("../fonts/ExtraBold/OpenSans-ExtraBold.eot?v=1.1.0"); src: url("../fonts/ExtraBold/OpenSans-ExtraBold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/ExtraBold/OpenSans-ExtraBold.woff2?v=1.1.0") format("woff2"), url("../fonts/ExtraBold/OpenSans-ExtraBold.woff?v=1.1.0") format("woff"), url("../fonts/ExtraBold/OpenSans-ExtraBold.ttf?v=1.1.0") format("truetype"), url("../fonts/ExtraBold/OpenSans-ExtraBold.svg?v=1.1.0#ExtraBold") format("svg"); font-weight: 800; font-style: normal; } /* END Extrabold */ /* BEGIN Extrabold Italic */ @font-face { font-family: 'Open Sans'; src: url("../fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.eot?v=1.1.0"); src: url("../fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.woff?v=1.1.0") format("woff"), url("../fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.ttf?v=1.1.0") format("truetype"), url("../fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.svg?v=1.1.0#ExtraBoldItalic") format("svg"); font-weight: 800; font-style: italic; } /* END Extrabold Italic */ /*! Bootstrap v4.0.0-alpha.4 (http://getbootstrap.com) Copyright 2011-2016 The Bootstrap Authors Copyright 2011-2016 Twitter, Inc. Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */ /*! normalize.css v4.0.0 | MIT License | github.com/necolas/normalize.css */ html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body { margin: 0; } article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } progress { vertical-align: baseline; } template, [hidden] { display: none; } a { background-color: transparent; } a:active, a:hover { outline-width: 0; } abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted; } b, strong { font-weight: inherit; } b, strong { font-weight: bolder; } dfn { font-style: italic; } h1 { font-size: 2em; margin: 0.67em 0; } mark { background-color: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } svg:not(:root) { overflow: hidden; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } figure { margin: 1em 40px; } hr { box-sizing: content-box; height: 0; overflow: visible; } button, input, select, textarea { font: inherit; } optgroup { font-weight: bold; } button, input, select { overflow: visible; } button, input, select, textarea { margin: 0; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { cursor: pointer; } [disabled] { cursor: default; } button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } button:-moz-focusring, input:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; } [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } html { box-sizing: border-box; } *, *::before, *::after { box-sizing: inherit; } @-ms-viewport { width: device-width; } html { font-size: 10px; -ms-overflow-style: scrollbar; -webkit-tap-highlight-color: transparent; } body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-size: 1rem; line-height: 1.5; color: #373a3c; background-color: #fff; } [tabindex="-1"]:focus { outline: none !important; } h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: .5rem; } p { margin-top: 0; margin-bottom: 1rem; } abbr[title], abbr[data-original-title] { cursor: help; border-bottom: 1px dotted #818a91; } address { margin-bottom: 1rem; font-style: normal; line-height: inherit; } ol, ul, dl { margin-top: 0; margin-bottom: 1rem; } ol ol, ul ul, ol ul, ul ol { margin-bottom: 0; } dt { font-weight: bold; } dd { margin-bottom: .5rem; margin-left: 0; } blockquote { margin: 0 0 1rem; } a { color: #0275d8; text-decoration: none; } a:focus, a:hover { color: #014c8c; text-decoration: underline; } a:focus { outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } a:not([href]):not([tabindex]) { color: inherit; text-decoration: none; } a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover { color: inherit; text-decoration: none; } a:not([href]):not([tabindex]):focus { outline: none; } pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; } figure { margin: 0 0 1rem; } img { vertical-align: middle; } [role="button"] { cursor: pointer; } a, area, button, [role="button"], input, label, select, summary, textarea { -ms-touch-action: manipulation; touch-action: manipulation; } table { border-collapse: collapse; background-color: transparent; } caption { padding-top: 0.75rem; padding-bottom: 0.75rem; color: #818a91; text-align: left; caption-side: bottom; } th { text-align: left; } label { display: inline-block; margin-bottom: .5rem; } button:focus { outline: 1px dotted; outline: 5px auto -webkit-focus-ring-color; } input, button, select, textarea { margin: 0; line-height: inherit; border-radius: 0; } input[type="radio"]:disabled, input[type="checkbox"]:disabled { cursor: not-allowed; } input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"] { -webkit-appearance: listbox; } textarea { resize: vertical; } fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } legend { display: block; width: 100%; padding: 0; margin-bottom: .5rem; font-size: 1.5rem; line-height: inherit; } input[type="search"] { -webkit-appearance: none; } output { display: inline-block; } [hidden] { display: none !important; } .container { margin-left: auto; margin-right: auto; padding-left: 5px; padding-right: 5px; } @media (min-width: 544px) { .container { max-width: 640px; } } @media (min-width: 768px) { .container { max-width: 758px; } } @media (min-width: 992px) { .container { max-width: 982px; } } @media (min-width: 1200px) { .container { max-width: 1140px; } } @media (min-width: 1600px) { .container { max-width: 1440px; } } @media (min-width: 2100px) { .container { max-width: 1920px; } } .container-fluid { margin-left: auto; margin-right: auto; padding-left: 5px; padding-right: 5px; } .row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-left: -5px; margin-right: -5px; } .col-phoneS-1, .col-phoneS-2, .col-phoneS-3, .col-phoneS-4, .col-phoneS-5, .col-phoneS-6, .col-phoneS-7, .col-phoneS-8, .col-phoneS-9, .col-phoneS-10, .col-phoneS-11, .col-phoneS-12, .col-phoneL-1, .col-phoneL-2, .col-phoneL-3, .col-phoneL-4, .col-phoneL-5, .col-phoneL-6, .col-phoneL-7, .col-phoneL-8, .col-phoneL-9, .col-phoneL-10, .col-phoneL-11, .col-phoneL-12, .col-tabletP-1, .col-tabletP-2, .col-tabletP-3, .col-tabletP-4, .col-tabletP-5, .col-tabletP-6, .col-tabletP-7, .col-tabletP-8, .col-tabletP-9, .col-tabletP-10, .col-tabletP-11, .col-tabletP-12, .col-tabletL-1, .col-tabletL-2, .col-tabletL-3, .col-tabletL-4, .col-tabletL-5, .col-tabletL-6, .col-tabletL-7, .col-tabletL-8, .col-tabletL-9, .col-tabletL-10, .col-tabletL-11, .col-tabletL-12, .col-desktopS-1, .col-desktopS-2, .col-desktopS-3, .col-desktopS-4, .col-desktopS-5, .col-desktopS-6, .col-desktopS-7, .col-desktopS-8, .col-desktopS-9, .col-desktopS-10, .col-desktopS-11, .col-desktopS-12, .col-desktopM-1, .col-desktopM-2, .col-desktopM-3, .col-desktopM-4, .col-desktopM-5, .col-desktopM-6, .col-desktopM-7, .col-desktopM-8, .col-desktopM-9, .col-desktopM-10, .col-desktopM-11, .col-desktopM-12, .col-desktopL-1, .col-desktopL-2, .col-desktopL-3, .col-desktopL-4, .col-desktopL-5, .col-desktopL-6, .col-desktopL-7, .col-desktopL-8, .col-desktopL-9, .col-desktopL-10, .col-desktopL-11, .col-desktopL-12, .contact-page #partnership .items .col-phoneS-1, .contact-page #partnership .items .col-phoneS-2, .contact-page #partnership .items .col-phoneS-3, .contact-page #partnership .items .col-phoneS-4, .contact-page #partnership .items .col-phoneS-5, .contact-page #partnership .items .col-phoneS-6, .contact-page #partnership .items .col-phoneS-7, .contact-page #partnership .items .col-phoneS-8, .contact-page #partnership .items .col-phoneS-9, .contact-page #partnership .items .col-phoneS-10, .contact-page #partnership .items .col-phoneL-1, .contact-page #partnership .items .col-phoneL-2, .contact-page #partnership .items .col-phoneL-3, .contact-page #partnership .items .col-phoneL-4, .contact-page #partnership .items .col-phoneL-5, .contact-page #partnership .items .col-phoneL-6, .contact-page #partnership .items .col-phoneL-7, .contact-page #partnership .items .col-phoneL-8, .contact-page #partnership .items .col-phoneL-9, .contact-page #partnership .items .col-phoneL-10, .contact-page #partnership .items .col-tabletP-1, .contact-page #partnership .items .col-tabletP-2, .contact-page #partnership .items .col-tabletP-3, .contact-page #partnership .items .col-tabletP-4, .contact-page #partnership .items .col-tabletP-5, .contact-page #partnership .items .col-tabletP-6, .contact-page #partnership .items .col-tabletP-7, .contact-page #partnership .items .col-tabletP-8, .contact-page #partnership .items .col-tabletP-9, .contact-page #partnership .items .col-tabletP-10, .contact-page #partnership .items .col-tabletL-1, .contact-page #partnership .items .col-tabletL-2, .contact-page #partnership .items .col-tabletL-3, .contact-page #partnership .items .col-tabletL-4, .contact-page #partnership .items .col-tabletL-5, .contact-page #partnership .items .col-tabletL-6, .contact-page #partnership .items .col-tabletL-7, .contact-page #partnership .items .col-tabletL-8, .contact-page #partnership .items .col-tabletL-9, .contact-page #partnership .items .col-tabletL-10, .contact-page #partnership .items .col-desktopS-1, .contact-page #partnership .items .col-desktopS-2, .contact-page #partnership .items .col-desktopS-3, .contact-page #partnership .items .col-desktopS-4, .contact-page #partnership .items .col-desktopS-5, .contact-page #partnership .items .col-desktopS-6, .contact-page #partnership .items .col-desktopS-7, .contact-page #partnership .items .col-desktopS-8, .contact-page #partnership .items .col-desktopS-9, .contact-page #partnership .items .col-desktopS-10, .contact-page #partnership .items .col-desktopM-1, .contact-page #partnership .items .col-desktopM-2, .contact-page #partnership .items .col-desktopM-3, .contact-page #partnership .items .col-desktopM-4, .contact-page #partnership .items .col-desktopM-5, .contact-page #partnership .items .col-desktopM-6, .contact-page #partnership .items .col-desktopM-7, .contact-page #partnership .items .col-desktopM-8, .contact-page #partnership .items .col-desktopM-9, .contact-page #partnership .items .col-desktopM-10, .contact-page #partnership .items .col-desktopL-1, .contact-page #partnership .items .col-desktopL-2, .contact-page #partnership .items .col-desktopL-3, .contact-page #partnership .items .col-desktopL-4, .contact-page #partnership .items .col-desktopL-5, .contact-page #partnership .items .col-desktopL-6, .contact-page #partnership .items .col-desktopL-7, .contact-page #partnership .items .col-desktopL-8, .contact-page #partnership .items .col-desktopL-9, .contact-page #partnership .items .col-desktopL-10, .values-page #numbers .items .col-phoneS-1, .about-us-page #numbers .items .col-phoneS-1, .values-page #numbers .items .col-phoneS-2, .about-us-page #numbers .items .col-phoneS-2, .values-page #numbers .items .col-phoneS-3, .about-us-page #numbers .items .col-phoneS-3, .values-page #numbers .items .col-phoneS-4, .about-us-page #numbers .items .col-phoneS-4, .values-page #numbers .items .col-phoneS-5, .about-us-page #numbers .items .col-phoneS-5, .values-page #numbers .items .col-phoneS-6, .about-us-page #numbers .items .col-phoneS-6, .values-page #numbers .items .col-phoneS-7, .about-us-page #numbers .items .col-phoneS-7, .values-page #numbers .items .col-phoneS-8, .about-us-page #numbers .items .col-phoneS-8, .values-page #numbers .items .col-phoneS-9, .about-us-page #numbers .items .col-phoneS-9, .values-page #numbers .items .col-phoneS-10, .about-us-page #numbers .items .col-phoneS-10, .values-page #numbers .items .col-phoneL-1, .about-us-page #numbers .items .col-phoneL-1, .values-page #numbers .items .col-phoneL-2, .about-us-page #numbers .items .col-phoneL-2, .values-page #numbers .items .col-phoneL-3, .about-us-page #numbers .items .col-phoneL-3, .values-page #numbers .items .col-phoneL-4, .about-us-page #numbers .items .col-phoneL-4, .values-page #numbers .items .col-phoneL-5, .about-us-page #numbers .items .col-phoneL-5, .values-page #numbers .items .col-phoneL-6, .about-us-page #numbers .items .col-phoneL-6, .values-page #numbers .items .col-phoneL-7, .about-us-page #numbers .items .col-phoneL-7, .values-page #numbers .items .col-phoneL-8, .about-us-page #numbers .items .col-phoneL-8, .values-page #numbers .items .col-phoneL-9, .about-us-page #numbers .items .col-phoneL-9, .values-page #numbers .items .col-phoneL-10, .about-us-page #numbers .items .col-phoneL-10, .values-page #numbers .items .col-tabletP-1, .about-us-page #numbers .items .col-tabletP-1, .values-page #numbers .items .col-tabletP-2, .about-us-page #numbers .items .col-tabletP-2, .values-page #numbers .items .col-tabletP-3, .about-us-page #numbers .items .col-tabletP-3, .values-page #numbers .items .col-tabletP-4, .about-us-page #numbers .items .col-tabletP-4, .values-page #numbers .items .col-tabletP-5, .about-us-page #numbers .items .col-tabletP-5, .values-page #numbers .items .col-tabletP-6, .about-us-page #numbers .items .col-tabletP-6, .values-page #numbers .items .col-tabletP-7, .about-us-page #numbers .items .col-tabletP-7, .values-page #numbers .items .col-tabletP-8, .about-us-page #numbers .items .col-tabletP-8, .values-page #numbers .items .col-tabletP-9, .about-us-page #numbers .items .col-tabletP-9, .values-page #numbers .items .col-tabletP-10, .about-us-page #numbers .items .col-tabletP-10, .values-page #numbers .items .col-tabletL-1, .about-us-page #numbers .items .col-tabletL-1, .values-page #numbers .items .col-tabletL-2, .about-us-page #numbers .items .col-tabletL-2, .values-page #numbers .items .col-tabletL-3, .about-us-page #numbers .items .col-tabletL-3, .values-page #numbers .items .col-tabletL-4, .about-us-page #numbers .items .col-tabletL-4, .values-page #numbers .items .col-tabletL-5, .about-us-page #numbers .items .col-tabletL-5, .values-page #numbers .items .col-tabletL-6, .about-us-page #numbers .items .col-tabletL-6, .values-page #numbers .items .col-tabletL-7, .about-us-page #numbers .items .col-tabletL-7, .values-page #numbers .items .col-tabletL-8, .about-us-page #numbers .items .col-tabletL-8, .values-page #numbers .items .col-tabletL-9, .about-us-page #numbers .items .col-tabletL-9, .values-page #numbers .items .col-tabletL-10, .about-us-page #numbers .items .col-tabletL-10, .values-page #numbers .items .col-desktopS-1, .about-us-page #numbers .items .col-desktopS-1, .values-page #numbers .items .col-desktopS-2, .about-us-page #numbers .items .col-desktopS-2, .values-page #numbers .items .col-desktopS-3, .about-us-page #numbers .items .col-desktopS-3, .values-page #numbers .items .col-desktopS-4, .about-us-page #numbers .items .col-desktopS-4, .values-page #numbers .items .col-desktopS-5, .about-us-page #numbers .items .col-desktopS-5, .values-page #numbers .items .col-desktopS-6, .about-us-page #numbers .items .col-desktopS-6, .values-page #numbers .items .col-desktopS-7, .about-us-page #numbers .items .col-desktopS-7, .values-page #numbers .items .col-desktopS-8, .about-us-page #numbers .items .col-desktopS-8, .values-page #numbers .items .col-desktopS-9, .about-us-page #numbers .items .col-desktopS-9, .values-page #numbers .items .col-desktopS-10, .about-us-page #numbers .items .col-desktopS-10, .values-page #numbers .items .col-desktopM-1, .about-us-page #numbers .items .col-desktopM-1, .values-page #numbers .items .col-desktopM-2, .about-us-page #numbers .items .col-desktopM-2, .values-page #numbers .items .col-desktopM-3, .about-us-page #numbers .items .col-desktopM-3, .values-page #numbers .items .col-desktopM-4, .about-us-page #numbers .items .col-desktopM-4, .values-page #numbers .items .col-desktopM-5, .about-us-page #numbers .items .col-desktopM-5, .values-page #numbers .items .col-desktopM-6, .about-us-page #numbers .items .col-desktopM-6, .values-page #numbers .items .col-desktopM-7, .about-us-page #numbers .items .col-desktopM-7, .values-page #numbers .items .col-desktopM-8, .about-us-page #numbers .items .col-desktopM-8, .values-page #numbers .items .col-desktopM-9, .about-us-page #numbers .items .col-desktopM-9, .values-page #numbers .items .col-desktopM-10, .about-us-page #numbers .items .col-desktopM-10, .values-page #numbers .items .col-desktopL-1, .about-us-page #numbers .items .col-desktopL-1, .values-page #numbers .items .col-desktopL-2, .about-us-page #numbers .items .col-desktopL-2, .values-page #numbers .items .col-desktopL-3, .about-us-page #numbers .items .col-desktopL-3, .values-page #numbers .items .col-desktopL-4, .about-us-page #numbers .items .col-desktopL-4, .values-page #numbers .items .col-desktopL-5, .about-us-page #numbers .items .col-desktopL-5, .values-page #numbers .items .col-desktopL-6, .about-us-page #numbers .items .col-desktopL-6, .values-page #numbers .items .col-desktopL-7, .about-us-page #numbers .items .col-desktopL-7, .values-page #numbers .items .col-desktopL-8, .about-us-page #numbers .items .col-desktopL-8, .values-page #numbers .items .col-desktopL-9, .about-us-page #numbers .items .col-desktopL-9, .values-page #numbers .items .col-desktopL-10, .about-us-page #numbers .items .col-desktopL-10, .wall-plug.us #section5 .features .col-phoneS-1, .wall-plug.us #section5 .features .col-phoneS-2, .wall-plug.us #section5 .features .col-phoneS-3, .wall-plug.us #section5 .features .col-phoneS-4, .wall-plug.us #section5 .features .col-phoneS-5, .wall-plug.us #section5 .features .col-phoneS-6, .wall-plug.us #section5 .features .col-phoneS-7, .wall-plug.us #section5 .features .col-phoneS-8, .wall-plug.us #section5 .features .col-phoneS-9, .wall-plug.us #section5 .features .col-phoneS-10, .wall-plug.us #section5 .features .col-phoneL-1, .wall-plug.us #section5 .features .col-phoneL-2, .wall-plug.us #section5 .features .col-phoneL-3, .wall-plug.us #section5 .features .col-phoneL-4, .wall-plug.us #section5 .features .col-phoneL-5, .wall-plug.us #section5 .features .col-phoneL-6, .wall-plug.us #section5 .features .col-phoneL-7, .wall-plug.us #section5 .features .col-phoneL-8, .wall-plug.us #section5 .features .col-phoneL-9, .wall-plug.us #section5 .features .col-phoneL-10, .wall-plug.us #section5 .features .col-tabletP-1, .wall-plug.us #section5 .features .col-tabletP-2, .wall-plug.us #section5 .features .col-tabletP-3, .wall-plug.us #section5 .features .col-tabletP-4, .wall-plug.us #section5 .features .col-tabletP-5, .wall-plug.us #section5 .features .col-tabletP-6, .wall-plug.us #section5 .features .col-tabletP-7, .wall-plug.us #section5 .features .col-tabletP-8, .wall-plug.us #section5 .features .col-tabletP-9, .wall-plug.us #section5 .features .col-tabletP-10, .wall-plug.us #section5 .features .col-tabletL-1, .wall-plug.us #section5 .features .col-tabletL-2, .wall-plug.us #section5 .features .col-tabletL-3, .wall-plug.us #section5 .features .col-tabletL-4, .wall-plug.us #section5 .features .col-tabletL-5, .wall-plug.us #section5 .features .col-tabletL-6, .wall-plug.us #section5 .features .col-tabletL-7, .wall-plug.us #section5 .features .col-tabletL-8, .wall-plug.us #section5 .features .col-tabletL-9, .wall-plug.us #section5 .features .col-tabletL-10, .wall-plug.us #section5 .features .col-desktopS-1, .wall-plug.us #section5 .features .col-desktopS-2, .wall-plug.us #section5 .features .col-desktopS-3, .wall-plug.us #section5 .features .col-desktopS-4, .wall-plug.us #section5 .features .col-desktopS-5, .wall-plug.us #section5 .features .col-desktopS-6, .wall-plug.us #section5 .features .col-desktopS-7, .wall-plug.us #section5 .features .col-desktopS-8, .wall-plug.us #section5 .features .col-desktopS-9, .wall-plug.us #section5 .features .col-desktopS-10, .wall-plug.us #section5 .features .col-desktopM-1, .wall-plug.us #section5 .features .col-desktopM-2, .wall-plug.us #section5 .features .col-desktopM-3, .wall-plug.us #section5 .features .col-desktopM-4, .wall-plug.us #section5 .features .col-desktopM-5, .wall-plug.us #section5 .features .col-desktopM-6, .wall-plug.us #section5 .features .col-desktopM-7, .wall-plug.us #section5 .features .col-desktopM-8, .wall-plug.us #section5 .features .col-desktopM-9, .wall-plug.us #section5 .features .col-desktopM-10, .wall-plug.us #section5 .features .col-desktopL-1, .wall-plug.us #section5 .features .col-desktopL-2, .wall-plug.us #section5 .features .col-desktopL-3, .wall-plug.us #section5 .features .col-desktopL-4, .wall-plug.us #section5 .features .col-desktopL-5, .wall-plug.us #section5 .features .col-desktopL-6, .wall-plug.us #section5 .features .col-desktopL-7, .wall-plug.us #section5 .features .col-desktopL-8, .wall-plug.us #section5 .features .col-desktopL-9, .wall-plug.us #section5 .features .col-desktopL-10 { position: relative; min-height: 1px; padding-right: 5px; padding-left: 5px; width: 100%; } .col-phoneS { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .col-phoneS-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .col-phoneS-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .col-phoneS-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-phoneS-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .col-phoneS-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .col-phoneS-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-phoneS-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .col-phoneS-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .col-phoneS-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-phoneS-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .col-phoneS-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .col-phoneS-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .pull-phoneS-0 { right: auto; } .pull-phoneS-1 { right: 8.33333%; } .pull-phoneS-2 { right: 16.66667%; } .pull-phoneS-3 { right: 25%; } .pull-phoneS-4 { right: 33.33333%; } .pull-phoneS-5 { right: 41.66667%; } .pull-phoneS-6 { right: 50%; } .pull-phoneS-7 { right: 58.33333%; } .pull-phoneS-8 { right: 66.66667%; } .pull-phoneS-9 { right: 75%; } .pull-phoneS-10 { right: 83.33333%; } .pull-phoneS-11 { right: 91.66667%; } .pull-phoneS-12 { right: 100%; } .push-phoneS-0 { left: auto; } .push-phoneS-1 { left: 8.33333%; } .push-phoneS-2 { left: 16.66667%; } .push-phoneS-3 { left: 25%; } .push-phoneS-4 { left: 33.33333%; } .push-phoneS-5 { left: 41.66667%; } .push-phoneS-6 { left: 50%; } .push-phoneS-7 { left: 58.33333%; } .push-phoneS-8 { left: 66.66667%; } .push-phoneS-9 { left: 75%; } .push-phoneS-10 { left: 83.33333%; } .push-phoneS-11 { left: 91.66667%; } .push-phoneS-12 { left: 100%; } .offset-phoneS-1 { margin-left: 8.33333%; } .offset-phoneS-2 { margin-left: 16.66667%; } .offset-phoneS-3 { margin-left: 25%; } .offset-phoneS-4 { margin-left: 33.33333%; } .offset-phoneS-5 { margin-left: 41.66667%; } .offset-phoneS-6 { margin-left: 50%; } .offset-phoneS-7 { margin-left: 58.33333%; } .offset-phoneS-8 { margin-left: 66.66667%; } .offset-phoneS-9 { margin-left: 75%; } .offset-phoneS-10 { margin-left: 83.33333%; } .offset-phoneS-11 { margin-left: 91.66667%; } @media (min-width: 544px) { .col-phoneL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .col-phoneL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .col-phoneL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .col-phoneL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-phoneL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .col-phoneL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .col-phoneL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-phoneL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .col-phoneL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .col-phoneL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-phoneL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .col-phoneL-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .col-phoneL-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .pull-phoneL-0 { right: auto; } .pull-phoneL-1 { right: 8.33333%; } .pull-phoneL-2 { right: 16.66667%; } .pull-phoneL-3 { right: 25%; } .pull-phoneL-4 { right: 33.33333%; } .pull-phoneL-5 { right: 41.66667%; } .pull-phoneL-6 { right: 50%; } .pull-phoneL-7 { right: 58.33333%; } .pull-phoneL-8 { right: 66.66667%; } .pull-phoneL-9 { right: 75%; } .pull-phoneL-10 { right: 83.33333%; } .pull-phoneL-11 { right: 91.66667%; } .pull-phoneL-12 { right: 100%; } .push-phoneL-0 { left: auto; } .push-phoneL-1 { left: 8.33333%; } .push-phoneL-2 { left: 16.66667%; } .push-phoneL-3 { left: 25%; } .push-phoneL-4 { left: 33.33333%; } .push-phoneL-5 { left: 41.66667%; } .push-phoneL-6 { left: 50%; } .push-phoneL-7 { left: 58.33333%; } .push-phoneL-8 { left: 66.66667%; } .push-phoneL-9 { left: 75%; } .push-phoneL-10 { left: 83.33333%; } .push-phoneL-11 { left: 91.66667%; } .push-phoneL-12 { left: 100%; } .offset-phoneL-0 { margin-left: 0%; } .offset-phoneL-1 { margin-left: 8.33333%; } .offset-phoneL-2 { margin-left: 16.66667%; } .offset-phoneL-3 { margin-left: 25%; } .offset-phoneL-4 { margin-left: 33.33333%; } .offset-phoneL-5 { margin-left: 41.66667%; } .offset-phoneL-6 { margin-left: 50%; } .offset-phoneL-7 { margin-left: 58.33333%; } .offset-phoneL-8 { margin-left: 66.66667%; } .offset-phoneL-9 { margin-left: 75%; } .offset-phoneL-10 { margin-left: 83.33333%; } .offset-phoneL-11 { margin-left: 91.66667%; } } @media (min-width: 768px) { .col-tabletP { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .col-tabletP-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .col-tabletP-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .col-tabletP-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-tabletP-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .col-tabletP-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .col-tabletP-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-tabletP-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .col-tabletP-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .col-tabletP-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-tabletP-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .col-tabletP-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .col-tabletP-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .pull-tabletP-0 { right: auto; } .pull-tabletP-1 { right: 8.33333%; } .pull-tabletP-2 { right: 16.66667%; } .pull-tabletP-3 { right: 25%; } .pull-tabletP-4 { right: 33.33333%; } .pull-tabletP-5 { right: 41.66667%; } .pull-tabletP-6 { right: 50%; } .pull-tabletP-7 { right: 58.33333%; } .pull-tabletP-8 { right: 66.66667%; } .pull-tabletP-9 { right: 75%; } .pull-tabletP-10 { right: 83.33333%; } .pull-tabletP-11 { right: 91.66667%; } .pull-tabletP-12 { right: 100%; } .push-tabletP-0 { left: auto; } .push-tabletP-1 { left: 8.33333%; } .push-tabletP-2 { left: 16.66667%; } .push-tabletP-3 { left: 25%; } .push-tabletP-4 { left: 33.33333%; } .push-tabletP-5 { left: 41.66667%; } .push-tabletP-6 { left: 50%; } .push-tabletP-7 { left: 58.33333%; } .push-tabletP-8 { left: 66.66667%; } .push-tabletP-9 { left: 75%; } .push-tabletP-10 { left: 83.33333%; } .push-tabletP-11 { left: 91.66667%; } .push-tabletP-12 { left: 100%; } .offset-tabletP-0 { margin-left: 0%; } .offset-tabletP-1 { margin-left: 8.33333%; } .offset-tabletP-2 { margin-left: 16.66667%; } .offset-tabletP-3 { margin-left: 25%; } .offset-tabletP-4 { margin-left: 33.33333%; } .offset-tabletP-5 { margin-left: 41.66667%; } .offset-tabletP-6 { margin-left: 50%; } .offset-tabletP-7 { margin-left: 58.33333%; } .offset-tabletP-8 { margin-left: 66.66667%; } .offset-tabletP-9 { margin-left: 75%; } .offset-tabletP-10 { margin-left: 83.33333%; } .offset-tabletP-11 { margin-left: 91.66667%; } } @media (min-width: 992px) { .col-tabletL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .col-tabletL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .col-tabletL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .col-tabletL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-tabletL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .col-tabletL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .col-tabletL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-tabletL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .col-tabletL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .col-tabletL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-tabletL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .col-tabletL-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .col-tabletL-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .pull-tabletL-0 { right: auto; } .pull-tabletL-1 { right: 8.33333%; } .pull-tabletL-2 { right: 16.66667%; } .pull-tabletL-3 { right: 25%; } .pull-tabletL-4 { right: 33.33333%; } .pull-tabletL-5 { right: 41.66667%; } .pull-tabletL-6 { right: 50%; } .pull-tabletL-7 { right: 58.33333%; } .pull-tabletL-8 { right: 66.66667%; } .pull-tabletL-9 { right: 75%; } .pull-tabletL-10 { right: 83.33333%; } .pull-tabletL-11 { right: 91.66667%; } .pull-tabletL-12 { right: 100%; } .push-tabletL-0 { left: auto; } .push-tabletL-1 { left: 8.33333%; } .push-tabletL-2 { left: 16.66667%; } .push-tabletL-3 { left: 25%; } .push-tabletL-4 { left: 33.33333%; } .push-tabletL-5 { left: 41.66667%; } .push-tabletL-6 { left: 50%; } .push-tabletL-7 { left: 58.33333%; } .push-tabletL-8 { left: 66.66667%; } .push-tabletL-9 { left: 75%; } .push-tabletL-10 { left: 83.33333%; } .push-tabletL-11 { left: 91.66667%; } .push-tabletL-12 { left: 100%; } .offset-tabletL-0 { margin-left: 0%; } .offset-tabletL-1 { margin-left: 8.33333%; } .offset-tabletL-2 { margin-left: 16.66667%; } .offset-tabletL-3 { margin-left: 25%; } .offset-tabletL-4 { margin-left: 33.33333%; } .offset-tabletL-5 { margin-left: 41.66667%; } .offset-tabletL-6 { margin-left: 50%; } .offset-tabletL-7 { margin-left: 58.33333%; } .offset-tabletL-8 { margin-left: 66.66667%; } .offset-tabletL-9 { margin-left: 75%; } .offset-tabletL-10 { margin-left: 83.33333%; } .offset-tabletL-11 { margin-left: 91.66667%; } } @media (min-width: 1200px) { .col-desktopS { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .col-desktopS-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .col-desktopS-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .col-desktopS-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-desktopS-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .col-desktopS-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .col-desktopS-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-desktopS-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .col-desktopS-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .col-desktopS-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-desktopS-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .col-desktopS-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .col-desktopS-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .pull-desktopS-0 { right: auto; } .pull-desktopS-1 { right: 8.33333%; } .pull-desktopS-2 { right: 16.66667%; } .pull-desktopS-3 { right: 25%; } .pull-desktopS-4 { right: 33.33333%; } .pull-desktopS-5 { right: 41.66667%; } .pull-desktopS-6 { right: 50%; } .pull-desktopS-7 { right: 58.33333%; } .pull-desktopS-8 { right: 66.66667%; } .pull-desktopS-9 { right: 75%; } .pull-desktopS-10 { right: 83.33333%; } .pull-desktopS-11 { right: 91.66667%; } .pull-desktopS-12 { right: 100%; } .push-desktopS-0 { left: auto; } .push-desktopS-1 { left: 8.33333%; } .push-desktopS-2 { left: 16.66667%; } .push-desktopS-3 { left: 25%; } .push-desktopS-4 { left: 33.33333%; } .push-desktopS-5 { left: 41.66667%; } .push-desktopS-6 { left: 50%; } .push-desktopS-7 { left: 58.33333%; } .push-desktopS-8 { left: 66.66667%; } .push-desktopS-9 { left: 75%; } .push-desktopS-10 { left: 83.33333%; } .push-desktopS-11 { left: 91.66667%; } .push-desktopS-12 { left: 100%; } .offset-desktopS-0 { margin-left: 0%; } .offset-desktopS-1 { margin-left: 8.33333%; } .offset-desktopS-2 { margin-left: 16.66667%; } .offset-desktopS-3 { margin-left: 25%; } .offset-desktopS-4 { margin-left: 33.33333%; } .offset-desktopS-5 { margin-left: 41.66667%; } .offset-desktopS-6 { margin-left: 50%; } .offset-desktopS-7 { margin-left: 58.33333%; } .offset-desktopS-8 { margin-left: 66.66667%; } .offset-desktopS-9 { margin-left: 75%; } .offset-desktopS-10 { margin-left: 83.33333%; } .offset-desktopS-11 { margin-left: 91.66667%; } } @media (min-width: 1600px) { .col-desktopM { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .col-desktopM-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .col-desktopM-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .col-desktopM-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-desktopM-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .col-desktopM-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .col-desktopM-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-desktopM-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .col-desktopM-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .col-desktopM-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-desktopM-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .col-desktopM-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .col-desktopM-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .pull-desktopM-0 { right: auto; } .pull-desktopM-1 { right: 8.33333%; } .pull-desktopM-2 { right: 16.66667%; } .pull-desktopM-3 { right: 25%; } .pull-desktopM-4 { right: 33.33333%; } .pull-desktopM-5 { right: 41.66667%; } .pull-desktopM-6 { right: 50%; } .pull-desktopM-7 { right: 58.33333%; } .pull-desktopM-8 { right: 66.66667%; } .pull-desktopM-9 { right: 75%; } .pull-desktopM-10 { right: 83.33333%; } .pull-desktopM-11 { right: 91.66667%; } .pull-desktopM-12 { right: 100%; } .push-desktopM-0 { left: auto; } .push-desktopM-1 { left: 8.33333%; } .push-desktopM-2 { left: 16.66667%; } .push-desktopM-3 { left: 25%; } .push-desktopM-4 { left: 33.33333%; } .push-desktopM-5 { left: 41.66667%; } .push-desktopM-6 { left: 50%; } .push-desktopM-7 { left: 58.33333%; } .push-desktopM-8 { left: 66.66667%; } .push-desktopM-9 { left: 75%; } .push-desktopM-10 { left: 83.33333%; } .push-desktopM-11 { left: 91.66667%; } .push-desktopM-12 { left: 100%; } .offset-desktopM-0 { margin-left: 0%; } .offset-desktopM-1 { margin-left: 8.33333%; } .offset-desktopM-2 { margin-left: 16.66667%; } .offset-desktopM-3 { margin-left: 25%; } .offset-desktopM-4 { margin-left: 33.33333%; } .offset-desktopM-5 { margin-left: 41.66667%; } .offset-desktopM-6 { margin-left: 50%; } .offset-desktopM-7 { margin-left: 58.33333%; } .offset-desktopM-8 { margin-left: 66.66667%; } .offset-desktopM-9 { margin-left: 75%; } .offset-desktopM-10 { margin-left: 83.33333%; } .offset-desktopM-11 { margin-left: 91.66667%; } } @media (min-width: 2100px) { .col-desktopL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .col-desktopL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .col-desktopL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .col-desktopL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-desktopL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .col-desktopL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .col-desktopL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-desktopL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .col-desktopL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .col-desktopL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-desktopL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .col-desktopL-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .col-desktopL-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .pull-desktopL-0 { right: auto; } .pull-desktopL-1 { right: 8.33333%; } .pull-desktopL-2 { right: 16.66667%; } .pull-desktopL-3 { right: 25%; } .pull-desktopL-4 { right: 33.33333%; } .pull-desktopL-5 { right: 41.66667%; } .pull-desktopL-6 { right: 50%; } .pull-desktopL-7 { right: 58.33333%; } .pull-desktopL-8 { right: 66.66667%; } .pull-desktopL-9 { right: 75%; } .pull-desktopL-10 { right: 83.33333%; } .pull-desktopL-11 { right: 91.66667%; } .pull-desktopL-12 { right: 100%; } .push-desktopL-0 { left: auto; } .push-desktopL-1 { left: 8.33333%; } .push-desktopL-2 { left: 16.66667%; } .push-desktopL-3 { left: 25%; } .push-desktopL-4 { left: 33.33333%; } .push-desktopL-5 { left: 41.66667%; } .push-desktopL-6 { left: 50%; } .push-desktopL-7 { left: 58.33333%; } .push-desktopL-8 { left: 66.66667%; } .push-desktopL-9 { left: 75%; } .push-desktopL-10 { left: 83.33333%; } .push-desktopL-11 { left: 91.66667%; } .push-desktopL-12 { left: 100%; } .offset-desktopL-0 { margin-left: 0%; } .offset-desktopL-1 { margin-left: 8.33333%; } .offset-desktopL-2 { margin-left: 16.66667%; } .offset-desktopL-3 { margin-left: 25%; } .offset-desktopL-4 { margin-left: 33.33333%; } .offset-desktopL-5 { margin-left: 41.66667%; } .offset-desktopL-6 { margin-left: 50%; } .offset-desktopL-7 { margin-left: 58.33333%; } .offset-desktopL-8 { margin-left: 66.66667%; } .offset-desktopL-9 { margin-left: 75%; } .offset-desktopL-10 { margin-left: 83.33333%; } .offset-desktopL-11 { margin-left: 91.66667%; } } .embed-responsive { position: relative; display: block; height: 0; padding: 0; overflow: hidden; } .embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object, .embed-responsive video { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; } .embed-responsive-21by9 { padding-bottom: 42.85714%; } .embed-responsive-16by9 { padding-bottom: 56.25%; } .embed-responsive-4by3 { padding-bottom: 75%; } .embed-responsive-1by1 { padding-bottom: 100%; } .bg-faded { background-color: #f7f7f9; } .bg-primary { color: #fff !important; background-color: #0275d8 !important; } a.bg-primary:focus, a.bg-primary:hover { background-color: #025aa5 !important; } .bg-success { color: #fff !important; background-color: #5cb85c !important; } a.bg-success:focus, a.bg-success:hover { background-color: #449d44 !important; } .bg-info { color: #fff !important; background-color: #5bc0de !important; } a.bg-info:focus, a.bg-info:hover { background-color: #31b0d5 !important; } .bg-warning { color: #fff !important; background-color: #f0ad4e !important; } a.bg-warning:focus, a.bg-warning:hover { background-color: #ec971f !important; } .bg-danger { color: #fff !important; background-color: #d9534f !important; } a.bg-danger:focus, a.bg-danger:hover { background-color: #c9302c !important; } .bg-inverse { color: #fff !important; background-color: #373a3c !important; } a.bg-inverse:focus, a.bg-inverse:hover { background-color: #1f2021 !important; } .clearfix::after { content: ""; display: table; clear: both; } .d-block { display: block !important; } .d-inline-block { display: inline-block !important; } .d-inline { display: inline !important; } .flex-phoneS-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-phoneS-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-phoneS-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } .flex-items-phoneS-top { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .flex-items-phoneS-middle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .flex-items-phoneS-bottom { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } .flex-phoneS-top { -ms-flex-item-align: start; align-self: flex-start; } .flex-phoneS-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .flex-phoneS-bottom { -ms-flex-item-align: end; align-self: flex-end; } .flex-items-phoneS-left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .flex-items-phoneS-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .flex-items-phoneS-right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .flex-items-phoneS-around { -ms-flex-pack: distribute; justify-content: space-around; } .flex-items-phoneS-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } @media (min-width: 544px) { .flex-phoneL-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-phoneL-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-phoneL-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } } @media (min-width: 544px) { .flex-items-phoneL-top { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .flex-items-phoneL-middle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .flex-items-phoneL-bottom { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } } @media (min-width: 544px) { .flex-phoneL-top { -ms-flex-item-align: start; align-self: flex-start; } .flex-phoneL-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .flex-phoneL-bottom { -ms-flex-item-align: end; align-self: flex-end; } } @media (min-width: 544px) { .flex-items-phoneL-left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .flex-items-phoneL-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .flex-items-phoneL-right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .flex-items-phoneL-around { -ms-flex-pack: distribute; justify-content: space-around; } .flex-items-phoneL-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } @media (min-width: 768px) { .flex-tabletP-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-tabletP-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-tabletP-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } } @media (min-width: 768px) { .flex-items-tabletP-top { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .flex-items-tabletP-middle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .flex-items-tabletP-bottom { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } } @media (min-width: 768px) { .flex-tabletP-top { -ms-flex-item-align: start; align-self: flex-start; } .flex-tabletP-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .flex-tabletP-bottom { -ms-flex-item-align: end; align-self: flex-end; } } @media (min-width: 768px) { .flex-items-tabletP-left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .flex-items-tabletP-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .flex-items-tabletP-right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .flex-items-tabletP-around { -ms-flex-pack: distribute; justify-content: space-around; } .flex-items-tabletP-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } @media (min-width: 992px) { .flex-tabletL-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-tabletL-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-tabletL-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } } @media (min-width: 992px) { .flex-items-tabletL-top { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .flex-items-tabletL-middle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .flex-items-tabletL-bottom { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } } @media (min-width: 992px) { .flex-tabletL-top { -ms-flex-item-align: start; align-self: flex-start; } .flex-tabletL-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .flex-tabletL-bottom { -ms-flex-item-align: end; align-self: flex-end; } } @media (min-width: 992px) { .flex-items-tabletL-left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .flex-items-tabletL-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .flex-items-tabletL-right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .flex-items-tabletL-around { -ms-flex-pack: distribute; justify-content: space-around; } .flex-items-tabletL-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } @media (min-width: 1200px) { .flex-desktopS-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-desktopS-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-desktopS-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } } @media (min-width: 1200px) { .flex-items-desktopS-top { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .flex-items-desktopS-middle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .flex-items-desktopS-bottom { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } } @media (min-width: 1200px) { .flex-desktopS-top { -ms-flex-item-align: start; align-self: flex-start; } .flex-desktopS-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .flex-desktopS-bottom { -ms-flex-item-align: end; align-self: flex-end; } } @media (min-width: 1200px) { .flex-items-desktopS-left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .flex-items-desktopS-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .flex-items-desktopS-right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .flex-items-desktopS-around { -ms-flex-pack: distribute; justify-content: space-around; } .flex-items-desktopS-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } @media (min-width: 1600px) { .flex-desktopM-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-desktopM-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-desktopM-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } } @media (min-width: 1600px) { .flex-items-desktopM-top { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .flex-items-desktopM-middle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .flex-items-desktopM-bottom { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } } @media (min-width: 1600px) { .flex-desktopM-top { -ms-flex-item-align: start; align-self: flex-start; } .flex-desktopM-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .flex-desktopM-bottom { -ms-flex-item-align: end; align-self: flex-end; } } @media (min-width: 1600px) { .flex-items-desktopM-left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .flex-items-desktopM-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .flex-items-desktopM-right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .flex-items-desktopM-around { -ms-flex-pack: distribute; justify-content: space-around; } .flex-items-desktopM-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } @media (min-width: 2100px) { .flex-desktopL-first { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .flex-desktopL-last { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .flex-desktopL-unordered { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } } @media (min-width: 2100px) { .flex-items-desktopL-top { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .flex-items-desktopL-middle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .flex-items-desktopL-bottom { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } } @media (min-width: 2100px) { .flex-desktopL-top { -ms-flex-item-align: start; align-self: flex-start; } .flex-desktopL-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .flex-desktopL-bottom { -ms-flex-item-align: end; align-self: flex-end; } } @media (min-width: 2100px) { .flex-items-desktopL-left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .flex-items-desktopL-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .flex-items-desktopL-right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .flex-items-desktopL-around { -ms-flex-pack: distribute; justify-content: space-around; } .flex-items-desktopL-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } .pull-phoneS-left { float: left !important; } .pull-phoneS-right { float: right !important; } .pull-phoneS-none { float: none !important; } @media (min-width: 544px) { .pull-phoneL-left { float: left !important; } .pull-phoneL-right { float: right !important; } .pull-phoneL-none { float: none !important; } } @media (min-width: 768px) { .pull-tabletP-left { float: left !important; } .pull-tabletP-right { float: right !important; } .pull-tabletP-none { float: none !important; } } @media (min-width: 992px) { .pull-tabletL-left { float: left !important; } .pull-tabletL-right { float: right !important; } .pull-tabletL-none { float: none !important; } } @media (min-width: 1200px) { .pull-desktopS-left { float: left !important; } .pull-desktopS-right { float: right !important; } .pull-desktopS-none { float: none !important; } } @media (min-width: 1600px) { .pull-desktopM-left { float: left !important; } .pull-desktopM-right { float: right !important; } .pull-desktopM-none { float: none !important; } } @media (min-width: 2100px) { .pull-desktopL-left { float: left !important; } .pull-desktopL-right { float: right !important; } .pull-desktopL-none { float: none !important; } } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } .sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; } .w-100 { width: 100% !important; } .m-x-auto { margin-right: auto !important; margin-left: auto !important; } .m-a-0 { margin: 0 0 !important; } .m-t-0 { margin-top: 0 !important; } .m-r-0 { margin-right: 0 !important; } .m-b-0 { margin-bottom: 0 !important; } .m-l-0 { margin-left: 0 !important; } .m-x-0 { margin-right: 0 !important; margin-left: 0 !important; } .m-y-0 { margin-top: 0 !important; margin-bottom: 0 !important; } .m-a-1 { margin: 1rem 1rem !important; } .m-t-1 { margin-top: 1rem !important; } .m-r-1 { margin-right: 1rem !important; } .m-b-1 { margin-bottom: 1rem !important; } .m-l-1 { margin-left: 1rem !important; } .m-x-1 { margin-right: 1rem !important; margin-left: 1rem !important; } .m-y-1 { margin-top: 1rem !important; margin-bottom: 1rem !important; } .m-a-2 { margin: 1.5rem 1.5rem !important; } .m-t-2 { margin-top: 1.5rem !important; } .m-r-2 { margin-right: 1.5rem !important; } .m-b-2 { margin-bottom: 1.5rem !important; } .m-l-2 { margin-left: 1.5rem !important; } .m-x-2 { margin-right: 1.5rem !important; margin-left: 1.5rem !important; } .m-y-2 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; } .m-a-3 { margin: 3rem 3rem !important; } .m-t-3 { margin-top: 3rem !important; } .m-r-3 { margin-right: 3rem !important; } .m-b-3 { margin-bottom: 3rem !important; } .m-l-3 { margin-left: 3rem !important; } .m-x-3 { margin-right: 3rem !important; margin-left: 3rem !important; } .m-y-3 { margin-top: 3rem !important; margin-bottom: 3rem !important; } .p-a-0 { padding: 0 0 !important; } .p-t-0 { padding-top: 0 !important; } .p-r-0 { padding-right: 0 !important; } .p-b-0 { padding-bottom: 0 !important; } .p-l-0 { padding-left: 0 !important; } .p-x-0 { padding-right: 0 !important; padding-left: 0 !important; } .p-y-0 { padding-top: 0 !important; padding-bottom: 0 !important; } .p-a-1 { padding: 1rem 1rem !important; } .p-t-1 { padding-top: 1rem !important; } .p-r-1 { padding-right: 1rem !important; } .p-b-1 { padding-bottom: 1rem !important; } .p-l-1 { padding-left: 1rem !important; } .p-x-1 { padding-right: 1rem !important; padding-left: 1rem !important; } .p-y-1 { padding-top: 1rem !important; padding-bottom: 1rem !important; } .p-a-2 { padding: 1.5rem 1.5rem !important; } .p-t-2 { padding-top: 1.5rem !important; } .p-r-2 { padding-right: 1.5rem !important; } .p-b-2 { padding-bottom: 1.5rem !important; } .p-l-2 { padding-left: 1.5rem !important; } .p-x-2 { padding-right: 1.5rem !important; padding-left: 1.5rem !important; } .p-y-2 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; } .p-a-3 { padding: 3rem 3rem !important; } .p-t-3 { padding-top: 3rem !important; } .p-r-3 { padding-right: 3rem !important; } .p-b-3 { padding-bottom: 3rem !important; } .p-l-3 { padding-left: 3rem !important; } .p-x-3 { padding-right: 3rem !important; padding-left: 3rem !important; } .p-y-3 { padding-top: 3rem !important; padding-bottom: 3rem !important; } .pos-f-t { position: fixed; top: 0; right: 0; left: 0; z-index: 1030; } .text-justify { text-align: justify !important; } .text-nowrap { white-space: nowrap !important; } .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .text-phoneS-left { text-align: left !important; } .text-phoneS-right { text-align: right !important; } .text-phoneS-center { text-align: center !important; } @media (min-width: 544px) { .text-phoneL-left { text-align: left !important; } .text-phoneL-right { text-align: right !important; } .text-phoneL-center { text-align: center !important; } } @media (min-width: 768px) { .text-tabletP-left { text-align: left !important; } .text-tabletP-right { text-align: right !important; } .text-tabletP-center { text-align: center !important; } } @media (min-width: 992px) { .text-tabletL-left { text-align: left !important; } .text-tabletL-right { text-align: right !important; } .text-tabletL-center { text-align: center !important; } } @media (min-width: 1200px) { .text-desktopS-left { text-align: left !important; } .text-desktopS-right { text-align: right !important; } .text-desktopS-center { text-align: center !important; } } @media (min-width: 1600px) { .text-desktopM-left { text-align: left !important; } .text-desktopM-right { text-align: right !important; } .text-desktopM-center { text-align: center !important; } } @media (min-width: 2100px) { .text-desktopL-left { text-align: left !important; } .text-desktopL-right { text-align: right !important; } .text-desktopL-center { text-align: center !important; } } .text-lowercase { text-transform: lowercase !important; } .text-uppercase { text-transform: uppercase !important; } .text-capitalize { text-transform: capitalize !important; } .font-weight-normal { font-weight: normal; } .font-weight-bold { font-weight: bold; } .font-italic { font-style: italic; } .text-muted { color: #818a91 !important; } a.text-muted:focus, a.text-muted:hover { color: #687077 !important; } .text-primary { color: #0275d8 !important; } a.text-primary:focus, a.text-primary:hover { color: #025aa5 !important; } .text-success { color: #5cb85c !important; } a.text-success:focus, a.text-success:hover { color: #449d44 !important; } .text-info { color: #5bc0de !important; } a.text-info:focus, a.text-info:hover { color: #31b0d5 !important; } .text-warning { color: #f0ad4e !important; } a.text-warning:focus, a.text-warning:hover { color: #ec971f !important; } .text-danger { color: #d9534f !important; } a.text-danger:focus, a.text-danger:hover { color: #c9302c !important; } .text-hide { font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0; } .invisible { visibility: hidden !important; } .hidden-phoneS-up { display: none !important; } @media (max-width: 543px) { .hidden-phoneS-down { display: none !important; } } @media (min-width: 544px) { .hidden-phoneL-up { display: none !important; } } @media (max-width: 767px) { .hidden-phoneL-down { display: none !important; } } @media (min-width: 768px) { .hidden-tabletP-up { display: none !important; } } @media (max-width: 991px) { .hidden-tabletP-down { display: none !important; } } @media (min-width: 992px) { .hidden-tabletL-up { display: none !important; } } @media (max-width: 1199px) { .hidden-tabletL-down { display: none !important; } } @media (min-width: 1200px) { .hidden-desktopS-up { display: none !important; } } @media (max-width: 1599px) { .hidden-desktopS-down { display: none !important; } } @media (min-width: 1600px) { .hidden-desktopM-up { display: none !important; } } @media (max-width: 2099px) { .hidden-desktopM-down { display: none !important; } } @media (min-width: 2100px) { .hidden-desktopL-up { display: none !important; } } .hidden-desktopL-down { display: none !important; } .visible-print-block { display: none !important; } @media print { .visible-print-block { display: block !important; } } .visible-print-inline { display: none !important; } @media print { .visible-print-inline { display: inline !important; } } .visible-print-inline-block { display: none !important; } @media print { .visible-print-inline-block { display: inline-block !important; } } @media print { .hidden-print { display: none !important; } } /*! ========================================================= bootstrap-slider.js Maintainers: Kyle Kemp - Twitter: @seiyria - Github: seiyria Rohit Kalkur - Twitter: @Rovolutionary - Github: rovolution ========================================================= bootstrap-slider is released under the MIT License Copyright (c) 2017 Kyle Kemp, Rohit Kalkur, and contributors Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. ========================================================= */ .slider { display: inline-block; vertical-align: middle; position: relative; } .slider.slider-horizontal { width: 210px; height: 20px; } .slider.slider-horizontal .slider-track { height: 10px; width: 100%; margin-top: -5px; top: 50%; left: 0; } .slider.slider-horizontal .slider-selection, .slider.slider-horizontal .slider-track-low, .slider.slider-horizontal .slider-track-high { height: 100%; top: 0; bottom: 0; } .slider.slider-horizontal .slider-tick, .slider.slider-horizontal .slider-handle { margin-left: -10px; } .slider.slider-horizontal .slider-tick.triangle, .slider.slider-horizontal .slider-handle.triangle { position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); border-width: 0 10px 10px 10px; width: 0; height: 0; border-bottom-color: #0267bf; margin-top: 0; } .slider.slider-horizontal .slider-tick-container { white-space: nowrap; position: absolute; top: 0; left: 0; width: 100%; } .slider.slider-horizontal .slider-tick-label-container { white-space: nowrap; margin-top: 20px; } .slider.slider-horizontal .slider-tick-label-container .slider-tick-label { display: inline-block; padding-top: 24px; text-align: center; } .slider.slider-horizontal.slider-rtl .slider-track { left: initial; right: 0; } .slider.slider-horizontal.slider-rtl .slider-tick, .slider.slider-horizontal.slider-rtl .slider-handle { margin-left: initial; margin-right: -10px; } .slider.slider-horizontal.slider-rtl .slider-tick-container { left: initial; right: 0; } .slider.slider-vertical { height: 210px; width: 20px; } .slider.slider-vertical .slider-track { width: 10px; height: 100%; left: 25%; top: 0; } .slider.slider-vertical .slider-selection { width: 100%; left: 0; top: 0; bottom: 0; } .slider.slider-vertical .slider-track-low, .slider.slider-vertical .slider-track-high { width: 100%; left: 0; right: 0; } .slider.slider-vertical .slider-tick, .slider.slider-vertical .slider-handle { margin-top: -10px; } .slider.slider-vertical .slider-tick.triangle, .slider.slider-vertical .slider-handle.triangle { border-width: 10px 0 10px 10px; width: 1px; height: 1px; border-left-color: #0267bf; margin-left: 0; } .slider.slider-vertical .slider-tick-label-container { white-space: nowrap; } .slider.slider-vertical .slider-tick-label-container .slider-tick-label { padding-left: 4px; } .slider.slider-vertical.slider-rtl .slider-track { left: initial; right: 25%; } .slider.slider-vertical.slider-rtl .slider-selection { left: initial; right: 0; } .slider.slider-vertical.slider-rtl .slider-tick.triangle, .slider.slider-vertical.slider-rtl .slider-handle.triangle { border-width: 10px 10px 10px 0; } .slider.slider-vertical.slider-rtl .slider-tick-label-container .slider-tick-label { padding-left: initial; padding-right: 4px; } .slider.slider-disabled .slider-handle { background-color: #cfcfcf; background-image: linear-gradient(to bottom, #DFDFDF, #BEBEBE); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DFDFDF', endColorstr='#BEBEBE',GradientType=0); } .slider.slider-disabled .slider-track { background-color: #e7e7e7; background-image: linear-gradient(to bottom, #E5E5E5, #E9E9E9); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E5E5E5', endColorstr='#E9E9E9',GradientType=0); cursor: not-allowed; } .slider input { display: none; } .slider .tooltip-inner { white-space: nowrap; max-width: none; } .slider .tooltip.top { margin-top: -36px; } .slider .tooltip-inner { white-space: nowrap; max-width: none; } .slider .hide { display: none; } .slider-track { background-color: #f7f7f7; background-image: linear-gradient(to bottom, #F5F5F5, #F9F9F9); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F5F5F5', endColorstr='#F9F9F9',GradientType=0); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); border-radius: 4px; position: absolute; cursor: pointer; } .slider-selection { background-color: #f7f7f7; background-image: linear-gradient(to bottom, #F9F9F9, #F5F5F5); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F9F9F9', endColorstr='#F5F5F5',GradientType=0); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-sizing: border-box; border-radius: 4px; position: absolute; } .slider-selection.tick-slider-selection { background-color: #5db4ff; background-image: linear-gradient(to bottom, #6abaff, #50aeff); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6abaff', endColorstr='#50aeff',GradientType=0); } .slider-track-low, .slider-track-high { box-sizing: border-box; border-radius: 4px; position: absolute; background: transparent; } .slider-handle { background-color: #026ecb; background-image: linear-gradient(to bottom, #0275d8, #0267bf); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0275d8', endColorstr='#0267bf',GradientType=0); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); position: absolute; top: 0; width: 20px; height: 20px; background-color: #0275d8; border: 0px solid transparent; } .slider-handle.round { border-radius: 20px; } .slider-handle.triangle { background: transparent none; } .slider-handle.custom { background: transparent none; } .slider-handle.custom::before { line-height: 20px; font-size: 20px; content: '\2605'; color: #726204; } .slider-tick { background-color: #f7f7f7; background-image: linear-gradient(to bottom, #F5F5F5, #F9F9F9); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F5F5F5', endColorstr='#F9F9F9',GradientType=0); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-sizing: border-box; position: absolute; width: 20px; height: 20px; -webkit-filter: none; filter: none; opacity: 0.8; border: 0px solid transparent; } .slider-tick.round { border-radius: 50%; } .slider-tick.triangle { background: transparent none; } .slider-tick.custom { background: transparent none; } .slider-tick.custom::before { line-height: 20px; font-size: 20px; content: '\2605'; color: #726204; } .slider-tick.in-selection { background-color: #5db4ff; background-image: linear-gradient(to bottom, #6abaff, #50aeff); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6abaff', endColorstr='#50aeff',GradientType=0); opacity: 1; } body { background-color: #fbfbfb; } .site-wrapper { max-width: 2560px; margin: 0 auto; overflow-x: hidden; background-color: #fff; } h1, h2, h3, h4, h5, h6, p, ol, ul { margin-bottom: 0; } ul, ol { margin: 0; padding: 0; list-style: none; } main { margin-top: 52px; } .has-secondary-nav main { margin-top: 104px; } @media (min-width: 1200px) { main { margin-top: 64px; } .has-secondary-nav main { margin-top: 128px; } } @media (min-width: 1600px) { main { margin-top: 80px; } .has-secondary-nav main { margin-top: 160px; } } .size-16by9 { padding-bottom: 56.25%; } .size-twothirds { padding-bottom: 36%; } body { font-family: 'Open Sans', sans-serif; font-weight: 300; font-style: normal; font-size: 1.4rem; color: #444444; } h1, h2, h3, h4, h5, h6 { font-weight: 300; line-height: 1.2; } h1 { font-size: 3.4rem; padding-bottom: .8rem; } h2 { font-size: 2.8rem; padding-bottom: 2.4rem; } a { color: #0090FF; } a:hover { color: #0090FF; text-decoration: none; } a:focus { color: #0090FF; text-decoration: none; outline: 0; } a.footnotes-link { color: inherit; } .more { color: #0090FF; padding-right: 5px; border-bottom: 1px solid transparent; transition: border-bottom 250ms; } .more:hover { border-bottom: 1px solid #0090FF; } .more:after { content: ""; display: inline-block; width: 8px; height: 8px; border-top: 1px solid #0090FF; border-right: 1px solid #0090FF; background-color: transparent; -webkit-transform: rotate(45deg) translate(1px, -2px); transform: rotate(45deg) translate(1px, -2px); } p { line-height: 1.5; padding-bottom: 2.4rem; -webkit-hyphens: none; -ms-hyphens: none; hyphens: none; } li { line-height: 1.5; } .content { text-align: center; } .typo-light { color: #fff; } .typo-align-left .content { text-align: left; } .typo-align-center .content { text-align: center; } @media (min-width: 992px) { body { font-size: 1.6rem; } h1 { font-size: 3.8rem; } h2 { font-size: 3.2rem; } } @media (min-width: 1200px) { body { font-size: 1.8rem; } h1 { font-size: 4.8rem; } h2 { font-size: 4rem; } .more { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } .more:after { -webkit-transform: rotate(45deg) translate(1px, -4px); transform: rotate(45deg) translate(1px, -4px); } .more:hover { border-bottom: 1px solid #0090FF; } } @media (min-width: 1600px) { body { font-size: 2rem; } h1 { font-size: 5.6rem; letter-spacing: 0.03em; } h2 { font-size: 4.8rem; } } @media (min-width: 2100px) { h1 { font-size: 8rem; letter-spacing: 0.05em; } h2 { font-size: 6rem; } } .bg { width: 100%; height: 100%; position: relative; background-position: 50% 50%; background-repeat: no-repeat; } .bg-size-cover { background-size: cover; } .bg-size-width { background-size: 100% auto; } .bg-size-height { background-size: auto 100%; } .bg-pos-left { background-position: 0 0; } .bg-pos-right { background-position: 100% 50%; } .bg-pos-bottom { background-position: 50% 100%; } .find-a-store-custom-button { display: inline-block; color: #fff; padding: 8px 60px 8px 60px; border-radius: 15px; background-color: #0090ff; text-transform: uppercase; font-size: 18px; letter-spacing: 2px; font-weight: 400; transition: all 250ms; margin: 0 0 50px; } .find-a-store-custom-button:hover { color: #fff; background-color: #007ae4; } .button { display: inline-block; } .button.button-play { width: 60px; height: 60px; position: relative; } .button.button-play:before { content: ""; display: block; background-color: rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 50%; width: 58px; height: 58px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); -webkit-animation: 2s linear 0s infinite normal; animation: 2s linear 0s infinite normal; -webkit-animation-name: play-button-before; animation-name: play-button-before; } .button.button-play:after { content: ""; display: block; width: 60px; height: 60px; background: url("../img/common/play-icon.svg") no-repeat; background-size: 60px 60px; position: absolute; top: 0; left: 0; } .button.button-replay { position: relative; z-index: 100; font-size: 80%; border: 0; background: none; color: #0090FF; display: none; } .button.button-replay:after { content: ""; display: block; width: 28px; height: 28px; background: url("../img/common/replay.svg") no-repeat 50% 50%; background-size: 24px 24px; position: absolute; top: 50%; left: -28px; transition: all 500ms; -webkit-transform: translateY(-50%) rotate(0deg); transform: translateY(-50%) rotate(0deg); } .button.button-replay:focus { outline: 0; } .button.button-replay.white { color: #fff; } .button.button-replay.white:after { background: url("../img/common/replay-white.svg") no-repeat 50% 50%; } .button.button-replay.silver { color: #518EBB; } .button.button-replay.silver:after { background: url("../img/common/replay-silver.svg") no-repeat 50% 50%; } .button.button-border { border: 1px solid #0090ff; padding: .5rem 4rem; border-radius: 1em / 50%; transition: all 250ms; } .button.button-border:hover { background-color: #0090ff; color: #fff; } .button.button-buy { padding: 6px 66px; border-radius: 18px / 50%; border: 1px solid #0090ff; background-color: transparent; transition: all 250ms; } .button span { display: block; width: 1px; height: 1px; font-size: 0; visibility: hidden; } .button:hover { cursor: pointer; } .edge .button.button-play:before, .ie11 .button.button-play:before { display: none; } @media (min-width: 1200px) { .find-a-store-custom-button { margin: 20px 0 0; font-size: 22px; } .button.button-border { padding: .5rem 7rem; } .button.button-replay:hover:after { -webkit-transform: translateY(-50%) rotate(360deg); transform: translateY(-50%) rotate(360deg); } .button.button-buy { border-radius: 20px / 50%; } .button.button-buy:hover { background-color: #0090ff; color: #fff; } } @media (min-width: 1600px) { .find-a-store-custom-button { margin: 40px 0 0; } } @media (min-width: 1600px) { .find-a-store-custom-button { margin: 50px 0 0; } } @-webkit-keyframes play-button-before { 0% { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); opacity: 0; } 20% { -webkit-transform: translate(-50%, -50%) scale(1.4); transform: translate(-50%, -50%) scale(1.4); opacity: 1; } 75% { -webkit-transform: translate(-50%, -50%) scale(1.7); transform: translate(-50%, -50%) scale(1.7); opacity: 0; } 100% { -webkit-transform: translate(-50%, -50%) scale(1.7); transform: translate(-50%, -50%) scale(1.7); opacity: 0; } } @keyframes play-button-before { 0% { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); opacity: 0; } 20% { -webkit-transform: translate(-50%, -50%) scale(1.4); transform: translate(-50%, -50%) scale(1.4); opacity: 1; } 75% { -webkit-transform: translate(-50%, -50%) scale(1.7); transform: translate(-50%, -50%) scale(1.7); opacity: 0; } 100% { -webkit-transform: translate(-50%, -50%) scale(1.7); transform: translate(-50%, -50%) scale(1.7); opacity: 0; } } header { width: 100%; max-width: 2560px; background: #fff; position: fixed; z-index: 10000; transition: -webkit-transform 500ms ease-in-out; transition: transform 500ms ease-in-out; transition: transform 500ms ease-in-out, -webkit-transform 500ms ease-in-out; -webkit-transform: translateZ(0) translateY(0); transform: translateZ(0) translateY(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-perspective: 1000px; perspective: 1000px; } header ul { list-style: none; margin: 0; padding: 0; } header a { color: #444444; } header a:hover { color: #444444; text-decoration: none; } header a:focus { color: inherit; outline: 0; text-decoration: none; } header .brand { position: relative; } header .brand a { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: bold; color: #000; letter-spacing: -1px; font-size: 1.8rem; display: inline-block; height: 5.2rem; line-height: 5.2rem; vertical-align: middle; } header .brand a:hover { text-decoration: none; } header .brand a:active, header .brand a:focus { outline: 0; } header .brand a img { width: auto; /*height: 13px;*/ margin: -3px 0 0 1px; } header nav { display: none; overflow-y: auto; padding-bottom: 3.5rem; } header nav ul li { padding-bottom: 1.75rem; padding-top: 1.75rem; text-align: left; } header nav a { font-size: 1.4rem; } header nav .menu-top-item { border-bottom: 1px solid #e1e1e1; } header nav .menu-top-item a { display: inline-block; width: 100%; } header nav .menu-top-item.open > ul.menu-sub-products > li .page-icon, header nav .menu-top-item.open > ul.menu-sub-products > li .menu-description, header nav .menu-top-item.open > ul.menu-sub-products > li .menu-link { display: none; } header nav .menu-top-item.open > ul.menu-sub-workswith { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; padding-bottom: 1rem; border-bottom: none; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a { padding-right: 0; font-size: 1.4rem; text-transform: none; text-align: left; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a:after { display: none; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a:hover { color: #0090FF; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a img { display: block; margin-left: auto; margin-right: auto; width: 150px; height: auto; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a span br { display: none; } header nav .menu-top-item.open > ul.menu-sub-workswith > li .page-icon, header nav .menu-top-item.open > ul.menu-sub-workswith > li .menu-description, header nav .menu-top-item.open > ul.menu-sub-workswith > li .menu-link { display: none; } header nav .menu-top-item > .menu-sub { padding-left: 2.4rem; } header nav .menu-item-has-children > a { position: relative; } header nav .menu-item-has-children > a:after { content: ''; display: block; width: 8px; height: 8px; border-bottom: 1px solid #444444; border-right: 1px solid #444444; position: absolute; right: 3px; top: 5px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } header nav .menu-item-has-children.open > a { font-weight: 400; } header nav .menu-item-has-children.open > a:after { border-bottom: 2px solid #444444; border-right: 2px solid #444444; top: 10px; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } header nav .menu-sub { display: none; } header nav .menu-sub li { padding-bottom: 0; } header nav .menu-sub-item img { width: 80px; height: auto; margin-left: -10px; } header #menu-toggle { -webkit-appearance: none; border: 0; background-color: #fff; cursor: pointer; display: block; width: 36px; height: 36px; position: absolute; top: 8px; right: 0; } header #menu-toggle span { left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } header #menu-toggle span, header #menu-toggle span:before, header #menu-toggle span:after { content: ' '; height: 5.5%; width: 61%; opacity: 1; background: #0090FF; position: absolute; display: block; transition: all 100ms ease-in-out; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } header #menu-toggle span:before, header #menu-toggle span:after { height: 100%; width: 100%; } header #menu-toggle span:before { -webkit-transform: translateY(-350%); transform: translateY(-350%); } header #menu-toggle span:after { -webkit-transform: translateY(350%); transform: translateY(350%); } header #menu-toggle:focus { outline: 0; } header.mobnav-active #menu-toggle span:before, header.mobnav-active #menu-toggle span:after { top: 0; -webkit-transform: translateY(0); transform: translateY(0); } header #language-selector { margin-top: 2.4rem; } header #language-selector #lang-choices { display: none; width: 100%; } header #language-selector #lang-choices a { display: block; width: 100%; padding: 2rem 24px .5rem 34px; } header #language-selector #lang-toggle { position: relative; transition: color 250ms; padding-right: 18px; padding-left: 34px; width: 100%; display: block; } header #language-selector #lang-toggle:before { content: ""; display: block; width: 24px; height: 24px; background: url("../img/common/globe-langselector.svg") no-repeat 50% 50%; background-size: contain; vertical-align: bottom; position: absolute; left: 0; top: -1px; } header #language-selector #lang-toggle:after { content: ''; display: block; width: 8px; height: 8px; border-bottom: 1px solid #444444; border-right: 1px solid #444444; position: absolute; right: 3px; top: 6px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } header #language-selector #lang-toggle.open { font-weight: 400; } header #language-selector #lang-toggle.open:after { border-bottom: 2px solid #444444; border-right: 2px solid #444444; top: 10px; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } header.fold-active { -webkit-transform: translateZ(0) translateY(-52px); transform: translateZ(0) translateY(-52px); } header .products-redesign.menu-top-item.open > ul > li > ul > li.all-products, header .products-redesign.menu-top-item.open > ul > li > ul > li .all-uses { display: none; } @media (min-width: 768px) { header .brand a { font-size: 2.4rem; } header .brand a img { /*height: 18px;*/ } header nav .menu-sub-item img { width: 100px; } } @media (max-width: 1199px) { header .brand:after { content: ''; display: block; position: absolute; border-bottom: 1px solid #e1e1e1; height: 1px; width: 1200px; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } header nav { height: calc(100vh - 52px); } } @media (min-width: 1200px) { header { box-shadow: none; } header.subnav-active:after { content: ''; position: absolute; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.6); border-top: 1px solid #cccccc; cursor: pointer; } header.lang-active:after { content: ''; position: absolute; width: 100%; height: 100vh; background-color: rgba(255, 255, 255, 0.8); cursor: pointer; } header .brand a { height: 6.4rem; line-height: 6.4rem; } header nav { position: static !important; width: auto; display: -webkit-box; display: -ms-flexbox; display: flex; padding-bottom: 0; top: 0; right: 0; bottom: 0; left: 0; } header nav ul li { text-align: center; } header nav > ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row; flex-flow: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; min-height: 64px; width: 86%; margin-right: 30px; } header nav > ul > li { margin-top: 0; margin-bottom: 0; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 400; } header nav .menu-top-item { border-bottom: none; } header nav .menu-top-item a { width: auto; } header nav .menu-top-item > a { color: #444444; transition: color 250ms; } header nav .menu-top-item > a:after { border-bottom: 1px solid #444444; border-right: 1px solid #444444; transition: all 125ms; } header nav .menu-top-item > a:hover { color: #0090FF; } header nav .menu-top-item > a:hover:after { border-bottom: 1px solid #0090FF; border-right: 1px solid #0090FF; } header nav .menu-top-item.open { height: 340px; } header nav .menu-top-item.open > a:hover:after { border-bottom: 1px solid #0090FF; border-right: 1px solid #0090FF; } header nav .menu-top-item.open > ul { position: absolute; width: 1140px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding-bottom: 1rem; border-bottom: 1px solid #cccccc; } header nav .menu-top-item.open > ul > li { padding-top: 4rem; padding-left: 2rem; padding-right: 2rem; } header nav .menu-top-item.open > ul > li a { padding-right: 0; } header nav .menu-top-item.open > ul > li a:after { display: none; } header nav .menu-top-item.open > ul > li.open > a { color: #0090FF; } header nav .menu-top-item.open > ul > li > a { font-size: 2rem; text-transform: uppercase; font-weight: 300; color: #444444; transition: color 250ms; } header nav .menu-top-item.open > ul > li > a:hover { color: #0090FF; } header nav .menu-top-item.open > ul > li > ul { position: absolute; width: 1140px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); text-align: center; } header nav .menu-top-item.open > ul > li > ul > li { width: 16%; display: inline-block; text-align: center; padding-top: 4rem; } header nav .menu-top-item.open > ul > li > ul > li a { display: block; } header nav .menu-top-item.open > ul > li > ul > li a span { display: inline-block; text-align: center; } header nav .menu-top-item.open > ul.menu-sub-products > li img.page-icon { display: none; } header nav .menu-top-item.open > ul.menu-sub-workswith { position: absolute; width: 1140px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: distribute; justify-content: space-around; padding-bottom: 1rem; border-bottom: none; } header nav .menu-top-item.open > ul.menu-sub-workswith > li { padding-top: 0; padding-left: 4rem; padding-right: 4rem; max-width: 370px; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a { padding-right: 0; font-size: 1.4rem; text-transform: none; text-align: center; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a:after { display: none; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a:hover { color: #0090FF; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a img { display: block; margin-left: auto; margin-right: auto; width: 180px; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a span br { display: block; } header nav .menu-top-item.open > ul.menu-sub-workswith > li .page-icon { display: inline; } header nav .menu-top-item.open > ul.menu-sub-workswith > li .menu-description { display: block; font-size: 1.4rem; font-weight: 300; margin-bottom: 3rem; } header nav .menu-top-item.open > ul.menu-sub-workswith > li .menu-sub-toggle { display: none; } header nav .menu-top-item.open > ul.menu-sub-workswith > li .menu-link { display: inline-block; position: relative; padding: 4px 50px; border-radius: 6px; border: 1px solid #0090ff; color: #0090ff; transition: all 250ms; } header nav .menu-top-item.open > ul.menu-sub-workswith > li .menu-link:hover { color: #ffffff; background-color: #0090FF; } header nav .menu-top-item > .menu-sub { padding-left: 0; } header nav .menu-item-has-children > a { padding-right: 18px; } header nav .menu-item-has-children.open > a:after { border-bottom: 1px solid #444444; border-right: 1px solid #444444; } header nav .menu-sub-item img { margin-left: 50%; margin-bottom: 1rem; width: auto; height: 114px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; -webkit-transform: translateX(-50%); transform: translateX(-50%); } header nav .menu-sub-item a span { color: #444444; transition: color 250ms; } header nav .menu-sub-item a:hover span { color: #0090FF; } header nav .menu-sub-item a:hover img { -webkit-transform: translateX(-50%) scale(1.15); transform: translateX(-50%) scale(1.15); } header #language-selector { max-height: 64px; margin-top: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row; flex-flow: row; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } header #language-selector #lang-choices { position: fixed; width: auto; min-width: 120px; height: auto; top: 64px; background-color: #fff; z-index: 100; } header #language-selector #lang-choices a { display: block; transition: all 250ms; padding: 8px 24px; text-align: left; font-weight: 400; } header #language-selector #lang-choices a:hover { color: #fff; background-color: #0090FF; } header #language-selector #lang-choices.open { display: block; } header #language-selector #lang-toggle { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding-top: 2px; padding-bottom: 2px; width: auto; font-weight: 400; transition: all 125ms; } header #language-selector #lang-toggle:after { top: 7px; transition: all 125ms; } header #language-selector #lang-toggle:before { top: 0; width: 24px; height: 24px; } header #language-selector #lang-toggle:hover { color: #0090FF; } header #language-selector #lang-toggle:hover:after { border-bottom: 1px solid #0090FF; border-right: 1px solid #0090FF; } header #language-selector #lang-toggle.open:after { border-bottom: 1px solid #0090FF; border-right: 1px solid #0090FF; top: 12px; } header.fold-active { -webkit-transform: translateZ(0) translateY(-94px); transform: translateZ(0) translateY(-94px); } header .products-redesign.menu-top-item.open { height: 390px; } header .products-redesign.menu-top-item.open > ul { width: 100%; max-width: 2560px; background-color: #f6f6f6; border-bottom: 0; margin-top: 1.75rem; padding-bottom: 0; } header .products-redesign.menu-top-item.open > ul > li { margin-top: 1rem; padding: 1rem 3rem 2rem 3rem; } header .products-redesign.menu-top-item.open > ul > li > a { font-size: 1.5rem; } header .products-redesign.menu-top-item.open > ul > li > ul > li { width: 12%; height: 180px; padding-top: 6rem; } header .products-redesign.menu-top-item.open > ul > li > ul > li a span { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; font-size: 1.1rem; } header .products-redesign.menu-top-item.open > ul > li > ul > li.all-products, header .products-redesign.menu-top-item.open > ul > li > ul > li .all-uses { position: absolute; display: block; padding-top: 2rem; margin-top: 4.5rem; border-top: 1px solid #eaeaea; width: 50%; } header .products-redesign.menu-top-item.open > ul > li > ul > li.all-products a img, header .products-redesign.menu-top-item.open > ul > li > ul > li .all-uses a img { display: none; } header .products-redesign.menu-top-item.open > ul > li > ul > li.all-products a span, header .products-redesign.menu-top-item.open > ul > li > ul > li .all-uses a span { color: #0090FF; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; padding-right: 7rem; } header .products-redesign.menu-top-item.open > ul > li > ul > li.all-products a span:after, header .products-redesign.menu-top-item.open > ul > li > ul > li .all-uses a span:after { content: ""; display: inline-block; width: 6px; height: 6px; border-top: 1px solid #0090FF; border-right: 1px solid #0090FF; background-color: transparent; -webkit-transform: rotate(45deg) translate(7px, 0px); transform: rotate(45deg) translate(7px, 0px); } header .products-redesign.menu-top-item.open > ul > li > ul > li.all-uses { margin-left: 50%; } header .products-redesign.menu-top-item.open > ul > li > ul > li.all-uses a span { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding-left: 7rem; } header .products-redesign.menu-top-item.open > ul > li > ul > li.full-width { width: 100%; } header .products-redesign.menu-top-item.open > ul > li > ul > li.full-width a span { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0; } header .products-redesign.menu-top-item.open > ul > li.open { background-color: #fff; border-radius: 10px 10px 0 0; } header .products-redesign .menu-sub-item img { height: 90px; } .mac.safari header #language-selector #lang-choices { -webkit-transform: translateX(-120px); transform: translateX(-120px); } } @media (min-width: 1600px) { header .brand a { height: 8rem; line-height: 8rem; font-size: 3.2rem; } header .brand a img { height: 24px; margin: -6px 0 0 1px; } header nav ul li { padding-bottom: 2rem; padding-top: 2.5rem; } header nav > ul { min-height: 80px; margin-right: 35px; } header nav a { font-size: 1.6rem; } header nav .menu-top-item.open { height: 460px; } header nav .menu-top-item.open > ul { width: 1440px; padding-bottom: 2rem; } header nav .menu-top-item.open > ul > li { padding-top: 5rem; } header nav .menu-top-item.open > ul > li > a { font-size: 2.6rem; padding-left: 2rem; padding-right: 2rem; } header nav .menu-top-item.open > ul > li > ul { width: 1440px; } header nav .menu-top-item.open > ul > li > ul > li { padding-top: 7rem; } header nav .menu-top-item.open > ul.menu-sub-workswith { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } header nav .menu-top-item.open > ul.menu-sub-workswith > li { padding-top: 2rem; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a { font-size: 1.6rem; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a img { width: 230px; } header nav .menu-top-item.open > ul.menu-sub-workswith > li .menu-description { margin-bottom: 4rem; min-width: 290px; } header nav .menu-item-has-children > a:after { top: 6px; } header nav .menu-item-has-children.open > a:after { top: 11px; } header nav .menu-sub-item img { margin-bottom: 1.5rem; width: auto; height: 145px; } header #language-selector { max-height: 80px; } header #language-selector #lang-choices { top: 80px; } header #language-selector #lang-toggle { top: 1px; } header #language-selector #lang-toggle:before { top: 2px; } header.fold-active { -webkit-transform: translateZ(0) translateY(-80px); transform: translateZ(0) translateY(-80px); } header .products-redesign.menu-top-item.open { height: 460px; } header .products-redesign.menu-top-item.open > ul > li > a { font-size: 1.5rem; } header .products-redesign.menu-top-item.open > ul > li > ul > li { padding-top: 8rem; } header .products-redesign.menu-top-item.open > ul > li > ul > li a span { font-size: 1.3rem; } header .products-redesign.menu-top-item.open > ul > li > ul > li.all-products, header .products-redesign.menu-top-item.open > ul > li > ul > li .all-uses { margin-top: 6rem; } header .products-redesign.menu-top-item.open > ul > li > ul > li.all-products a span:after, header .products-redesign.menu-top-item.open > ul > li > ul > li .all-uses a span:after { width: 7px; height: 7px; -webkit-transform: rotate(45deg) translate(7px, 3px); transform: rotate(45deg) translate(7px, 3px); } header .products-redesign .menu-sub-item img { height: 100px; } } @media (min-width: 2100px) { header nav a { font-size: 1.8rem; } header nav > ul { margin-right: 50px; } header nav .menu-top-item.open { height: 530px; } header nav .menu-top-item.open > ul { width: 1920px; padding-bottom: 2rem; } header nav .menu-top-item.open > ul > li > a { font-size: 3.6rem; } header nav .menu-top-item.open > ul > li > ul { width: 1920px; } header nav .menu-top-item.open > ul > li > ul > li { padding-top: 8rem; } header nav .menu-top-item.open > ul.menu-sub-workswith > li { padding-top: 3rem; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a { font-size: 1.8rem; } header nav .menu-top-item.open > ul.menu-sub-workswith > li a img { width: 230px; } header nav .menu-top-item.open > ul.menu-sub-workswith > li .menu-description { margin-bottom: 5rem; } header nav .menu-item-has-children > a:after { top: 8px; } header nav .menu-item-has-children.open > a:after { top: 13px; } header nav .menu-sub-item img { margin-bottom: 1.5rem; width: auto; height: 190px; } header nav .products-redesign.menu-top-item.open { height: 505px; } header nav .products-redesign.menu-top-item.open > ul > li > a { font-size: 1.7rem; } header nav .products-redesign.menu-top-item.open > ul > li > ul > li { padding-top: 9rem; } header nav .products-redesign.menu-top-item.open > ul > li > ul > li a span { font-size: 1.4rem; } header nav .products-redesign.menu-top-item.open > ul > li > ul > li.all-products, header nav .products-redesign.menu-top-item.open > ul > li > ul > li .all-uses { margin-top: 7rem; } header nav .products-redesign.menu-top-item.open > ul > li > ul > li.all-products a span:after, header nav .products-redesign.menu-top-item.open > ul > li > ul > li .all-uses a span:after { width: 7px; height: 7px; -webkit-transform: rotate(45deg) translate(9px, 2px); transform: rotate(45deg) translate(9px, 2px); } header nav .products-redesign .menu-sub-item img { height: 120px; } header #language-selector #lang-toggle { margin-top: -1px; max-width: none; } header #language-selector #lang-toggle:after { content: ''; display: block; width: 8px; height: 8px; border-bottom: 1px solid #444444; border-right: 1px solid #444444; position: absolute; right: 3px; top: 10px; -webkit-transform: rotate(45deg); transform: rotate(45deg); transition: all 250ms; } header #language-selector #lang-toggle.open:after { top: 14px; } header #language-selector #lang-choices { min-width: 130px; } .mac.safari header #language-selector #lang-choices { -webkit-transform: translateX(-130px); transform: translateX(-130px); } } #secondary-nav { width: 100%; min-height: 52px; position: relative; background-color: #f6f6f6; box-shadow: 0 0 0 transparent; border-bottom: 1px solid #e1e1e1; transition: all 250ms; } #secondary-nav .items { width: 100%; min-height: 52px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-size: 14px; padding: 14px 0; transition: padding 50ms; } #secondary-nav .title { font-size: 16px; font-weight: 600; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; line-height: 1; max-width: 45%; } #secondary-nav .links { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; -webkit-box-flex: 1; -ms-flex: 1 0 100%; flex: 1 0 100%; margin-top: 20px; margin-bottom: -14px; } #secondary-nav .links a { text-align: center; padding: 18px 0; line-height: 1; border-top: 1px solid #e1e1e1; } #secondary-nav .links a.current { font-weight: 600; } #secondary-nav .links.mobile-hidden { display: none; } #secondary-nav .actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; width: 50%; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #secondary-nav .bin { display: inline-block; background: #0090ff; border: 1px solid #0090ff; color: #fff; padding: 6px 10px; border-radius: 8px; font-size: 10px; line-height: 1; text-transform: uppercase; } #secondary-nav .bin:only-child { position: absolute; right: 5px; } #secondary-nav .link-toggle { width: 20px; height: 20px; -webkit-transform: translateX(-50%); transform: translateX(-50%); } #secondary-nav .link-toggle span { display: block; width: 10px; height: 10px; border-right: 2px solid #444; border-bottom: 2px solid #444; -webkit-transform: translate(50%, 25%) rotate(45deg); transform: translate(50%, 25%) rotate(45deg); transition: -webkit-transform 75ms ease; transition: transform 75ms ease; transition: transform 75ms ease, -webkit-transform 75ms ease; } #secondary-nav .link-toggle.active span { -webkit-transform: translate(50%, 75%) rotate(225deg); transform: translate(50%, 75%) rotate(225deg); } #secondary-nav.mobile-sub-open { box-shadow: 0 4px 12px rgba(144, 144, 144, 0.5); border-bottom: 1px solid #f6f6f6; } @media (min-width: 1200px) { #secondary-nav { height: 65px; border-top: 1px solid #ececec; } #secondary-nav .items { height: 64px; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } #secondary-nav .title { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; font-size: 18px; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } #secondary-nav .links { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; margin-top: 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 0; } #secondary-nav .links a { margin-left: 40px; transition: all 250ms; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 400; margin-bottom: 0; border: 1px solid transparent; border-radius: 8px; } #secondary-nav .links a:hover { color: #0090ff; } #secondary-nav .links a.current:hover { color: #444; } #secondary-nav .links.mobile-hidden { display: -webkit-box; display: -ms-flexbox; display: flex; } #secondary-nav .actions { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; width: auto; } #secondary-nav .bin { margin-left: 60px; padding: 6px 21px 5px; transition: all 250ms; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 400; font-size: inherit; } #secondary-nav .bin:hover { background-color: transparent; color: #0090ff; } #secondary-nav .bin:only-child { position: relative; } .subnav-active #secondary-nav { display: none; } .lang-active #secondary-nav { opacity: .25; pointer-events: none; } } @media (min-width: 1600px) { #secondary-nav { height: 81px; } #secondary-nav .items { height: 80px; font-size: 16px; } #secondary-nav .title { font-size: 21px; } #secondary-nav .links a { margin-left: 50px; } #secondary-nav .bin { padding: 8px 21px 7px; } } @media (min-width: 2100px) { #secondary-nav .items { font-size: 18px; } #secondary-nav .title { font-size: 24px; } #secondary-nav .links a { margin-left: 60px; } #secondary-nav .bin { margin-left: 70px; } } .custom-footer-homekit .section-product-footer .container-fluid.top { display: none; } .custom-footer-homekit .section-product-footer { background-color: #f6f6f6 !important; } footer { font-size: 1.4rem; color: #7e7e7e; } footer .social { padding-top: 2.4rem; padding-bottom: 2.4rem; border-top: 1px solid #e1e1e1; margin-bottom: -3.4rem; } footer .social ul { list-style: none; margin: 0; padding: 0; width: 100%; max-width: 275px; margin-left: auto; margin-right: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } footer .social ul img { width: 36px; height: auto; } footer .links { background-color: #eeeeee; } footer .links ul { list-style: none; width: 100%; max-width: 480px; margin-left: auto; margin-right: auto; text-align: center; padding-top: 2.4rem; padding-bottom: 1rem; } footer .links ul li { display: inline-block; padding: 0 1rem; margin-bottom: 1.4rem; } footer .links ul li a { color: #444444; } footer .links ul li a:hover, footer .links ul li a:focus { text-decoration: none; outline: 0; } footer .custom-footer-menu { padding-top: 1.2rem; padding-bottom: 1.2rem; } footer .custom-footer-menu h3 { font-size: inherit; font-weight: 600; color: #444; margin-top: 1.6rem; padding-bottom: 1.6rem; } footer .custom-footer-menu li { padding: 3px 0; } footer .custom-footer-menu a { color: #7e7e7e; text-decoration: none; } footer .custom-footer-menu .four-columns { position: relative; min-height: 1px; padding-right: 5px; padding-left: 5px; width: 100%; } footer .custom-footer-menu .four-columns:last-of-type h3 { border-bottom: 0; } footer .custom-footer-menu .five-columns { position: relative; min-height: 1px; padding-right: 5px; padding-left: 5px; width: 100%; } footer .custom-footer-menu .five-columns:last-of-type h3 { border-bottom: 0; } footer:lang(ar) .custom-footer-menu { direction: rtl; } footer:lang(ar) .custom-footer-menu h3 { padding-right: 15px; } footer:lang(ar) .links ul { direction: rtl; } .sub-footer .partner { padding-top: 2.4rem; text-align: center; font-size: 1.4rem; } .sub-footer .partner a { text-transform: uppercase; color: #7e7e7e; } .sub-footer .partner a:hover, .sub-footer .partner a:focus { text-decoration: none; outline: 0; } .sub-footer .partner a img { display: inline-block; width: 120px; margin-left: 1rem; } .sub-footer .copyright { text-align: center; } .sub-footer .copyright p { font-size: 1.4rem; color: #7e7e7e; padding-top: 2.4rem; padding-bottom: 1.8rem; } .sub-footer .copyright img { width: auto; height: 42px; margin-bottom: 2.4rem; } @media (max-width: 767px) { footer .custom-footer-menu ul { display: none; margin-top: .6rem; } footer .custom-footer-menu h3 { border-bottom: 1px solid #f0f0f0; position: relative; } footer .custom-footer-menu h3:after { content: ''; display: block; width: 8px; height: 8px; border-right: 1px solid #444; border-bottom: 1px solid #444; position: absolute; right: 0; top: calc(50% - 8px); -webkit-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg); transition: all 250ms; } footer .custom-footer-menu h3.active:after { -webkit-transform: translateY(-15%) rotate(225deg); transform: translateY(-15%) rotate(225deg); } footer .custom-footer-menu h3.active + ul { display: block; } footer .custom-footer-menu .col-phoneS-12:last-of-type h3 { border-bottom: 0; } } @media (min-width: 544px) { footer .links ul { max-width: 520px; } } @media (min-width: 768px) { footer { background-color: #eeeeee; } footer .links ul { max-width: 660px; } footer .links.lighter-font ul li a { color: #7e7e7e; } footer .social { border-top: 0; margin-bottom: 0; } footer .custom-footer-menu .four-columns { width: 25%; } footer .custom-footer-menu .five-columns { width: 25%; } footer:lang(ar) .custom-footer-menu h3 { padding-right: 0; } } @media (min-width: 992px) { footer .links ul { max-width: none; } footer .custom-footer-menu .five-columns { width: 20%; } } @media (min-width: 1200px) { footer .container-fluid { max-width: 1140px; } footer .links { background-color: transparent; } footer .links ul { margin-left: 0; margin-right: 0; text-align: left; } footer .links ul li { border-left: 1px solid #ccc; } footer .links ul li:first-child { border-left: none; padding-left: 0; } footer .links ul li a { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } footer .links ul li a:hover { border-bottom: 1px solid #444444; } footer .social { border-bottom: none; padding-bottom: 0; padding-top: 1.6rem; } footer .social ul { margin-left: 0; margin-right: 0; float: right; } footer .social ul img { transition: opacity 250ms; } footer .social ul img:hover { opacity: .7; } footer .social.custom-social { margin-bottom: 2.4rem; } footer .social.custom-social ul { max-width: none; float: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } footer .logo img { height: 46px; width: auto; margin-top: 12px; } footer .custom-footer-menu a { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } footer .custom-footer-menu a:hover { border-bottom: 1px solid #7e7e7e; } footer:lang(ar) .custom-footer { direction: rtl; } footer:lang(ar) .container-fluid .row:nth-of-type(2) { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } footer:lang(ar) .links ul { text-align: right; } footer:lang(ar) .links ul li:first-of-type { border-left: 1px solid #ccc; padding: 0 0 0 1rem; } footer:lang(ar) .links ul li:last-of-type { border-left: 0; } .sub-footer .partner p { text-align: right; padding-right: .8rem; } } @media (min-width: 1600px) { footer .container-fluid { max-width: 1440px; } footer .social ul { padding-left: 4rem; } footer .social.custom-social ul { padding-left: 0; } } @media (min-width: 2100px) { footer .container-fluid { max-width: 1920px; } footer .social ul { padding-left: 7rem; } footer .social.custom-social ul { padding-left: 0; } } section { position: relative; } section .content { width: 100%; padding-top: 2.4rem; padding-bottom: 2.4rem; } .section-header .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .section-header .bg { position: relative; height: 0; padding-bottom: 56.25%; } @media (min-width: 1200px) { section .content { padding-top: 5.5rem; padding-bottom: 5.5rem; } } @media (min-width: 1600px) { section .content { padding-top: 7rem; padding-bottom: 7rem; } } .popup-overlay { display: none; position: fixed; z-index: 10100; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); } .popup-overlay a.close { display: block; width: 20px; height: 20px; background: url("../img/common/close-btn.svg") no-repeat 50% 50%; background-size: 20px 20px; } .popup-video .container { position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .popup-video a.close { position: absolute; top: 20px; right: 20px; z-index: 100; } .popup-white { background-color: #fff; } .popup-white .container { position: absolute; top: 30%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; text-align: center; } .popup-white h1 { margin-bottom: 2.4rem; } .popup-white p { margin-bottom: 1.2rem; } @media (min-width: 1200px) { .popup-white h1 { margin-bottom: 3.6rem; } .popup-white p { margin-bottom: 2.4rem; } } @media (min-width: 2100px) { .popup-white h1 { margin-bottom: 4.8rem; } .popup-white p { margin-bottom: 3.6rem; } } @media (min-width: 1200px) { .anim-textcontent h2, .anim-textcontent h2 + p { position: relative; -webkit-transform: translateY(-25px); transform: translateY(-25px); opacity: 0; } .anim-textcontent h2 ~ div, .anim-textcontent .anim { position: relative; opacity: 0; top: -25px; transition: all 750ms 25ms; } .anim-textcontent h2 { transition: all 750ms; } .anim-textcontent p { transition: all 750ms 25ms; } .anim-textcontent.active h2, .anim-textcontent.active h2 + p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } .anim-textcontent.active h2 { transition: all 750ms 50ms; } .anim-textcontent.active p { transition: all 750ms 25ms; } .anim-textcontent.active h2 ~ div, .anim-textcontent.active .anim { opacity: 1; top: 0; transition: all 750ms; } .anim-textcontent.active .anim-delay-1 { transition: all 1000ms 1000ms; } .anim-textcontent-l2r h2, .anim-textcontent-l2r h2 + p { position: relative; -webkit-transform: translateX(-25px); transform: translateX(-25px); opacity: 0; } .anim-textcontent-l2r h2 { transition: all 750ms 25ms; } .anim-textcontent-l2r p { transition: all 750ms; } .anim-textcontent-l2r.active h2, .anim-textcontent-l2r.active h2 + p { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } .anim-textcontent-l2r.active h2 { transition: all 750ms; } .anim-textcontent-l2r.active p { transition: all 750ms 25ms; } .anim-image-up img { transition: all 750ms 50ms; -webkit-transform: translateX(-40%) translateY(75px); transform: translateX(-40%) translateY(75px); } .anim-image-up.active img { -webkit-transform: translateX(-40%) translateY(0); transform: translateX(-40%) translateY(0); } } /** Swiper 3.3.1 Most modern mobile touch slider and framework with hardware accelerated transitions http://www.idangero.us/swiper/ Copyright 2016, Vladimir Kharlampidi The iDangero.us http://www.idangero.us/ Licensed under MIT Released on: February 7, 2016 */ .swiper-container { margin: 0 auto; position: relative; overflow: hidden; /* Fix of Webkit flickering */ z-index: 1; } .swiper-container-no-flexbox .swiper-slide { float: left; } .swiper-container-vertical > .swiper-wrapper { -webkit-box-orient: vertical; -ms-flex-direction: column; flex-direction: column; } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; box-sizing: content-box; } .swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translate3d(0px, 0, 0); transform: translate3d(0px, 0, 0); } .swiper-container-multirow > .swiper-wrapper { -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap; } .swiper-container-free-mode > .swiper-wrapper { transition-timing-function: ease-out; margin: 0 auto; } .swiper-slide { -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; } /* Auto Height */ .swiper-container-autoheight, .swiper-container-autoheight .swiper-slide { height: auto; } .swiper-container-autoheight .swiper-wrapper { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; transition-property: height, -webkit-transform; transition-property: transform, height; transition-property: transform, height, -webkit-transform; } /* a11y */ .swiper-container .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000; } /* IE10 Windows Phone 8 Fixes */ .swiper-wp8-horizontal { -ms-touch-action: pan-y; touch-action: pan-y; } .swiper-wp8-vertical { -ms-touch-action: pan-x; touch-action: pan-x; } /* Arrows */ .swiper-button-prev, .swiper-button-next { position: absolute; top: 50%; width: 27px; height: 44px; margin-top: -22px; z-index: 10; cursor: pointer; background-size: 27px 44px; background-position: center; background-repeat: no-repeat; } .swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none; } .swiper-button-prev, .swiper-container-rtl .swiper-button-next { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); left: 10px; right: auto; } .swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-next, .swiper-container-rtl .swiper-button-prev { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); right: 10px; left: auto; } .swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); } /* Pagination Styles */ .swiper-pagination { position: absolute; text-align: center; transition: 300ms; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: 10; } .swiper-pagination.swiper-pagination-hidden { opacity: 0; } /* Common Styles */ .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 10px; left: 0; width: 100%; } /* Bullets */ .swiper-pagination-bullet { width: 8px; height: 8px; display: inline-block; border-radius: 100%; background: #000; opacity: 0.2; } button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; box-shadow: none; -ms-appearance: none; -webkit-appearance: none; appearance: none; } .swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; } .swiper-pagination-white .swiper-pagination-bullet { background: #fff; } .swiper-pagination-bullet-active { opacity: 1; background: #007aff; } .swiper-pagination-white .swiper-pagination-bullet-active { background: #fff; } .swiper-pagination-black .swiper-pagination-bullet-active { background: #000; } .swiper-container-vertical > .swiper-pagination-bullets { right: 10px; top: 50%; -webkit-transform: translate3d(0px, -50%, 0); transform: translate3d(0px, -50%, 0); } .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 5px 0; display: block; } .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 5px; } /* Progress */ .swiper-pagination-progress { background: rgba(0, 0, 0, 0.25); position: absolute; } .swiper-pagination-progress .swiper-pagination-progressbar { background: #007aff; position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: scale(0); transform: scale(0); -webkit-transform-origin: left top; transform-origin: left top; } .swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar { -webkit-transform-origin: right top; transform-origin: right top; } .swiper-container-horizontal > .swiper-pagination-progress { width: 100%; height: 4px; left: 0; top: 0; } .swiper-container-vertical > .swiper-pagination-progress { width: 4px; height: 100%; left: 0; top: 0; } .swiper-pagination-progress.swiper-pagination-white { background: rgba(255, 255, 255, 0.5); } .swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar { background: #fff; } .swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar { background: #000; } /* 3D Container */ .swiper-container-3d { -webkit-perspective: 1200px; -o-perspective: 1200px; perspective: 1200px; } .swiper-container-3d .swiper-wrapper, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-cube-shadow { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; } .swiper-container-3d .swiper-slide-shadow-left { /* Safari 4+, Chrome */ /* Chrome 10+, Safari 5.1+, iOS 5+ */ /* Firefox 3.6-15 */ /* Opera 11.10-12.00 */ background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), transparent); /* Firefox 16+, IE10, Opera 12.50+ */ } .swiper-container-3d .swiper-slide-shadow-right { /* Safari 4+, Chrome */ /* Chrome 10+, Safari 5.1+, iOS 5+ */ /* Firefox 3.6-15 */ /* Opera 11.10-12.00 */ background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), transparent); /* Firefox 16+, IE10, Opera 12.50+ */ } .swiper-container-3d .swiper-slide-shadow-top { /* Safari 4+, Chrome */ /* Chrome 10+, Safari 5.1+, iOS 5+ */ /* Firefox 3.6-15 */ /* Opera 11.10-12.00 */ background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent); /* Firefox 16+, IE10, Opera 12.50+ */ } .swiper-container-3d .swiper-slide-shadow-bottom { /* Safari 4+, Chrome */ /* Chrome 10+, Safari 5.1+, iOS 5+ */ /* Firefox 3.6-15 */ /* Opera 11.10-12.00 */ background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), transparent); /* Firefox 16+, IE10, Opera 12.50+ */ } /* Coverflow */ .swiper-container-coverflow .swiper-wrapper, .swiper-container-flip .swiper-wrapper { /* Windows 8 IE 10 fix */ -ms-perspective: 1200px; } /* Cube + Flip */ .swiper-container-cube, .swiper-container-flip { overflow: visible; } .swiper-container-cube .swiper-slide, .swiper-container-flip .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; } .swiper-container-cube .swiper-slide .swiper-slide, .swiper-container-flip .swiper-slide .swiper-slide { pointer-events: none; } .swiper-container-cube .swiper-slide-active, .swiper-container-flip .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-container-cube .swiper-slide-shadow-top, .swiper-container-flip .swiper-slide-shadow-top, .swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } /* Cube */ .swiper-container-cube .swiper-slide { visibility: hidden; -webkit-transform-origin: 0 0; transform-origin: 0 0; width: 100%; height: 100%; } .swiper-container-cube.swiper-container-rtl .swiper-slide { -webkit-transform-origin: 100% 0; transform-origin: 100% 0; } .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-prev, .swiper-container-cube .swiper-slide-next + .swiper-slide { pointer-events: auto; visibility: visible; } .swiper-container-cube .swiper-cube-shadow { position: absolute; left: 0; bottom: 0px; width: 100%; height: 100%; background: #000; opacity: 0.6; -webkit-filter: blur(50px); filter: blur(50px); z-index: 0; } /* Fade */ .swiper-container-fade.swiper-container-free-mode .swiper-slide { transition-timing-function: ease-out; } .swiper-container-fade .swiper-slide { pointer-events: none; transition-property: opacity; } .swiper-container-fade .swiper-slide .swiper-slide { pointer-events: none; } .swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto; } /* Scrollbar */ .swiper-scrollbar { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0, 0, 0, 0.1); } .swiper-container-horizontal > .swiper-scrollbar { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98%; } .swiper-container-vertical > .swiper-scrollbar { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98%; } .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0, 0, 0, 0.5); border-radius: 10px; left: 0; top: 0; } .swiper-scrollbar-cursor-drag { cursor: move; } /* Preloader */ .swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite; animation: swiper-preloader-spin 1s steps(12, end) infinite; } .swiper-lazy-preloader:after { display: block; content: ""; width: 100%; height: 100%; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); background-position: 50%; background-size: 100%; background-repeat: no-repeat; } .swiper-lazy-preloader-white:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } @-webkit-keyframes swiper-preloader-spin { 100% { -webkit-transform: rotate(360deg); } } @keyframes swiper-preloader-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .compare-slider { width: 100%; height: 0; padding-bottom: 48.789%; position: relative; overflow: hidden; } .compare-slider div { position: absolute; top: 0; height: 100%; overflow: hidden; } .compare-slider .drag { display: block; width: 50px; height: 50px; margin: -25px 0 0 -25px; position: absolute; z-index: 100; border: 3px solid #fff; border-radius: 50%; } .compare-slider .drag:before, .compare-slider .drag:after { content: ''; display: block; position: absolute; border-left: 1px solid #fff; border-right: 1px solid #fff; height: 2000px; left: 21px; } .compare-slider .drag:before { top: -2000px; } .compare-slider .drag:after { top: 46px; } .compare-slider .drag .arrow { display: block; width: 0; height: 0; border-style: solid; position: absolute; top: 14px; } .compare-slider .drag .arrow.left { border-width: 8px 8px 8px 0; border-color: transparent #ffffff transparent transparent; left: 10px; } .compare-slider .drag .arrow.right { border-width: 8px 0 8px 8px; border-color: transparent transparent transparent #ffffff; left: 27px; } .hint { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 1.2rem; background-color: rgba(255, 255, 255, 0.1); color: #fff; border: 1px solid #fff; border-radius: 6px; text-align: left; } .hint figcaption { text-align: left; text-transform: uppercase; } .hint figcaption div { font-size: 80%; line-height: 1; } .hint figcaption div span { display: block; font-size: 170%; padding-top: .4rem; } .hint img { margin-right: 1.2rem; height: 50px !important; max-width: 60px !important; width: auto !important; } .hint.blue { background-color: rgba(0, 144, 255, 0.1); color: #0090ff; border-color: #0090ff; } .hint.whiteblue { background-color: rgba(255, 255, 255, 0.3); display: inline-block; color: #0090ff; } .hint.whiteblue figcaption { display: inline-block; } .hint.whiteblue img { vertical-align: top; } .hint.whiteblue sub { display: block; width: auto; max-width: 430px; font-size: 70%; line-height: normal; color: #444; margin-top: 1rem; padding-left: .8rem; text-align: left; } .hint.quote figcaption { text-transform: none; } .hint.quote figcaption div { font-style: italic; font-size: 120%; } @media (min-width: 992px) { .hint img { height: 60px !important; max-width: 70px !important; } } @media (min-width: 1200px) { .hint { padding: 1.6rem 2.4rem; margin-top: 1.2rem; border-radius: 12px; } .hint img { margin-right: 2.4rem; height: 70px !important; max-width: 80px !important; } } @media (min-width: 2100px) { .hint { padding: 2.4rem 3.6rem; } .hint img { height: 80px !important; max-width: 90px !important; } } #cookie-info { display: none; position: fixed; z-index: 1000; bottom: 0; width: 100%; background-color: #f0f0f0; padding-bottom: 2rem; padding-top: 2rem; } #cookie-info p { text-align: center; font-size: 1.1rem; padding-bottom: 0; padding-left: 1rem; padding-right: 1rem; } #cookie-info a.close { display: block; width: 16px; height: 16px; background: url("../img/common/close-btn-blue.svg") no-repeat 50% 50%; background-size: 16px 16px; position: absolute; top: 16px; right: 16px; z-index: 100; } #cookie-info .col-phoneS-10 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #cookie-info .cookie-ok { background-color: #0090ff; padding: 0.8rem 4rem; font-weight: 400; color: #ffffff; max-width: 200px; border-radius: 25px; font-size: 1.1rem; margin: 2rem 0 0; } #cookie-info .cookie-ok:hover { background-color: #007ae6; } @media (min-width: 768px) { #cookie-info p { font-size: 1.4rem; padding-left: 1rem; padding-right: 1rem; } #cookie-info a.close { width: 20px; height: 20px; background-size: 20px 20px; top: 20px; right: 20px; } } @media (min-width: 1200px) { #cookie-info .col-phoneS-10 { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } #cookie-info .cookie-ok { font-size: 1.4rem; margin: 0 0 0 4rem; } } .lazy-video .lazy-preview, .lazy-video video { display: block; width: 100%; max-width: none; height: auto; } .infobox-wrapper { width: 100%; height: auto; position: relative; } .infobox-button { display: block; border-radius: 50%; height: 24px; width: 24px; background: rgba(0, 144, 255, 0.1); position: absolute; z-index: 1; } .infobox-button:before, .infobox-button:after { content: ''; display: block; width: 12px; height: 12px; background-color: #0090FF; position: absolute; border-radius: 50%; z-index: 2; transition: all 250ms; left: 50%; top: 50%; } .infobox-button:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); } .infobox-button:after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); -webkit-animation: 2.5s ease-in-out .25s infinite normal forwards running th-info-button; animation: 2.5s ease-in-out .25s infinite normal forwards running th-info-button; } .infobox-button.active { background: #f6f6f6; } .infobox-button.active:before, .infobox-button.active:after { height: 14px; width: 2px; border-radius: 0; background-color: #0090ff; -webkit-animation: none; animation: none; } .infobox { display: none; background-color: #f6f6f6; border-radius: 6px; padding: 10px; margin-top: 3.6rem; font-size: 1.2rem; } .infobox span { display: block; text-align: center; font-size: 1.4rem; padding-bottom: .4rem; } .infobox.active { display: inline-block; z-index: 2; } .infobox.shadow { box-shadow: rgba(0, 0, 0, 0.15) 0 3px 8px; } @media (min-width: 1200px) { .infobox-button { -webkit-transform: scale(1.4); transform: scale(1.4); } .infobox { position: absolute; margin-top: 0; display: inline-block; opacity: 0; transition: all 250ms; } .infobox.active { opacity: 1; } .infobox.active.top { -webkit-transform: translateY(-20px); transform: translateY(-20px); } .infobox.active.bottom { -webkit-transform: translateY(20px); transform: translateY(20px); } .infobox.active.left { -webkit-transform: translateX(-20px); transform: translateX(-20px); } .infobox.active.right { -webkit-transform: translateX(20px); transform: translateX(20px); } } @media (min-width: 1600px) { .infobox { font-size: 1.4rem; padding: 12px 16px; } .infobox span { font-size: 1.6rem; padding-bottom: .6rem; } } @media (min-width: 2100px) { .infobox { font-size: 1.6rem; padding: 16px 24px; } .infobox span { font-size: 1.8rem; padding-bottom: .8rem; } } .chatbot { position: relative; width: 430px; overflow: hidden; -webkit-transform-origin: left top; transform-origin: left top; } .messages { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; opacity: 0; } .bubble { display: -webkit-box; display: -ms-flexbox; display: flex; text-align: left; } .bubble .text { max-width: 265px; padding: 14px 20px; border-radius: 20px; font-size: 18px; line-height: 1.4; margin-bottom: 18px; } .bubble.user { -ms-flex-item-align: end; align-self: flex-end; } .bubble.user .animate { -webkit-transform-origin: right bottom; transform-origin: right bottom; } .bubble.user .text { background-color: #0090FF; color: #fff; } .bubble.bot > div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } .bubble.bot .animate { -webkit-transform-origin: left bottom; transform-origin: left bottom; } .bubble.bot .text { background-color: #f1f0f0; } .bubble.bot img { width: 61px; height: 63px; margin-bottom: 4px; } .home-page.redesign #products-slide-menu, .home-page.redesign #products-list, .home-page.redesign #two-usecases, .home-page.redesign #fibaro-home, .home-page.redesign #remote-access, .home-page.redesign #homekit, .home-page.redesign #two-installers, .home-page.redesign #integrations, .home-page.redesign #campaign, .home-page.redesign #compatibility, .home-page.redesign #become-installer { font-size: 13px; } .home-page.redesign #products-slide-menu h1, .home-page.redesign #products-list h1, .home-page.redesign #two-usecases h1, .home-page.redesign #fibaro-home h1, .home-page.redesign #remote-access h1, .home-page.redesign #homekit h1, .home-page.redesign #two-installers h1, .home-page.redesign #integrations h1, .home-page.redesign #campaign h1, .home-page.redesign #compatibility h1, .home-page.redesign #become-installer h1 { font-size: 32px; } .home-page.redesign #products-slide-menu h2, .home-page.redesign #products-list h2, .home-page.redesign #two-usecases h2, .home-page.redesign #fibaro-home h2, .home-page.redesign #remote-access h2, .home-page.redesign #homekit h2, .home-page.redesign #two-installers h2, .home-page.redesign #integrations h2, .home-page.redesign #campaign h2, .home-page.redesign #compatibility h2, .home-page.redesign #become-installer h2 { font-size: 26px; padding-bottom: 13px; line-height: 1.4; } .home-page section { position: relative; } .home-page section .content { width: 100%; } .home-page #new-home-slider .content, .home-page #home-slider .content, .home-page #products-list .content { padding-top: 2.4rem; padding-bottom: 2.4rem; } .home-page #new-home-slider { width: auto; max-width: 2560px; } .home-page #new-home-slider .content { position: absolute; z-index: 10; text-align: center; } .home-page #new-home-slider .content p { padding-bottom: 0; } .home-page #new-home-slider .bg { height: 0; padding-bottom: 112%; } .home-page #new-home-slider .home-button { display: inline-block; position: relative; padding: 4px 20px 5px 20px; border-radius: 10px; transition: all 250ms; margin: 20px 0 0; background-image: linear-gradient(to right, #3b8ff7, #2b52db); cursor: pointer; } .home-page #new-home-slider .home-button a { color: #ffffff; font-size: 13px; } .home-page #new-home-slider .home-button:hover { background-image: linear-gradient(to right, #1c41b0, #1c41b0); } .home-page #new-home-slider .home-button:hover a { color: #ffffff; } .home-page #new-home-slider .bg-link { height: 0; padding-bottom: 36%; position: relative; z-index: 1; } .home-page #new-home-slider .swiper-pagination-bullet { opacity: 1; background-color: transparent; border: 1px solid #0090FF; } .home-page #new-home-slider .swiper-pagination-bullet-active { background-color: #0090FF; } .home-page #new-home-slider .swiper-button { display: none; } .home-page #new-home-slider .swiper-slide { background-color: #fff; } .home-page #new-home-slider .swiper-slide > a { display: block; width: 100%; height: 100%; position: absolute; z-index: 1000; color: #444444; } .home-page #new-home-slider .swiper-slide > a.bg-link { height: 0; padding-bottom: 112%; position: relative; z-index: 1; } .home-page #new-home-slider .swiper-slide .content { pointer-events: none; } .home-page #new-home-slider .smart-home .content { padding-top: 4rem; } .home-page #new-home-slider .smart-home h1, .home-page #new-home-slider .smart-home h2 { font-weight: 700; color: #444444; padding-bottom: 0; font-size: 2.8rem; line-height: 1.4; } .home-page #new-home-slider .bundle-pack h1, .home-page #new-home-slider .bundle-pack h2 { font-weight: 700; font-size: 2.8rem; } .home-page #new-home-slider .bundle-pack .content { padding-top: 4rem; } .home-page #new-home-slider .bundle-pack .bundles { text-align: center; padding: 0 5%; font-weight: 300; } .home-page #new-home-slider .bundle-pack .bundles span { font-weight: 300; } .home-page #new-home-slider .bundle-pack .bundles br { display: none; } .home-page #new-home-slider .your-home h1, .home-page #new-home-slider .your-home h2 { font-weight: 700; color: #444444; padding-bottom: 0; font-size: 3rem; line-height: 1.4; } .home-page #new-home-slider .your-home .content { margin-left: -5px; } .home-page #new-home-slider .walli h1, .home-page #new-home-slider .walli h2 { font-weight: 600; color: #ffffff; padding-bottom: 0; font-size: 3rem; line-height: 1.4; } .home-page #new-home-slider .walli p { color: #ffffff; font-size: 1em; padding-top: 9%; } .home-page #new-home-slider .walli .content { margin-left: -5px; } .home-page #new-home-slider .installer h1, .home-page #new-home-slider .installer h2 { font-weight: 700; color: #2b2b2b; padding-bottom: 0; font-size: 3rem; line-height: 1.4; } .home-page #new-home-slider .installer h1 span, .home-page #new-home-slider .installer h2 span { display: none; } .home-page #new-home-slider .installer p { color: #2b2b2b; font-size: 1em; font-weight: 400; } .home-page #new-home-slider .installer img { width: 100px; height: auto; margin-top: -20px; } .home-page #new-home-slider .use-case-1, .home-page #new-home-slider .use-case-2, .home-page #new-home-slider .use-case-3 { background-color: #000f2a; } .home-page #new-home-slider .use-case-1 .content, .home-page #new-home-slider .use-case-2 .content, .home-page #new-home-slider .use-case-3 .content { color: #ffffff; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #new-home-slider .use-case-1 .content h2, .home-page #new-home-slider .use-case-2 .content h2, .home-page #new-home-slider .use-case-3 .content h2 { font-size: 3.5rem; padding-bottom: 2.5rem; } .home-page #new-home-slider .use-case-1 .content span, .home-page #new-home-slider .use-case-2 .content span, .home-page #new-home-slider .use-case-3 .content span { font-family: 'Caveat', cursive; font-size: 1.3em; position: relative; z-index: 10; } .home-page #new-home-slider .use-case-1 .content svg, .home-page #new-home-slider .use-case-2 .content svg, .home-page #new-home-slider .use-case-3 .content svg { position: absolute; left: 3%; top: 55px; z-index: 1; } .home-page #usecase-icon-menu { padding: 2rem 0; } .home-page #usecase-icon-menu p { color: #444444; padding-top: 10px; } .home-page #usecase-icon-menu img { width: 50%; height: auto; max-width: 130px; } .home-page #usecase-icon-menu h2 { font-size: 30px; line-height: 1.4; } .home-page #usecase-icon-menu .swiper-scrollbar-drag { cursor: move; /* fallback if grab cursor is unsupported */ cursor: -webkit-grab; cursor: grab; } .home-page #usecase-icon-menu .swiper-container .swiper-scrollbar { bottom: 13px; } .home-page #usecase-icon-menu .swiper-container .swiper-slide { -ms-flex-item-align: end; align-self: flex-end; } .home-page #usecase-icon-menu .swiper-container .swiper-slide .col-phoneS-12 { padding-left: 0; } .home-page #usecase-icon-menu .swiper-container .swiper-slide .more { display: none; } .home-page #usecase-icon-menu .swiper-container .swiper-slide:nth-of-type(2n) .content .col-phoneS-12 { padding-right: 0; } .home-page #usecase-icon-menu .usecase-button { display: inline-block; position: relative; padding: 8px 30px 8px 30px; border-radius: 10px; transition: all 250ms; margin: 20px 0 0; background-image: linear-gradient(to right, #3b8ff7, #2b52db); cursor: pointer; } .home-page #usecase-icon-menu .usecase-button a { color: #ffffff; font-size: 1.2em; } .home-page #usecase-icon-menu .usecase-button:hover { background-image: linear-gradient(to right, #1c41b0, #1c41b0); } .home-page #usecase-icon-menu .usecase-button:hover a { color: #ffffff; } .home-page #fibaro-home { margin-top: 5px; } .home-page #fibaro-home a { display: block; width: 100%; height: 100%; position: absolute; z-index: 1000; } .home-page #fibaro-home a:hover .content .more { border-bottom: 1px solid #ffffff; } .home-page #fibaro-home h2 { font-weight: 600; } .home-page #fibaro-home h2 span { font-weight: 300; font-size: 70%; display: block; } .home-page #fibaro-home p { padding-bottom: 1.4rem; } .home-page #fibaro-home .content { color: #ffffff; position: absolute; z-index: 1; } .home-page #fibaro-home .content .more { color: #ffffff; display: inline-block; position: relative; border-radius: 0; border-bottom: 1px solid transparent; padding: 0; } .home-page #fibaro-home .content .more:after { width: 6px; height: 6px; border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; } .home-page #fibaro-home .bg { height: 370px; background-position: 50% 100%; } .home-page #fibaro-home.all-use-cases a:hover .content .more { border-bottom: 1px solid #0090ff; } .home-page #fibaro-home.all-use-cases .content { color: #444; } .home-page #fibaro-home.all-use-cases .content .more { color: #0090ff; } .home-page #fibaro-home.all-use-cases .content .more:after { border-top: 1px solid #0090ff; border-right: 1px solid #0090ff; } .home-page #fibaro-home.all-use-cases .bg { height: 440px; } .home-page #two-usecases a { color: #444444; width: 100%; height: 100%; } .home-page #two-usecases a:hover .content .more { border-bottom: 1px solid #444444; } .home-page #two-usecases .container-fluid { padding-left: 0; padding-right: 0; } .home-page #two-usecases .content { position: absolute; z-index: 1; } .home-page #two-usecases .content h2 { font-weight: 700; padding-bottom: 1rem; } .home-page #two-usecases .content a { color: #444444; display: block; width: 100%; height: 100%; z-index: 1000; } .home-page #two-usecases .left, .home-page #two-usecases .right { margin-top: 5px; } .home-page #two-usecases .bg { height: 380px; background-position: 50% 100%; } .home-page #two-usecases .more { color: #444444; display: inline-block; position: relative; border-radius: 0; border-bottom: 1px solid transparent; padding: 0; } .home-page #two-usecases .more:after { width: 6px; height: 6px; border-top: 1px solid #444444; border-right: 1px solid #444444; } .home-page #two-usecases.safe-secure .bg { height: 480px; } .home-page #two-usecases.safe-secure .more { color: #0090ff; } .home-page #two-usecases.safe-secure .more:after { border-top: 1px solid #0090ff; border-right: 1px solid #0090ff; } .home-page #two-usecases.safe-secure a .right { color: #ffffff; } .home-page #two-usecases.safe-secure a:hover .content .more { border-bottom: 1px solid #0090ff; } .home-page #remote-access { margin-top: 5px; } .home-page #remote-access a { color: #ffffff; display: block; width: 100%; height: 100%; position: absolute; z-index: 1000; } .home-page #remote-access a:hover .content .more { border-bottom: 1px solid #0090FF; } .home-page #remote-access h2 { font-weight: 700; padding-bottom: 1rem; } .home-page #remote-access p { padding-bottom: 1.4rem; } .home-page #remote-access .content { color: #444444; position: absolute; z-index: 1; } .home-page #remote-access .bg { height: 540px; background-position: 50% 100%; } .home-page #remote-access .more { color: #0090ff; display: inline-block; position: relative; border-radius: 0; border-bottom: 1px solid transparent; padding: 0; } .home-page #remote-access .more:after { width: 6px; height: 6px; border-top: 1px solid #0090ff; border-right: 1px solid #0090ff; } .home-page #integrations { margin-top: 5px; } .home-page #integrations:hover .content .more { border-bottom: 1px solid #0090FF; } .home-page #integrations .content { position: absolute; z-index: 10; text-align: center; color: #444444; } .home-page #integrations .content h2 { font-weight: 700; } .home-page #integrations .content h2 span { font-weight: 300; display: block; } .home-page #integrations .bg { height: 450px; background-position: 50% 100%; } .home-page #integrations .more { color: #0090ff; display: inline-block; position: relative; border-radius: 0; border-bottom: 1px solid transparent; padding: 0; } .home-page #integrations .more:after { width: 6px; height: 6px; border-top: 1px solid #0090ff; border-right: 1px solid #0090ff; } .home-page #products-list .col-phoneS-12 { background: linear-gradient(to bottom, #fff, #eee); } .home-page #products-list img { width: 100%; max-width: 390px; margin-bottom: 1.2rem; } .home-page #products-list .content h2 { padding-bottom: 1.4rem; } .home-page #products-list .content > a { display: inline-block; color: #444444; } .home-page #products-list.redesign h2 { font-weight: 700; padding-bottom: 1rem; } .home-page #products-list.redesign img { margin-bottom: 0; } .home-page #products-list.redesign .wall-plug { background: #e8eff9; } .home-page #products-list.redesign .button { background: #fae6e7; } .home-page #products-list.redesign .swipe { background: #f0e8f7; } .home-page #two-installers a, .home-page #two-installers-cloned a { width: 100%; height: 100%; } .home-page #two-installers .container-fluid, .home-page #two-installers-cloned .container-fluid { padding-left: 0; padding-right: 0; } .home-page #two-installers .content, .home-page #two-installers-cloned .content { position: absolute; z-index: 1; color: #ffffff; } .home-page #two-installers .content h2, .home-page #two-installers-cloned .content h2 { font-weight: 700; padding-bottom: 1rem; } .home-page #two-installers .content a, .home-page #two-installers-cloned .content a { color: #ffffff; display: block; width: 100%; height: 100%; z-index: 1000; } .home-page #two-installers .find, .home-page #two-installers-cloned .find { margin-top: 5px; height: 500px; background-position: 50% 100%; } .home-page #two-installers .find:hover .more, .home-page #two-installers-cloned .find:hover .more { border-bottom: 1px solid #0090FF; } .home-page #two-installers .become, .home-page #two-installers-cloned .become { margin-top: 5px; height: 500px; background-position: 50% 100%; } .home-page #two-installers .become h2, .home-page #two-installers-cloned .become h2 { padding-bottom: 2.4rem; } .home-page #two-installers .become p, .home-page #two-installers-cloned .become p { padding-bottom: 1rem; } .home-page #two-installers .become:hover .more, .home-page #two-installers-cloned .become:hover .more { border-bottom: 1px solid #0090FF; } .home-page #two-installers .more, .home-page #two-installers-cloned .more { color: #0090ff; display: inline-block; position: relative; border-radius: 0; border-bottom: 1px solid transparent; padding: 0; } .home-page #two-installers .more:after, .home-page #two-installers-cloned .more:after { width: 6px; height: 6px; border-top: 1px solid #0090ff; border-right: 1px solid #0090ff; } .home-page #two-installers .become, .home-page #two-installers .second { display: none; } .home-page #two-installers-cloned .find, .home-page #two-installers-cloned .first { display: none; } .home-page #homekit { margin-top: 5px; } .home-page #homekit:hover .content .more { border-bottom: 1px solid #0090FF; } .home-page #homekit a { color: #444444; display: block; width: 100%; height: 100%; position: absolute; z-index: 1000; } .home-page #homekit h2 { font-weight: 700; padding-bottom: 1rem; } .home-page #homekit p { padding-bottom: 1.4rem; } .home-page #homekit .content { position: absolute; z-index: 1; } .home-page #homekit .bg { height: 510px; background-position: 50% 100%; } .home-page #homekit .homekit { position: absolute; bottom: 2.5rem; width: 48%; height: auto; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .home-page #homekit .more { color: #0090ff; display: inline-block; position: relative; border-radius: 0; border-bottom: 1px solid transparent; padding: 0; } .home-page #homekit .more:after { width: 6px; height: 6px; border-top: 1px solid #0090ff; border-right: 1px solid #0090ff; } .home-page #separator { height: 15px; } .home-page #eu-flag { transition: opacity 3s 8s; } .home-page #eu-flag .eu-flag-cookie { position: fixed; right: 21px; display: block; bottom: 230px; z-index: 10000; transition: all 1500ms 250ms; } .home-page #eu-flag .eu-flag-cookie.animate { -webkit-transform: translateY(160px); transform: translateY(160px); } .home-page #eu-flag .eu-flag { position: fixed; right: 21px; display: block; bottom: 20px; z-index: 10000; } .home-page #eu-flag.hide { opacity: 0; } .home-page #eu-flag img { width: 80px; height: 67px; } .home-page #home-slider { width: auto; max-width: 2560px; } .home-page #home-slider .content { position: absolute; z-index: 10; text-align: center; } .home-page #home-slider .bg { height: 0; padding-bottom: 144%; } .home-page #home-slider .swiper-pagination-bullet { opacity: 1; background-color: transparent; border: 1px solid #0090FF; } .home-page #home-slider .swiper-pagination-bullet-active { background-color: #0090FF; } .home-page #home-slider .swiper-button { display: none; } .home-page #home-slider .slide2 .content, .home-page #home-slider .slide4 .content, .home-page #home-slider .slide5 .content { padding-top: 5rem; text-transform: uppercase; } .home-page #home-slider .slide2 .content h1, .home-page #home-slider .slide2 .content h2, .home-page #home-slider .slide4 .content h1, .home-page #home-slider .slide4 .content h2, .home-page #home-slider .slide5 .content h1, .home-page #home-slider .slide5 .content h2 { padding-bottom: 0; letter-spacing: 10px; margin-right: -10px; font-size: 3.4rem; } .home-page #home-slider .slide2 .content p, .home-page #home-slider .slide4 .content p, .home-page #home-slider .slide5 .content p { font-size: 1.8rem; } .home-page #home-slider .slide2 .content hr, .home-page #home-slider .slide4 .content hr, .home-page #home-slider .slide5 .content hr { color: transparent; border: 0; border-bottom: 1px solid #444444; display: inline-block; width: 120px; } .home-page #home-slider .slide4 .content { text-transform: none; } .home-page #home-slider .slide4 .content h1, .home-page #home-slider .slide4 .content h2 { letter-spacing: 0; margin-right: 0; } .home-page #home-slider .slide4 .content p { text-transform: uppercase; } .home-page #home-slider .slide5 .content { color: #fff; text-transform: none; } .home-page #home-slider .slide5 .content h1, .home-page #home-slider .slide5 .content h2 { letter-spacing: 0; margin-right: 0; } .home-page #home-slider .slide5 .content hr { border-bottom: 1px solid #0090ff; width: 260px; } .home-page #home-slider .slide6 .content { color: #ffffff; } .home-page #home-slider .slide6 .content h2 { padding-bottom: 5px; font-size: 3em; } .home-page #home-slider .slide6 .content p { padding-top: 5px; font-size: 120%; } .home-page #home-slider .slide6 hr { height: 1px; border: 0; width: 230px; background-image: linear-gradient(to right, #00FCFB, #0090ff); margin-bottom: 10px; } .home-page #home-slider .swiper-slide { background-color: #fff; } .home-page #home-slider .swiper-slide > a { display: block; width: 100%; height: 100%; position: absolute; z-index: 1000; color: #444444; } .home-page #home-slider .slide3 .content { padding-top: 5rem; } .home-page #home-slider .slide3 .content h1, .home-page #home-slider .slide3 .content h2 { padding-bottom: 0; } .home-page #home-slider .slide3 .content p { font-size: 1.8rem; text-transform: uppercase; } .home-page #home-slider .slide3 .content hr { color: transparent; border-bottom: 1px solid #444444; display: inline-block; width: 120px; } .home-page #home-slider .slide12 .content { padding-top: 2.4rem; } .home-page #home-slider .slide12 h1 { font-weight: 300; color: #fff; padding-bottom: 0; font-size: 2.8rem; } .home-page #home-slider .slide12 img { margin: 15px 10px 15px 0; } .home-page #home-slider .slide13 .content { padding-top: 4rem; } .home-page #home-slider .slide13 h1 { font-weight: 300; color: #fff; padding-bottom: 0; font-size: 2.8rem; } .home-page #home-slider .slide13 p { font-weight: 300; color: #ff734d; padding-bottom: 0; } .home-page #compatibility img { width: 80px; margin-bottom: 2.4rem; } .home-page #compatibility.redesign h2 { font-weight: 700; } .home-page #compatibility.redesign .more { display: inline-block; position: relative; padding: 6px 50px; border-radius: 25px; border: 1px solid #0090ff; color: #0090ff; transition: all 250ms; } .home-page #compatibility.redesign .more:hover { background-color: #0090FF; color: #ffffff; } .home-page #compatibility.redesign .more:hover:after { border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; } .home-page #compatibility.redesign .more:after { -webkit-transform: rotate(45deg) translate(2px, -2px); transform: rotate(45deg) translate(2px, -2px); } .home-page #why-fibaro .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #why-fibaro .content h2 { color: #fff; } .home-page #why-fibaro .bg { height: 260px; } .home-page #become-installer .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-60%); transform: translateY(-60%); } .home-page #become-installer .content h2 { color: #fff; padding-bottom: 23px; font-weight: 700; } .home-page #become-installer .content p { color: #fff; padding-bottom: 5px; } .home-page #become-installer .more { display: inline-block; position: relative; padding: 6px 50px; border-radius: 25px; border: 1px solid #0090ff; color: #0090ff; transition: all 250ms; } .home-page #become-installer .more:hover { background-color: #0090FF; color: #ffffff; } .home-page #become-installer .more:hover:after { border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; } .home-page #become-installer .more:after { -webkit-transform: rotate(45deg) translate(2px, -2px); transform: rotate(45deg) translate(2px, -2px); } .home-page #become-installer .bg { height: 420px; } .home-page #campaign .col-phoneS-12 { padding: 0; } .home-page #campaign a { display: block; width: 100%; position: relative; color: #fff; } .home-page #campaign img { width: 100%; height: auto; margin: 0; padding: 0; } .home-page #campaign h2 { font-size: 21px; padding-bottom: 10px; } .home-page #campaign span { font-size: 13px; } .home-page #campaign .wrapper { width: 100%; position: absolute; z-index: 10; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; } .home-page #campaign .morelink { display: inline-block; position: relative; padding: 8px 45px 8px 30px; border-radius: 18px/50%; background-color: #0090ff; border: 1px solid #0090ff; color: #fff; transition: all 250ms; } .home-page #campaign .morelink:after { content: ''; display: block; position: absolute; top: 50%; right: 16px; z-index: 2; width: 12px; height: 12px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .home-page #campaign.redesign span { font-size: inherit; display: block; font-weight: 700; margin-top: 5px; } @media (max-width: 543px) { .home-page #new-home-slider h1, .home-page #new-home-slider h2, .home-page #home-slider h1, .home-page #home-slider h2 { font-size: 2.8rem; padding-bottom: 0; } .home-page #new-home-slider h1, .home-page #home-slider h1 { padding-bottom: 1rem; } .home-page #new-home-slider h2, .home-page #home-slider h2 { padding-bottom: .5rem; } } @media (min-width: 544px) { .home-page #new-home-slider .bundle-pack .bundles { font-weight: 700; } .home-page #new-home-slider .bundle-pack .bundles span { font-weight: 300; } .home-page #new-home-slider .bundle-pack .bundles br { display: block; } .home-page #new-home-slider .your-home h1, .home-page #new-home-slider .your-home h2 { padding-top: 15%; } .home-page #new-home-slider .walli p { padding-top: 15%; } .home-page #new-home-slider .installer h1 span, .home-page #new-home-slider .installer h2 span { display: inline; } .home-page #new-home-slider .installer p { padding-top: 15%; } .home-page #fibaro-home .bg { height: 450px; } .home-page #fibaro-home.all-use-cases .bg { height: 520px; } .home-page #two-usecases .bg { height: 530px; } .home-page #remote-access .bg { height: 770px; } .home-page #integrations .bg { height: 650px; } .home-page #two-installers .find, .home-page #two-installers .become, .home-page #two-installers-cloned .find, .home-page #two-installers-cloned .become { height: 700px; } .home-page #homekit .bg { height: 770px; } .home-page #home-slider .slide3 .content p { font-size: inherit; } .home-page #home-slider .slide12 .content { padding-top: 8.4rem; } .home-page #home-slider .slide13 .content { padding-top: 10rem; } .home-page #become-installer .bg { height: 620px; } .home-page #eu-flag .eu-flag-cookie { bottom: 190px; } .home-page #eu-flag .eu-flag-cookie.animate { -webkit-transform: translateY(110px); transform: translateY(110px); } } @media (min-width: 768px) { .home-page #new-home-slider .swiper-slide > a.bg-link { padding-bottom: 36%; } .home-page #new-home-slider .bg { padding-bottom: 36%; } .home-page #new-home-slider .home-button { margin: 10px 0 0; } .home-page #new-home-slider .smart-home .content { text-align: left; padding-top: 7rem; } .home-page #new-home-slider .bundle-pack .content { padding-top: 2.4rem; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #new-home-slider .bundle-pack .bundles { text-align: left; padding: 0; } .home-page #new-home-slider .your-home h1, .home-page #new-home-slider .your-home h2 { padding-top: 0; } .home-page #new-home-slider .your-home .content { text-align: center; padding-top: 2.4rem; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #new-home-slider .walli p { padding-top: 0; } .home-page #new-home-slider .installer p { padding-top: 0; } .home-page #new-home-slider .installer .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #new-home-slider .use-case-1, .home-page #new-home-slider .use-case-2, .home-page #new-home-slider .use-case-3 { background-color: #000f2a; } .home-page #new-home-slider .use-case-1 .content h2, .home-page #new-home-slider .use-case-2 .content h2, .home-page #new-home-slider .use-case-3 .content h2 { padding-bottom: 1rem; } .home-page #new-home-slider .use-case-1 .content svg, .home-page #new-home-slider .use-case-2 .content svg, .home-page #new-home-slider .use-case-3 .content svg { top: 45px; } .home-page #new-home-slider .use-case-1 .home-button, .home-page #new-home-slider .use-case-2 .home-button, .home-page #new-home-slider .use-case-3 .home-button { margin: 10px; } .home-page #fibaro-home:hover .off { opacity: 0; } .home-page #fibaro-home .content { text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #fibaro-home .bg { height: 240px; transition: opacity 1000ms; } .home-page #fibaro-home.all-use-cases { overflow: hidden; -webkit-backface-visibility: hidden; } .home-page #fibaro-home.all-use-cases .bg { height: 240px; transition: all 1s ease-out; } .home-page #fibaro-home.all-use-cases:hover .bg { transform: scale(1.06); -webkit-transform: translateZ(0) scale(1.06); } .home-page #two-usecases a { width: 50%; height: 100%; } .home-page #two-usecases .content { text-align: left; } .home-page #two-usecases .left { padding-right: 0; } .home-page #two-usecases .right { padding-left: 0; margin-left: 5px; } .home-page #two-usecases .left, .home-page #two-usecases .right { overflow: hidden; -webkit-backface-visibility: hidden; } .home-page #two-usecases .left:hover .bg, .home-page #two-usecases .right:hover .bg { transform: scale(1.06); -webkit-transform: translateZ(0) scale(1.06); } .home-page #two-usecases .bg { height: 260px; background-position: 50% 50%; transition: all 1s ease-out; } .home-page #two-usecases.safe-secure .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #two-usecases.safe-secure .bg { height: 260px; } .home-page #remote-access { overflow: hidden; -webkit-backface-visibility: hidden; } .home-page #remote-access:hover .bg { transform: scale(1.06); -webkit-transform: translateZ(0) scale(1.06); } .home-page #remote-access .content { text-align: left; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #remote-access .bg { height: 240px; transition: all 1s ease-out; } .home-page #integrations .bg { height: 320px; padding-bottom: 0; } .home-page #two-installers a { width: 50%; height: 100%; } .home-page #two-installers .content { text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #two-installers .find, .home-page #two-installers .become { height: auto; overflow: hidden; -webkit-backface-visibility: hidden; } .home-page #two-installers .find:hover .bg, .home-page #two-installers .become:hover .bg { transform: scale(1.06); -webkit-transform: translateZ(0) scale(1.06); } .home-page #two-installers .find { padding-right: 0; } .home-page #two-installers .become { padding-left: 0; margin-left: 5px; display: block; } .home-page #two-installers .bg { height: 260px; background-position: 50% 50%; transition: all 1s ease-out; -webkit-transform-origin: 100% 0; transform-origin: 100% 0; } .home-page #two-installers-cloned { display: none; } .home-page #homekit:hover .bg.hover { opacity: 1; } .home-page #homekit .bg { height: 270px; transition: all 1s ease-out; } .home-page #homekit .bg.hover { opacity: 0; transition: opacity 1000ms; } .home-page #homekit .homekit { bottom: 1.5rem; width: 100px; -webkit-transform: translateX(-51%); transform: translateX(-51%); } .home-page #eu-flag .eu-flag-cookie { right: 10px; } .home-page #eu-flag img { width: 100px; height: 85px; } .home-page #home-slider .bg { padding-bottom: 36%; } .home-page #home-slider .slide2 .content, .home-page #home-slider .slide4 .content { padding-top: 2.4rem; } .home-page #home-slider .slide3 .content, .home-page #home-slider .slide5 .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); padding: 0; } .home-page #home-slider .slide5 .content hr { width: 310px; } .home-page #home-slider .slide6 .content { position: absolute; color: #ffffff; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #home-slider .slide6 hr { width: 210px; margin-bottom: 10px; } .home-page #home-slider .slide12 .content { padding-top: 3.6rem; position: absolute; text-align: left; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .home-page #home-slider .slide13 .content { padding-top: 2.4rem; } .home-page #products-list .col-phoneS-12 { background: linear-gradient(to bottom, #f2f2f2, #e0e0e0); } .home-page #products-list .col-phoneS-12:first-child { border-right: 2.5px solid #fff; } .home-page #products-list .col-phoneS-12:nth-child(2) { border-left: 2.5px solid #fff; border-right: 2.5px solid #fff; } .home-page #products-list .col-phoneS-12:last-child { border-left: 2.5px solid #fff; } .home-page #products-list .row { border-top: 5px solid #fff; } .home-page #products-list img { width: 80%; } .home-page #products-list img + p { padding-bottom: 0; } .home-page #campaign h2 { font-size: 28px; padding-bottom: 20px; } .home-page #campaign.redesign { margin-top: 5px; } .home-page #campaign.redesign h2 { font-size: 20px; } .home-page #campaign.redesign span { font-size: 28px; } .home-page #campaign.redesign .wrapper { -webkit-transform: translate(-50%, 0%) scale(0.8); transform: translate(-50%, 0%) scale(0.8); text-align: left; top: initial; bottom: 0; } .home-page #campaign.redesign .col-phoneS-12:nth-of-type(1) { border-right: 4px solid #fff; } .home-page #campaign.redesign .col-phoneS-12:nth-of-type(2) { border-right: 2px solid #fff; border-left: 2px solid #fff; } .home-page #campaign.redesign .col-phoneS-12:nth-of-type(3) { border-left: 4px solid #fff; } .home-page #become-installer { margin-bottom: 5px; } .home-page #become-installer .content { -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-page #become-installer .bg { height: 240px; } } @media (min-width: 992px) { .home-page #new-home-slider .content, .home-page #home-slider .content, .home-page #products-list .content { padding-top: 3.6rem; padding-bottom: 3.6rem; } .home-page #new-home-slider .home-button { margin: 20px 0 0; } .home-page #new-home-slider .smart-home h1, .home-page #new-home-slider .smart-home h2 { font-size: 3.2rem; } .home-page #new-home-slider .smart-home .bg { padding-bottom: 36%; } .home-page #new-home-slider .smart-home .content { padding-top: 10rem; } .home-page #new-home-slider .bundle-pack h1, .home-page #new-home-slider .bundle-pack h2 { font-size: 3.2rem; } .home-page #new-home-slider .your-home h1, .home-page #new-home-slider .your-home h2 { font-size: 2.8rem; } .home-page #new-home-slider .walli h1, .home-page #new-home-slider .walli h2 { font-size: 2.8rem; } .home-page #new-home-slider .installer h1, .home-page #new-home-slider .installer h2 { font-size: 2.8rem; } .home-page #fibaro-home h2 span { font-size: 100%; display: block; } .home-page #fibaro-home .bg { height: 260px; } .home-page #fibaro-home.all-use-cases .bg { height: 260px; } .home-page #two-usecases .right { padding-right: 5px; } .home-page #two-usecases .bg { height: 290px; } .home-page #two-usecases.safe-secure .bg { height: 290px; } .home-page #remote-access .bg { height: 260px; } .home-page #integrations .bg { height: 350px; } .home-page #homekit .bg { height: 320px; } .home-page #homekit .homekit { bottom: 2.5rem; width: 120px; } .home-page #home-slider .slide2 .content h1, .home-page #home-slider .slide2 .content h2, .home-page #home-slider .slide4 .content h1, .home-page #home-slider .slide4 .content h2 { font-size: 3.8rem; } .home-page #home-slider .slide12 h1 { font-size: 3.2rem; } .home-page #home-slider .slide13 h1 { font-size: 3.2rem; } .home-page #home-slider .slide13 .content { padding-top: 3.6rem; } .home-page #compatibility h2 + p { padding-bottom: 3.6rem; } .home-page #why-fibaro .bg { height: 300px; } .home-page #campaign .wrapper { -webkit-transform: translate(-50%, -50%) scale(0.8); transform: translate(-50%, -50%) scale(0.8); } .home-page #campaign .col-phoneS-12:nth-of-type(1) { border-right: 2px solid #fff; } .home-page #campaign .col-phoneS-12:nth-of-type(2) { border-right: 1px solid #fff; border-left: 1px solid #fff; } .home-page #campaign .col-phoneS-12:nth-of-type(3) { border-left: 2px solid #fff; } .home-page #become-installer .bg { height: 260px; } } @media (min-width: 1200px) { .home-page.redesign main { overflow: hidden; background-color: #fff; } .home-page.redesign #products-slide-menu, .home-page.redesign #usecase-icon-menu, .home-page.redesign #products-list, .home-page.redesign #two-usecases, .home-page.redesign #fibaro-home, .home-page.redesign #remote-access, .home-page.redesign #homekit, .home-page.redesign #two-installers, .home-page.redesign #integrations, .home-page.redesign #campaign, .home-page.redesign #compatibility, .home-page.redesign #become-installer { width: 1140px; margin-left: auto; margin-right: auto; overflow: hidden; background-color: #fff; } .home-page.redesign #products-slide-menu .content, .home-page.redesign #usecase-icon-menu .content, .home-page.redesign #products-list .content, .home-page.redesign #two-usecases .content, .home-page.redesign #fibaro-home .content, .home-page.redesign #remote-access .content, .home-page.redesign #homekit .content, .home-page.redesign #two-installers .content, .home-page.redesign #integrations .content, .home-page.redesign #campaign .content, .home-page.redesign #compatibility .content, .home-page.redesign #become-installer .content { padding-top: 3.2rem; padding-bottom: 3.2rem; } .home-page #usecase-icon-menu { font-size: 13px; padding: 4rem 0; } .home-page #usecase-icon-menu img { width: 60%; } .home-page #usecase-icon-menu .usecase-button a { font-size: 13px; } .home-page #usecase-icon-menu .swiper-container { padding-top: 10px; padding-bottom: 25px; margin-bottom: -60px; } .home-page #usecase-icon-menu .swiper-container .swiper-wrapper { padding: 0 10px; } .home-page #usecase-icon-menu .swiper-container .swiper-slide p { padding-bottom: 0; } .home-page #usecase-icon-menu .swiper-container .swiper-slide .content { padding-top: 2rem; padding-bottom: 3rem; } .home-page #usecase-icon-menu .swiper-container .swiper-slide .more { display: block; opacity: 0; color: #0090ff; margin-top: 5px; margin-bottom: -5px; } .home-page #usecase-icon-menu .swiper-container .swiper-slide .more:hover { border-bottom: 1px solid #ffffff; } .home-page #usecase-icon-menu .swiper-container .swiper-slide .more:after { width: 6px; height: 6px; } .home-page #usecase-icon-menu .swiper-container .swiper-slide:hover p:nth-of-type(1) { color: #7c00ff; } .home-page #usecase-icon-menu .swiper-container .swiper-slide:hover .more { transition: opacity 0.3s ease-in-out; opacity: 1; } .home-page #usecase-icon-menu .swiper-container .swiper-slide .border { width: 87%; } .home-page #usecase-icon-menu .swiper-container .swiper-slide .border::after { content: ''; position: absolute; z-index: -1; width: 87%; height: 100%; border-radius: 5px; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2); transition: opacity 0.3s ease-in-out; opacity: 0; top: 0; left: 0; } .home-page #usecase-icon-menu .swiper-container .swiper-slide .border:hover::after { opacity: 1; } .home-page #new-home-slider .swiper-slide > a.bg-link { padding-bottom: 29%; } .home-page #new-home-slider .home-button { padding: 4px 30px 6px 30px; } .home-page #new-home-slider .swiper-button { display: block; position: absolute; z-index: 100; top: 0; height: 100%; width: 80px; cursor: pointer; } .home-page #new-home-slider .swiper-button svg { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .home-page #new-home-slider .swiper-button .cl { transition: all 250ms; } .home-page #new-home-slider .swiper-button.button-prev { left: 0; } .home-page #new-home-slider .swiper-button.button-next { right: 0; } .home-page #new-home-slider .swiper-button.button-next svg { -webkit-transform: translate(-50%, -50%) rotate(180deg); transform: translate(-50%, -50%) rotate(180deg); } .home-page #new-home-slider .swiper-button:hover .cl { stroke: #0090FF; } .home-page #new-home-slider .smart-home .bg { padding-bottom: 29%; } .home-page #new-home-slider .smart-home .content { padding-top: 7.5rem; width: 1140px; margin-left: auto; margin-right: auto; overflow: hidden; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .home-page #new-home-slider .bundle-pack .bg { padding-bottom: 29%; } .home-page #new-home-slider .bundle-pack .content { width: 1140px; margin-left: auto; margin-right: auto; overflow: hidden; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .home-page #new-home-slider .your-home .bg { padding-bottom: 29%; } .home-page #new-home-slider .walli .content p { font-size: 16px; } .home-page #new-home-slider .walli .bg { padding-bottom: 29%; } .home-page #new-home-slider .installer .content p { font-size: 16px; } .home-page #new-home-slider .installer .content img { width: 180px; margin-top: -30px; } .home-page #new-home-slider .installer .bg { padding-bottom: 29%; } .home-page #new-home-slider .use-case-1, .home-page #new-home-slider .use-case-2, .home-page #new-home-slider .use-case-3 { overflow: hidden; } .home-page #new-home-slider .use-case-1 .content h2, .home-page #new-home-slider .use-case-2 .content h2, .home-page #new-home-slider .use-case-3 .content h2 { font-size: 4.5rem; } .home-page #new-home-slider .use-case-1 .content span, .home-page #new-home-slider .use-case-2 .content span, .home-page #new-home-slider .use-case-3 .content span { opacity: 0.01; min-width: 1px; text-rendering: optimizeLegibility; position: relative; } .home-page #new-home-slider .use-case-1 .content svg, .home-page #new-home-slider .use-case-2 .content svg, .home-page #new-home-slider .use-case-3 .content svg { top: 60px; position: absolute; } .home-page #new-home-slider .use-case-1 .content .home-button, .home-page #new-home-slider .use-case-2 .content .home-button, .home-page #new-home-slider .use-case-3 .content .home-button { opacity: 0; } .home-page #new-home-slider .use-case-1 .bg, .home-page #new-home-slider .use-case-2 .bg, .home-page #new-home-slider .use-case-3 .bg { padding-bottom: 29%; -webkit-transform: scale(1.2); transform: scale(1.2); } .home-page #new-home-slider .use-case-1.swiper-slide-active .content span, .home-page #new-home-slider .use-case-2.swiper-slide-active .content span, .home-page #new-home-slider .use-case-3.swiper-slide-active .content span { opacity: 1; transition: opacity 500ms ease-in 1s; } .home-page #new-home-slider .use-case-1.swiper-slide-active .content .home-button, .home-page #new-home-slider .use-case-2.swiper-slide-active .content .home-button, .home-page #new-home-slider .use-case-3.swiper-slide-active .content .home-button { opacity: 1; transition: opacity 500ms ease-in 2000ms; } .home-page #new-home-slider .use-case-1.swiper-slide-active .content .cls-1, .home-page #new-home-slider .use-case-1.swiper-slide-active .content .cls-2, .home-page #new-home-slider .use-case-1.swiper-slide-active .content .cls-3, .home-page #new-home-slider .use-case-2.swiper-slide-active .content .cls-1, .home-page #new-home-slider .use-case-2.swiper-slide-active .content .cls-2, .home-page #new-home-slider .use-case-2.swiper-slide-active .content .cls-3, .home-page #new-home-slider .use-case-3.swiper-slide-active .content .cls-1, .home-page #new-home-slider .use-case-3.swiper-slide-active .content .cls-2, .home-page #new-home-slider .use-case-3.swiper-slide-active .content .cls-3 { opacity: 0.8; stroke-dasharray: 300; stroke-dashoffset: 750; -webkit-animation: dash 2000ms linear forwards; animation: dash 2000ms linear forwards; } @-webkit-keyframes dash { to { stroke-dashoffset: 0; } } @keyframes dash { to { stroke-dashoffset: 0; } } .home-page #new-home-slider .use-case-1.swiper-slide-active .bg, .home-page #new-home-slider .use-case-2.swiper-slide-active .bg, .home-page #new-home-slider .use-case-3.swiper-slide-active .bg { opacity: 0.7; -webkit-transform: scale(1); transform: scale(1); transition: all 4s ease-out; } .home-page #fibaro-home .content h2 { font-size: 22px; padding-bottom: 26px; line-height: 1.4; } .home-page #fibaro-home .bg { height: 270px; } .home-page #fibaro-home.all-use-cases .bg { height: 310px; } .home-page #two-usecases .content h2 { font-size: 22px; padding-bottom: 1.4rem; line-height: 1.4; } .home-page #two-usecases .bg { height: 330px; } .home-page #two-usecases.safe-secure .bg { height: 330px; } .home-page #remote-access .content { -webkit-transform: translateY(-60%); transform: translateY(-60%); } .home-page #remote-access .content h2 { font-size: 22px; padding-bottom: 1.4rem; line-height: 1.4; } .home-page #remote-access .bg { height: 310px; } .home-page #integrations .bg { height: 400px; } .home-page #two-installers .bg { height: 270px; } .home-page #homekit .bg { height: 360px; } .home-page #homekit .homekit { bottom: 3rem; } .home-page #eu-flag .eu-flag-cookie { bottom: 135px; } .home-page #eu-flag .eu-flag-cookie.animate { -webkit-transform: translateY(95px); transform: translateY(95px); } .home-page #home-slider .bg { padding-bottom: 33.75%; } .home-page #home-slider .slide2 .content h1, .home-page #home-slider .slide2 .content h2, .home-page #home-slider .slide4 .content h1, .home-page #home-slider .slide4 .content h2 { letter-spacing: 30px; margin-right: -30px; font-size: 4.8rem; } .home-page #home-slider .slide2 .content p, .home-page #home-slider .slide4 .content p { font-size: 2.4rem; letter-spacing: 1px; } .home-page #home-slider .slide4 .content h1, .home-page #home-slider .slide5 .content h1 { letter-spacing: 0; margin-right: 0; } .home-page #home-slider .slide5 .content hr { width: 420px; } .home-page #home-slider .slide12 h1 { font-size: 4rem; } .home-page #home-slider .slide13 h1 { font-size: 4rem; } .home-page #home-slider .slide13 .content { padding-top: 5.5rem; } .home-page #home-slider .swiper-button { display: block; position: absolute; z-index: 100; top: 0; height: 100%; width: 80px; cursor: pointer; } .home-page #home-slider .swiper-button svg { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .home-page #home-slider .swiper-button .cl { transition: all 250ms; } .home-page #home-slider .swiper-button.button-prev { left: 0; } .home-page #home-slider .swiper-button.button-next { right: 0; } .home-page #home-slider .swiper-button.button-next svg { -webkit-transform: translate(-50%, -50%) rotate(180deg); transform: translate(-50%, -50%) rotate(180deg); } .home-page #home-slider .swiper-button:hover .cl { stroke: #0090FF; } .home-page #products-list img { width: 90%; } .home-page #products-list.redesign img { width: 70%; } .home-page #compatibility img { width: 100px; padding-bottom: 3.6rem; } .home-page #compatibility h2 + p { padding-bottom: 6rem; } .home-page #why-fibaro .bg { height: 360px; } .home-page #campaign .morelink:hover { background-color: rgba(255, 255, 255, 0.9); color: #0090ff; } .home-page #campaign .morelink:hover:after { border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; } .home-page #campaign.redesign h2 { font-size: 22px; } .home-page #campaign.redesign span { font-size: 28px; margin-top: 10px; } .home-page #campaign.redesign .wrapper { bottom: 2rem; } .home-page #become-installer .bg { height: 260px; } } @media (min-width: 1600px) { .home-page.redesign #products-slide-menu, .home-page.redesign #usecase-icon-menu, .home-page.redesign #products-list, .home-page.redesign #two-usecases, .home-page.redesign #fibaro-home, .home-page.redesign #remote-access, .home-page.redesign #homekit, .home-page.redesign #two-installers, .home-page.redesign #integrations, .home-page.redesign #campaign, .home-page.redesign #compatibility, .home-page.redesign #become-installer { font-size: 15px; width: 1440px; } .home-page.redesign #products-slide-menu h1, .home-page.redesign #usecase-icon-menu h1, .home-page.redesign #products-list h1, .home-page.redesign #two-usecases h1, .home-page.redesign #fibaro-home h1, .home-page.redesign #remote-access h1, .home-page.redesign #homekit h1, .home-page.redesign #two-installers h1, .home-page.redesign #integrations h1, .home-page.redesign #campaign h1, .home-page.redesign #compatibility h1, .home-page.redesign #become-installer h1 { font-size: 38px; } .home-page.redesign #products-slide-menu h2, .home-page.redesign #usecase-icon-menu h2, .home-page.redesign #products-list h2, .home-page.redesign #two-usecases h2, .home-page.redesign #fibaro-home h2, .home-page.redesign #remote-access h2, .home-page.redesign #homekit h2, .home-page.redesign #two-installers h2, .home-page.redesign #integrations h2, .home-page.redesign #campaign h2, .home-page.redesign #compatibility h2, .home-page.redesign #become-installer h2 { font-size: 26px; padding-bottom: 13px; } .home-page.redesign #products-slide-menu .content, .home-page.redesign #usecase-icon-menu .content, .home-page.redesign #products-list .content, .home-page.redesign #two-usecases .content, .home-page.redesign #fibaro-home .content, .home-page.redesign #remote-access .content, .home-page.redesign #homekit .content, .home-page.redesign #two-installers .content, .home-page.redesign #integrations .content, .home-page.redesign #campaign .content, .home-page.redesign #compatibility .content, .home-page.redesign #become-installer .content { padding-top: 4.8rem; padding-bottom: 4.8rem; } .home-page #usecase-icon-menu h2 { font-size: 36px !important; } .home-page #usecase-icon-menu .swiper-container { padding-top: 30px; } .home-page #usecase-icon-menu .usecase-button a { font-size: 15px; } .home-page #new-home-slider .home-button { margin: 30px 0 0; } .home-page #new-home-slider .home-button a { font-size: 15px; } .home-page #new-home-slider .smart-home .content { padding-top: 12rem; } .home-page #new-home-slider .bundle-pack h1, .home-page #new-home-slider .bundle-pack h2 { font-size: 3.7rem; } .home-page #new-home-slider .bundle-pack .content { left: 40%; } .home-page #new-home-slider .your-home h1, .home-page #new-home-slider .your-home h2 { font-size: 3.5rem; } .home-page #new-home-slider .walli .content p { font-size: 20px; padding-top: 2%; } .home-page #new-home-slider .walli .content h1, .home-page #new-home-slider .walli .content h2 { font-size: 3.5rem; } .home-page #new-home-slider .installer .content p { font-size: 20px; padding-top: 2%; } .home-page #new-home-slider .installer .content h1, .home-page #new-home-slider .installer .content h2 { font-size: 3.5rem; } .home-page #new-home-slider .installer .content img { width: 210px; margin-top: -35px; } .home-page #new-home-slider .use-case-1 .content h2, .home-page #new-home-slider .use-case-2 .content h2, .home-page #new-home-slider .use-case-3 .content h2 { font-size: 5rem; padding-bottom: 2rem; } .home-page #new-home-slider .use-case-1 .content svg, .home-page #new-home-slider .use-case-2 .content svg, .home-page #new-home-slider .use-case-3 .content svg { top: 65px; } .home-page #fibaro-home .content h2 { padding-bottom: 26px; } .home-page #fibaro-home .bg { height: 350px; } .home-page #fibaro-home.all-use-cases .bg { height: 390px; } .home-page #two-usecases .bg { height: 420px; } .home-page #two-usecases.safe-secure .bg { height: 420px; } .home-page #remote-access .bg { height: 390px; } .home-page #integrations .bg { height: 470px; } .home-page #two-installers .bg { height: 360px; } .home-page #homekit .bg { height: 440px; } .home-page #homekit .homekit { bottom: 3rem; width: 160px; } .home-page #eu-flag .eu-flag-cookie { bottom: 115px; } .home-page #eu-flag .eu-flag-cookie.animate { -webkit-transform: translateY(70px); transform: translateY(70px); } .home-page #home-slider .slide1 h1 { margin-top: 2.4rem; } .home-page #home-slider .slide1 p { font-size: 120%; } .home-page #home-slider .slide2 .content, .home-page #home-slider .slide4 .content, .home-page #home-slider .slide5 .content { padding-top: 4.8rem; } .home-page #home-slider .slide2 .content h1, .home-page #home-slider .slide2 .content h2, .home-page #home-slider .slide4 .content h1, .home-page #home-slider .slide4 .content h2, .home-page #home-slider .slide5 .content h1, .home-page #home-slider .slide5 .content h2 { font-size: 5.6rem; } .home-page #home-slider .slide5 .content h1, .home-page #home-slider .slide5 .content h2 { font-size: 5.2rem; } .home-page #home-slider .slide5 .content p { font-size: 2.4rem; letter-spacing: 1px; } .home-page #home-slider .slide5 .content hr { width: 610px; } .home-page #home-slider .slide12 img { margin: 25px 10px 25px 0; } .home-page #home-slider .slide12 h1 { font-size: 4.8rem; } .home-page #home-slider .slide13 .content { padding-top: 7rem; } .home-page #home-slider .slide13 h1 { font-size: 4.8rem; } .home-page #compatibility img { width: 149px; } .home-page #products-list img { width: 100%; } .home-page #why-fibaro .bg { height: 475px; } .home-page #campaign .wrapper { -webkit-transform: translate(-50%, -50%) scale(0.9); transform: translate(-50%, -50%) scale(0.9); } .home-page #campaign.redesign h2 { font-size: 26px; } .home-page #campaign.redesign span { font-size: 36px; } .home-page #become-installer .content h2 { padding-bottom: 40px; } .home-page #become-installer .bg { height: 320px; } } @media (min-width: 2100px) { .home-page.redesign #products-slide-menu, .home-page.redesign #usecase-icon-menu, .home-page.redesign #products-list, .home-page.redesign #two-usecases, .home-page.redesign #fibaro-home, .home-page.redesign #remote-access, .home-page.redesign #homekit, .home-page.redesign #two-installers, .home-page.redesign #integrations, .home-page.redesign #campaign, .home-page.redesign #compatibility, .home-page.redesign #become-installer { font-size: 18px; width: 1920px; } .home-page.redesign #products-slide-menu h1, .home-page.redesign #usecase-icon-menu h1, .home-page.redesign #products-list h1, .home-page.redesign #two-usecases h1, .home-page.redesign #fibaro-home h1, .home-page.redesign #remote-access h1, .home-page.redesign #homekit h1, .home-page.redesign #two-installers h1, .home-page.redesign #integrations h1, .home-page.redesign #campaign h1, .home-page.redesign #compatibility h1, .home-page.redesign #become-installer h1 { font-size: 56px; } .home-page.redesign #products-slide-menu h2, .home-page.redesign #usecase-icon-menu h2, .home-page.redesign #products-list h2, .home-page.redesign #two-usecases h2, .home-page.redesign #fibaro-home h2, .home-page.redesign #remote-access h2, .home-page.redesign #homekit h2, .home-page.redesign #two-installers h2, .home-page.redesign #integrations h2, .home-page.redesign #campaign h2, .home-page.redesign #compatibility h2, .home-page.redesign #become-installer h2 { font-size: 36px; } .home-page.redesign #products-slide-menu .content, .home-page.redesign #usecase-icon-menu .content, .home-page.redesign #products-list .content, .home-page.redesign #two-usecases .content, .home-page.redesign #fibaro-home .content, .home-page.redesign #remote-access .content, .home-page.redesign #homekit .content, .home-page.redesign #two-installers .content, .home-page.redesign #integrations .content, .home-page.redesign #campaign .content, .home-page.redesign #compatibility .content, .home-page.redesign #become-installer .content { padding-top: 6.8rem; padding-bottom: 6.8rem; } .home-page #new-home-slider .home-button { margin: 36px 0 0; } .home-page #new-home-slider .home-button a { font-size: 18px; } .home-page #new-home-slider .smart-home .content { padding-top: 18rem; } .home-page #new-home-slider .bundle-pack h1, .home-page #new-home-slider .bundle-pack h2 { font-size: 5rem; } .home-page #new-home-slider .bundle-pack .content { left: 35%; } .home-page #new-home-slider .your-home h1, .home-page #new-home-slider .your-home h2 { font-size: 5rem; letter-spacing: 0; } .home-page #new-home-slider .walli .content p { font-size: 30px; padding-top: 3%; } .home-page #new-home-slider .walli .content h1, .home-page #new-home-slider .walli .content h2 { font-size: 5rem; letter-spacing: 0; } .home-page #new-home-slider .installer .content p { font-size: 30px; padding-top: 3%; } .home-page #new-home-slider .installer .content h1, .home-page #new-home-slider .installer .content h2 { font-size: 5rem; letter-spacing: 0; } .home-page #new-home-slider .installer .content img { width: 240px; margin-top: -40px; margin-bottom: -20px; } .home-page #fibaro-home .bg { height: 460px; } .home-page #fibaro-home.all-use-cases .bg { height: 510px; } .home-page #usecase-icon-menu h2 { font-size: 45px !important; } .home-page #two-usecases .content { padding-top: 5.8rem; padding-bottom: 5.8rem; } .home-page #two-usecases .bg { height: 560px; } .home-page #two-usecases.safe-secure .bg { height: 560px; } .home-page #remote-access .bg { height: 520px; } .home-page #integrations .bg { height: 630px; } .home-page #two-installers .bg { height: 460px; } .home-page #homekit .bg { height: 570px; } .home-page #homekit .homekit { bottom: 4rem; width: 200px; } .home-page #home-slider .slide1 p { font-size: 140%; } .home-page #home-slider .slide2 .content, .home-page #home-slider .slide4 .content { padding-top: 10rem; } .home-page #home-slider .slide2 .content h1, .home-page #home-slider .slide4 .content h1 { font-size: 8rem; } .home-page #home-slider .slide2 .content p, .home-page #home-slider .slide4 .content p { font-size: 3rem; letter-spacing: 1.5px; } .home-page #home-slider .slide5 .content h1, .home-page #home-slider .slide5 .content h2 { font-size: 6.4rem; } .home-page #home-slider .slide5 .content hr { width: 760px; } .home-page #home-slider .slide12 h1 { font-size: 6rem; } .home-page #home-slider .slide13 .content { padding-top: 9rem; } .home-page #home-slider .slide13 h1 { font-size: 6rem; } .home-page #campaign .wrapper { -webkit-transform: translate(-50%, -50%) scale(1.2); transform: translate(-50%, -50%) scale(1.2); } .home-page #campaign.redesign h2 { font-size: 36px; } .home-page #campaign.redesign span { font-size: 50px; } .home-page #compatibility.redesign .more:after { -webkit-transform: rotate(45deg) translate(2px, -4px); transform: rotate(45deg) translate(2px, -4px); } .home-page #become-installer .bg { height: 430px; } .home-page #products-slide-menu .swiper-container { margin-bottom: 4.8rem; } } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE10+ CSS styles go here */ .home-page #new-home-slider .use-case-1 .content svg, .home-page #new-home-slider .use-case-2 .content svg, .home-page #new-home-slider .use-case-3 .content svg { top: 30px; } } .contact-page #contact-header .content h1 { padding-bottom: 0; color: #fff; } .contact-page #contact-header .content h1 span { display: block; font-size: 50%; } .contact-page #contact-header .bg { padding-bottom: 47.4%; } .contact-page #info .content, .contact-page #support .content { text-align: left; } .contact-page #info .content h2, .contact-page #support .content h2 { border-bottom: 1px solid #cccccc; margin-bottom: 3.6rem; } .contact-page #info .content span, .contact-page #support .content span { font-weight: 400; color: #0090FF; } .contact-page #info .content p:nth-of-type(2), .contact-page #support .content p:nth-of-type(2) { padding-top: 1.4rem; } .contact-page #info .content label, .contact-page #support .content label { display: block; text-align: justify; color: #444444; } .contact-page #info .content .wpcf7, .contact-page #support .content .wpcf7 { margin-top: 2rem; margin-bottom: -3rem; } .contact-page #info .content .wpcf7 textarea, .contact-page #support .content .wpcf7 textarea { margin-bottom: 1rem; } .contact-page #info .content .wpcf7 p:nth-of-type(2), .contact-page #support .content .wpcf7 p:nth-of-type(2) { padding-top: 0; } .contact-page #info .content .wpcf7 span, .contact-page #support .content .wpcf7 span { color: #444444; font-weight: 300; } .contact-page #info .content .wpcf7 .terms2 .wpcf7-list-item, .contact-page #info .content .wpcf7 .terms3 .wpcf7-list-item, .contact-page #support .content .wpcf7 .terms2 .wpcf7-list-item, .contact-page #support .content .wpcf7 .terms3 .wpcf7-list-item { margin: 0; } .contact-page #info .content .wpcf7 .terms2 .wpcf7-list-item-label, .contact-page #info .content .wpcf7 .terms3 .wpcf7-list-item-label, .contact-page #support .content .wpcf7 .terms2 .wpcf7-list-item-label, .contact-page #support .content .wpcf7 .terms3 .wpcf7-list-item-label { display: none; } .contact-page #info .content .wpcf7 .ajax-loader, .contact-page #support .content .wpcf7 .ajax-loader { background-position-x: left; background-position-y: top; } .contact-page #info .content .wpcf7 .wpcf7-form-control-wrap input, .contact-page #info .content .wpcf7 .wpcf7-form-control-wrap textarea, .contact-page #support .content .wpcf7 .wpcf7-form-control-wrap input, .contact-page #support .content .wpcf7 .wpcf7-form-control-wrap textarea, .contact-page #info .content .wpcf7 .wpcf7-form-control-wrap select { border: 1px solid #dedede; background-color: #f0f0f0; padding: 14px 24px; font-size: 0.8em; } .contact-page #info .content .wpcf7 .box-title, .contact-page #support .content .wpcf7 .box-title { font-weight: 400; padding-top: 1rem; padding-bottom: 1rem; font-size: 0.8em; } .contact-page #info .content .wpcf7 .wpcf7-not-valid-tip, .contact-page #support .content .wpcf7 .wpcf7-not-valid-tip { color: red; padding-bottom: 3rem; } .contact-page #info .content .wpcf7 .submit-wrapper, .contact-page #support .content .wpcf7 .submit-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; margin-top: 2rem; } .contact-page #info .content .wpcf7 input[type="submit"], .contact-page #support .content .wpcf7 input[type="submit"] { margin-bottom: 1.2rem; } .contact-page #info .content .wpcf7 .intl-tel-input, .contact-page #support .content .wpcf7 .intl-tel-input { width: 100%; margin-bottom: 1.4rem; } .contact-page #info .content .wpcf7 .intl-tel-input .flag-container, .contact-page #support .content .wpcf7 .intl-tel-input .flag-container { padding: 1px; } .contact-page #info .content .wpcf7 .intl-tel-input .selected-flag, .contact-page #support .content .wpcf7 .intl-tel-input .selected-flag { padding: 0 0 0 36px; width: 105px !important; } .contact-page #info .content .wpcf7 .intl-tel-input .selected-flag .iti-arrow, .contact-page #support .content .wpcf7 .intl-tel-input .selected-flag .iti-arrow { right: auto; left: 24px; } .contact-page #info .content .wpcf7 .intl-tel-input .prefix, .contact-page #support .content .wpcf7 .intl-tel-input .prefix { padding-left: 30px; font-size: 0.8em; color: #757575; position: absolute; top: 14px; } .contact-page #info .content .wpcf7 .intl-tel-input input, .contact-page #support .content .wpcf7 .intl-tel-input input { padding: 14px 24px 14px 110px; } .contact-page #info .contacts .col-phoneS-12, .contact-page #support .contacts .col-phoneS-12 { padding-bottom: 2.4rem; } .contact-page #info .contacts p, .contact-page #support .contacts p { padding-bottom: 0; } .contact-page #info .contacts h3 ~ p, .contact-page #support .contacts h3 ~ p { padding-bottom: .5rem; } .contact-page #info .contacts a, .contact-page #support .contacts a { color: #444444; border-bottom: 1px solid transparent; transition: all 250ms; } .contact-page #info .contacts a:hover, .contact-page #support .contacts a:hover { color: #0090FF; border-bottom: 1px solid #0090FF; } .contact-page #support .contacts p { line-height: 1.7; } .contact-page #support .contacts p:nth-of-type(1) { line-height: 1.5; } .contact-page #sales .content { text-align: left; } .contact-page #sales .content h2 { border-bottom: 1px solid #cccccc; margin-bottom: 3.6rem; } .contact-page #sales .content span { font-weight: 400; color: #0090FF; } .contact-page #sales .contacts .col-phoneS-12 { padding-bottom: 3.6rem; } .contact-page #sales .contacts h3 { font-weight: 400; padding-top: 1.4rem; padding-bottom: .5rem; } .contact-page #sales .contacts p { padding-bottom: 0; } .contact-page #sales .contacts h3 ~ p { padding-bottom: .5rem; } .contact-page #sales .contacts a { color: #444444; border-bottom: 1px solid transparent; transition: all 250ms; } .contact-page #sales .contacts a:hover { color: #0090FF; border-bottom: 1px solid #0090FF; } .contact-page .pr .content { padding-top: 0; padding-bottom: 2.4rem; text-align: left; } .contact-page .pr .content h2 { border-bottom: 1px solid #cccccc; margin-bottom: 3.6rem; } .contact-page .pr .content a { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } .contact-page .pr .content a:hover { border-bottom: 1px solid #0090FF; } .contact-page .pr .contacts .col-phoneS-12 { padding-bottom: 4.8rem; } .contact-page .pr .contacts img { width: 60px; height: 40px; margin-right: 1.8rem; float: left; } .contact-page .pr .contacts h3 { font-size: 120%; margin-bottom: 0; } .contact-page #hq img { width: 100px; margin-bottom: 2.4rem; } .contact-page #partnership .content { padding-top: 0; padding-bottom: 2.4rem; text-align: left; } .contact-page #partnership .content h2 { border-bottom: 1px solid #cccccc; margin-bottom: 3.6rem; } .contact-page #partnership .content a { display: block; text-align: center; margin-bottom: 2.4rem; } .contact-page #partnership .content a img { width: 60px; height: 60px; margin-bottom: .5rem; } .contact-page #partnership .content a h3 { color: #444444; margin-bottom: 1rem; } .contact-page #partnership .content a span { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } .contact-page #partnership .content a:hover span { border-bottom: 1px solid #0090FF; } .contact-page #partnership .items .col-phoneS-1, .contact-page #partnership .items .col-phoneS-2, .contact-page #partnership .items .col-phoneS-3, .contact-page #partnership .items .col-phoneS-4, .contact-page #partnership .items .col-phoneS-5, .contact-page #partnership .items .col-phoneS-6, .contact-page #partnership .items .col-phoneS-7, .contact-page #partnership .items .col-phoneS-8, .contact-page #partnership .items .col-phoneS-9, .contact-page #partnership .items .col-phoneS-10, .contact-page #partnership .items .col-phoneS-11, .contact-page #partnership .items .col-phoneS-12, .contact-page #partnership .items .col-phoneL-1, .contact-page #partnership .items .col-phoneL-2, .contact-page #partnership .items .col-phoneL-3, .contact-page #partnership .items .col-phoneL-4, .contact-page #partnership .items .col-phoneL-5, .contact-page #partnership .items .col-phoneL-6, .contact-page #partnership .items .col-phoneL-7, .contact-page #partnership .items .col-phoneL-8, .contact-page #partnership .items .col-phoneL-9, .contact-page #partnership .items .col-phoneL-10, .contact-page #partnership .items .col-phoneL-11, .contact-page #partnership .items .col-phoneL-12, .contact-page #partnership .items .col-tabletP-1, .contact-page #partnership .items .col-tabletP-2, .contact-page #partnership .items .col-tabletP-3, .contact-page #partnership .items .col-tabletP-4, .contact-page #partnership .items .col-tabletP-5, .contact-page #partnership .items .col-tabletP-6, .contact-page #partnership .items .col-tabletP-7, .contact-page #partnership .items .col-tabletP-8, .contact-page #partnership .items .col-tabletP-9, .contact-page #partnership .items .col-tabletP-10, .contact-page #partnership .items .col-tabletP-11, .contact-page #partnership .items .col-tabletP-12, .contact-page #partnership .items .col-tabletL-1, .contact-page #partnership .items .col-tabletL-2, .contact-page #partnership .items .col-tabletL-3, .contact-page #partnership .items .col-tabletL-4, .contact-page #partnership .items .col-tabletL-5, .contact-page #partnership .items .col-tabletL-6, .contact-page #partnership .items .col-tabletL-7, .contact-page #partnership .items .col-tabletL-8, .contact-page #partnership .items .col-tabletL-9, .contact-page #partnership .items .col-tabletL-10, .contact-page #partnership .items .col-tabletL-11, .contact-page #partnership .items .col-tabletL-12, .contact-page #partnership .items .col-desktopS-1, .contact-page #partnership .items .col-desktopS-2, .contact-page #partnership .items .col-desktopS-3, .contact-page #partnership .items .col-desktopS-4, .contact-page #partnership .items .col-desktopS-5, .contact-page #partnership .items .col-desktopS-6, .contact-page #partnership .items .col-desktopS-7, .contact-page #partnership .items .col-desktopS-8, .contact-page #partnership .items .col-desktopS-9, .contact-page #partnership .items .col-desktopS-10, .contact-page #partnership .items .col-desktopS-11, .contact-page #partnership .items .col-desktopS-12, .contact-page #partnership .items .col-desktopM-1, .contact-page #partnership .items .col-desktopM-2, .contact-page #partnership .items .col-desktopM-3, .contact-page #partnership .items .col-desktopM-4, .contact-page #partnership .items .col-desktopM-5, .contact-page #partnership .items .col-desktopM-6, .contact-page #partnership .items .col-desktopM-7, .contact-page #partnership .items .col-desktopM-8, .contact-page #partnership .items .col-desktopM-9, .contact-page #partnership .items .col-desktopM-10, .contact-page #partnership .items .col-desktopM-11, .contact-page #partnership .items .col-desktopM-12, .contact-page #partnership .items .col-desktopL-1, .contact-page #partnership .items .col-desktopL-2, .contact-page #partnership .items .col-desktopL-3, .contact-page #partnership .items .col-desktopL-4, .contact-page #partnership .items .col-desktopL-5, .contact-page #partnership .items .col-desktopL-6, .contact-page #partnership .items .col-desktopL-7, .contact-page #partnership .items .col-desktopL-8, .contact-page #partnership .items .col-desktopL-9, .contact-page #partnership .items .col-desktopL-10, .contact-page #partnership .items .col-desktopL-11, .contact-page #partnership .items .col-desktopL-12, .contact-page #partnership .items .col-phoneS-1, .contact-page #partnership .items .col-phoneS-2, .contact-page #partnership .items .col-phoneS-3, .contact-page #partnership .items .col-phoneS-4, .contact-page #partnership .items .col-phoneS-5, .contact-page #partnership .items .col-phoneS-6, .contact-page #partnership .items .col-phoneS-7, .contact-page #partnership .items .col-phoneS-8, .contact-page #partnership .items .col-phoneS-9, .contact-page #partnership .items .col-phoneS-10, .contact-page #partnership .items .col-phoneL-1, .contact-page #partnership .items .col-phoneL-2, .contact-page #partnership .items .col-phoneL-3, .contact-page #partnership .items .col-phoneL-4, .contact-page #partnership .items .col-phoneL-5, .contact-page #partnership .items .col-phoneL-6, .contact-page #partnership .items .col-phoneL-7, .contact-page #partnership .items .col-phoneL-8, .contact-page #partnership .items .col-phoneL-9, .contact-page #partnership .items .col-phoneL-10, .contact-page #partnership .items .col-tabletP-1, .contact-page #partnership .items .col-tabletP-2, .contact-page #partnership .items .col-tabletP-3, .contact-page #partnership .items .col-tabletP-4, .contact-page #partnership .items .col-tabletP-5, .contact-page #partnership .items .col-tabletP-6, .contact-page #partnership .items .col-tabletP-7, .contact-page #partnership .items .col-tabletP-8, .contact-page #partnership .items .col-tabletP-9, .contact-page #partnership .items .col-tabletP-10, .contact-page #partnership .items .col-tabletL-1, .contact-page #partnership .items .col-tabletL-2, .contact-page #partnership .items .col-tabletL-3, .contact-page #partnership .items .col-tabletL-4, .contact-page #partnership .items .col-tabletL-5, .contact-page #partnership .items .col-tabletL-6, .contact-page #partnership .items .col-tabletL-7, .contact-page #partnership .items .col-tabletL-8, .contact-page #partnership .items .col-tabletL-9, .contact-page #partnership .items .col-tabletL-10, .contact-page #partnership .items .col-desktopS-1, .contact-page #partnership .items .col-desktopS-2, .contact-page #partnership .items .col-desktopS-3, .contact-page #partnership .items .col-desktopS-4, .contact-page #partnership .items .col-desktopS-5, .contact-page #partnership .items .col-desktopS-6, .contact-page #partnership .items .col-desktopS-7, .contact-page #partnership .items .col-desktopS-8, .contact-page #partnership .items .col-desktopS-9, .contact-page #partnership .items .col-desktopS-10, .contact-page #partnership .items .col-desktopM-1, .contact-page #partnership .items .col-desktopM-2, .contact-page #partnership .items .col-desktopM-3, .contact-page #partnership .items .col-desktopM-4, .contact-page #partnership .items .col-desktopM-5, .contact-page #partnership .items .col-desktopM-6, .contact-page #partnership .items .col-desktopM-7, .contact-page #partnership .items .col-desktopM-8, .contact-page #partnership .items .col-desktopM-9, .contact-page #partnership .items .col-desktopM-10, .contact-page #partnership .items .col-desktopL-1, .contact-page #partnership .items .col-desktopL-2, .contact-page #partnership .items .col-desktopL-3, .contact-page #partnership .items .col-desktopL-4, .contact-page #partnership .items .col-desktopL-5, .contact-page #partnership .items .col-desktopL-6, .contact-page #partnership .items .col-desktopL-7, .contact-page #partnership .items .col-desktopL-8, .contact-page #partnership .items .col-desktopL-9, .contact-page #partnership .items .col-desktopL-10, .contact-page #partnership .values-page #numbers .items .col-phoneS-1, .values-page #numbers .contact-page #partnership .items .col-phoneS-1, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-1, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-1, .contact-page #partnership .values-page #numbers .items .col-phoneS-2, .values-page #numbers .contact-page #partnership .items .col-phoneS-2, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-2, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-2, .contact-page #partnership .values-page #numbers .items .col-phoneS-3, .values-page #numbers .contact-page #partnership .items .col-phoneS-3, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-3, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-3, .contact-page #partnership .values-page #numbers .items .col-phoneS-4, .values-page #numbers .contact-page #partnership .items .col-phoneS-4, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-4, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-4, .contact-page #partnership .values-page #numbers .items .col-phoneS-5, .values-page #numbers .contact-page #partnership .items .col-phoneS-5, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-5, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-5, .contact-page #partnership .values-page #numbers .items .col-phoneS-6, .values-page #numbers .contact-page #partnership .items .col-phoneS-6, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-6, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-6, .contact-page #partnership .values-page #numbers .items .col-phoneS-7, .values-page #numbers .contact-page #partnership .items .col-phoneS-7, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-7, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-7, .contact-page #partnership .values-page #numbers .items .col-phoneS-8, .values-page #numbers .contact-page #partnership .items .col-phoneS-8, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-8, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-8, .contact-page #partnership .values-page #numbers .items .col-phoneS-9, .values-page #numbers .contact-page #partnership .items .col-phoneS-9, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-9, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-9, .contact-page #partnership .values-page #numbers .items .col-phoneS-10, .values-page #numbers .contact-page #partnership .items .col-phoneS-10, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-10, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-10, .contact-page #partnership .values-page #numbers .items .col-phoneL-1, .values-page #numbers .contact-page #partnership .items .col-phoneL-1, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-1, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-1, .contact-page #partnership .values-page #numbers .items .col-phoneL-2, .values-page #numbers .contact-page #partnership .items .col-phoneL-2, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-2, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-2, .contact-page #partnership .values-page #numbers .items .col-phoneL-3, .values-page #numbers .contact-page #partnership .items .col-phoneL-3, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-3, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-3, .contact-page #partnership .values-page #numbers .items .col-phoneL-4, .values-page #numbers .contact-page #partnership .items .col-phoneL-4, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-4, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-4, .contact-page #partnership .values-page #numbers .items .col-phoneL-5, .values-page #numbers .contact-page #partnership .items .col-phoneL-5, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-5, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-5, .contact-page #partnership .values-page #numbers .items .col-phoneL-6, .values-page #numbers .contact-page #partnership .items .col-phoneL-6, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-6, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-6, .contact-page #partnership .values-page #numbers .items .col-phoneL-7, .values-page #numbers .contact-page #partnership .items .col-phoneL-7, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-7, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-7, .contact-page #partnership .values-page #numbers .items .col-phoneL-8, .values-page #numbers .contact-page #partnership .items .col-phoneL-8, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-8, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-8, .contact-page #partnership .values-page #numbers .items .col-phoneL-9, .values-page #numbers .contact-page #partnership .items .col-phoneL-9, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-9, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-9, .contact-page #partnership .values-page #numbers .items .col-phoneL-10, .values-page #numbers .contact-page #partnership .items .col-phoneL-10, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-10, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-10, .contact-page #partnership .values-page #numbers .items .col-tabletP-1, .values-page #numbers .contact-page #partnership .items .col-tabletP-1, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-1, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-1, .contact-page #partnership .values-page #numbers .items .col-tabletP-2, .values-page #numbers .contact-page #partnership .items .col-tabletP-2, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-2, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-2, .contact-page #partnership .values-page #numbers .items .col-tabletP-3, .values-page #numbers .contact-page #partnership .items .col-tabletP-3, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-3, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-3, .contact-page #partnership .values-page #numbers .items .col-tabletP-4, .values-page #numbers .contact-page #partnership .items .col-tabletP-4, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-4, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-4, .contact-page #partnership .values-page #numbers .items .col-tabletP-5, .values-page #numbers .contact-page #partnership .items .col-tabletP-5, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-5, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-5, .contact-page #partnership .values-page #numbers .items .col-tabletP-6, .values-page #numbers .contact-page #partnership .items .col-tabletP-6, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-6, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-6, .contact-page #partnership .values-page #numbers .items .col-tabletP-7, .values-page #numbers .contact-page #partnership .items .col-tabletP-7, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-7, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-7, .contact-page #partnership .values-page #numbers .items .col-tabletP-8, .values-page #numbers .contact-page #partnership .items .col-tabletP-8, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-8, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-8, .contact-page #partnership .values-page #numbers .items .col-tabletP-9, .values-page #numbers .contact-page #partnership .items .col-tabletP-9, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-9, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-9, .contact-page #partnership .values-page #numbers .items .col-tabletP-10, .values-page #numbers .contact-page #partnership .items .col-tabletP-10, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-10, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-10, .contact-page #partnership .values-page #numbers .items .col-tabletL-1, .values-page #numbers .contact-page #partnership .items .col-tabletL-1, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-1, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-1, .contact-page #partnership .values-page #numbers .items .col-tabletL-2, .values-page #numbers .contact-page #partnership .items .col-tabletL-2, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-2, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-2, .contact-page #partnership .values-page #numbers .items .col-tabletL-3, .values-page #numbers .contact-page #partnership .items .col-tabletL-3, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-3, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-3, .contact-page #partnership .values-page #numbers .items .col-tabletL-4, .values-page #numbers .contact-page #partnership .items .col-tabletL-4, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-4, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-4, .contact-page #partnership .values-page #numbers .items .col-tabletL-5, .values-page #numbers .contact-page #partnership .items .col-tabletL-5, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-5, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-5, .contact-page #partnership .values-page #numbers .items .col-tabletL-6, .values-page #numbers .contact-page #partnership .items .col-tabletL-6, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-6, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-6, .contact-page #partnership .values-page #numbers .items .col-tabletL-7, .values-page #numbers .contact-page #partnership .items .col-tabletL-7, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-7, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-7, .contact-page #partnership .values-page #numbers .items .col-tabletL-8, .values-page #numbers .contact-page #partnership .items .col-tabletL-8, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-8, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-8, .contact-page #partnership .values-page #numbers .items .col-tabletL-9, .values-page #numbers .contact-page #partnership .items .col-tabletL-9, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-9, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-9, .contact-page #partnership .values-page #numbers .items .col-tabletL-10, .values-page #numbers .contact-page #partnership .items .col-tabletL-10, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-10, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-10, .contact-page #partnership .values-page #numbers .items .col-desktopS-1, .values-page #numbers .contact-page #partnership .items .col-desktopS-1, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-1, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-1, .contact-page #partnership .values-page #numbers .items .col-desktopS-2, .values-page #numbers .contact-page #partnership .items .col-desktopS-2, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-2, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-2, .contact-page #partnership .values-page #numbers .items .col-desktopS-3, .values-page #numbers .contact-page #partnership .items .col-desktopS-3, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-3, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-3, .contact-page #partnership .values-page #numbers .items .col-desktopS-4, .values-page #numbers .contact-page #partnership .items .col-desktopS-4, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-4, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-4, .contact-page #partnership .values-page #numbers .items .col-desktopS-5, .values-page #numbers .contact-page #partnership .items .col-desktopS-5, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-5, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-5, .contact-page #partnership .values-page #numbers .items .col-desktopS-6, .values-page #numbers .contact-page #partnership .items .col-desktopS-6, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-6, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-6, .contact-page #partnership .values-page #numbers .items .col-desktopS-7, .values-page #numbers .contact-page #partnership .items .col-desktopS-7, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-7, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-7, .contact-page #partnership .values-page #numbers .items .col-desktopS-8, .values-page #numbers .contact-page #partnership .items .col-desktopS-8, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-8, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-8, .contact-page #partnership .values-page #numbers .items .col-desktopS-9, .values-page #numbers .contact-page #partnership .items .col-desktopS-9, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-9, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-9, .contact-page #partnership .values-page #numbers .items .col-desktopS-10, .values-page #numbers .contact-page #partnership .items .col-desktopS-10, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-10, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-10, .contact-page #partnership .values-page #numbers .items .col-desktopM-1, .values-page #numbers .contact-page #partnership .items .col-desktopM-1, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-1, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-1, .contact-page #partnership .values-page #numbers .items .col-desktopM-2, .values-page #numbers .contact-page #partnership .items .col-desktopM-2, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-2, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-2, .contact-page #partnership .values-page #numbers .items .col-desktopM-3, .values-page #numbers .contact-page #partnership .items .col-desktopM-3, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-3, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-3, .contact-page #partnership .values-page #numbers .items .col-desktopM-4, .values-page #numbers .contact-page #partnership .items .col-desktopM-4, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-4, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-4, .contact-page #partnership .values-page #numbers .items .col-desktopM-5, .values-page #numbers .contact-page #partnership .items .col-desktopM-5, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-5, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-5, .contact-page #partnership .values-page #numbers .items .col-desktopM-6, .values-page #numbers .contact-page #partnership .items .col-desktopM-6, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-6, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-6, .contact-page #partnership .values-page #numbers .items .col-desktopM-7, .values-page #numbers .contact-page #partnership .items .col-desktopM-7, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-7, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-7, .contact-page #partnership .values-page #numbers .items .col-desktopM-8, .values-page #numbers .contact-page #partnership .items .col-desktopM-8, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-8, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-8, .contact-page #partnership .values-page #numbers .items .col-desktopM-9, .values-page #numbers .contact-page #partnership .items .col-desktopM-9, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-9, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-9, .contact-page #partnership .values-page #numbers .items .col-desktopM-10, .values-page #numbers .contact-page #partnership .items .col-desktopM-10, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-10, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-10, .contact-page #partnership .values-page #numbers .items .col-desktopL-1, .values-page #numbers .contact-page #partnership .items .col-desktopL-1, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-1, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-1, .contact-page #partnership .values-page #numbers .items .col-desktopL-2, .values-page #numbers .contact-page #partnership .items .col-desktopL-2, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-2, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-2, .contact-page #partnership .values-page #numbers .items .col-desktopL-3, .values-page #numbers .contact-page #partnership .items .col-desktopL-3, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-3, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-3, .contact-page #partnership .values-page #numbers .items .col-desktopL-4, .values-page #numbers .contact-page #partnership .items .col-desktopL-4, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-4, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-4, .contact-page #partnership .values-page #numbers .items .col-desktopL-5, .values-page #numbers .contact-page #partnership .items .col-desktopL-5, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-5, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-5, .contact-page #partnership .values-page #numbers .items .col-desktopL-6, .values-page #numbers .contact-page #partnership .items .col-desktopL-6, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-6, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-6, .contact-page #partnership .values-page #numbers .items .col-desktopL-7, .values-page #numbers .contact-page #partnership .items .col-desktopL-7, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-7, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-7, .contact-page #partnership .values-page #numbers .items .col-desktopL-8, .values-page #numbers .contact-page #partnership .items .col-desktopL-8, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-8, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-8, .contact-page #partnership .values-page #numbers .items .col-desktopL-9, .values-page #numbers .contact-page #partnership .items .col-desktopL-9, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-9, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-9, .contact-page #partnership .values-page #numbers .items .col-desktopL-10, .values-page #numbers .contact-page #partnership .items .col-desktopL-10, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-10, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-10 { position: relative; min-height: 1px; padding-right: 5px; padding-left: 5px; width: 100%; } .contact-page #partnership .items .col-phoneS { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .contact-page #partnership .items .col-phoneS-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .contact-page #partnership .items .col-phoneS-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .contact-page #partnership .items .col-phoneS-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .contact-page #partnership .items .col-phoneS-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .contact-page #partnership .items .col-phoneS-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .contact-page #partnership .items .col-phoneS-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .contact-page #partnership .items .col-phoneS-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .contact-page #partnership .items .col-phoneS-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .contact-page #partnership .items .col-phoneS-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .contact-page #partnership .items .col-phoneS-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contact-page #partnership .items .pull-phoneS-0 { right: auto; } .contact-page #partnership .items .pull-phoneS-1 { right: 10%; } .contact-page #partnership .items .pull-phoneS-2 { right: 20%; } .contact-page #partnership .items .pull-phoneS-3 { right: 30%; } .contact-page #partnership .items .pull-phoneS-4 { right: 40%; } .contact-page #partnership .items .pull-phoneS-5 { right: 50%; } .contact-page #partnership .items .pull-phoneS-6 { right: 60%; } .contact-page #partnership .items .pull-phoneS-7 { right: 70%; } .contact-page #partnership .items .pull-phoneS-8 { right: 80%; } .contact-page #partnership .items .pull-phoneS-9 { right: 90%; } .contact-page #partnership .items .pull-phoneS-10 { right: 100%; } .contact-page #partnership .items .push-phoneS-0 { left: auto; } .contact-page #partnership .items .push-phoneS-1 { left: 10%; } .contact-page #partnership .items .push-phoneS-2 { left: 20%; } .contact-page #partnership .items .push-phoneS-3 { left: 30%; } .contact-page #partnership .items .push-phoneS-4 { left: 40%; } .contact-page #partnership .items .push-phoneS-5 { left: 50%; } .contact-page #partnership .items .push-phoneS-6 { left: 60%; } .contact-page #partnership .items .push-phoneS-7 { left: 70%; } .contact-page #partnership .items .push-phoneS-8 { left: 80%; } .contact-page #partnership .items .push-phoneS-9 { left: 90%; } .contact-page #partnership .items .push-phoneS-10 { left: 100%; } .contact-page #partnership .items .offset-phoneS-1 { margin-left: 10%; } .contact-page #partnership .items .offset-phoneS-2 { margin-left: 20%; } .contact-page #partnership .items .offset-phoneS-3 { margin-left: 30%; } .contact-page #partnership .items .offset-phoneS-4 { margin-left: 40%; } .contact-page #partnership .items .offset-phoneS-5 { margin-left: 50%; } .contact-page #partnership .items .offset-phoneS-6 { margin-left: 60%; } .contact-page #partnership .items .offset-phoneS-7 { margin-left: 70%; } .contact-page #partnership .items .offset-phoneS-8 { margin-left: 80%; } .contact-page #partnership .items .offset-phoneS-9 { margin-left: 90%; } @media (min-width: 544px) { .contact-page #partnership .items .col-phoneL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .contact-page #partnership .items .col-phoneL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .contact-page #partnership .items .col-phoneL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .contact-page #partnership .items .col-phoneL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .contact-page #partnership .items .col-phoneL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .contact-page #partnership .items .col-phoneL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .contact-page #partnership .items .col-phoneL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .contact-page #partnership .items .col-phoneL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .contact-page #partnership .items .col-phoneL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .contact-page #partnership .items .col-phoneL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .contact-page #partnership .items .col-phoneL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contact-page #partnership .items .pull-phoneL-0 { right: auto; } .contact-page #partnership .items .pull-phoneL-1 { right: 10%; } .contact-page #partnership .items .pull-phoneL-2 { right: 20%; } .contact-page #partnership .items .pull-phoneL-3 { right: 30%; } .contact-page #partnership .items .pull-phoneL-4 { right: 40%; } .contact-page #partnership .items .pull-phoneL-5 { right: 50%; } .contact-page #partnership .items .pull-phoneL-6 { right: 60%; } .contact-page #partnership .items .pull-phoneL-7 { right: 70%; } .contact-page #partnership .items .pull-phoneL-8 { right: 80%; } .contact-page #partnership .items .pull-phoneL-9 { right: 90%; } .contact-page #partnership .items .pull-phoneL-10 { right: 100%; } .contact-page #partnership .items .push-phoneL-0 { left: auto; } .contact-page #partnership .items .push-phoneL-1 { left: 10%; } .contact-page #partnership .items .push-phoneL-2 { left: 20%; } .contact-page #partnership .items .push-phoneL-3 { left: 30%; } .contact-page #partnership .items .push-phoneL-4 { left: 40%; } .contact-page #partnership .items .push-phoneL-5 { left: 50%; } .contact-page #partnership .items .push-phoneL-6 { left: 60%; } .contact-page #partnership .items .push-phoneL-7 { left: 70%; } .contact-page #partnership .items .push-phoneL-8 { left: 80%; } .contact-page #partnership .items .push-phoneL-9 { left: 90%; } .contact-page #partnership .items .push-phoneL-10 { left: 100%; } .contact-page #partnership .items .offset-phoneL-0 { margin-left: 0%; } .contact-page #partnership .items .offset-phoneL-1 { margin-left: 10%; } .contact-page #partnership .items .offset-phoneL-2 { margin-left: 20%; } .contact-page #partnership .items .offset-phoneL-3 { margin-left: 30%; } .contact-page #partnership .items .offset-phoneL-4 { margin-left: 40%; } .contact-page #partnership .items .offset-phoneL-5 { margin-left: 50%; } .contact-page #partnership .items .offset-phoneL-6 { margin-left: 60%; } .contact-page #partnership .items .offset-phoneL-7 { margin-left: 70%; } .contact-page #partnership .items .offset-phoneL-8 { margin-left: 80%; } .contact-page #partnership .items .offset-phoneL-9 { margin-left: 90%; } } @media (min-width: 768px) { .contact-page #partnership .items .col-tabletP { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .contact-page #partnership .items .col-tabletP-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .contact-page #partnership .items .col-tabletP-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .contact-page #partnership .items .col-tabletP-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .contact-page #partnership .items .col-tabletP-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .contact-page #partnership .items .col-tabletP-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .contact-page #partnership .items .col-tabletP-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .contact-page #partnership .items .col-tabletP-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .contact-page #partnership .items .col-tabletP-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .contact-page #partnership .items .col-tabletP-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .contact-page #partnership .items .col-tabletP-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contact-page #partnership .items .pull-tabletP-0 { right: auto; } .contact-page #partnership .items .pull-tabletP-1 { right: 10%; } .contact-page #partnership .items .pull-tabletP-2 { right: 20%; } .contact-page #partnership .items .pull-tabletP-3 { right: 30%; } .contact-page #partnership .items .pull-tabletP-4 { right: 40%; } .contact-page #partnership .items .pull-tabletP-5 { right: 50%; } .contact-page #partnership .items .pull-tabletP-6 { right: 60%; } .contact-page #partnership .items .pull-tabletP-7 { right: 70%; } .contact-page #partnership .items .pull-tabletP-8 { right: 80%; } .contact-page #partnership .items .pull-tabletP-9 { right: 90%; } .contact-page #partnership .items .pull-tabletP-10 { right: 100%; } .contact-page #partnership .items .push-tabletP-0 { left: auto; } .contact-page #partnership .items .push-tabletP-1 { left: 10%; } .contact-page #partnership .items .push-tabletP-2 { left: 20%; } .contact-page #partnership .items .push-tabletP-3 { left: 30%; } .contact-page #partnership .items .push-tabletP-4 { left: 40%; } .contact-page #partnership .items .push-tabletP-5 { left: 50%; } .contact-page #partnership .items .push-tabletP-6 { left: 60%; } .contact-page #partnership .items .push-tabletP-7 { left: 70%; } .contact-page #partnership .items .push-tabletP-8 { left: 80%; } .contact-page #partnership .items .push-tabletP-9 { left: 90%; } .contact-page #partnership .items .push-tabletP-10 { left: 100%; } .contact-page #partnership .items .offset-tabletP-0 { margin-left: 0%; } .contact-page #partnership .items .offset-tabletP-1 { margin-left: 10%; } .contact-page #partnership .items .offset-tabletP-2 { margin-left: 20%; } .contact-page #partnership .items .offset-tabletP-3 { margin-left: 30%; } .contact-page #partnership .items .offset-tabletP-4 { margin-left: 40%; } .contact-page #partnership .items .offset-tabletP-5 { margin-left: 50%; } .contact-page #partnership .items .offset-tabletP-6 { margin-left: 60%; } .contact-page #partnership .items .offset-tabletP-7 { margin-left: 70%; } .contact-page #partnership .items .offset-tabletP-8 { margin-left: 80%; } .contact-page #partnership .items .offset-tabletP-9 { margin-left: 90%; } } @media (min-width: 992px) { .contact-page #partnership .items .col-tabletL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .contact-page #partnership .items .col-tabletL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .contact-page #partnership .items .col-tabletL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .contact-page #partnership .items .col-tabletL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .contact-page #partnership .items .col-tabletL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .contact-page #partnership .items .col-tabletL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .contact-page #partnership .items .col-tabletL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .contact-page #partnership .items .col-tabletL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .contact-page #partnership .items .col-tabletL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .contact-page #partnership .items .col-tabletL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .contact-page #partnership .items .col-tabletL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contact-page #partnership .items .pull-tabletL-0 { right: auto; } .contact-page #partnership .items .pull-tabletL-1 { right: 10%; } .contact-page #partnership .items .pull-tabletL-2 { right: 20%; } .contact-page #partnership .items .pull-tabletL-3 { right: 30%; } .contact-page #partnership .items .pull-tabletL-4 { right: 40%; } .contact-page #partnership .items .pull-tabletL-5 { right: 50%; } .contact-page #partnership .items .pull-tabletL-6 { right: 60%; } .contact-page #partnership .items .pull-tabletL-7 { right: 70%; } .contact-page #partnership .items .pull-tabletL-8 { right: 80%; } .contact-page #partnership .items .pull-tabletL-9 { right: 90%; } .contact-page #partnership .items .pull-tabletL-10 { right: 100%; } .contact-page #partnership .items .push-tabletL-0 { left: auto; } .contact-page #partnership .items .push-tabletL-1 { left: 10%; } .contact-page #partnership .items .push-tabletL-2 { left: 20%; } .contact-page #partnership .items .push-tabletL-3 { left: 30%; } .contact-page #partnership .items .push-tabletL-4 { left: 40%; } .contact-page #partnership .items .push-tabletL-5 { left: 50%; } .contact-page #partnership .items .push-tabletL-6 { left: 60%; } .contact-page #partnership .items .push-tabletL-7 { left: 70%; } .contact-page #partnership .items .push-tabletL-8 { left: 80%; } .contact-page #partnership .items .push-tabletL-9 { left: 90%; } .contact-page #partnership .items .push-tabletL-10 { left: 100%; } .contact-page #partnership .items .offset-tabletL-0 { margin-left: 0%; } .contact-page #partnership .items .offset-tabletL-1 { margin-left: 10%; } .contact-page #partnership .items .offset-tabletL-2 { margin-left: 20%; } .contact-page #partnership .items .offset-tabletL-3 { margin-left: 30%; } .contact-page #partnership .items .offset-tabletL-4 { margin-left: 40%; } .contact-page #partnership .items .offset-tabletL-5 { margin-left: 50%; } .contact-page #partnership .items .offset-tabletL-6 { margin-left: 60%; } .contact-page #partnership .items .offset-tabletL-7 { margin-left: 70%; } .contact-page #partnership .items .offset-tabletL-8 { margin-left: 80%; } .contact-page #partnership .items .offset-tabletL-9 { margin-left: 90%; } } @media (min-width: 1200px) { .contact-page #partnership .items .col-desktopS { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .contact-page #partnership .items .col-desktopS-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .contact-page #partnership .items .col-desktopS-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .contact-page #partnership .items .col-desktopS-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .contact-page #partnership .items .col-desktopS-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .contact-page #partnership .items .col-desktopS-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .contact-page #partnership .items .col-desktopS-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .contact-page #partnership .items .col-desktopS-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .contact-page #partnership .items .col-desktopS-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .contact-page #partnership .items .col-desktopS-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .contact-page #partnership .items .col-desktopS-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contact-page #partnership .items .pull-desktopS-0 { right: auto; } .contact-page #partnership .items .pull-desktopS-1 { right: 10%; } .contact-page #partnership .items .pull-desktopS-2 { right: 20%; } .contact-page #partnership .items .pull-desktopS-3 { right: 30%; } .contact-page #partnership .items .pull-desktopS-4 { right: 40%; } .contact-page #partnership .items .pull-desktopS-5 { right: 50%; } .contact-page #partnership .items .pull-desktopS-6 { right: 60%; } .contact-page #partnership .items .pull-desktopS-7 { right: 70%; } .contact-page #partnership .items .pull-desktopS-8 { right: 80%; } .contact-page #partnership .items .pull-desktopS-9 { right: 90%; } .contact-page #partnership .items .pull-desktopS-10 { right: 100%; } .contact-page #partnership .items .push-desktopS-0 { left: auto; } .contact-page #partnership .items .push-desktopS-1 { left: 10%; } .contact-page #partnership .items .push-desktopS-2 { left: 20%; } .contact-page #partnership .items .push-desktopS-3 { left: 30%; } .contact-page #partnership .items .push-desktopS-4 { left: 40%; } .contact-page #partnership .items .push-desktopS-5 { left: 50%; } .contact-page #partnership .items .push-desktopS-6 { left: 60%; } .contact-page #partnership .items .push-desktopS-7 { left: 70%; } .contact-page #partnership .items .push-desktopS-8 { left: 80%; } .contact-page #partnership .items .push-desktopS-9 { left: 90%; } .contact-page #partnership .items .push-desktopS-10 { left: 100%; } .contact-page #partnership .items .offset-desktopS-0 { margin-left: 0%; } .contact-page #partnership .items .offset-desktopS-1 { margin-left: 10%; } .contact-page #partnership .items .offset-desktopS-2 { margin-left: 20%; } .contact-page #partnership .items .offset-desktopS-3 { margin-left: 30%; } .contact-page #partnership .items .offset-desktopS-4 { margin-left: 40%; } .contact-page #partnership .items .offset-desktopS-5 { margin-left: 50%; } .contact-page #partnership .items .offset-desktopS-6 { margin-left: 60%; } .contact-page #partnership .items .offset-desktopS-7 { margin-left: 70%; } .contact-page #partnership .items .offset-desktopS-8 { margin-left: 80%; } .contact-page #partnership .items .offset-desktopS-9 { margin-left: 90%; } } @media (min-width: 1600px) { .contact-page #partnership .items .col-desktopM { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .contact-page #partnership .items .col-desktopM-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .contact-page #partnership .items .col-desktopM-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .contact-page #partnership .items .col-desktopM-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .contact-page #partnership .items .col-desktopM-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .contact-page #partnership .items .col-desktopM-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .contact-page #partnership .items .col-desktopM-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .contact-page #partnership .items .col-desktopM-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .contact-page #partnership .items .col-desktopM-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .contact-page #partnership .items .col-desktopM-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .contact-page #partnership .items .col-desktopM-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contact-page #partnership .items .pull-desktopM-0 { right: auto; } .contact-page #partnership .items .pull-desktopM-1 { right: 10%; } .contact-page #partnership .items .pull-desktopM-2 { right: 20%; } .contact-page #partnership .items .pull-desktopM-3 { right: 30%; } .contact-page #partnership .items .pull-desktopM-4 { right: 40%; } .contact-page #partnership .items .pull-desktopM-5 { right: 50%; } .contact-page #partnership .items .pull-desktopM-6 { right: 60%; } .contact-page #partnership .items .pull-desktopM-7 { right: 70%; } .contact-page #partnership .items .pull-desktopM-8 { right: 80%; } .contact-page #partnership .items .pull-desktopM-9 { right: 90%; } .contact-page #partnership .items .pull-desktopM-10 { right: 100%; } .contact-page #partnership .items .push-desktopM-0 { left: auto; } .contact-page #partnership .items .push-desktopM-1 { left: 10%; } .contact-page #partnership .items .push-desktopM-2 { left: 20%; } .contact-page #partnership .items .push-desktopM-3 { left: 30%; } .contact-page #partnership .items .push-desktopM-4 { left: 40%; } .contact-page #partnership .items .push-desktopM-5 { left: 50%; } .contact-page #partnership .items .push-desktopM-6 { left: 60%; } .contact-page #partnership .items .push-desktopM-7 { left: 70%; } .contact-page #partnership .items .push-desktopM-8 { left: 80%; } .contact-page #partnership .items .push-desktopM-9 { left: 90%; } .contact-page #partnership .items .push-desktopM-10 { left: 100%; } .contact-page #partnership .items .offset-desktopM-0 { margin-left: 0%; } .contact-page #partnership .items .offset-desktopM-1 { margin-left: 10%; } .contact-page #partnership .items .offset-desktopM-2 { margin-left: 20%; } .contact-page #partnership .items .offset-desktopM-3 { margin-left: 30%; } .contact-page #partnership .items .offset-desktopM-4 { margin-left: 40%; } .contact-page #partnership .items .offset-desktopM-5 { margin-left: 50%; } .contact-page #partnership .items .offset-desktopM-6 { margin-left: 60%; } .contact-page #partnership .items .offset-desktopM-7 { margin-left: 70%; } .contact-page #partnership .items .offset-desktopM-8 { margin-left: 80%; } .contact-page #partnership .items .offset-desktopM-9 { margin-left: 90%; } } @media (min-width: 2100px) { .contact-page #partnership .items .col-desktopL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .contact-page #partnership .items .col-desktopL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .contact-page #partnership .items .col-desktopL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .contact-page #partnership .items .col-desktopL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .contact-page #partnership .items .col-desktopL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .contact-page #partnership .items .col-desktopL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .contact-page #partnership .items .col-desktopL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .contact-page #partnership .items .col-desktopL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .contact-page #partnership .items .col-desktopL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .contact-page #partnership .items .col-desktopL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .contact-page #partnership .items .col-desktopL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .contact-page #partnership .items .pull-desktopL-0 { right: auto; } .contact-page #partnership .items .pull-desktopL-1 { right: 10%; } .contact-page #partnership .items .pull-desktopL-2 { right: 20%; } .contact-page #partnership .items .pull-desktopL-3 { right: 30%; } .contact-page #partnership .items .pull-desktopL-4 { right: 40%; } .contact-page #partnership .items .pull-desktopL-5 { right: 50%; } .contact-page #partnership .items .pull-desktopL-6 { right: 60%; } .contact-page #partnership .items .pull-desktopL-7 { right: 70%; } .contact-page #partnership .items .pull-desktopL-8 { right: 80%; } .contact-page #partnership .items .pull-desktopL-9 { right: 90%; } .contact-page #partnership .items .pull-desktopL-10 { right: 100%; } .contact-page #partnership .items .push-desktopL-0 { left: auto; } .contact-page #partnership .items .push-desktopL-1 { left: 10%; } .contact-page #partnership .items .push-desktopL-2 { left: 20%; } .contact-page #partnership .items .push-desktopL-3 { left: 30%; } .contact-page #partnership .items .push-desktopL-4 { left: 40%; } .contact-page #partnership .items .push-desktopL-5 { left: 50%; } .contact-page #partnership .items .push-desktopL-6 { left: 60%; } .contact-page #partnership .items .push-desktopL-7 { left: 70%; } .contact-page #partnership .items .push-desktopL-8 { left: 80%; } .contact-page #partnership .items .push-desktopL-9 { left: 90%; } .contact-page #partnership .items .push-desktopL-10 { left: 100%; } .contact-page #partnership .items .offset-desktopL-0 { margin-left: 0%; } .contact-page #partnership .items .offset-desktopL-1 { margin-left: 10%; } .contact-page #partnership .items .offset-desktopL-2 { margin-left: 20%; } .contact-page #partnership .items .offset-desktopL-3 { margin-left: 30%; } .contact-page #partnership .items .offset-desktopL-4 { margin-left: 40%; } .contact-page #partnership .items .offset-desktopL-5 { margin-left: 50%; } .contact-page #partnership .items .offset-desktopL-6 { margin-left: 60%; } .contact-page #partnership .items .offset-desktopL-7 { margin-left: 70%; } .contact-page #partnership .items .offset-desktopL-8 { margin-left: 80%; } .contact-page #partnership .items .offset-desktopL-9 { margin-left: 90%; } } @media (max-width: 767px) { .contact-page .pr .tax br:nth-of-type(1), .contact-page .pr .tax br:nth-of-type(2), .contact-page .pr .tax br:nth-of-type(3) { display: none; } } @media (min-width: 768px) { .contact-page #contact-header .content h1 span { display: inline; font-size: 100%; } .contact-page #contact-header .bg { padding-bottom: 0; height: 350px; } .contact-page #info .content, .contact-page #support .content { padding-top: 4.8rem; padding-bottom: 2.4rem; } .contact-page #sales .content { padding-bottom: 2.4rem; } .contact-page #partnership .content a img { margin-bottom: 1rem; width: 80px; height: 80px; } .contact-page #partnership .content a h3 { margin-bottom: 2rem; } } @media (min-width: 992px) { #info .content .wpcf7 .intl-tel-input .selected-flag, #support .content .wpcf7 .intl-tel-input .selected-flag { width: 110px !important; } #info .content .wpcf7 .intl-tel-input input, #support .content .wpcf7 .intl-tel-input input { padding: 14px 24px 14px 115px; } .contact-page .pr#pr .content img { width: 60px; height: 50px; } } @media (min-width: 1200px) { .contact-page #info .content, .contact-page #support .content { padding-bottom: 0; } .contact-page #info .content h2, .contact-page #support .content h2 { margin-bottom: 5.4rem; } .contact-page #info .content .wpcf7, .contact-page #support .content .wpcf7 { margin-top: 3rem; } .contact-page #info .content .wpcf7 .submit-wrapper, .contact-page #support .content .wpcf7 .submit-wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: inherit; flex-direction: inherit; margin-top: 2rem; } .contact-page #info .content .wpcf7 .submit-wrapper .form-right-wrapper div div, .contact-page #support .content .wpcf7 .submit-wrapper .form-right-wrapper div div { float: right; } .contact-page #info .content .wpcf7 .intl-tel-input .selected-flag, .contact-page #support .content .wpcf7 .intl-tel-input .selected-flag { width: 115px !important; } .contact-page #info .content .wpcf7 .intl-tel-input input, .contact-page #support .content .wpcf7 .intl-tel-input input { padding: 14px 24px 14px 120px; } .contact-page #sales .content h2, .contact-page .pr .content h2 { margin-bottom: 5.4rem; } .contact-page .pr .contacts h3 { font-size: 125%; } .contact-page #hq img { width: 130px; margin-bottom: 3.6rem; } .contact-page #partnership .content { padding-bottom: 4.8rem; } .contact-page #partnership .content a h3 { margin-bottom: 3rem; } .contact-page #partnership .content a img { margin-top: 2.4rem; } } @media (min-width: 1600px) { .contact-page #info .content .wpcf7 .intl-tel-input .selected-flag, .contact-page #support .content .wpcf7 .intl-tel-input .selected-flag { width: 120px !important; } .contact-page #info .content .wpcf7 .intl-tel-input input, .contact-page #support .content .wpcf7 .intl-tel-input input { padding: 14px 24px 14px 125px; } .contact-page #support { padding-top: 6rem; } .contact-page #sales { padding-top: 6rem; padding-bottom: 4.8rem; } .contact-page .pr .content { padding-top: 6rem; padding-bottom: 6rem; } .contact-page .pr .contacts h3 { font-size: 130%; } .contact-page .pr#pr .content img { margin-right: 3.2rem; width: 70px; height: 60px; } } .values-page #video, .about-us-page #video { height: 360px; width: auto; max-width: 2560px; } .values-page #video.section-video-player .content, .about-us-page #video.section-video-player .content { position: relative; top: 0; -webkit-transform: translateY(0); transform: translateY(0); } .values-page #video .content h1, .about-us-page #video .content h1 { text-transform: none; line-height: 1.4; font-size: 36px; } .values-page #video .content h2, .about-us-page #video .content h2 { text-transform: none; line-height: 1.4; font-size: 36px; } .values-page #video .button.button-play::before, .about-us-page #video .button.button-play::before { content: ""; display: inline-block; background-color: rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 50%; width: 38px; height: 38px; position: absolute; top: 50%; left: -25%; -webkit-animation: 2s linear 0s infinite normal; animation: 2s linear 0s infinite normal; -webkit-animation-name: play-button-before; animation-name: play-button-before; } .values-page #video .button.button-play, .about-us-page #video .button.button-play { top: 140px; } .values-page #video .button span, .about-us-page #video .button span { font-size: 1.4rem; width: 100px; visibility: visible; color: #ffffff; top: 33%; position: absolute; } .values-page #video .button.button-play::after, .about-us-page #video .button.button-play::after { content: ""; display: inline-block; width: 40px; height: 40px; background-size: 40px 40px; position: absolute; top: 10px; left: -35px; } .values-page #attributes hr, .about-us-page #attributes hr { display: inline-block; width: 70px; border: 0; height: 2px; background-color: #0090ff; margin: 0 0 10px; } .values-page #attributes p span, .about-us-page #attributes p span { font-weight: 600; font-size: 130%; } .values-page #attributes h2, .about-us-page #attributes h2 { font-size: 16px; font-weight: 600; } .values-page #attributes .item-1, .about-us-page #attributes .item-1 { padding: 40px 0 40px; } .values-page #attributes .item-2, .about-us-page #attributes .item-2 { background-color: #f6f6f6; padding: 50px 0 40px; } .values-page #attributes .item-3, .about-us-page #attributes .item-3 { padding: 40px 0 10px; } .values-page #parallax, .about-us-page #parallax { width: auto; max-width: 2560px; } .values-page #parallax .content h2, .about-us-page #parallax .content h2 { line-height: 1.4; } .values-page #numbers, .about-us-page #numbers { width: auto; max-width: 2560px; } .values-page #numbers .content, .about-us-page #numbers .content { padding-top: 2.4rem; padding-bottom: 2.4rem; text-align: left; background-color: #f6f6f6; } .values-page #numbers .content h2, .about-us-page #numbers .content h2 { font-weight: 700; color: #343e6a; padding-bottom: 0.5rem; font-size: 4rem; } .values-page #numbers .content h2 span, .about-us-page #numbers .content h2 span { font-size: 2.5rem; } .values-page #numbers .content img, .about-us-page #numbers .content img { width: 10px; height: 20px; margin-right: 15px; } .values-page #numbers .content .arrow, .about-us-page #numbers .content .arrow { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .values-page #numbers .content .center, .about-us-page #numbers .content .center { display: block; text-align: center; margin: 2.2rem 0; } .values-page #numbers .content .wrapper div, .about-us-page #numbers .content .wrapper div { opacity: 0; top: 30px; } .values-page #numbers .content .wrapper div:nth-of-type(1), .about-us-page #numbers .content .wrapper div:nth-of-type(1) { transition: all 1s 500ms; } .values-page #numbers .content .wrapper div:nth-of-type(2), .about-us-page #numbers .content .wrapper div:nth-of-type(2) { transition: all 1s 1000ms; } .values-page #numbers .content .wrapper div:nth-of-type(3), .about-us-page #numbers .content .wrapper div:nth-of-type(3) { transition: all 1s 1500ms; } .values-page #numbers .content .wrapper div:nth-of-type(4), .about-us-page #numbers .content .wrapper div:nth-of-type(4) { transition: all 1s 2000ms; } .values-page #numbers .content .wrapper div:nth-of-type(5), .about-us-page #numbers .content .wrapper div:nth-of-type(5) { transition: all 1s 2500ms; } .values-page #numbers .content .wrapper.active div:nth-of-type(1), .values-page #numbers .content .wrapper.active div:nth-of-type(2), .values-page #numbers .content .wrapper.active div:nth-of-type(3), .values-page #numbers .content .wrapper.active div:nth-of-type(4), .values-page #numbers .content .wrapper.active div:nth-of-type(5), .about-us-page #numbers .content .wrapper.active div:nth-of-type(1), .about-us-page #numbers .content .wrapper.active div:nth-of-type(2), .about-us-page #numbers .content .wrapper.active div:nth-of-type(3), .about-us-page #numbers .content .wrapper.active div:nth-of-type(4), .about-us-page #numbers .content .wrapper.active div:nth-of-type(5) { opacity: 1; top: 0; } .values-page #numbers .items .col-phoneS-1, .values-page #numbers .items .col-phoneS-2, .values-page #numbers .items .col-phoneS-3, .values-page #numbers .items .col-phoneS-4, .values-page #numbers .items .col-phoneS-5, .values-page #numbers .items .col-phoneS-6, .values-page #numbers .items .col-phoneS-7, .values-page #numbers .items .col-phoneS-8, .values-page #numbers .items .col-phoneS-9, .values-page #numbers .items .col-phoneS-10, .values-page #numbers .items .col-phoneS-11, .values-page #numbers .items .col-phoneS-12, .values-page #numbers .items .col-phoneL-1, .values-page #numbers .items .col-phoneL-2, .values-page #numbers .items .col-phoneL-3, .values-page #numbers .items .col-phoneL-4, .values-page #numbers .items .col-phoneL-5, .values-page #numbers .items .col-phoneL-6, .values-page #numbers .items .col-phoneL-7, .values-page #numbers .items .col-phoneL-8, .values-page #numbers .items .col-phoneL-9, .values-page #numbers .items .col-phoneL-10, .values-page #numbers .items .col-phoneL-11, .values-page #numbers .items .col-phoneL-12, .values-page #numbers .items .col-tabletP-1, .values-page #numbers .items .col-tabletP-2, .values-page #numbers .items .col-tabletP-3, .values-page #numbers .items .col-tabletP-4, .values-page #numbers .items .col-tabletP-5, .values-page #numbers .items .col-tabletP-6, .values-page #numbers .items .col-tabletP-7, .values-page #numbers .items .col-tabletP-8, .values-page #numbers .items .col-tabletP-9, .values-page #numbers .items .col-tabletP-10, .values-page #numbers .items .col-tabletP-11, .values-page #numbers .items .col-tabletP-12, .values-page #numbers .items .col-tabletL-1, .values-page #numbers .items .col-tabletL-2, .values-page #numbers .items .col-tabletL-3, .values-page #numbers .items .col-tabletL-4, .values-page #numbers .items .col-tabletL-5, .values-page #numbers .items .col-tabletL-6, .values-page #numbers .items .col-tabletL-7, .values-page #numbers .items .col-tabletL-8, .values-page #numbers .items .col-tabletL-9, .values-page #numbers .items .col-tabletL-10, .values-page #numbers .items .col-tabletL-11, .values-page #numbers .items .col-tabletL-12, .values-page #numbers .items .col-desktopS-1, .values-page #numbers .items .col-desktopS-2, .values-page #numbers .items .col-desktopS-3, .values-page #numbers .items .col-desktopS-4, .values-page #numbers .items .col-desktopS-5, .values-page #numbers .items .col-desktopS-6, .values-page #numbers .items .col-desktopS-7, .values-page #numbers .items .col-desktopS-8, .values-page #numbers .items .col-desktopS-9, .values-page #numbers .items .col-desktopS-10, .values-page #numbers .items .col-desktopS-11, .values-page #numbers .items .col-desktopS-12, .values-page #numbers .items .col-desktopM-1, .values-page #numbers .items .col-desktopM-2, .values-page #numbers .items .col-desktopM-3, .values-page #numbers .items .col-desktopM-4, .values-page #numbers .items .col-desktopM-5, .values-page #numbers .items .col-desktopM-6, .values-page #numbers .items .col-desktopM-7, .values-page #numbers .items .col-desktopM-8, .values-page #numbers .items .col-desktopM-9, .values-page #numbers .items .col-desktopM-10, .values-page #numbers .items .col-desktopM-11, .values-page #numbers .items .col-desktopM-12, .values-page #numbers .items .col-desktopL-1, .values-page #numbers .items .col-desktopL-2, .values-page #numbers .items .col-desktopL-3, .values-page #numbers .items .col-desktopL-4, .values-page #numbers .items .col-desktopL-5, .values-page #numbers .items .col-desktopL-6, .values-page #numbers .items .col-desktopL-7, .values-page #numbers .items .col-desktopL-8, .values-page #numbers .items .col-desktopL-9, .values-page #numbers .items .col-desktopL-10, .values-page #numbers .items .col-desktopL-11, .values-page #numbers .items .col-desktopL-12, .values-page #numbers .contact-page #partnership .items .col-phoneS-1, .contact-page #partnership .values-page #numbers .items .col-phoneS-1, .values-page #numbers .contact-page #partnership .items .col-phoneS-2, .contact-page #partnership .values-page #numbers .items .col-phoneS-2, .values-page #numbers .contact-page #partnership .items .col-phoneS-3, .contact-page #partnership .values-page #numbers .items .col-phoneS-3, .values-page #numbers .contact-page #partnership .items .col-phoneS-4, .contact-page #partnership .values-page #numbers .items .col-phoneS-4, .values-page #numbers .contact-page #partnership .items .col-phoneS-5, .contact-page #partnership .values-page #numbers .items .col-phoneS-5, .values-page #numbers .contact-page #partnership .items .col-phoneS-6, .contact-page #partnership .values-page #numbers .items .col-phoneS-6, .values-page #numbers .contact-page #partnership .items .col-phoneS-7, .contact-page #partnership .values-page #numbers .items .col-phoneS-7, .values-page #numbers .contact-page #partnership .items .col-phoneS-8, .contact-page #partnership .values-page #numbers .items .col-phoneS-8, .values-page #numbers .contact-page #partnership .items .col-phoneS-9, .contact-page #partnership .values-page #numbers .items .col-phoneS-9, .values-page #numbers .contact-page #partnership .items .col-phoneS-10, .contact-page #partnership .values-page #numbers .items .col-phoneS-10, .values-page #numbers .contact-page #partnership .items .col-phoneL-1, .contact-page #partnership .values-page #numbers .items .col-phoneL-1, .values-page #numbers .contact-page #partnership .items .col-phoneL-2, .contact-page #partnership .values-page #numbers .items .col-phoneL-2, .values-page #numbers .contact-page #partnership .items .col-phoneL-3, .contact-page #partnership .values-page #numbers .items .col-phoneL-3, .values-page #numbers .contact-page #partnership .items .col-phoneL-4, .contact-page #partnership .values-page #numbers .items .col-phoneL-4, .values-page #numbers .contact-page #partnership .items .col-phoneL-5, .contact-page #partnership .values-page #numbers .items .col-phoneL-5, .values-page #numbers .contact-page #partnership .items .col-phoneL-6, .contact-page #partnership .values-page #numbers .items .col-phoneL-6, .values-page #numbers .contact-page #partnership .items .col-phoneL-7, .contact-page #partnership .values-page #numbers .items .col-phoneL-7, .values-page #numbers .contact-page #partnership .items .col-phoneL-8, .contact-page #partnership .values-page #numbers .items .col-phoneL-8, .values-page #numbers .contact-page #partnership .items .col-phoneL-9, .contact-page #partnership .values-page #numbers .items .col-phoneL-9, .values-page #numbers .contact-page #partnership .items .col-phoneL-10, .contact-page #partnership .values-page #numbers .items .col-phoneL-10, .values-page #numbers .contact-page #partnership .items .col-tabletP-1, .contact-page #partnership .values-page #numbers .items .col-tabletP-1, .values-page #numbers .contact-page #partnership .items .col-tabletP-2, .contact-page #partnership .values-page #numbers .items .col-tabletP-2, .values-page #numbers .contact-page #partnership .items .col-tabletP-3, .contact-page #partnership .values-page #numbers .items .col-tabletP-3, .values-page #numbers .contact-page #partnership .items .col-tabletP-4, .contact-page #partnership .values-page #numbers .items .col-tabletP-4, .values-page #numbers .contact-page #partnership .items .col-tabletP-5, .contact-page #partnership .values-page #numbers .items .col-tabletP-5, .values-page #numbers .contact-page #partnership .items .col-tabletP-6, .contact-page #partnership .values-page #numbers .items .col-tabletP-6, .values-page #numbers .contact-page #partnership .items .col-tabletP-7, .contact-page #partnership .values-page #numbers .items .col-tabletP-7, .values-page #numbers .contact-page #partnership .items .col-tabletP-8, .contact-page #partnership .values-page #numbers .items .col-tabletP-8, .values-page #numbers .contact-page #partnership .items .col-tabletP-9, .contact-page #partnership .values-page #numbers .items .col-tabletP-9, .values-page #numbers .contact-page #partnership .items .col-tabletP-10, .contact-page #partnership .values-page #numbers .items .col-tabletP-10, .values-page #numbers .contact-page #partnership .items .col-tabletL-1, .contact-page #partnership .values-page #numbers .items .col-tabletL-1, .values-page #numbers .contact-page #partnership .items .col-tabletL-2, .contact-page #partnership .values-page #numbers .items .col-tabletL-2, .values-page #numbers .contact-page #partnership .items .col-tabletL-3, .contact-page #partnership .values-page #numbers .items .col-tabletL-3, .values-page #numbers .contact-page #partnership .items .col-tabletL-4, .contact-page #partnership .values-page #numbers .items .col-tabletL-4, .values-page #numbers .contact-page #partnership .items .col-tabletL-5, .contact-page #partnership .values-page #numbers .items .col-tabletL-5, .values-page #numbers .contact-page #partnership .items .col-tabletL-6, .contact-page #partnership .values-page #numbers .items .col-tabletL-6, .values-page #numbers .contact-page #partnership .items .col-tabletL-7, .contact-page #partnership .values-page #numbers .items .col-tabletL-7, .values-page #numbers .contact-page #partnership .items .col-tabletL-8, .contact-page #partnership .values-page #numbers .items .col-tabletL-8, .values-page #numbers .contact-page #partnership .items .col-tabletL-9, .contact-page #partnership .values-page #numbers .items .col-tabletL-9, .values-page #numbers .contact-page #partnership .items .col-tabletL-10, .contact-page #partnership .values-page #numbers .items .col-tabletL-10, .values-page #numbers .contact-page #partnership .items .col-desktopS-1, .contact-page #partnership .values-page #numbers .items .col-desktopS-1, .values-page #numbers .contact-page #partnership .items .col-desktopS-2, .contact-page #partnership .values-page #numbers .items .col-desktopS-2, .values-page #numbers .contact-page #partnership .items .col-desktopS-3, .contact-page #partnership .values-page #numbers .items .col-desktopS-3, .values-page #numbers .contact-page #partnership .items .col-desktopS-4, .contact-page #partnership .values-page #numbers .items .col-desktopS-4, .values-page #numbers .contact-page #partnership .items .col-desktopS-5, .contact-page #partnership .values-page #numbers .items .col-desktopS-5, .values-page #numbers .contact-page #partnership .items .col-desktopS-6, .contact-page #partnership .values-page #numbers .items .col-desktopS-6, .values-page #numbers .contact-page #partnership .items .col-desktopS-7, .contact-page #partnership .values-page #numbers .items .col-desktopS-7, .values-page #numbers .contact-page #partnership .items .col-desktopS-8, .contact-page #partnership .values-page #numbers .items .col-desktopS-8, .values-page #numbers .contact-page #partnership .items .col-desktopS-9, .contact-page #partnership .values-page #numbers .items .col-desktopS-9, .values-page #numbers .contact-page #partnership .items .col-desktopS-10, .contact-page #partnership .values-page #numbers .items .col-desktopS-10, .values-page #numbers .contact-page #partnership .items .col-desktopM-1, .contact-page #partnership .values-page #numbers .items .col-desktopM-1, .values-page #numbers .contact-page #partnership .items .col-desktopM-2, .contact-page #partnership .values-page #numbers .items .col-desktopM-2, .values-page #numbers .contact-page #partnership .items .col-desktopM-3, .contact-page #partnership .values-page #numbers .items .col-desktopM-3, .values-page #numbers .contact-page #partnership .items .col-desktopM-4, .contact-page #partnership .values-page #numbers .items .col-desktopM-4, .values-page #numbers .contact-page #partnership .items .col-desktopM-5, .contact-page #partnership .values-page #numbers .items .col-desktopM-5, .values-page #numbers .contact-page #partnership .items .col-desktopM-6, .contact-page #partnership .values-page #numbers .items .col-desktopM-6, .values-page #numbers .contact-page #partnership .items .col-desktopM-7, .contact-page #partnership .values-page #numbers .items .col-desktopM-7, .values-page #numbers .contact-page #partnership .items .col-desktopM-8, .contact-page #partnership .values-page #numbers .items .col-desktopM-8, .values-page #numbers .contact-page #partnership .items .col-desktopM-9, .contact-page #partnership .values-page #numbers .items .col-desktopM-9, .values-page #numbers .contact-page #partnership .items .col-desktopM-10, .contact-page #partnership .values-page #numbers .items .col-desktopM-10, .values-page #numbers .contact-page #partnership .items .col-desktopL-1, .contact-page #partnership .values-page #numbers .items .col-desktopL-1, .values-page #numbers .contact-page #partnership .items .col-desktopL-2, .contact-page #partnership .values-page #numbers .items .col-desktopL-2, .values-page #numbers .contact-page #partnership .items .col-desktopL-3, .contact-page #partnership .values-page #numbers .items .col-desktopL-3, .values-page #numbers .contact-page #partnership .items .col-desktopL-4, .contact-page #partnership .values-page #numbers .items .col-desktopL-4, .values-page #numbers .contact-page #partnership .items .col-desktopL-5, .contact-page #partnership .values-page #numbers .items .col-desktopL-5, .values-page #numbers .contact-page #partnership .items .col-desktopL-6, .contact-page #partnership .values-page #numbers .items .col-desktopL-6, .values-page #numbers .contact-page #partnership .items .col-desktopL-7, .contact-page #partnership .values-page #numbers .items .col-desktopL-7, .values-page #numbers .contact-page #partnership .items .col-desktopL-8, .contact-page #partnership .values-page #numbers .items .col-desktopL-8, .values-page #numbers .contact-page #partnership .items .col-desktopL-9, .contact-page #partnership .values-page #numbers .items .col-desktopL-9, .values-page #numbers .contact-page #partnership .items .col-desktopL-10, .contact-page #partnership .values-page #numbers .items .col-desktopL-10, .values-page #numbers .items .col-phoneS-1, .values-page .about-us-page #numbers .items .col-phoneS-1, .about-us-page .values-page #numbers .items .col-phoneS-1, .values-page #numbers .items .col-phoneS-2, .values-page .about-us-page #numbers .items .col-phoneS-2, .about-us-page .values-page #numbers .items .col-phoneS-2, .values-page #numbers .items .col-phoneS-3, .values-page .about-us-page #numbers .items .col-phoneS-3, .about-us-page .values-page #numbers .items .col-phoneS-3, .values-page #numbers .items .col-phoneS-4, .values-page .about-us-page #numbers .items .col-phoneS-4, .about-us-page .values-page #numbers .items .col-phoneS-4, .values-page #numbers .items .col-phoneS-5, .values-page .about-us-page #numbers .items .col-phoneS-5, .about-us-page .values-page #numbers .items .col-phoneS-5, .values-page #numbers .items .col-phoneS-6, .values-page .about-us-page #numbers .items .col-phoneS-6, .about-us-page .values-page #numbers .items .col-phoneS-6, .values-page #numbers .items .col-phoneS-7, .values-page .about-us-page #numbers .items .col-phoneS-7, .about-us-page .values-page #numbers .items .col-phoneS-7, .values-page #numbers .items .col-phoneS-8, .values-page .about-us-page #numbers .items .col-phoneS-8, .about-us-page .values-page #numbers .items .col-phoneS-8, .values-page #numbers .items .col-phoneS-9, .values-page .about-us-page #numbers .items .col-phoneS-9, .about-us-page .values-page #numbers .items .col-phoneS-9, .values-page #numbers .items .col-phoneS-10, .values-page .about-us-page #numbers .items .col-phoneS-10, .about-us-page .values-page #numbers .items .col-phoneS-10, .values-page #numbers .items .col-phoneL-1, .values-page .about-us-page #numbers .items .col-phoneL-1, .about-us-page .values-page #numbers .items .col-phoneL-1, .values-page #numbers .items .col-phoneL-2, .values-page .about-us-page #numbers .items .col-phoneL-2, .about-us-page .values-page #numbers .items .col-phoneL-2, .values-page #numbers .items .col-phoneL-3, .values-page .about-us-page #numbers .items .col-phoneL-3, .about-us-page .values-page #numbers .items .col-phoneL-3, .values-page #numbers .items .col-phoneL-4, .values-page .about-us-page #numbers .items .col-phoneL-4, .about-us-page .values-page #numbers .items .col-phoneL-4, .values-page #numbers .items .col-phoneL-5, .values-page .about-us-page #numbers .items .col-phoneL-5, .about-us-page .values-page #numbers .items .col-phoneL-5, .values-page #numbers .items .col-phoneL-6, .values-page .about-us-page #numbers .items .col-phoneL-6, .about-us-page .values-page #numbers .items .col-phoneL-6, .values-page #numbers .items .col-phoneL-7, .values-page .about-us-page #numbers .items .col-phoneL-7, .about-us-page .values-page #numbers .items .col-phoneL-7, .values-page #numbers .items .col-phoneL-8, .values-page .about-us-page #numbers .items .col-phoneL-8, .about-us-page .values-page #numbers .items .col-phoneL-8, .values-page #numbers .items .col-phoneL-9, .values-page .about-us-page #numbers .items .col-phoneL-9, .about-us-page .values-page #numbers .items .col-phoneL-9, .values-page #numbers .items .col-phoneL-10, .values-page .about-us-page #numbers .items .col-phoneL-10, .about-us-page .values-page #numbers .items .col-phoneL-10, .values-page #numbers .items .col-tabletP-1, .values-page .about-us-page #numbers .items .col-tabletP-1, .about-us-page .values-page #numbers .items .col-tabletP-1, .values-page #numbers .items .col-tabletP-2, .values-page .about-us-page #numbers .items .col-tabletP-2, .about-us-page .values-page #numbers .items .col-tabletP-2, .values-page #numbers .items .col-tabletP-3, .values-page .about-us-page #numbers .items .col-tabletP-3, .about-us-page .values-page #numbers .items .col-tabletP-3, .values-page #numbers .items .col-tabletP-4, .values-page .about-us-page #numbers .items .col-tabletP-4, .about-us-page .values-page #numbers .items .col-tabletP-4, .values-page #numbers .items .col-tabletP-5, .values-page .about-us-page #numbers .items .col-tabletP-5, .about-us-page .values-page #numbers .items .col-tabletP-5, .values-page #numbers .items .col-tabletP-6, .values-page .about-us-page #numbers .items .col-tabletP-6, .about-us-page .values-page #numbers .items .col-tabletP-6, .values-page #numbers .items .col-tabletP-7, .values-page .about-us-page #numbers .items .col-tabletP-7, .about-us-page .values-page #numbers .items .col-tabletP-7, .values-page #numbers .items .col-tabletP-8, .values-page .about-us-page #numbers .items .col-tabletP-8, .about-us-page .values-page #numbers .items .col-tabletP-8, .values-page #numbers .items .col-tabletP-9, .values-page .about-us-page #numbers .items .col-tabletP-9, .about-us-page .values-page #numbers .items .col-tabletP-9, .values-page #numbers .items .col-tabletP-10, .values-page .about-us-page #numbers .items .col-tabletP-10, .about-us-page .values-page #numbers .items .col-tabletP-10, .values-page #numbers .items .col-tabletL-1, .values-page .about-us-page #numbers .items .col-tabletL-1, .about-us-page .values-page #numbers .items .col-tabletL-1, .values-page #numbers .items .col-tabletL-2, .values-page .about-us-page #numbers .items .col-tabletL-2, .about-us-page .values-page #numbers .items .col-tabletL-2, .values-page #numbers .items .col-tabletL-3, .values-page .about-us-page #numbers .items .col-tabletL-3, .about-us-page .values-page #numbers .items .col-tabletL-3, .values-page #numbers .items .col-tabletL-4, .values-page .about-us-page #numbers .items .col-tabletL-4, .about-us-page .values-page #numbers .items .col-tabletL-4, .values-page #numbers .items .col-tabletL-5, .values-page .about-us-page #numbers .items .col-tabletL-5, .about-us-page .values-page #numbers .items .col-tabletL-5, .values-page #numbers .items .col-tabletL-6, .values-page .about-us-page #numbers .items .col-tabletL-6, .about-us-page .values-page #numbers .items .col-tabletL-6, .values-page #numbers .items .col-tabletL-7, .values-page .about-us-page #numbers .items .col-tabletL-7, .about-us-page .values-page #numbers .items .col-tabletL-7, .values-page #numbers .items .col-tabletL-8, .values-page .about-us-page #numbers .items .col-tabletL-8, .about-us-page .values-page #numbers .items .col-tabletL-8, .values-page #numbers .items .col-tabletL-9, .values-page .about-us-page #numbers .items .col-tabletL-9, .about-us-page .values-page #numbers .items .col-tabletL-9, .values-page #numbers .items .col-tabletL-10, .values-page .about-us-page #numbers .items .col-tabletL-10, .about-us-page .values-page #numbers .items .col-tabletL-10, .values-page #numbers .items .col-desktopS-1, .values-page .about-us-page #numbers .items .col-desktopS-1, .about-us-page .values-page #numbers .items .col-desktopS-1, .values-page #numbers .items .col-desktopS-2, .values-page .about-us-page #numbers .items .col-desktopS-2, .about-us-page .values-page #numbers .items .col-desktopS-2, .values-page #numbers .items .col-desktopS-3, .values-page .about-us-page #numbers .items .col-desktopS-3, .about-us-page .values-page #numbers .items .col-desktopS-3, .values-page #numbers .items .col-desktopS-4, .values-page .about-us-page #numbers .items .col-desktopS-4, .about-us-page .values-page #numbers .items .col-desktopS-4, .values-page #numbers .items .col-desktopS-5, .values-page .about-us-page #numbers .items .col-desktopS-5, .about-us-page .values-page #numbers .items .col-desktopS-5, .values-page #numbers .items .col-desktopS-6, .values-page .about-us-page #numbers .items .col-desktopS-6, .about-us-page .values-page #numbers .items .col-desktopS-6, .values-page #numbers .items .col-desktopS-7, .values-page .about-us-page #numbers .items .col-desktopS-7, .about-us-page .values-page #numbers .items .col-desktopS-7, .values-page #numbers .items .col-desktopS-8, .values-page .about-us-page #numbers .items .col-desktopS-8, .about-us-page .values-page #numbers .items .col-desktopS-8, .values-page #numbers .items .col-desktopS-9, .values-page .about-us-page #numbers .items .col-desktopS-9, .about-us-page .values-page #numbers .items .col-desktopS-9, .values-page #numbers .items .col-desktopS-10, .values-page .about-us-page #numbers .items .col-desktopS-10, .about-us-page .values-page #numbers .items .col-desktopS-10, .values-page #numbers .items .col-desktopM-1, .values-page .about-us-page #numbers .items .col-desktopM-1, .about-us-page .values-page #numbers .items .col-desktopM-1, .values-page #numbers .items .col-desktopM-2, .values-page .about-us-page #numbers .items .col-desktopM-2, .about-us-page .values-page #numbers .items .col-desktopM-2, .values-page #numbers .items .col-desktopM-3, .values-page .about-us-page #numbers .items .col-desktopM-3, .about-us-page .values-page #numbers .items .col-desktopM-3, .values-page #numbers .items .col-desktopM-4, .values-page .about-us-page #numbers .items .col-desktopM-4, .about-us-page .values-page #numbers .items .col-desktopM-4, .values-page #numbers .items .col-desktopM-5, .values-page .about-us-page #numbers .items .col-desktopM-5, .about-us-page .values-page #numbers .items .col-desktopM-5, .values-page #numbers .items .col-desktopM-6, .values-page .about-us-page #numbers .items .col-desktopM-6, .about-us-page .values-page #numbers .items .col-desktopM-6, .values-page #numbers .items .col-desktopM-7, .values-page .about-us-page #numbers .items .col-desktopM-7, .about-us-page .values-page #numbers .items .col-desktopM-7, .values-page #numbers .items .col-desktopM-8, .values-page .about-us-page #numbers .items .col-desktopM-8, .about-us-page .values-page #numbers .items .col-desktopM-8, .values-page #numbers .items .col-desktopM-9, .values-page .about-us-page #numbers .items .col-desktopM-9, .about-us-page .values-page #numbers .items .col-desktopM-9, .values-page #numbers .items .col-desktopM-10, .values-page .about-us-page #numbers .items .col-desktopM-10, .about-us-page .values-page #numbers .items .col-desktopM-10, .values-page #numbers .items .col-desktopL-1, .values-page .about-us-page #numbers .items .col-desktopL-1, .about-us-page .values-page #numbers .items .col-desktopL-1, .values-page #numbers .items .col-desktopL-2, .values-page .about-us-page #numbers .items .col-desktopL-2, .about-us-page .values-page #numbers .items .col-desktopL-2, .values-page #numbers .items .col-desktopL-3, .values-page .about-us-page #numbers .items .col-desktopL-3, .about-us-page .values-page #numbers .items .col-desktopL-3, .values-page #numbers .items .col-desktopL-4, .values-page .about-us-page #numbers .items .col-desktopL-4, .about-us-page .values-page #numbers .items .col-desktopL-4, .values-page #numbers .items .col-desktopL-5, .values-page .about-us-page #numbers .items .col-desktopL-5, .about-us-page .values-page #numbers .items .col-desktopL-5, .values-page #numbers .items .col-desktopL-6, .values-page .about-us-page #numbers .items .col-desktopL-6, .about-us-page .values-page #numbers .items .col-desktopL-6, .values-page #numbers .items .col-desktopL-7, .values-page .about-us-page #numbers .items .col-desktopL-7, .about-us-page .values-page #numbers .items .col-desktopL-7, .values-page #numbers .items .col-desktopL-8, .values-page .about-us-page #numbers .items .col-desktopL-8, .about-us-page .values-page #numbers .items .col-desktopL-8, .values-page #numbers .items .col-desktopL-9, .values-page .about-us-page #numbers .items .col-desktopL-9, .about-us-page .values-page #numbers .items .col-desktopL-9, .values-page #numbers .items .col-desktopL-10, .values-page .about-us-page #numbers .items .col-desktopL-10, .about-us-page .values-page #numbers .items .col-desktopL-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-10, .about-us-page #numbers .items .col-phoneS-1, .about-us-page #numbers .items .col-phoneS-2, .about-us-page #numbers .items .col-phoneS-3, .about-us-page #numbers .items .col-phoneS-4, .about-us-page #numbers .items .col-phoneS-5, .about-us-page #numbers .items .col-phoneS-6, .about-us-page #numbers .items .col-phoneS-7, .about-us-page #numbers .items .col-phoneS-8, .about-us-page #numbers .items .col-phoneS-9, .about-us-page #numbers .items .col-phoneS-10, .about-us-page #numbers .items .col-phoneS-11, .about-us-page #numbers .items .col-phoneS-12, .about-us-page #numbers .items .col-phoneL-1, .about-us-page #numbers .items .col-phoneL-2, .about-us-page #numbers .items .col-phoneL-3, .about-us-page #numbers .items .col-phoneL-4, .about-us-page #numbers .items .col-phoneL-5, .about-us-page #numbers .items .col-phoneL-6, .about-us-page #numbers .items .col-phoneL-7, .about-us-page #numbers .items .col-phoneL-8, .about-us-page #numbers .items .col-phoneL-9, .about-us-page #numbers .items .col-phoneL-10, .about-us-page #numbers .items .col-phoneL-11, .about-us-page #numbers .items .col-phoneL-12, .about-us-page #numbers .items .col-tabletP-1, .about-us-page #numbers .items .col-tabletP-2, .about-us-page #numbers .items .col-tabletP-3, .about-us-page #numbers .items .col-tabletP-4, .about-us-page #numbers .items .col-tabletP-5, .about-us-page #numbers .items .col-tabletP-6, .about-us-page #numbers .items .col-tabletP-7, .about-us-page #numbers .items .col-tabletP-8, .about-us-page #numbers .items .col-tabletP-9, .about-us-page #numbers .items .col-tabletP-10, .about-us-page #numbers .items .col-tabletP-11, .about-us-page #numbers .items .col-tabletP-12, .about-us-page #numbers .items .col-tabletL-1, .about-us-page #numbers .items .col-tabletL-2, .about-us-page #numbers .items .col-tabletL-3, .about-us-page #numbers .items .col-tabletL-4, .about-us-page #numbers .items .col-tabletL-5, .about-us-page #numbers .items .col-tabletL-6, .about-us-page #numbers .items .col-tabletL-7, .about-us-page #numbers .items .col-tabletL-8, .about-us-page #numbers .items .col-tabletL-9, .about-us-page #numbers .items .col-tabletL-10, .about-us-page #numbers .items .col-tabletL-11, .about-us-page #numbers .items .col-tabletL-12, .about-us-page #numbers .items .col-desktopS-1, .about-us-page #numbers .items .col-desktopS-2, .about-us-page #numbers .items .col-desktopS-3, .about-us-page #numbers .items .col-desktopS-4, .about-us-page #numbers .items .col-desktopS-5, .about-us-page #numbers .items .col-desktopS-6, .about-us-page #numbers .items .col-desktopS-7, .about-us-page #numbers .items .col-desktopS-8, .about-us-page #numbers .items .col-desktopS-9, .about-us-page #numbers .items .col-desktopS-10, .about-us-page #numbers .items .col-desktopS-11, .about-us-page #numbers .items .col-desktopS-12, .about-us-page #numbers .items .col-desktopM-1, .about-us-page #numbers .items .col-desktopM-2, .about-us-page #numbers .items .col-desktopM-3, .about-us-page #numbers .items .col-desktopM-4, .about-us-page #numbers .items .col-desktopM-5, .about-us-page #numbers .items .col-desktopM-6, .about-us-page #numbers .items .col-desktopM-7, .about-us-page #numbers .items .col-desktopM-8, .about-us-page #numbers .items .col-desktopM-9, .about-us-page #numbers .items .col-desktopM-10, .about-us-page #numbers .items .col-desktopM-11, .about-us-page #numbers .items .col-desktopM-12, .about-us-page #numbers .items .col-desktopL-1, .about-us-page #numbers .items .col-desktopL-2, .about-us-page #numbers .items .col-desktopL-3, .about-us-page #numbers .items .col-desktopL-4, .about-us-page #numbers .items .col-desktopL-5, .about-us-page #numbers .items .col-desktopL-6, .about-us-page #numbers .items .col-desktopL-7, .about-us-page #numbers .items .col-desktopL-8, .about-us-page #numbers .items .col-desktopL-9, .about-us-page #numbers .items .col-desktopL-10, .about-us-page #numbers .items .col-desktopL-11, .about-us-page #numbers .items .col-desktopL-12, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-1, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-1, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-2, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-2, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-3, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-3, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-4, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-4, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-5, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-5, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-6, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-6, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-7, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-7, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-8, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-8, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-9, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-9, .about-us-page #numbers .contact-page #partnership .items .col-phoneS-10, .contact-page #partnership .about-us-page #numbers .items .col-phoneS-10, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-1, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-1, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-2, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-2, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-3, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-3, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-4, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-4, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-5, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-5, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-6, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-6, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-7, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-7, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-8, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-8, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-9, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-9, .about-us-page #numbers .contact-page #partnership .items .col-phoneL-10, .contact-page #partnership .about-us-page #numbers .items .col-phoneL-10, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-1, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-1, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-2, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-2, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-3, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-3, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-4, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-4, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-5, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-5, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-6, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-6, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-7, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-7, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-8, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-8, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-9, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-9, .about-us-page #numbers .contact-page #partnership .items .col-tabletP-10, .contact-page #partnership .about-us-page #numbers .items .col-tabletP-10, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-1, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-1, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-2, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-2, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-3, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-3, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-4, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-4, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-5, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-5, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-6, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-6, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-7, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-7, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-8, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-8, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-9, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-9, .about-us-page #numbers .contact-page #partnership .items .col-tabletL-10, .contact-page #partnership .about-us-page #numbers .items .col-tabletL-10, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-1, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-1, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-2, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-2, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-3, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-3, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-4, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-4, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-5, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-5, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-6, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-6, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-7, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-7, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-8, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-8, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-9, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-9, .about-us-page #numbers .contact-page #partnership .items .col-desktopS-10, .contact-page #partnership .about-us-page #numbers .items .col-desktopS-10, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-1, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-1, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-2, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-2, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-3, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-3, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-4, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-4, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-5, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-5, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-6, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-6, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-7, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-7, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-8, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-8, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-9, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-9, .about-us-page #numbers .contact-page #partnership .items .col-desktopM-10, .contact-page #partnership .about-us-page #numbers .items .col-desktopM-10, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-1, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-1, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-2, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-2, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-3, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-3, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-4, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-4, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-5, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-5, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-6, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-6, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-7, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-7, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-8, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-8, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-9, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-9, .about-us-page #numbers .contact-page #partnership .items .col-desktopL-10, .contact-page #partnership .about-us-page #numbers .items .col-desktopL-10, .about-us-page .values-page #numbers .items .col-phoneS-1, .values-page .about-us-page #numbers .items .col-phoneS-1, .about-us-page #numbers .items .col-phoneS-1, .about-us-page .values-page #numbers .items .col-phoneS-2, .values-page .about-us-page #numbers .items .col-phoneS-2, .about-us-page #numbers .items .col-phoneS-2, .about-us-page .values-page #numbers .items .col-phoneS-3, .values-page .about-us-page #numbers .items .col-phoneS-3, .about-us-page #numbers .items .col-phoneS-3, .about-us-page .values-page #numbers .items .col-phoneS-4, .values-page .about-us-page #numbers .items .col-phoneS-4, .about-us-page #numbers .items .col-phoneS-4, .about-us-page .values-page #numbers .items .col-phoneS-5, .values-page .about-us-page #numbers .items .col-phoneS-5, .about-us-page #numbers .items .col-phoneS-5, .about-us-page .values-page #numbers .items .col-phoneS-6, .values-page .about-us-page #numbers .items .col-phoneS-6, .about-us-page #numbers .items .col-phoneS-6, .about-us-page .values-page #numbers .items .col-phoneS-7, .values-page .about-us-page #numbers .items .col-phoneS-7, .about-us-page #numbers .items .col-phoneS-7, .about-us-page .values-page #numbers .items .col-phoneS-8, .values-page .about-us-page #numbers .items .col-phoneS-8, .about-us-page #numbers .items .col-phoneS-8, .about-us-page .values-page #numbers .items .col-phoneS-9, .values-page .about-us-page #numbers .items .col-phoneS-9, .about-us-page #numbers .items .col-phoneS-9, .about-us-page .values-page #numbers .items .col-phoneS-10, .values-page .about-us-page #numbers .items .col-phoneS-10, .about-us-page #numbers .items .col-phoneS-10, .about-us-page .values-page #numbers .items .col-phoneL-1, .values-page .about-us-page #numbers .items .col-phoneL-1, .about-us-page #numbers .items .col-phoneL-1, .about-us-page .values-page #numbers .items .col-phoneL-2, .values-page .about-us-page #numbers .items .col-phoneL-2, .about-us-page #numbers .items .col-phoneL-2, .about-us-page .values-page #numbers .items .col-phoneL-3, .values-page .about-us-page #numbers .items .col-phoneL-3, .about-us-page #numbers .items .col-phoneL-3, .about-us-page .values-page #numbers .items .col-phoneL-4, .values-page .about-us-page #numbers .items .col-phoneL-4, .about-us-page #numbers .items .col-phoneL-4, .about-us-page .values-page #numbers .items .col-phoneL-5, .values-page .about-us-page #numbers .items .col-phoneL-5, .about-us-page #numbers .items .col-phoneL-5, .about-us-page .values-page #numbers .items .col-phoneL-6, .values-page .about-us-page #numbers .items .col-phoneL-6, .about-us-page #numbers .items .col-phoneL-6, .about-us-page .values-page #numbers .items .col-phoneL-7, .values-page .about-us-page #numbers .items .col-phoneL-7, .about-us-page #numbers .items .col-phoneL-7, .about-us-page .values-page #numbers .items .col-phoneL-8, .values-page .about-us-page #numbers .items .col-phoneL-8, .about-us-page #numbers .items .col-phoneL-8, .about-us-page .values-page #numbers .items .col-phoneL-9, .values-page .about-us-page #numbers .items .col-phoneL-9, .about-us-page #numbers .items .col-phoneL-9, .about-us-page .values-page #numbers .items .col-phoneL-10, .values-page .about-us-page #numbers .items .col-phoneL-10, .about-us-page #numbers .items .col-phoneL-10, .about-us-page .values-page #numbers .items .col-tabletP-1, .values-page .about-us-page #numbers .items .col-tabletP-1, .about-us-page #numbers .items .col-tabletP-1, .about-us-page .values-page #numbers .items .col-tabletP-2, .values-page .about-us-page #numbers .items .col-tabletP-2, .about-us-page #numbers .items .col-tabletP-2, .about-us-page .values-page #numbers .items .col-tabletP-3, .values-page .about-us-page #numbers .items .col-tabletP-3, .about-us-page #numbers .items .col-tabletP-3, .about-us-page .values-page #numbers .items .col-tabletP-4, .values-page .about-us-page #numbers .items .col-tabletP-4, .about-us-page #numbers .items .col-tabletP-4, .about-us-page .values-page #numbers .items .col-tabletP-5, .values-page .about-us-page #numbers .items .col-tabletP-5, .about-us-page #numbers .items .col-tabletP-5, .about-us-page .values-page #numbers .items .col-tabletP-6, .values-page .about-us-page #numbers .items .col-tabletP-6, .about-us-page #numbers .items .col-tabletP-6, .about-us-page .values-page #numbers .items .col-tabletP-7, .values-page .about-us-page #numbers .items .col-tabletP-7, .about-us-page #numbers .items .col-tabletP-7, .about-us-page .values-page #numbers .items .col-tabletP-8, .values-page .about-us-page #numbers .items .col-tabletP-8, .about-us-page #numbers .items .col-tabletP-8, .about-us-page .values-page #numbers .items .col-tabletP-9, .values-page .about-us-page #numbers .items .col-tabletP-9, .about-us-page #numbers .items .col-tabletP-9, .about-us-page .values-page #numbers .items .col-tabletP-10, .values-page .about-us-page #numbers .items .col-tabletP-10, .about-us-page #numbers .items .col-tabletP-10, .about-us-page .values-page #numbers .items .col-tabletL-1, .values-page .about-us-page #numbers .items .col-tabletL-1, .about-us-page #numbers .items .col-tabletL-1, .about-us-page .values-page #numbers .items .col-tabletL-2, .values-page .about-us-page #numbers .items .col-tabletL-2, .about-us-page #numbers .items .col-tabletL-2, .about-us-page .values-page #numbers .items .col-tabletL-3, .values-page .about-us-page #numbers .items .col-tabletL-3, .about-us-page #numbers .items .col-tabletL-3, .about-us-page .values-page #numbers .items .col-tabletL-4, .values-page .about-us-page #numbers .items .col-tabletL-4, .about-us-page #numbers .items .col-tabletL-4, .about-us-page .values-page #numbers .items .col-tabletL-5, .values-page .about-us-page #numbers .items .col-tabletL-5, .about-us-page #numbers .items .col-tabletL-5, .about-us-page .values-page #numbers .items .col-tabletL-6, .values-page .about-us-page #numbers .items .col-tabletL-6, .about-us-page #numbers .items .col-tabletL-6, .about-us-page .values-page #numbers .items .col-tabletL-7, .values-page .about-us-page #numbers .items .col-tabletL-7, .about-us-page #numbers .items .col-tabletL-7, .about-us-page .values-page #numbers .items .col-tabletL-8, .values-page .about-us-page #numbers .items .col-tabletL-8, .about-us-page #numbers .items .col-tabletL-8, .about-us-page .values-page #numbers .items .col-tabletL-9, .values-page .about-us-page #numbers .items .col-tabletL-9, .about-us-page #numbers .items .col-tabletL-9, .about-us-page .values-page #numbers .items .col-tabletL-10, .values-page .about-us-page #numbers .items .col-tabletL-10, .about-us-page #numbers .items .col-tabletL-10, .about-us-page .values-page #numbers .items .col-desktopS-1, .values-page .about-us-page #numbers .items .col-desktopS-1, .about-us-page #numbers .items .col-desktopS-1, .about-us-page .values-page #numbers .items .col-desktopS-2, .values-page .about-us-page #numbers .items .col-desktopS-2, .about-us-page #numbers .items .col-desktopS-2, .about-us-page .values-page #numbers .items .col-desktopS-3, .values-page .about-us-page #numbers .items .col-desktopS-3, .about-us-page #numbers .items .col-desktopS-3, .about-us-page .values-page #numbers .items .col-desktopS-4, .values-page .about-us-page #numbers .items .col-desktopS-4, .about-us-page #numbers .items .col-desktopS-4, .about-us-page .values-page #numbers .items .col-desktopS-5, .values-page .about-us-page #numbers .items .col-desktopS-5, .about-us-page #numbers .items .col-desktopS-5, .about-us-page .values-page #numbers .items .col-desktopS-6, .values-page .about-us-page #numbers .items .col-desktopS-6, .about-us-page #numbers .items .col-desktopS-6, .about-us-page .values-page #numbers .items .col-desktopS-7, .values-page .about-us-page #numbers .items .col-desktopS-7, .about-us-page #numbers .items .col-desktopS-7, .about-us-page .values-page #numbers .items .col-desktopS-8, .values-page .about-us-page #numbers .items .col-desktopS-8, .about-us-page #numbers .items .col-desktopS-8, .about-us-page .values-page #numbers .items .col-desktopS-9, .values-page .about-us-page #numbers .items .col-desktopS-9, .about-us-page #numbers .items .col-desktopS-9, .about-us-page .values-page #numbers .items .col-desktopS-10, .values-page .about-us-page #numbers .items .col-desktopS-10, .about-us-page #numbers .items .col-desktopS-10, .about-us-page .values-page #numbers .items .col-desktopM-1, .values-page .about-us-page #numbers .items .col-desktopM-1, .about-us-page #numbers .items .col-desktopM-1, .about-us-page .values-page #numbers .items .col-desktopM-2, .values-page .about-us-page #numbers .items .col-desktopM-2, .about-us-page #numbers .items .col-desktopM-2, .about-us-page .values-page #numbers .items .col-desktopM-3, .values-page .about-us-page #numbers .items .col-desktopM-3, .about-us-page #numbers .items .col-desktopM-3, .about-us-page .values-page #numbers .items .col-desktopM-4, .values-page .about-us-page #numbers .items .col-desktopM-4, .about-us-page #numbers .items .col-desktopM-4, .about-us-page .values-page #numbers .items .col-desktopM-5, .values-page .about-us-page #numbers .items .col-desktopM-5, .about-us-page #numbers .items .col-desktopM-5, .about-us-page .values-page #numbers .items .col-desktopM-6, .values-page .about-us-page #numbers .items .col-desktopM-6, .about-us-page #numbers .items .col-desktopM-6, .about-us-page .values-page #numbers .items .col-desktopM-7, .values-page .about-us-page #numbers .items .col-desktopM-7, .about-us-page #numbers .items .col-desktopM-7, .about-us-page .values-page #numbers .items .col-desktopM-8, .values-page .about-us-page #numbers .items .col-desktopM-8, .about-us-page #numbers .items .col-desktopM-8, .about-us-page .values-page #numbers .items .col-desktopM-9, .values-page .about-us-page #numbers .items .col-desktopM-9, .about-us-page #numbers .items .col-desktopM-9, .about-us-page .values-page #numbers .items .col-desktopM-10, .values-page .about-us-page #numbers .items .col-desktopM-10, .about-us-page #numbers .items .col-desktopM-10, .about-us-page .values-page #numbers .items .col-desktopL-1, .values-page .about-us-page #numbers .items .col-desktopL-1, .about-us-page #numbers .items .col-desktopL-1, .about-us-page .values-page #numbers .items .col-desktopL-2, .values-page .about-us-page #numbers .items .col-desktopL-2, .about-us-page #numbers .items .col-desktopL-2, .about-us-page .values-page #numbers .items .col-desktopL-3, .values-page .about-us-page #numbers .items .col-desktopL-3, .about-us-page #numbers .items .col-desktopL-3, .about-us-page .values-page #numbers .items .col-desktopL-4, .values-page .about-us-page #numbers .items .col-desktopL-4, .about-us-page #numbers .items .col-desktopL-4, .about-us-page .values-page #numbers .items .col-desktopL-5, .values-page .about-us-page #numbers .items .col-desktopL-5, .about-us-page #numbers .items .col-desktopL-5, .about-us-page .values-page #numbers .items .col-desktopL-6, .values-page .about-us-page #numbers .items .col-desktopL-6, .about-us-page #numbers .items .col-desktopL-6, .about-us-page .values-page #numbers .items .col-desktopL-7, .values-page .about-us-page #numbers .items .col-desktopL-7, .about-us-page #numbers .items .col-desktopL-7, .about-us-page .values-page #numbers .items .col-desktopL-8, .values-page .about-us-page #numbers .items .col-desktopL-8, .about-us-page #numbers .items .col-desktopL-8, .about-us-page .values-page #numbers .items .col-desktopL-9, .values-page .about-us-page #numbers .items .col-desktopL-9, .about-us-page #numbers .items .col-desktopL-9, .about-us-page .values-page #numbers .items .col-desktopL-10, .values-page .about-us-page #numbers .items .col-desktopL-10, .about-us-page #numbers .items .col-desktopL-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-10 { position: relative; min-height: 1px; padding-right: 5px; padding-left: 5px; width: 100%; } .values-page #numbers .items .col-phoneS, .about-us-page #numbers .items .col-phoneS { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .values-page #numbers .items .col-phoneS-1, .about-us-page #numbers .items .col-phoneS-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .values-page #numbers .items .col-phoneS-2, .about-us-page #numbers .items .col-phoneS-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .values-page #numbers .items .col-phoneS-3, .about-us-page #numbers .items .col-phoneS-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .values-page #numbers .items .col-phoneS-4, .about-us-page #numbers .items .col-phoneS-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .values-page #numbers .items .col-phoneS-5, .about-us-page #numbers .items .col-phoneS-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .values-page #numbers .items .col-phoneS-6, .about-us-page #numbers .items .col-phoneS-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .values-page #numbers .items .col-phoneS-7, .about-us-page #numbers .items .col-phoneS-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .values-page #numbers .items .col-phoneS-8, .about-us-page #numbers .items .col-phoneS-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .values-page #numbers .items .col-phoneS-9, .about-us-page #numbers .items .col-phoneS-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .values-page #numbers .items .col-phoneS-10, .about-us-page #numbers .items .col-phoneS-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .values-page #numbers .items .pull-phoneS-0, .about-us-page #numbers .items .pull-phoneS-0 { right: auto; } .values-page #numbers .items .pull-phoneS-1, .about-us-page #numbers .items .pull-phoneS-1 { right: 10%; } .values-page #numbers .items .pull-phoneS-2, .about-us-page #numbers .items .pull-phoneS-2 { right: 20%; } .values-page #numbers .items .pull-phoneS-3, .about-us-page #numbers .items .pull-phoneS-3 { right: 30%; } .values-page #numbers .items .pull-phoneS-4, .about-us-page #numbers .items .pull-phoneS-4 { right: 40%; } .values-page #numbers .items .pull-phoneS-5, .about-us-page #numbers .items .pull-phoneS-5 { right: 50%; } .values-page #numbers .items .pull-phoneS-6, .about-us-page #numbers .items .pull-phoneS-6 { right: 60%; } .values-page #numbers .items .pull-phoneS-7, .about-us-page #numbers .items .pull-phoneS-7 { right: 70%; } .values-page #numbers .items .pull-phoneS-8, .about-us-page #numbers .items .pull-phoneS-8 { right: 80%; } .values-page #numbers .items .pull-phoneS-9, .about-us-page #numbers .items .pull-phoneS-9 { right: 90%; } .values-page #numbers .items .pull-phoneS-10, .about-us-page #numbers .items .pull-phoneS-10 { right: 100%; } .values-page #numbers .items .push-phoneS-0, .about-us-page #numbers .items .push-phoneS-0 { left: auto; } .values-page #numbers .items .push-phoneS-1, .about-us-page #numbers .items .push-phoneS-1 { left: 10%; } .values-page #numbers .items .push-phoneS-2, .about-us-page #numbers .items .push-phoneS-2 { left: 20%; } .values-page #numbers .items .push-phoneS-3, .about-us-page #numbers .items .push-phoneS-3 { left: 30%; } .values-page #numbers .items .push-phoneS-4, .about-us-page #numbers .items .push-phoneS-4 { left: 40%; } .values-page #numbers .items .push-phoneS-5, .about-us-page #numbers .items .push-phoneS-5 { left: 50%; } .values-page #numbers .items .push-phoneS-6, .about-us-page #numbers .items .push-phoneS-6 { left: 60%; } .values-page #numbers .items .push-phoneS-7, .about-us-page #numbers .items .push-phoneS-7 { left: 70%; } .values-page #numbers .items .push-phoneS-8, .about-us-page #numbers .items .push-phoneS-8 { left: 80%; } .values-page #numbers .items .push-phoneS-9, .about-us-page #numbers .items .push-phoneS-9 { left: 90%; } .values-page #numbers .items .push-phoneS-10, .about-us-page #numbers .items .push-phoneS-10 { left: 100%; } .values-page #numbers .items .offset-phoneS-1, .about-us-page #numbers .items .offset-phoneS-1 { margin-left: 10%; } .values-page #numbers .items .offset-phoneS-2, .about-us-page #numbers .items .offset-phoneS-2 { margin-left: 20%; } .values-page #numbers .items .offset-phoneS-3, .about-us-page #numbers .items .offset-phoneS-3 { margin-left: 30%; } .values-page #numbers .items .offset-phoneS-4, .about-us-page #numbers .items .offset-phoneS-4 { margin-left: 40%; } .values-page #numbers .items .offset-phoneS-5, .about-us-page #numbers .items .offset-phoneS-5 { margin-left: 50%; } .values-page #numbers .items .offset-phoneS-6, .about-us-page #numbers .items .offset-phoneS-6 { margin-left: 60%; } .values-page #numbers .items .offset-phoneS-7, .about-us-page #numbers .items .offset-phoneS-7 { margin-left: 70%; } .values-page #numbers .items .offset-phoneS-8, .about-us-page #numbers .items .offset-phoneS-8 { margin-left: 80%; } .values-page #numbers .items .offset-phoneS-9, .about-us-page #numbers .items .offset-phoneS-9 { margin-left: 90%; } @media (min-width: 544px) { .values-page #numbers .items .col-phoneL, .about-us-page #numbers .items .col-phoneL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .values-page #numbers .items .col-phoneL-1, .about-us-page #numbers .items .col-phoneL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .values-page #numbers .items .col-phoneL-2, .about-us-page #numbers .items .col-phoneL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .values-page #numbers .items .col-phoneL-3, .about-us-page #numbers .items .col-phoneL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .values-page #numbers .items .col-phoneL-4, .about-us-page #numbers .items .col-phoneL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .values-page #numbers .items .col-phoneL-5, .about-us-page #numbers .items .col-phoneL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .values-page #numbers .items .col-phoneL-6, .about-us-page #numbers .items .col-phoneL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .values-page #numbers .items .col-phoneL-7, .about-us-page #numbers .items .col-phoneL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .values-page #numbers .items .col-phoneL-8, .about-us-page #numbers .items .col-phoneL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .values-page #numbers .items .col-phoneL-9, .about-us-page #numbers .items .col-phoneL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .values-page #numbers .items .col-phoneL-10, .about-us-page #numbers .items .col-phoneL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .values-page #numbers .items .pull-phoneL-0, .about-us-page #numbers .items .pull-phoneL-0 { right: auto; } .values-page #numbers .items .pull-phoneL-1, .about-us-page #numbers .items .pull-phoneL-1 { right: 10%; } .values-page #numbers .items .pull-phoneL-2, .about-us-page #numbers .items .pull-phoneL-2 { right: 20%; } .values-page #numbers .items .pull-phoneL-3, .about-us-page #numbers .items .pull-phoneL-3 { right: 30%; } .values-page #numbers .items .pull-phoneL-4, .about-us-page #numbers .items .pull-phoneL-4 { right: 40%; } .values-page #numbers .items .pull-phoneL-5, .about-us-page #numbers .items .pull-phoneL-5 { right: 50%; } .values-page #numbers .items .pull-phoneL-6, .about-us-page #numbers .items .pull-phoneL-6 { right: 60%; } .values-page #numbers .items .pull-phoneL-7, .about-us-page #numbers .items .pull-phoneL-7 { right: 70%; } .values-page #numbers .items .pull-phoneL-8, .about-us-page #numbers .items .pull-phoneL-8 { right: 80%; } .values-page #numbers .items .pull-phoneL-9, .about-us-page #numbers .items .pull-phoneL-9 { right: 90%; } .values-page #numbers .items .pull-phoneL-10, .about-us-page #numbers .items .pull-phoneL-10 { right: 100%; } .values-page #numbers .items .push-phoneL-0, .about-us-page #numbers .items .push-phoneL-0 { left: auto; } .values-page #numbers .items .push-phoneL-1, .about-us-page #numbers .items .push-phoneL-1 { left: 10%; } .values-page #numbers .items .push-phoneL-2, .about-us-page #numbers .items .push-phoneL-2 { left: 20%; } .values-page #numbers .items .push-phoneL-3, .about-us-page #numbers .items .push-phoneL-3 { left: 30%; } .values-page #numbers .items .push-phoneL-4, .about-us-page #numbers .items .push-phoneL-4 { left: 40%; } .values-page #numbers .items .push-phoneL-5, .about-us-page #numbers .items .push-phoneL-5 { left: 50%; } .values-page #numbers .items .push-phoneL-6, .about-us-page #numbers .items .push-phoneL-6 { left: 60%; } .values-page #numbers .items .push-phoneL-7, .about-us-page #numbers .items .push-phoneL-7 { left: 70%; } .values-page #numbers .items .push-phoneL-8, .about-us-page #numbers .items .push-phoneL-8 { left: 80%; } .values-page #numbers .items .push-phoneL-9, .about-us-page #numbers .items .push-phoneL-9 { left: 90%; } .values-page #numbers .items .push-phoneL-10, .about-us-page #numbers .items .push-phoneL-10 { left: 100%; } .values-page #numbers .items .offset-phoneL-0, .about-us-page #numbers .items .offset-phoneL-0 { margin-left: 0%; } .values-page #numbers .items .offset-phoneL-1, .about-us-page #numbers .items .offset-phoneL-1 { margin-left: 10%; } .values-page #numbers .items .offset-phoneL-2, .about-us-page #numbers .items .offset-phoneL-2 { margin-left: 20%; } .values-page #numbers .items .offset-phoneL-3, .about-us-page #numbers .items .offset-phoneL-3 { margin-left: 30%; } .values-page #numbers .items .offset-phoneL-4, .about-us-page #numbers .items .offset-phoneL-4 { margin-left: 40%; } .values-page #numbers .items .offset-phoneL-5, .about-us-page #numbers .items .offset-phoneL-5 { margin-left: 50%; } .values-page #numbers .items .offset-phoneL-6, .about-us-page #numbers .items .offset-phoneL-6 { margin-left: 60%; } .values-page #numbers .items .offset-phoneL-7, .about-us-page #numbers .items .offset-phoneL-7 { margin-left: 70%; } .values-page #numbers .items .offset-phoneL-8, .about-us-page #numbers .items .offset-phoneL-8 { margin-left: 80%; } .values-page #numbers .items .offset-phoneL-9, .about-us-page #numbers .items .offset-phoneL-9 { margin-left: 90%; } } @media (min-width: 768px) { .values-page #numbers .items .col-tabletP, .about-us-page #numbers .items .col-tabletP { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .values-page #numbers .items .col-tabletP-1, .about-us-page #numbers .items .col-tabletP-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .values-page #numbers .items .col-tabletP-2, .about-us-page #numbers .items .col-tabletP-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .values-page #numbers .items .col-tabletP-3, .about-us-page #numbers .items .col-tabletP-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .values-page #numbers .items .col-tabletP-4, .about-us-page #numbers .items .col-tabletP-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .values-page #numbers .items .col-tabletP-5, .about-us-page #numbers .items .col-tabletP-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .values-page #numbers .items .col-tabletP-6, .about-us-page #numbers .items .col-tabletP-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .values-page #numbers .items .col-tabletP-7, .about-us-page #numbers .items .col-tabletP-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .values-page #numbers .items .col-tabletP-8, .about-us-page #numbers .items .col-tabletP-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .values-page #numbers .items .col-tabletP-9, .about-us-page #numbers .items .col-tabletP-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .values-page #numbers .items .col-tabletP-10, .about-us-page #numbers .items .col-tabletP-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .values-page #numbers .items .pull-tabletP-0, .about-us-page #numbers .items .pull-tabletP-0 { right: auto; } .values-page #numbers .items .pull-tabletP-1, .about-us-page #numbers .items .pull-tabletP-1 { right: 10%; } .values-page #numbers .items .pull-tabletP-2, .about-us-page #numbers .items .pull-tabletP-2 { right: 20%; } .values-page #numbers .items .pull-tabletP-3, .about-us-page #numbers .items .pull-tabletP-3 { right: 30%; } .values-page #numbers .items .pull-tabletP-4, .about-us-page #numbers .items .pull-tabletP-4 { right: 40%; } .values-page #numbers .items .pull-tabletP-5, .about-us-page #numbers .items .pull-tabletP-5 { right: 50%; } .values-page #numbers .items .pull-tabletP-6, .about-us-page #numbers .items .pull-tabletP-6 { right: 60%; } .values-page #numbers .items .pull-tabletP-7, .about-us-page #numbers .items .pull-tabletP-7 { right: 70%; } .values-page #numbers .items .pull-tabletP-8, .about-us-page #numbers .items .pull-tabletP-8 { right: 80%; } .values-page #numbers .items .pull-tabletP-9, .about-us-page #numbers .items .pull-tabletP-9 { right: 90%; } .values-page #numbers .items .pull-tabletP-10, .about-us-page #numbers .items .pull-tabletP-10 { right: 100%; } .values-page #numbers .items .push-tabletP-0, .about-us-page #numbers .items .push-tabletP-0 { left: auto; } .values-page #numbers .items .push-tabletP-1, .about-us-page #numbers .items .push-tabletP-1 { left: 10%; } .values-page #numbers .items .push-tabletP-2, .about-us-page #numbers .items .push-tabletP-2 { left: 20%; } .values-page #numbers .items .push-tabletP-3, .about-us-page #numbers .items .push-tabletP-3 { left: 30%; } .values-page #numbers .items .push-tabletP-4, .about-us-page #numbers .items .push-tabletP-4 { left: 40%; } .values-page #numbers .items .push-tabletP-5, .about-us-page #numbers .items .push-tabletP-5 { left: 50%; } .values-page #numbers .items .push-tabletP-6, .about-us-page #numbers .items .push-tabletP-6 { left: 60%; } .values-page #numbers .items .push-tabletP-7, .about-us-page #numbers .items .push-tabletP-7 { left: 70%; } .values-page #numbers .items .push-tabletP-8, .about-us-page #numbers .items .push-tabletP-8 { left: 80%; } .values-page #numbers .items .push-tabletP-9, .about-us-page #numbers .items .push-tabletP-9 { left: 90%; } .values-page #numbers .items .push-tabletP-10, .about-us-page #numbers .items .push-tabletP-10 { left: 100%; } .values-page #numbers .items .offset-tabletP-0, .about-us-page #numbers .items .offset-tabletP-0 { margin-left: 0%; } .values-page #numbers .items .offset-tabletP-1, .about-us-page #numbers .items .offset-tabletP-1 { margin-left: 10%; } .values-page #numbers .items .offset-tabletP-2, .about-us-page #numbers .items .offset-tabletP-2 { margin-left: 20%; } .values-page #numbers .items .offset-tabletP-3, .about-us-page #numbers .items .offset-tabletP-3 { margin-left: 30%; } .values-page #numbers .items .offset-tabletP-4, .about-us-page #numbers .items .offset-tabletP-4 { margin-left: 40%; } .values-page #numbers .items .offset-tabletP-5, .about-us-page #numbers .items .offset-tabletP-5 { margin-left: 50%; } .values-page #numbers .items .offset-tabletP-6, .about-us-page #numbers .items .offset-tabletP-6 { margin-left: 60%; } .values-page #numbers .items .offset-tabletP-7, .about-us-page #numbers .items .offset-tabletP-7 { margin-left: 70%; } .values-page #numbers .items .offset-tabletP-8, .about-us-page #numbers .items .offset-tabletP-8 { margin-left: 80%; } .values-page #numbers .items .offset-tabletP-9, .about-us-page #numbers .items .offset-tabletP-9 { margin-left: 90%; } } @media (min-width: 992px) { .values-page #numbers .items .col-tabletL, .about-us-page #numbers .items .col-tabletL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .values-page #numbers .items .col-tabletL-1, .about-us-page #numbers .items .col-tabletL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .values-page #numbers .items .col-tabletL-2, .about-us-page #numbers .items .col-tabletL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .values-page #numbers .items .col-tabletL-3, .about-us-page #numbers .items .col-tabletL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .values-page #numbers .items .col-tabletL-4, .about-us-page #numbers .items .col-tabletL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .values-page #numbers .items .col-tabletL-5, .about-us-page #numbers .items .col-tabletL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .values-page #numbers .items .col-tabletL-6, .about-us-page #numbers .items .col-tabletL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .values-page #numbers .items .col-tabletL-7, .about-us-page #numbers .items .col-tabletL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .values-page #numbers .items .col-tabletL-8, .about-us-page #numbers .items .col-tabletL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .values-page #numbers .items .col-tabletL-9, .about-us-page #numbers .items .col-tabletL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .values-page #numbers .items .col-tabletL-10, .about-us-page #numbers .items .col-tabletL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .values-page #numbers .items .pull-tabletL-0, .about-us-page #numbers .items .pull-tabletL-0 { right: auto; } .values-page #numbers .items .pull-tabletL-1, .about-us-page #numbers .items .pull-tabletL-1 { right: 10%; } .values-page #numbers .items .pull-tabletL-2, .about-us-page #numbers .items .pull-tabletL-2 { right: 20%; } .values-page #numbers .items .pull-tabletL-3, .about-us-page #numbers .items .pull-tabletL-3 { right: 30%; } .values-page #numbers .items .pull-tabletL-4, .about-us-page #numbers .items .pull-tabletL-4 { right: 40%; } .values-page #numbers .items .pull-tabletL-5, .about-us-page #numbers .items .pull-tabletL-5 { right: 50%; } .values-page #numbers .items .pull-tabletL-6, .about-us-page #numbers .items .pull-tabletL-6 { right: 60%; } .values-page #numbers .items .pull-tabletL-7, .about-us-page #numbers .items .pull-tabletL-7 { right: 70%; } .values-page #numbers .items .pull-tabletL-8, .about-us-page #numbers .items .pull-tabletL-8 { right: 80%; } .values-page #numbers .items .pull-tabletL-9, .about-us-page #numbers .items .pull-tabletL-9 { right: 90%; } .values-page #numbers .items .pull-tabletL-10, .about-us-page #numbers .items .pull-tabletL-10 { right: 100%; } .values-page #numbers .items .push-tabletL-0, .about-us-page #numbers .items .push-tabletL-0 { left: auto; } .values-page #numbers .items .push-tabletL-1, .about-us-page #numbers .items .push-tabletL-1 { left: 10%; } .values-page #numbers .items .push-tabletL-2, .about-us-page #numbers .items .push-tabletL-2 { left: 20%; } .values-page #numbers .items .push-tabletL-3, .about-us-page #numbers .items .push-tabletL-3 { left: 30%; } .values-page #numbers .items .push-tabletL-4, .about-us-page #numbers .items .push-tabletL-4 { left: 40%; } .values-page #numbers .items .push-tabletL-5, .about-us-page #numbers .items .push-tabletL-5 { left: 50%; } .values-page #numbers .items .push-tabletL-6, .about-us-page #numbers .items .push-tabletL-6 { left: 60%; } .values-page #numbers .items .push-tabletL-7, .about-us-page #numbers .items .push-tabletL-7 { left: 70%; } .values-page #numbers .items .push-tabletL-8, .about-us-page #numbers .items .push-tabletL-8 { left: 80%; } .values-page #numbers .items .push-tabletL-9, .about-us-page #numbers .items .push-tabletL-9 { left: 90%; } .values-page #numbers .items .push-tabletL-10, .about-us-page #numbers .items .push-tabletL-10 { left: 100%; } .values-page #numbers .items .offset-tabletL-0, .about-us-page #numbers .items .offset-tabletL-0 { margin-left: 0%; } .values-page #numbers .items .offset-tabletL-1, .about-us-page #numbers .items .offset-tabletL-1 { margin-left: 10%; } .values-page #numbers .items .offset-tabletL-2, .about-us-page #numbers .items .offset-tabletL-2 { margin-left: 20%; } .values-page #numbers .items .offset-tabletL-3, .about-us-page #numbers .items .offset-tabletL-3 { margin-left: 30%; } .values-page #numbers .items .offset-tabletL-4, .about-us-page #numbers .items .offset-tabletL-4 { margin-left: 40%; } .values-page #numbers .items .offset-tabletL-5, .about-us-page #numbers .items .offset-tabletL-5 { margin-left: 50%; } .values-page #numbers .items .offset-tabletL-6, .about-us-page #numbers .items .offset-tabletL-6 { margin-left: 60%; } .values-page #numbers .items .offset-tabletL-7, .about-us-page #numbers .items .offset-tabletL-7 { margin-left: 70%; } .values-page #numbers .items .offset-tabletL-8, .about-us-page #numbers .items .offset-tabletL-8 { margin-left: 80%; } .values-page #numbers .items .offset-tabletL-9, .about-us-page #numbers .items .offset-tabletL-9 { margin-left: 90%; } } @media (min-width: 1200px) { .values-page #numbers .items .col-desktopS, .about-us-page #numbers .items .col-desktopS { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .values-page #numbers .items .col-desktopS-1, .about-us-page #numbers .items .col-desktopS-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .values-page #numbers .items .col-desktopS-2, .about-us-page #numbers .items .col-desktopS-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .values-page #numbers .items .col-desktopS-3, .about-us-page #numbers .items .col-desktopS-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .values-page #numbers .items .col-desktopS-4, .about-us-page #numbers .items .col-desktopS-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .values-page #numbers .items .col-desktopS-5, .about-us-page #numbers .items .col-desktopS-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .values-page #numbers .items .col-desktopS-6, .about-us-page #numbers .items .col-desktopS-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .values-page #numbers .items .col-desktopS-7, .about-us-page #numbers .items .col-desktopS-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .values-page #numbers .items .col-desktopS-8, .about-us-page #numbers .items .col-desktopS-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .values-page #numbers .items .col-desktopS-9, .about-us-page #numbers .items .col-desktopS-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .values-page #numbers .items .col-desktopS-10, .about-us-page #numbers .items .col-desktopS-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .values-page #numbers .items .pull-desktopS-0, .about-us-page #numbers .items .pull-desktopS-0 { right: auto; } .values-page #numbers .items .pull-desktopS-1, .about-us-page #numbers .items .pull-desktopS-1 { right: 10%; } .values-page #numbers .items .pull-desktopS-2, .about-us-page #numbers .items .pull-desktopS-2 { right: 20%; } .values-page #numbers .items .pull-desktopS-3, .about-us-page #numbers .items .pull-desktopS-3 { right: 30%; } .values-page #numbers .items .pull-desktopS-4, .about-us-page #numbers .items .pull-desktopS-4 { right: 40%; } .values-page #numbers .items .pull-desktopS-5, .about-us-page #numbers .items .pull-desktopS-5 { right: 50%; } .values-page #numbers .items .pull-desktopS-6, .about-us-page #numbers .items .pull-desktopS-6 { right: 60%; } .values-page #numbers .items .pull-desktopS-7, .about-us-page #numbers .items .pull-desktopS-7 { right: 70%; } .values-page #numbers .items .pull-desktopS-8, .about-us-page #numbers .items .pull-desktopS-8 { right: 80%; } .values-page #numbers .items .pull-desktopS-9, .about-us-page #numbers .items .pull-desktopS-9 { right: 90%; } .values-page #numbers .items .pull-desktopS-10, .about-us-page #numbers .items .pull-desktopS-10 { right: 100%; } .values-page #numbers .items .push-desktopS-0, .about-us-page #numbers .items .push-desktopS-0 { left: auto; } .values-page #numbers .items .push-desktopS-1, .about-us-page #numbers .items .push-desktopS-1 { left: 10%; } .values-page #numbers .items .push-desktopS-2, .about-us-page #numbers .items .push-desktopS-2 { left: 20%; } .values-page #numbers .items .push-desktopS-3, .about-us-page #numbers .items .push-desktopS-3 { left: 30%; } .values-page #numbers .items .push-desktopS-4, .about-us-page #numbers .items .push-desktopS-4 { left: 40%; } .values-page #numbers .items .push-desktopS-5, .about-us-page #numbers .items .push-desktopS-5 { left: 50%; } .values-page #numbers .items .push-desktopS-6, .about-us-page #numbers .items .push-desktopS-6 { left: 60%; } .values-page #numbers .items .push-desktopS-7, .about-us-page #numbers .items .push-desktopS-7 { left: 70%; } .values-page #numbers .items .push-desktopS-8, .about-us-page #numbers .items .push-desktopS-8 { left: 80%; } .values-page #numbers .items .push-desktopS-9, .about-us-page #numbers .items .push-desktopS-9 { left: 90%; } .values-page #numbers .items .push-desktopS-10, .about-us-page #numbers .items .push-desktopS-10 { left: 100%; } .values-page #numbers .items .offset-desktopS-0, .about-us-page #numbers .items .offset-desktopS-0 { margin-left: 0%; } .values-page #numbers .items .offset-desktopS-1, .about-us-page #numbers .items .offset-desktopS-1 { margin-left: 10%; } .values-page #numbers .items .offset-desktopS-2, .about-us-page #numbers .items .offset-desktopS-2 { margin-left: 20%; } .values-page #numbers .items .offset-desktopS-3, .about-us-page #numbers .items .offset-desktopS-3 { margin-left: 30%; } .values-page #numbers .items .offset-desktopS-4, .about-us-page #numbers .items .offset-desktopS-4 { margin-left: 40%; } .values-page #numbers .items .offset-desktopS-5, .about-us-page #numbers .items .offset-desktopS-5 { margin-left: 50%; } .values-page #numbers .items .offset-desktopS-6, .about-us-page #numbers .items .offset-desktopS-6 { margin-left: 60%; } .values-page #numbers .items .offset-desktopS-7, .about-us-page #numbers .items .offset-desktopS-7 { margin-left: 70%; } .values-page #numbers .items .offset-desktopS-8, .about-us-page #numbers .items .offset-desktopS-8 { margin-left: 80%; } .values-page #numbers .items .offset-desktopS-9, .about-us-page #numbers .items .offset-desktopS-9 { margin-left: 90%; } } @media (min-width: 1600px) { .values-page #numbers .items .col-desktopM, .about-us-page #numbers .items .col-desktopM { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .values-page #numbers .items .col-desktopM-1, .about-us-page #numbers .items .col-desktopM-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .values-page #numbers .items .col-desktopM-2, .about-us-page #numbers .items .col-desktopM-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .values-page #numbers .items .col-desktopM-3, .about-us-page #numbers .items .col-desktopM-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .values-page #numbers .items .col-desktopM-4, .about-us-page #numbers .items .col-desktopM-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .values-page #numbers .items .col-desktopM-5, .about-us-page #numbers .items .col-desktopM-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .values-page #numbers .items .col-desktopM-6, .about-us-page #numbers .items .col-desktopM-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .values-page #numbers .items .col-desktopM-7, .about-us-page #numbers .items .col-desktopM-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .values-page #numbers .items .col-desktopM-8, .about-us-page #numbers .items .col-desktopM-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .values-page #numbers .items .col-desktopM-9, .about-us-page #numbers .items .col-desktopM-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .values-page #numbers .items .col-desktopM-10, .about-us-page #numbers .items .col-desktopM-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .values-page #numbers .items .pull-desktopM-0, .about-us-page #numbers .items .pull-desktopM-0 { right: auto; } .values-page #numbers .items .pull-desktopM-1, .about-us-page #numbers .items .pull-desktopM-1 { right: 10%; } .values-page #numbers .items .pull-desktopM-2, .about-us-page #numbers .items .pull-desktopM-2 { right: 20%; } .values-page #numbers .items .pull-desktopM-3, .about-us-page #numbers .items .pull-desktopM-3 { right: 30%; } .values-page #numbers .items .pull-desktopM-4, .about-us-page #numbers .items .pull-desktopM-4 { right: 40%; } .values-page #numbers .items .pull-desktopM-5, .about-us-page #numbers .items .pull-desktopM-5 { right: 50%; } .values-page #numbers .items .pull-desktopM-6, .about-us-page #numbers .items .pull-desktopM-6 { right: 60%; } .values-page #numbers .items .pull-desktopM-7, .about-us-page #numbers .items .pull-desktopM-7 { right: 70%; } .values-page #numbers .items .pull-desktopM-8, .about-us-page #numbers .items .pull-desktopM-8 { right: 80%; } .values-page #numbers .items .pull-desktopM-9, .about-us-page #numbers .items .pull-desktopM-9 { right: 90%; } .values-page #numbers .items .pull-desktopM-10, .about-us-page #numbers .items .pull-desktopM-10 { right: 100%; } .values-page #numbers .items .push-desktopM-0, .about-us-page #numbers .items .push-desktopM-0 { left: auto; } .values-page #numbers .items .push-desktopM-1, .about-us-page #numbers .items .push-desktopM-1 { left: 10%; } .values-page #numbers .items .push-desktopM-2, .about-us-page #numbers .items .push-desktopM-2 { left: 20%; } .values-page #numbers .items .push-desktopM-3, .about-us-page #numbers .items .push-desktopM-3 { left: 30%; } .values-page #numbers .items .push-desktopM-4, .about-us-page #numbers .items .push-desktopM-4 { left: 40%; } .values-page #numbers .items .push-desktopM-5, .about-us-page #numbers .items .push-desktopM-5 { left: 50%; } .values-page #numbers .items .push-desktopM-6, .about-us-page #numbers .items .push-desktopM-6 { left: 60%; } .values-page #numbers .items .push-desktopM-7, .about-us-page #numbers .items .push-desktopM-7 { left: 70%; } .values-page #numbers .items .push-desktopM-8, .about-us-page #numbers .items .push-desktopM-8 { left: 80%; } .values-page #numbers .items .push-desktopM-9, .about-us-page #numbers .items .push-desktopM-9 { left: 90%; } .values-page #numbers .items .push-desktopM-10, .about-us-page #numbers .items .push-desktopM-10 { left: 100%; } .values-page #numbers .items .offset-desktopM-0, .about-us-page #numbers .items .offset-desktopM-0 { margin-left: 0%; } .values-page #numbers .items .offset-desktopM-1, .about-us-page #numbers .items .offset-desktopM-1 { margin-left: 10%; } .values-page #numbers .items .offset-desktopM-2, .about-us-page #numbers .items .offset-desktopM-2 { margin-left: 20%; } .values-page #numbers .items .offset-desktopM-3, .about-us-page #numbers .items .offset-desktopM-3 { margin-left: 30%; } .values-page #numbers .items .offset-desktopM-4, .about-us-page #numbers .items .offset-desktopM-4 { margin-left: 40%; } .values-page #numbers .items .offset-desktopM-5, .about-us-page #numbers .items .offset-desktopM-5 { margin-left: 50%; } .values-page #numbers .items .offset-desktopM-6, .about-us-page #numbers .items .offset-desktopM-6 { margin-left: 60%; } .values-page #numbers .items .offset-desktopM-7, .about-us-page #numbers .items .offset-desktopM-7 { margin-left: 70%; } .values-page #numbers .items .offset-desktopM-8, .about-us-page #numbers .items .offset-desktopM-8 { margin-left: 80%; } .values-page #numbers .items .offset-desktopM-9, .about-us-page #numbers .items .offset-desktopM-9 { margin-left: 90%; } } @media (min-width: 2100px) { .values-page #numbers .items .col-desktopL, .about-us-page #numbers .items .col-desktopL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .values-page #numbers .items .col-desktopL-1, .about-us-page #numbers .items .col-desktopL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .values-page #numbers .items .col-desktopL-2, .about-us-page #numbers .items .col-desktopL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .values-page #numbers .items .col-desktopL-3, .about-us-page #numbers .items .col-desktopL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .values-page #numbers .items .col-desktopL-4, .about-us-page #numbers .items .col-desktopL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .values-page #numbers .items .col-desktopL-5, .about-us-page #numbers .items .col-desktopL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .values-page #numbers .items .col-desktopL-6, .about-us-page #numbers .items .col-desktopL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .values-page #numbers .items .col-desktopL-7, .about-us-page #numbers .items .col-desktopL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .values-page #numbers .items .col-desktopL-8, .about-us-page #numbers .items .col-desktopL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .values-page #numbers .items .col-desktopL-9, .about-us-page #numbers .items .col-desktopL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .values-page #numbers .items .col-desktopL-10, .about-us-page #numbers .items .col-desktopL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .values-page #numbers .items .pull-desktopL-0, .about-us-page #numbers .items .pull-desktopL-0 { right: auto; } .values-page #numbers .items .pull-desktopL-1, .about-us-page #numbers .items .pull-desktopL-1 { right: 10%; } .values-page #numbers .items .pull-desktopL-2, .about-us-page #numbers .items .pull-desktopL-2 { right: 20%; } .values-page #numbers .items .pull-desktopL-3, .about-us-page #numbers .items .pull-desktopL-3 { right: 30%; } .values-page #numbers .items .pull-desktopL-4, .about-us-page #numbers .items .pull-desktopL-4 { right: 40%; } .values-page #numbers .items .pull-desktopL-5, .about-us-page #numbers .items .pull-desktopL-5 { right: 50%; } .values-page #numbers .items .pull-desktopL-6, .about-us-page #numbers .items .pull-desktopL-6 { right: 60%; } .values-page #numbers .items .pull-desktopL-7, .about-us-page #numbers .items .pull-desktopL-7 { right: 70%; } .values-page #numbers .items .pull-desktopL-8, .about-us-page #numbers .items .pull-desktopL-8 { right: 80%; } .values-page #numbers .items .pull-desktopL-9, .about-us-page #numbers .items .pull-desktopL-9 { right: 90%; } .values-page #numbers .items .pull-desktopL-10, .about-us-page #numbers .items .pull-desktopL-10 { right: 100%; } .values-page #numbers .items .push-desktopL-0, .about-us-page #numbers .items .push-desktopL-0 { left: auto; } .values-page #numbers .items .push-desktopL-1, .about-us-page #numbers .items .push-desktopL-1 { left: 10%; } .values-page #numbers .items .push-desktopL-2, .about-us-page #numbers .items .push-desktopL-2 { left: 20%; } .values-page #numbers .items .push-desktopL-3, .about-us-page #numbers .items .push-desktopL-3 { left: 30%; } .values-page #numbers .items .push-desktopL-4, .about-us-page #numbers .items .push-desktopL-4 { left: 40%; } .values-page #numbers .items .push-desktopL-5, .about-us-page #numbers .items .push-desktopL-5 { left: 50%; } .values-page #numbers .items .push-desktopL-6, .about-us-page #numbers .items .push-desktopL-6 { left: 60%; } .values-page #numbers .items .push-desktopL-7, .about-us-page #numbers .items .push-desktopL-7 { left: 70%; } .values-page #numbers .items .push-desktopL-8, .about-us-page #numbers .items .push-desktopL-8 { left: 80%; } .values-page #numbers .items .push-desktopL-9, .about-us-page #numbers .items .push-desktopL-9 { left: 90%; } .values-page #numbers .items .push-desktopL-10, .about-us-page #numbers .items .push-desktopL-10 { left: 100%; } .values-page #numbers .items .offset-desktopL-0, .about-us-page #numbers .items .offset-desktopL-0 { margin-left: 0%; } .values-page #numbers .items .offset-desktopL-1, .about-us-page #numbers .items .offset-desktopL-1 { margin-left: 10%; } .values-page #numbers .items .offset-desktopL-2, .about-us-page #numbers .items .offset-desktopL-2 { margin-left: 20%; } .values-page #numbers .items .offset-desktopL-3, .about-us-page #numbers .items .offset-desktopL-3 { margin-left: 30%; } .values-page #numbers .items .offset-desktopL-4, .about-us-page #numbers .items .offset-desktopL-4 { margin-left: 40%; } .values-page #numbers .items .offset-desktopL-5, .about-us-page #numbers .items .offset-desktopL-5 { margin-left: 50%; } .values-page #numbers .items .offset-desktopL-6, .about-us-page #numbers .items .offset-desktopL-6 { margin-left: 60%; } .values-page #numbers .items .offset-desktopL-7, .about-us-page #numbers .items .offset-desktopL-7 { margin-left: 70%; } .values-page #numbers .items .offset-desktopL-8, .about-us-page #numbers .items .offset-desktopL-8 { margin-left: 80%; } .values-page #numbers .items .offset-desktopL-9, .about-us-page #numbers .items .offset-desktopL-9 { margin-left: 90%; } } .values-page #beginning hr, .about-us-page #beginning hr { display: inline-block; width: 100px; border: 0; height: 2px; background-color: #0090ff; margin: 0 0 10px; } .values-page #beginning .content, .about-us-page #beginning .content { padding: 3.4rem 0; } .values-page #beginning .ceo-wrapper, .about-us-page #beginning .ceo-wrapper { background-color: #f7f7f7; border-radius: 5px; font-style: italic; padding: 15px 25px 15px; margin-bottom: 20px; margin-top: 85px; } .values-page #beginning .ceo-wrapper .ceo-image img, .about-us-page #beginning .ceo-wrapper .ceo-image img { width: 100px; height: 100px; margin-top: -66px; } .values-page #beginning .ceo-wrapper span, .about-us-page #beginning .ceo-wrapper span { font-size: 90%; color: #0090ff; margin: 10px 0 20px 0; display: inline-block; } .values-page #values-header .content, .about-us-page #values-header .content { position: relative; top: 0; -webkit-transform: none; transform: none; } .values-page #values-header .content h1, .about-us-page #values-header .content h1 { font-size: 2.8rem; padding-bottom: 2.4rem; } .values-page #values-header .content h1 + p, .about-us-page #values-header .content h1 + p { padding-bottom: 0; } .values-page #values-list .content, .about-us-page #values-list .content { position: relative; z-index: 10; color: #fff; } .values-page #values-list .content h3, .about-us-page #values-list .content h3 { font-size: 2rem; padding-top: 1.6rem; padding-bottom: 2.4rem; } .values-page #values-list .content svg, .about-us-page #values-list .content svg { height: 60px; width: auto; } .values-page #values-list .content svg path, .about-us-page #values-list .content svg path { fill: #fff; } .values-page #values-list .content hr, .about-us-page #values-list .content hr { display: inline-block; width: 100px; border: 0; height: 1px; background-color: #ffffff; margin: 0 0 10px; } .values-page #values-list .bg, .about-us-page #values-list .bg { position: absolute; width: 100%; height: 100%; top: 0; } .values-page #environment-header .content p, .about-us-page #environment-header .content p { padding-bottom: 0; } .values-page #environment-header .bg, .about-us-page #environment-header .bg { height: 260px; padding-bottom: 0; } .values-page #new-mission, .about-us-page #new-mission { margin-top: 5px; } .values-page #new-mission hr, .about-us-page #new-mission hr { display: inline-block; width: 100px; border: 0; height: 1px; background-color: #ffffff; margin: 0 0 10px; } .values-page #new-mission .content, .about-us-page #new-mission .content { color: #ffffff; position: absolute; z-index: 1; } .values-page #new-mission .bg, .about-us-page #new-mission .bg { padding-bottom: 123%; } .values-page #new-vision, .about-us-page #new-vision { margin-top: 5px; } .values-page #new-vision hr, .about-us-page #new-vision hr { display: inline-block; width: 100px; border: 0; height: 1px; background-color: #ffffff; margin: 0 0 10px; } .values-page #new-vision .content, .about-us-page #new-vision .content { color: #ffffff; position: absolute; z-index: 1; } .values-page #new-vision .bg, .about-us-page #new-vision .bg { padding-bottom: 123%; } .values-page #production hr, .about-us-page #production hr { display: inline-block; width: 100px; border: 0; height: 2px; background-color: #0090ff; margin: 0 0 10px; } .values-page #production .second-part-copy, .about-us-page #production .second-part-copy { background-color: #f6f6f6; } .values-page #production .second-part-copy .content p, .about-us-page #production .second-part-copy .content p { padding-top: 13px; } .values-page #production .swiper-container, .about-us-page #production .swiper-container { overflow: visible; padding-bottom: 40px; margin-bottom: 20px; } .values-page #production .swiper-slide img, .about-us-page #production .swiper-slide img { width: 100%; height: 100%; } .values-page #production .swiper-button-next, .about-us-page #production .swiper-button-next { display: block; background: none; border-right: 4px solid rgba(255, 255, 255, 0.5); border-bottom: 4px solid rgba(255, 255, 255, 0.5); width: 50px; height: 50px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; right: 30px; left: auto; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } .values-page #production .swiper-button-prev, .about-us-page #production .swiper-button-prev { display: block; background: none; border-right: 4px solid rgba(255, 255, 255, 0.5); border-bottom: 4px solid rgba(255, 255, 255, 0.5); width: 50px; height: 50px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; right: auto; left: 30px; -webkit-transform: rotate(135deg); transform: rotate(135deg); } .values-page #awards .content .wrapper div img, .about-us-page #awards .content .wrapper div img { width: 75px; height: 75px; padding: 5px; margin: 30px 0; } @media (min-width: 544px) { .values-page #video, .about-us-page #video { height: 0; padding-bottom: 70%; } .values-page #video .button.button-play, .about-us-page #video .button.button-play { top: 200px; } .values-page #video .content h1, .about-us-page #video .content h1 { margin-top: 15px; } .values-page #video .content h2, .about-us-page #video .content h2 { margin-top: 15px; } .values-page #new-mission .bg, .about-us-page #new-mission .bg { padding-bottom: 100%; } .values-page #new-vision .bg, .about-us-page #new-vision .bg { padding-bottom: 123%; } } @media (max-width: 991px) { .values-page #values-list .content, .about-us-page #values-list .content { padding-bottom: 0; } .values-page #values-list .content p, .about-us-page #values-list .content p { padding-bottom: 1rem; } .values-page #values-list .list > div, .about-us-page #values-list .list > div { padding-top: 4.8rem; padding-bottom: 2.4rem; } .values-page #values-list .list > div:nth-child(2n):after, .about-us-page #values-list .list > div:nth-child(2n):after { content: ''; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 1000px; height: 100%; background: rgba(255, 255, 255, 0.1); } .values-page #values-list .toggles, .about-us-page #values-list .toggles { display: none; } } @media (min-width: 768px) { .values-page #video, .about-us-page #video { height: 0; padding-bottom: 40%; } .values-page #video .button.button-play, .about-us-page #video .button.button-play { top: 20px; } .values-page #video.section-video-player .content, .about-us-page #video.section-video-player .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .values-page #parallax.section-scroll-slide, .about-us-page #parallax.section-scroll-slide { height: 220px; } .values-page #numbers .content .justify, .about-us-page #numbers .content .justify { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .values-page #beginning .ceo-wrapper, .about-us-page #beginning .ceo-wrapper { padding: 15px 75px 15px; } .values-page #new-mission .content, .about-us-page #new-mission .content { text-align: left; margin-top: 2rem; } .values-page #new-mission .bg, .about-us-page #new-mission .bg { padding-bottom: 55%; background-position: 30% 50%; } .values-page #new-vision .content, .about-us-page #new-vision .content { text-align: left; margin-top: 8rem; } .values-page #new-vision .bg, .about-us-page #new-vision .bg { padding-bottom: 55%; } .values-page #production .first-part-copy .content, .values-page #production .second-part-copy .content, .about-us-page #production .first-part-copy .content, .about-us-page #production .second-part-copy .content { padding: 4.4rem 0; } .values-page #awards .content, .about-us-page #awards .content { padding-top: 4.4rem; } .values-page #awards .content .wrapper div img, .about-us-page #awards .content .wrapper div img { width: 75px; height: 75px; padding: 0; } } @media (min-width: 992px) { .values-page #attributes .wrapper, .about-us-page #attributes .wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; } .values-page #attributes .item-1, .about-us-page #attributes .item-1 { padding: 40px 0 10px; } .values-page #attributes .item-2, .about-us-page #attributes .item-2 { background-color: #ffffff; padding: 40px 0 10px; } .values-page #attributes .item-3, .about-us-page #attributes .item-3 { padding: 40px 0 10px; } .values-page #parallax.section-scroll-slide, .about-us-page #parallax.section-scroll-slide { height: 250px; } .values-page #values-header .content h1, .about-us-page #values-header .content h1 { font-size: 3.2rem; } .values-page #values-list .content h2, .about-us-page #values-list .content h2 { padding-bottom: .8rem; } .values-page #values-list .content h2 + p, .about-us-page #values-list .content h2 + p { padding-bottom: 4.8rem; } .values-page #values-list .list .head, .about-us-page #values-list .list .head { display: none; } .values-page #values-list .list > div, .about-us-page #values-list .list > div { display: none; } .values-page #values-list .list > div.active, .about-us-page #values-list .list > div.active { display: block; } .values-page #values-list .toggles p, .about-us-page #values-list .toggles p { font-size: 2rem; padding-top: 1.6rem; padding-bottom: 4.8rem; } .values-page #values-list .toggles .head, .about-us-page #values-list .toggles .head { color: #0090ff; transition: color 250ms; } .values-page #values-list .toggles .head svg path, .about-us-page #values-list .toggles .head svg path { fill: #0090ff; transition: fill 250ms; } .values-page #values-list .toggles .head.active, .about-us-page #values-list .toggles .head.active { color: #fff; } .values-page #values-list .toggles .head.active svg path, .about-us-page #values-list .toggles .head.active svg path { fill: #fff; } .values-page #values-list .content, .values-page #values-list .bg, .about-us-page #values-list .content, .about-us-page #values-list .bg { height: auto; min-height: 540px; } .values-page #values-list .extra-margin, .about-us-page #values-list .extra-margin { margin-top: 50px; } .values-page #new-mission .bg, .about-us-page #new-mission .bg { padding-bottom: 40%; } .values-page #new-vision .content, .about-us-page #new-vision .content { margin-top: 7rem; } .values-page #new-vision .bg, .about-us-page #new-vision .bg { padding-bottom: 40%; } .values-page #awards .content .wrapper, .about-us-page #awards .content .wrapper { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .values-page #awards .content .wrapper div img, .about-us-page #awards .content .wrapper div img { padding: 10px; width: 85px; height: 85px; margin: 50px 0 30px; } } @media (min-width: 1200px) { .values-page #video, .about-us-page #video { padding-bottom: 25%; } .values-page #video .content h1, .about-us-page #video .content h1 { font-size: 40px; } .values-page #parallax.section-scroll-slide, .about-us-page #parallax.section-scroll-slide { height: 230px; } .values-page #numbers .content, .about-us-page #numbers .content { padding-bottom: 4.8rem; padding-top: 4.8rem; } .values-page #beginning .ceo-wrapper, .about-us-page #beginning .ceo-wrapper { padding: 15px 85px 15px; } .values-page #beginning hr, .about-us-page #beginning hr { width: 120px; } .values-page #beginning .content, .about-us-page #beginning .content { padding: 6rem 0; } .values-page #values-header .content h1, .about-us-page #values-header .content h1 { font-size: 4rem; } .values-page #environment-header .bg, .about-us-page #environment-header .bg { height: 360px; } .values-page #values-list .toggles .head svg, .about-us-page #values-list .toggles .head svg { height: 70px; width: auto; } .values-page #values-list .toggles .head:hover, .about-us-page #values-list .toggles .head:hover { color: #fff; cursor: pointer; } .values-page #values-list .toggles .head:hover svg path, .about-us-page #values-list .toggles .head:hover svg path { fill: #fff; } .values-page #values-list .content, .values-page #values-list .bg, .about-us-page #values-list .content, .about-us-page #values-list .bg { height: auto; min-height: 660px; } .values-page #values-list .content hr, .values-page #values-list .bg hr, .about-us-page #values-list .content hr, .about-us-page #values-list .bg hr { width: 120px; } .values-page #values-list .fixed-height .bg, .about-us-page #values-list .fixed-height .bg { min-height: 530px; } .values-page #new-mission .content, .about-us-page #new-mission .content { margin-top: 5rem; } .values-page #production .first-part-copy .content, .about-us-page #production .first-part-copy .content { padding-top: 6rem; padding-bottom: 0; } .values-page #production .second-part-copy, .about-us-page #production .second-part-copy { background-color: #ffffff; } .values-page #production .second-part-copy .content, .about-us-page #production .second-part-copy .content { padding-top: 0; padding-bottom: 4rem; } .values-page #production .second-part-copy .content p, .about-us-page #production .second-part-copy .content p { padding-top: 0; } .values-page #production .swiper-container, .about-us-page #production .swiper-container { padding-bottom: 50px; margin-bottom: 0; } .values-page #awards .content, .about-us-page #awards .content { padding-top: 6rem; } } @media (min-width: 1600px) { .values-page #video, .about-us-page #video { padding-bottom: 25%; } .values-page #video .content h1, .about-us-page #video .content h1 { font-size: 45px; } .values-page #attributes h2, .about-us-page #attributes h2 { font-size: 19px; } .values-page #parallax.section-scroll-slide, .about-us-page #parallax.section-scroll-slide { height: 260px; } .values-page #values-header .content h1, .about-us-page #values-header .content h1 { font-size: 4.8rem; } .values-page #environment-header .bg, .about-us-page #environment-header .bg { height: 420px; } .values-page #values-list .content h2 + p, .about-us-page #values-list .content h2 + p { padding-bottom: 6rem; } .values-page #values-list .toggles p, .about-us-page #values-list .toggles p { font-size: 2.4rem; padding-bottom: 6rem; } .values-page #values-list .toggles .head svg, .about-us-page #values-list .toggles .head svg { height: 70px; width: auto; } .values-page #values-list .content, .values-page #values-list .bg, .about-us-page #values-list .content, .about-us-page #values-list .bg { height: auto; min-height: 770px; } .values-page #values-list .fixed-height .bg, .about-us-page #values-list .fixed-height .bg { min-height: 580px; } .values-page #new-mission .content, .about-us-page #new-mission .content { margin-top: 5rem; } .values-page #production .first-part-copy .content, .about-us-page #production .first-part-copy .content { padding-top: 8rem; } .values-page #production .second-part-copy .content, .about-us-page #production .second-part-copy .content { padding-bottom: 6rem; } .values-page #awards .content, .about-us-page #awards .content { padding-top: 8rem; } .values-page #awards .content .wrapper div img, .about-us-page #awards .content .wrapper div img { width: 95px; height: 95px; margin: 80px 0 60px; } } @media (min-width: 2100px) { .values-page #video, .about-us-page #video { padding-bottom: 22%; } .values-page #video .content h1, .about-us-page #video .content h1 { font-size: 45px; } .values-page #attributes h2, .about-us-page #attributes h2 { font-size: 23px; } .values-page #parallax.section-scroll-slide, .about-us-page #parallax.section-scroll-slide { height: 300px; } .values-page #values-header .content h1, .about-us-page #values-header .content h1 { font-size: 6rem; } .values-page #values-list .toggles .head svg, .about-us-page #values-list .toggles .head svg { height: 80px; width: auto; } .values-page #values-list .content, .values-page #values-list .bg, .about-us-page #values-list .content, .about-us-page #values-list .bg { height: auto; min-height: 820px; } .values-page #values-list .fixed-height .bg, .about-us-page #values-list .fixed-height .bg { min-height: 660px; } .values-page #new-mission .content, .about-us-page #new-mission .content { margin-top: 6rem; } .values-page #new-mission .bg, .about-us-page #new-mission .bg { padding-bottom: 33%; background-position: 50% 50%; } .values-page #new-vision .content, .about-us-page #new-vision .content { margin-top: 13rem; } .values-page #new-vision .bg, .about-us-page #new-vision .bg { padding-bottom: 33%; } .values-page #production .first-part-copy .content, .about-us-page #production .first-part-copy .content { padding-top: 10rem; } .values-page #production .second-part-copy .content, .about-us-page #production .second-part-copy .content { padding-bottom: 8rem; } .values-page #awards .content, .about-us-page #awards .content { padding-top: 10rem; } .values-page #awards .content .wrapper div img, .about-us-page #awards .content .wrapper div img { width: 105px; height: 105px; } } .compatibility-page #compatibility-header .content h1 { height: 0; overflow: hidden; text-indent: -9999em; color: transparent; padding-bottom: 0; } .compatibility-page #compatibility-header .content p { display: none; } .compatibility-page #compatibility-header .bg { padding-bottom: 0; height: 330px; } .compatibility-page #compatibility-header .swappable-text.hidden-tabletP-up text { fill: #fff; font-size: 40px; text-anchor: middle; -webkit-transform: translateX(150px); transform: translateX(150px); } .compatibility-page #compatibility-header .swappable-text.hidden-tabletP-up g[filter] { margin-top: 60px; } .compatibility-page #compatibility-header .swappable-text.hidden-tabletP-up g image { -webkit-transform: translateX(40px); transform: translateX(40px); } .compatibility-page #compatibility-header .swappable-text.hidden-tabletP-up g text { -webkit-transform: translate(150px, 186px); transform: translate(150px, 186px); } .compatibility-page #compatibility-header .swappable-text.hidden-tabletP-up g.texts { -webkit-transform: translateY(100px); transform: translateY(100px); } .compatibility-page #compatibility-header .swappable-text.hidden-tabletP-up g.texts text { opacity: 0; } .compatibility-page #compatibility-header .swappable-text.hidden-tabletP-up g.texts text:first-of-type { opacity: 1; } .compatibility-page #compatibility-header .swappable-text.hidden-tabletP-up { width: 200px; height: 200px; } .compatibility-page #systems .content img, .compatibility-page #voice .content img { margin-bottom: 2.4rem; } .compatibility-page #systems .content .homekit, .compatibility-page #voice .content .homekit { padding-top: 2.4rem; padding-bottom: 4.8rem; } .compatibility-page #systems .content .homekit img, .compatibility-page #voice .content .homekit img { width: 140px; height: auto; } .compatibility-page #systems .content .alexa, .compatibility-page #voice .content .alexa { padding-top: 2.4rem; padding-bottom: 4.8rem; } .compatibility-page #systems .content .alexa img, .compatibility-page #voice .content .alexa img { width: auto; height: 50px; } .compatibility-page #systems .content .siri, .compatibility-page #voice .content .siri { padding-top: 2.4rem; padding-bottom: 4.8rem; } .compatibility-page #systems .content .siri img, .compatibility-page #voice .content .siri img { width: auto; height: 50px; } .compatibility-page #systems .content .zwave img, .compatibility-page #systems .content .google img, .compatibility-page #systems .content .amazon img, .compatibility-page #voice .content .zwave img, .compatibility-page #voice .content .google img, .compatibility-page #voice .content .amazon img { width: auto; height: 60px; } .compatibility-page #video, .compatibility-page #jogavideo { height: 220px; } .compatibility-page #video .content h2, .compatibility-page #jogavideo .content h2 { text-transform: none; } .compatibility-page #smart-things .content { position: absolute; z-index: 1; color: #ffffff; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .compatibility-page #smart-things .content img { width: 220px; height: 35px; margin: 0 0 2.4rem; } .compatibility-page #smart-things .content br { display: none; } .compatibility-page #smart-things .content .more { color: #ffffff; } .compatibility-page #smart-things .content .more:hover { border-bottom: 1px solid #ffffff; } .compatibility-page #smart-things .content .more:after { content: ""; display: inline-block; width: 8px; height: 8px; border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; background-color: transparent; -webkit-transform: rotate(45deg) translate(1px, -2px); transform: rotate(45deg) translate(1px, -2px); } .compatibility-page #smart-things .bg { padding-bottom: 0; background-position: 20% 50%; height: 330px; } .compatibility-page #fibaro-bot-header .content img { width: 70px; height: 70px; margin: 20px 0; } .compatibility-page #fibaro-bot-header .bg { padding-bottom: 60%; background-position: 80% 50%; } .compatibility-page #simpler-than-ever, .compatibility-page #information-right-away { background-color: #ffffff; } .compatibility-page #simpler-than-ever .chatbot, .compatibility-page #information-right-away .chatbot { -webkit-transform: scale(0.6) translateX(-50%); transform: scale(0.6) translateX(-50%); left: 50%; } .compatibility-page #simpler-than-ever .chat-wrapper, .compatibility-page #information-right-away .chat-wrapper { margin-top: 2.4rem; } .compatibility-page #simpler-than-ever #conversation1, .compatibility-page #information-right-away #conversation1 { height: 260px; } .compatibility-page #simpler-than-ever #conversation2, .compatibility-page #information-right-away #conversation2 { height: 220px; } .compatibility-page #possibilities .mobile img { width: 100%; max-width: 160px; height: auto; margin-top: 2.4rem; margin-bottom: 2.4rem; } .compatibility-page #possibilities .desktop { display: none; } .compatibility-page #possibilities .compatibility-button { display: inline-block; position: relative; padding: 6px 50px; border-radius: 6px; border: 1px solid #0090ff; color: #0090ff; transition: all 250ms; margin: 20px 0; } .compatibility-page #possibilities .compatibility-button:hover { background-color: #0090FF; } .compatibility-page #possibilities .compatibility-button:hover a { color: #ffffff; } .compatibility-page #interfaces { background-color: #e8e8e8; } .compatibility-page #interfaces .content a { display: inline-block; margin-bottom: 2.4rem; } .compatibility-page #interfaces .bg { background-size: auto 100%; padding-bottom: 60%; } .compatibility-page #plugins .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .compatibility-page #plugins .content p { font-size: 140%; } .compatibility-page #plugins .content p:nth-of-type(1) { padding-bottom: 0; } .compatibility-page #plugins .content p:nth-of-type(2) { text-transform: uppercase; color: #0090FF; font-size: 240%; padding-bottom: 1rem; margin-top: -1rem; } .compatibility-page #plugins .bg { background-size: auto 100%; height: 380px; } .compatibility-page #plugins svg .c { font-family: "Open Sans", sans-serif; font-size: 124px; text-anchor: middle; dominant-baseline: central; } .compatibility-page #plugins svg .c.hidden-tabletP-up { dominant-baseline: middle; } .compatibility-page #plugins svg .p { font-family: "Open Sans", sans-serif; font-size: 52px; text-anchor: start; dominant-baseline: central; } .compatibility-page #plugins svg .p tspan { dominant-baseline: middle; } .compatibility-page #voice-control .content { padding-bottom: 0; } .compatibility-page #voice-control .content h2 { padding-bottom: 0; } .compatibility-page .vc-movie .text { padding-bottom: 2.4rem; } .compatibility-page .vc-movie .text img { display: inline-block; width: 180px; height: auto; } .compatibility-page .vc-movie .image { padding-left: 0; padding-right: 0; } .compatibility-page .vc-movie .image > div { position: relative; } .compatibility-page .vc-movie .image img { width: 100%; } .compatibility-page .vc-movie .image a { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media (min-width: 544px) { .compatibility-page #compatibility-header .bg { height: 380px; } .compatibility-page #smart-things .content img { width: 290px; height: 45px; } .compatibility-page #smart-things .content br { display: block; } .compatibility-page #smart-things .bg { height: 380px; } .compatibility-page #video, .compatibility-page #jogavideo { height: 260px; } .compatibility-page #interfaces .content a { margin-left: 2rem; margin-right: 2rem; } } @media (min-width: 768px) { .compatibility-page #compatibility-header .swappable-text.hidden-phoneL-down text { font-size: 29px; alignment-baseline: middle; text-anchor: start; fill: #fff; } .compatibility-page #compatibility-header .swappable-text.hidden-phoneL-down { width: 1200px; height: 75px; -webkit-transform: translateX(9.5%); transform: translateX(9.5%); } .compatibility-page #systems .content .homekit, .compatibility-page #voice .content .homekit { padding-bottom: 2.4rem; } .compatibility-page #systems .content .homekit img, .compatibility-page #voice .content .homekit img { margin-top: .5rem; margin-bottom: 2.9rem; width: auto; height: 40px; } .compatibility-page #systems .content .alexa, .compatibility-page #voice .content .alexa { padding-bottom: 2.4rem; } .compatibility-page #systems .content .alexa img, .compatibility-page #voice .content .alexa img { margin-top: .5rem; margin-bottom: 2.9rem; width: auto; height: 50px; } .compatibility-page #systems .content .siri, .compatibility-page #voice .content .siri { padding-bottom: 2.4rem; } .compatibility-page #systems .content .siri img, .compatibility-page #voice .content .siri img { margin-top: 1rem; margin-bottom: 3.4rem; width: auto; height: 40px; } .compatibility-page #systems .content .zwave, .compatibility-page #systems .content .google, .compatibility-page #systems .content .amazon, .compatibility-page #voice .content .zwave, .compatibility-page #voice .content .google, .compatibility-page #voice .content .amazon { padding-top: 2.4rem; padding-bottom: 2.4rem; } .compatibility-page #systems .content .zwave img, .compatibility-page #systems .content .google img, .compatibility-page #systems .content .amazon img, .compatibility-page #voice .content .zwave img, .compatibility-page #voice .content .google img, .compatibility-page #voice .content .amazon img { width: auto; } .compatibility-page #fibaro-bot-header .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .compatibility-page #fibaro-bot-header .content img { width: 50px; height: 50px; margin: 0 0 20px 0; } .compatibility-page #fibaro-bot-header .bg { padding-bottom: 60%; background-position: 57% 50%; } .compatibility-page #simpler-than-ever .text > div, .compatibility-page #information-right-away .text > div { position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .compatibility-page #simpler-than-ever .chat-wrapper, .compatibility-page #information-right-away .chat-wrapper { margin-top: 2.4rem; margin-bottom: 2.4rem; } .compatibility-page #possibilities .mobile img { max-width: 130px; } .compatibility-page #interfaces { background-color: #ececec; } .compatibility-page #interfaces .bg { padding-bottom: 0; height: 300px; } .compatibility-page #plugins .content p:nth-of-type(2) { display: none; } .compatibility-page #plugins svg { margin-top: -1rem; margin-bottom: 2rem; } .compatibility-page #voice-control { background-color: #f6f6f6; } .compatibility-page #voice-control .content { padding-bottom: 3.6rem; } .compatibility-page .vc-movie { background-color: #f6f6f6; } .compatibility-page .vc-movie .row > div { padding-left: 0; padding-right: 0; } .compatibility-page .vc-movie .content { padding-bottom: 4.8rem; padding-top: 0; } .compatibility-page .vc-movie .text { padding-bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; font-size: 90%; } .compatibility-page .vc-movie .text > div { background-color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .compatibility-page .vc-movie .text p { padding: 10px 20px; margin: 0; } } @media (min-width: 992px) { .compatibility-page #compatibility-header .swappable-text.hidden-phoneL-down { -webkit-transform: translateX(17%); transform: translateX(17%); } .compatibility-page #smart-things .content img { width: 330px; height: 52px; } .compatibility-page #smart-things .bg { height: 0; padding-bottom: 40%; } .compatibility-page #fibaro-bot-header .bg { padding-bottom: 40%; } } @media (min-width: 1200px) { .compatibility-page #compatibility-header .bg { height: 520px; } .compatibility-page #compatibility-header .swappable-text.hidden-phoneL-down { width: 1600px; height: 100px; -webkit-transform: translateX(12.5%); transform: translateX(12.5%); } .compatibility-page #systems .content .homekit img, .compatibility-page #voice .content .homekit img { margin-top: .5rem; margin-bottom: 2.9rem; width: auto; height: 60px; } .compatibility-page #systems .content .alexa img, .compatibility-page #voice .content .alexa img { margin-top: .5rem; margin-bottom: 2.9rem; width: auto; height: 74px; } .compatibility-page #systems .content .siri img, .compatibility-page #voice .content .siri img { margin-top: .5rem; margin-bottom: 3.9rem; width: auto; height: 64px; } .compatibility-page #systems .content .zwave, .compatibility-page #voice .content .zwave { padding-top: 2.4rem; padding-bottom: 2.4rem; } .compatibility-page #systems .content .zwave img, .compatibility-page #voice .content .zwave img { width: auto; height: 70px; } .compatibility-page #systems .content .google, .compatibility-page #systems .content .amazon, .compatibility-page #voice .content .google, .compatibility-page #voice .content .amazon { padding-top: 3rem; padding-bottom: 2.4rem; } .compatibility-page #systems .content .google img, .compatibility-page #systems .content .amazon img, .compatibility-page #voice .content .google img, .compatibility-page #voice .content .amazon img { width: auto; height: 70px; } .compatibility-page #video, .compatibility-page #jogavideo { height: 360px; } .compatibility-page #smart-things .content img { width: 410px; height: 64px; } .compatibility-page #fibaro-bot-header .content img { width: 80px; height: 80px; margin: 0 0 20px 0; } .compatibility-page #simpler-than-ever .chatbot { -webkit-transform: scale(0.75) translateX(-50%); transform: scale(0.75) translateX(-50%); } .compatibility-page #simpler-than-ever #conversation1 { height: 330px; } .compatibility-page #information-right-away .chatbot { -webkit-transform: scale(0.75) translateX(-50%); transform: scale(0.75) translateX(-50%); } .compatibility-page #information-right-away #conversation2 { height: 280px; } .compatibility-page #possibilities .content h2 { padding-bottom: 6rem; } .compatibility-page #possibilities .mobile { display: none; } .compatibility-page #possibilities .desktop { display: -webkit-box; display: -ms-flexbox; display: flex; } .compatibility-page #possibilities .desktop .product, .compatibility-page #possibilities .desktop .description { display: inline-block; width: 90%; } .compatibility-page #possibilities .desktop .product { border: 1px solid #f6f6f6; } .compatibility-page #possibilities .desktop .product img { width: 100%; max-width: 270px; height: auto; } .compatibility-page #possibilities .desktop .description { background-color: #f6f6f6; border: 1px solid #f6f6f6; font-size: 70%; color: #7e7e7e; min-height: 170px; padding-left: 1.6rem; padding-right: 1.6rem; padding-bottom: 1rem; margin-bottom: 4.8rem; } .compatibility-page #possibilities .desktop .description > div { position: relative; width: 100%; height: 60px; margin-bottom: 1.6rem; } .compatibility-page #possibilities .desktop .description > div img { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .compatibility-page #interfaces .content a { margin-top: 2.4rem; } .compatibility-page #interfaces .bg { height: 420px; } .compatibility-page #voice-control .content { padding-bottom: 6rem; } .compatibility-page .vc-movie .content { padding-bottom: 7.2rem; } .compatibility-page .vc-movie .text { -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 100%; } .compatibility-page .vc-movie .text > div { padding: 2.6rem 0; } .compatibility-page .vc-movie .text p { padding: 10px 40px; } .ie11 .compatibility-page, .edge .compatibility-page { overflow: hidden; } .ie11 .compatibility-page #compatibility-header .content p, .edge .compatibility-page #compatibility-header .content p { font-size: 6rem; display: block; } .ie11 .compatibility-page #compatibility-header svg, .edge .compatibility-page #compatibility-header svg { display: none; } .ie11 .compatibility-page #plugins .content p:nth-of-type(2), .edge .compatibility-page #plugins .content p:nth-of-type(2) { display: block; } .ie11 .compatibility-page #plugins svg, .edge .compatibility-page #plugins svg { position: relative; top: 30px; } .ie11 .compatibility-page #plugins svg .c.hidden-tabletP-up, .edge .compatibility-page #plugins svg .c.hidden-tabletP-up { display: block !important; } .ie11 .compatibility-page #plugins svg .p, .ie11 .compatibility-page #plugins svg .c.hidden-phoneL-down, .edge .compatibility-page #plugins svg .p, .edge .compatibility-page #plugins svg .c.hidden-phoneL-down { display: none !important; } } @media (min-width: 1600px) { .compatibility-page #compatibility-header .bg { height: 680px; } .compatibility-page #compatibility-header .swappable-text.hidden-phoneL-down { width: 1760px; height: 110px; -webkit-transform: translateX(17%); transform: translateX(17%); } .compatibility-page #systems .content h2, .compatibility-page #voice .content h2 { padding-bottom: 4.8rem; } .compatibility-page #video, .compatibility-page #jogavideo { height: 515px; } .compatibility-page #smart-things .content img { width: 500px; height: 78px; } .compatibility-page #smart-things .bg { padding-bottom: 38%; } .compatibility-page #fibaro-bot-header .bg { padding-bottom: 36%; } .compatibility-page #simpler-than-ever .chatbot { -webkit-transform: scale(1) translateX(-50%); transform: scale(1) translateX(-50%); } .compatibility-page #simpler-than-ever #conversation1 { height: 440px; } .compatibility-page #information-right-away .chatbot { -webkit-transform: scale(1) translateX(-50%); transform: scale(1) translateX(-50%); } .compatibility-page #information-right-away #conversation2 { height: 370px; } .compatibility-page #possibilities .content h2 { padding-bottom: 7.2rem; } .compatibility-page #possibilities .desktop .product, .compatibility-page #possibilities .desktop .description { width: 86%; } .compatibility-page #possibilities .desktop .description { padding-left: 2.4rem; padding-right: 2.4rem; min-height: 190px; margin-bottom: 7.2rem; } .compatibility-page #possibilities .desktop .description > div { margin-bottom: 2.4rem; } .compatibility-page #interfaces .bg { height: 476px; } .compatibility-page #plugins .bg { height: 540px; } .compatibility-page #plugins svg { height: 200px; } .compatibility-page #voice-control .content { padding-bottom: 7.2rem; } .compatibility-page .vc-movie .content { padding-bottom: 9.6rem; } .compatibility-page .vc-movie .text img { width: 260px; } .compatibility-page .vc-movie .text p { padding: 15px 60px; } } @media (min-width: 2100px) { .compatibility-page #compatibility-header .bg { height: 790px; } .compatibility-page #compatibility-header .swappable-text.hidden-phoneL-down { width: 1920px; height: 120px; -webkit-transform: translateX(16.5%); transform: translateX(16.5%); } .compatibility-page #systems .content h2, .compatibility-page #voice .content h2 { padding-bottom: 6rem; } .compatibility-page #smart-things .content img { width: 560px; height: 87px; } .compatibility-page #smart-things .bg { padding-bottom: 39%; } .compatibility-page #fibaro-bot-header .bg { padding-bottom: 31%; } .compatibility-page #simpler-than-ever .content p { padding: 15px 190px; } .compatibility-page #information-right-away .content p { padding: 15px 190px; } .compatibility-page #possibilities .desktop .product, .compatibility-page #possibilities .desktop .description { width: 80%; } .compatibility-page #possibilities .desktop .description { margin-bottom: 9.6rem; } .compatibility-page #voice-control .content { padding-bottom: 9.6rem; } .compatibility-page .vc-movie .content { padding-bottom: 14.4rem; } .compatibility-page .vc-movie .text img { width: 360px; } .compatibility-page .vc-movie .text > div { padding: 5.4rem 0; } .compatibility-page .vc-movie .text p { padding: 15px 240px; } } .why-fibaro-page #header .content { top: 30%; } .why-fibaro-page #header .content h1 { padding-bottom: 0; color: #fff; } .why-fibaro-page #header .content h1 span { display: block; font-size: 50%; } .why-fibaro-page #header .bg { padding-bottom: 0; height: 290px; } .why-fibaro-page #characteristics .content ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; } .why-fibaro-page #characteristics .content li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; background-repeat: no-repeat; margin-bottom: 4rem; width: 50%; } .why-fibaro-page #characteristics .content li img { height: 60px; width: auto; margin-bottom: 1.6rem; } .why-fibaro-page #characteristics .content li span { text-align: center; display: block; width: 100%; } .why-fibaro-page #your-home { background-color: #edeae5; } .why-fibaro-page #your-home .content { padding-bottom: 0; } .why-fibaro-page #your-home .content img { height: 60px; width: auto; } .why-fibaro-page #your-home .wrapper { width: 100%; height: 290px; overflow-x: auto; } .why-fibaro-page #your-home .wrapper img { height: 100%; width: auto; } .why-fibaro-page #data-safety .content { top: 0; -webkit-transform: none; transform: none; } .why-fibaro-page #data-safety .bg { padding-bottom: 0; height: 290px; } .why-fibaro-page #plug-n-play { background-color: #f5e7d7; } .why-fibaro-page #plug-n-play .content { position: relative; } .why-fibaro-page #plug-n-play .bg { padding-bottom: 0; height: 290px; } .why-fibaro-page #voice-control { background-color: #f4f4f4; } .why-fibaro-page #voice-control .content { position: relative; } .why-fibaro-page #voice-control .bg { padding-bottom: 0; height: 290px; } .why-fibaro-page #anywhere-access .content { position: absolute; z-index: 10; } .why-fibaro-page #anywhere-access .bg { padding-bottom: 0; height: 550px; } .why-fibaro-page #anywhere-access .hint { float: left; margin-top: 60px; } .why-fibaro-page #security { background-color: #f0efec; } .why-fibaro-page #security .content { position: relative; } .why-fibaro-page #security .bg { padding-bottom: 0; height: 290px; } .why-fibaro-page #savings { background-color: #565a68; } .why-fibaro-page #savings .content { position: relative; } .why-fibaro-page #savings .bg { padding-bottom: 0; height: 290px; } .why-fibaro-page #comfort { background-color: #f3eeeb; } .why-fibaro-page #comfort .content { position: relative; } .why-fibaro-page #comfort .bg { padding-bottom: 0; height: 290px; } .why-fibaro-page #explore .content { top: 0; -webkit-transform: none; transform: none; } .why-fibaro-page #explore .content a { display: inline-block; border: 1px solid #0090FF; border-radius: 6px; padding: .6rem 1.2rem; } .why-fibaro-page #explore .bg { padding-bottom: 0; height: 410px; } @media (min-width: 544px) { .why-fibaro-page #header .bg, .why-fibaro-page #data-safety .bg, .why-fibaro-page #plug-n-play .bg, .why-fibaro-page #voice-control .bg, .why-fibaro-page #security .bg, .why-fibaro-page #savings .bg, .why-fibaro-page #comfort .bg { height: 400px; } .why-fibaro-page #anywhere-access .bg { height: 640px; } .why-fibaro-page #your-home .wrapper { height: 400px; } .why-fibaro-page #explore .bg { height: 380px; } } @media (min-width: 768px) { .why-fibaro-page #characteristics .content li { margin-top: 2rem; width: 25%; } .why-fibaro-page #characteristics .content li img { height: 70px; } .why-fibaro-page #plug-n-play .content { position: absolute; color: #fff; text-align: left; top: 35%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .why-fibaro-page #voice-control .content { position: absolute; top: 40%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .why-fibaro-page #anywhere-access .bg { height: 450px; } .why-fibaro-page #anywhere-access .hint { float: none; margin-top: 1.2rem; } .why-fibaro-page #security .content { position: absolute; text-align: left; top: 40%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .why-fibaro-page #security .hint { margin-left: 0; margin-right: 0; } .why-fibaro-page #savings .content { position: absolute; text-align: left; top: 40%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .why-fibaro-page #savings .hint { margin-left: 0; margin-right: 0; } .why-fibaro-page #comfort .content { position: absolute; text-align: left; top: 40%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .why-fibaro-page #comfort .hint { margin-left: 0; margin-right: 0; } } @media (min-width: 992px) { .why-fibaro-page #header .bg, .why-fibaro-page #data-safety .bg, .why-fibaro-page #plug-n-play .bg, .why-fibaro-page #voice-control .bg, .why-fibaro-page #security .bg, .why-fibaro-page #savings .bg, .why-fibaro-page #comfort .bg, .why-fibaro-page #anywhere-access .bg { height: 580px; } .why-fibaro-page #data-safety .bg { height: 550px; } .why-fibaro-page #comfort .content, .why-fibaro-page #security .content, .why-fibaro-page #savings .content { top: 40%; } .why-fibaro-page #your-home .wrapper { height: 580px; } .why-fibaro-page #explore .bg { height: 410px; } } @media (min-width: 1200px) { .why-fibaro-page #header .bg { height: 780px; } .why-fibaro-page #characteristics .content li { margin-bottom: 0; } .why-fibaro-page #plug-n-play .bg, .why-fibaro-page #voice-control .bg, .why-fibaro-page #security .bg, .why-fibaro-page #savings .bg, .why-fibaro-page #comfort .bg, .why-fibaro-page #anywhere-access .bg { height: 660px; } .why-fibaro-page #your-home .content img { display: none; } .why-fibaro-page #your-home .wrapper { height: auto; } .why-fibaro-page #your-home .wrapper img { width: 100%; height: auto; } .why-fibaro-page #explore .content { padding-bottom: 0; } .why-fibaro-page #explore .content a { margin-top: 16rem; font-size: 90%; background-color: transparent; transition: all 250ms; } .why-fibaro-page #explore .content a:hover { background-color: #0090FF; color: #fff; } .why-fibaro-page #explore .bg { height: 450px; } } @media (min-width: 1600px) { .why-fibaro-page #header .bg { height: 1020px; } .why-fibaro-page #plug-n-play .bg, .why-fibaro-page #voice-control .bg, .why-fibaro-page #savings .bg, .why-fibaro-page #comfort .bg, .why-fibaro-page #anywhere-access .bg { height: 870px; } .why-fibaro-page #security .bg { height: 1100px; } .why-fibaro-page #explore .content a { margin-top: 22rem; padding: .8rem 1.6rem; } .why-fibaro-page #explore .bg { height: 560px; } } @media (min-width: 2100px) { .why-fibaro-page #header .bg { height: 1250px; } .why-fibaro-page #explore .content a { margin-top: 26rem; padding: 1.2rem 2.4rem; } .why-fibaro-page #explore .bg { height: 640px; } } .text-page section .content { text-align: left; } .text-page section .content ul, .text-page section .content ol { margin-left: 1em; margin-bottom: 1em; } .text-page section .content ul { list-style-type: disc; } .text-page section .content h2, .text-page section .content h3 { line-height: 1.4; font-size: 120%; margin-top: 2.4rem; } .text-page section .content h3 { margin-bottom: 1em; } .text-page section .content h1 { letter-spacing: 0; font-size: 240%; border-bottom: 1px solid #cccccc; margin-bottom: 4.8rem; padding-bottom: 2.4rem; } .support-page #support-header .content h1 { padding-bottom: 0; color: #fff; } .support-page #support-header .content h1 span { display: block; font-size: 50%; } .support-page #support-header .bg { padding-bottom: 47.4%; } .support-page #basic .content h2 { padding-bottom: 4.8rem; } .support-page #basic .col-phoneS-12 { padding-bottom: 4.8rem; } .support-page #basic .items img { height: 50px; width: auto; margin-bottom: 1.8rem; } .support-page #basic .items h3 { font-size: 160%; padding-bottom: .8rem; } .support-page #basic .items p { padding-bottom: .8rem; } .support-page #finder { background-color: #f4f4f4; } .support-page #finder .content p { padding-bottom: 5.6rem; } .support-page #finder .items img { height: 60px; width: auto; margin-bottom: 1.8rem; } .support-page #finder .items a:before { content: "\2193"; display: inline-block; width: 22px; height: 22px; border: 1px solid #0090FF; border-radius: 50%; vertical-align: top; font-family: Helvetica, Arial, sans-serif; font-size: 87%; font-weight: 400; margin-right: .6rem; } .support-page #finder .items a:after { display: none; } .support-page .support-contact { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; text-align: left; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 3.6rem; } .support-page .support-contact img { width: 40px; height: 40px; margin-right: 1.8rem; float: left; } .support-page .support-contact h3 { font-size: 120%; margin-bottom: 0; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; } .support-page .support-contact a { display: block; } .support-page .support-contact.china { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .support-page #need-help .content h2 { padding-bottom: 4.8rem; } .support-page #need-help .content h2 span { display: none; } .support-page #need-help .content ul { list-style: none; padding-bottom: 3.6rem; } .support-page #need-help .content ul li { text-align: center; padding-bottom: 3.6rem; } .support-page #need-help .content ul li h3 { font-size: 120%; } .support-page #need-help .content p { padding-bottom: 0; } .support-page #need-help .content a { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } .support-page #need-help .content a:hover { border-bottom: 1px solid #0090FF; } .support-page #need-help .content .top .support-contact { color: #0090FF; padding-bottom: 2.4rem; } .support-page #need-help .content .top .support-contact p:first-of-type { font-size: 120%; } .support-page #need-help .content .emails { margin-top: -2em; padding-bottom: 2.4rem; -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .support-page #need-help .content .emails .support-contact { width: 100%; -ms-flex-wrap: nowrap; flex-wrap: nowrap; margin-top: 3em; } .support-page #need-help .content .emails .support-contact img { -ms-flex-item-align: start; align-self: flex-start; margin-left: 2.8rem; display: -webkit-box; display: -ms-flexbox; display: flex; } .support-page #need-help .content .emails .support-contact h3 { font-weight: 400; } .support-page #need-help .content .emails .support-contact p:nth-of-type(2) { margin: 1rem 0; } .support-page #need-help .content .emails .support-contact a { display: inline-block; } .support-page #need-help .content .contact-form { border-bottom: 1px solid #f6f6f6; padding-bottom: 2.4rem; } .support-page #warranty { background-color: #f4f4f4; } .support-page #warranty .content h2 + p { padding-bottom: 4.8rem; } .support-page #warranty .content a { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } .support-page #warranty .content a:hover { border-bottom: 1px solid #0090FF; } .support-page #warranty .content .warranty { box-sizing: border-box; padding: 0 0 0 20px; width: 100%; } .support-page #warranty .content .warranty h3 { padding-bottom: 1.4rem; padding-top: 1rem; font-weight: 500; } .support-page #warranty .content .warranty ul { list-style: decimal; } .support-page #warranty .content .warranty ul li { line-height: 1.8; } .support-page #warranty .content .warranty a { display: inline; } .support-page #service-desk { margin-top: 3.6rem; } .support-page .contact-form h3 { font-size: 175%; } .support-page .contact-form form { text-align: left; } .support-page .contact-form select, .support-page .contact-form input:not([type=checkbox]), .support-page .contact-form textarea { width: 100%; margin-bottom: 1rem; } @media (min-width: 768px) { .support-page #support-header .content h1 span { display: inline; font-size: 100%; } .support-page #support-header .bg { padding-bottom: 0; height: 350px; } .support-page #basic .items p { padding-left: 4rem; padding-right: 4rem; } .support-page #need-help .content ul li { width: 50%; float: left; } .support-page #need-help .content .emails .support-contact { width: 100%; } .support-page #need-help .content .emails .support-contact.china { margin-top: 3.6rem; } .support-page #need-help .content .emails .support-contact p:nth-of-type(2) { margin: 1.5rem 0; } } @media (min-width: 992px) { .support-page #finder .items a:before { width: 24px; height: 24px; font-size: 82%; margin-right: .6rem; } .support-page #warranty .content .warranty { padding: 0 30px 0 60px; width: 45%; } .support-page #warranty .content .warranty ul { font-size: 100%; } } @media (min-width: 1200px) { .support-page #basic .content { padding-bottom: 0; } .support-page #basic .content h2 { padding-bottom: 6rem; } .support-page #basic .col-phoneS-12 { padding-bottom: 6rem; } .support-page #basic .items { padding-bottom: 0; } .support-page #basic .items img { height: 70px; } .support-page #finder .content { padding-bottom: 0; } .support-page #finder .items img { height: 80px; } .support-page #finder .items a:before { width: 28px; height: 28px; font-size: 82%; margin-right: .8rem; position: relative; top: 0; transition: all 250ms; } .support-page #finder .items a:hover:before { color: #fff; background-color: #0090FF; } .support-page .support-contact img { width: 50px; height: 50px; margin-right: 1.8rem; } .support-page #need-help .content { padding-bottom: 0; } .support-page #need-help .content ul li { text-align: left; width: 33.33%; } .support-page #warranty .content .warranty { padding: 0 40px 0 30px; width: 45%; } } @media (min-width: 1600px) { .support-page #basic { padding-top: 6rem; } .support-page #basic .content h2 { padding-bottom: 12rem; } .support-page #basic .col-phoneS-12 { padding-bottom: 12rem; } .support-page #basic .items p { padding-left: 7rem; padding-right: 7rem; } .support-page #finder { padding-top: 2.4rem; } .support-page #finder .content { padding-bottom: 0; } .support-page #finder .items { padding-top: 6rem; padding-bottom: 4.8rem; } .support-page #finder .items img { height: 80px; } .support-page #finder .items a:before { width: 30px; height: 30px; font-size: 82%; margin-right: 1rem; } .support-page .support-contact img { width: 50px; height: 50px; margin-right: 1.8rem; } .support-page #need-help { padding-top: 2.4rem; } .support-page #need-help .content { padding-bottom: 0; } .support-page #need-help .content h2 { padding-bottom: 3.6rem; } .support-page #need-help .content ul { padding-top: 7.2rem; padding-bottom: 14.4rem; } .support-page #need-help .content ul li { text-align: left; } .support-page #need-help .content .emails { padding-bottom: 4.8em; } .support-page #warranty { padding-top: 2.4rem; } .support-page #warranty .content .warranty { width: 40%; } } @media (min-width: 2100px) { .support-page #basic .items p { padding-left: 15rem; padding-right: 15rem; } .support-page #warranty .content .warranty { padding: 0 70px 0 70px; width: 33%; } } .eu-subsidies-page section .content h2, .subsidies-page section .content h2 { margin-bottom: 4.8rem; } .eu-subsidies-page .subsidy, .subsidies-page .subsidy { padding-bottom: 2.4rem; margin-bottom: 4.8rem; border-bottom: 1px solid #f6f6f6; } .eu-subsidies-page .subsidy h3, .subsidies-page .subsidy h3 { font-weight: 400; } .eu-subsidies-page .subsidy img, .subsidies-page .subsidy img { width: 100%; max-width: 360px; height: auto; margin-bottom: 1.2rem; } .eu-subsidies-page .subsidy:last-of-type, .subsidies-page .subsidy:last-of-type { border-bottom: none; margin-bottom: 0; } @media (min-width: 768px) { .eu-subsidies-page .subsidy img, .subsidies-page .subsidy img { max-width: 520px; } } @media (min-width: 1600px) { .eu-subsidies-page .subsidy img, .subsidies-page .subsidy img { max-width: 720px; } } .where-to-buy-page #wtb-header .content h1 { padding-bottom: 0; color: #fff; } .where-to-buy-page #wtb-header .bg { padding-bottom: 52%; } .where-to-buy-page #wtb-header input { width: 100%; display: block; position: relative; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); border: 1px solid #0090FF; padding: .8rem 1rem; border-radius: 6px; color: #0090FF; font-size: 125%; margin-top: 3rem; margin-bottom: 1rem; } .where-to-buy-page #wtb-header input:focus { outline: none; } .where-to-buy-page #wtb-header .iwrapper { position: relative; } .where-to-buy-page #wtb-header .iwrapper a { display: none; width: 20px; height: 21px; position: absolute; right: 1rem; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .where-to-buy-page #wtb-header .iwrapper a img { display: block; width: auto; height: 100%; vertical-align: top; } .where-to-buy-page h2 { padding-top: 1.2rem; padding-bottom: 3.6rem; } .where-to-buy-page .items { text-align: left; } .where-to-buy-page .items .col-phoneS-12 > div { margin-bottom: 2.4rem; } .where-to-buy-page .items h3 { font-weight: 400; padding-bottom: 2.4rem; font-size: 140%; position: relative; } @media (max-width: 1199px) { .where-to-buy-page .items .col-phoneS-12 > div { border-bottom: 1px solid #e1e1e1; } .where-to-buy-page .items p { display: none; } .where-to-buy-page .items h3:after { content: ''; display: block; width: 8px; height: 8px; border-bottom: 1px solid #444444; border-right: 1px solid #444444; position: absolute; right: 3px; top: 5px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .where-to-buy-page .items .open h3:after { border-bottom: 2px solid #444444; border-right: 2px solid #444444; top: 10px; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } .where-to-buy-page .items .open p { display: block; } } @media (min-width: 768px) { .where-to-buy-page #wtb-header .bg { padding-bottom: 0; height: 380px; } .where-to-buy-page h2 { text-align: left; padding-top: 2.4rem; padding-bottom: 4.8rem; } .where-to-buy-page .items .col-phoneS-12 > div { width: 95%; margin-bottom: 4.8rem; } } @media (min-width: 1200px) { .where-to-buy-page #wtb-header input { padding: 1.5rem 3rem; margin-top: 5rem; } .where-to-buy-page #wtb-header .iwrapper { position: relative; } .where-to-buy-page #wtb-header .iwrapper a { width: 24px; height: 25px; right: 1.6rem; } .where-to-buy-page h2 { border-bottom: 1px solid #e1e1e1; padding-bottom: 2.4rem; margin-bottom: 4.8rem; } .where-to-buy-page .items .col-phoneS-12 > div { width: 85%; } .where-to-buy-page .items a { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } .where-to-buy-page .items a:hover { border-bottom: 1px solid #0090FF; } } @media (min-width: 1600px) { .where-to-buy-page #wtb-header input { margin-top: 5rem; } .where-to-buy-page h2 { margin-bottom: 7.2rem; } .where-to-buy-page .items .col-phoneS-12 > div { margin-bottom: 6rem; } } .wtb-noscroll { overflow: hidden; height: 100%; position: fixed; } .where-to-buy-page-redesign .grey-bg { background-color: #F3F6F9; } .where-to-buy-page-redesign #wtb-header .content { top: 50%; -webkit-transform: translateY(-53%); transform: translateY(-53%); } .where-to-buy-page-redesign #wtb-header .content h1 { padding-bottom: 40px; color: #fff; position: relative; opacity: 1; transition: all 1s ease; } .where-to-buy-page-redesign #wtb-header .content h2 { color: #fff; width: 100%; height: 100%; position: fixed; top: 0; left: 0; opacity: 0; transition: all 2s ease; } .where-to-buy-page-redesign #wtb-header .content p { color: #fff; padding-bottom: 40px; transition: all 1s ease; } .where-to-buy-page-redesign #wtb-header .content .show { opacity: 1; } .where-to-buy-page-redesign #wtb-header .content .hide { opacity: 0; margin-top: -80px; } .where-to-buy-page-redesign #wtb-header .bg { padding-bottom: 135%; transition: all 2s ease; } .where-to-buy-page-redesign #wtb-header .active { padding-bottom: 100%; } .where-to-buy-page-redesign #wtb-header input { width: 100%; display: inline-block; position: relative; border: 0 solid #444444; padding: 1.5rem 3rem; border-radius: 6px 6px 0 0; color: #444444; font-size: 125%; margin-top: 1rem; } .where-to-buy-page-redesign #wtb-header input:focus { outline: none; } .where-to-buy-page-redesign #wtb-header .custom-select { position: relative; border: 0 solid #444444; border-radius: 0 0 6px 6px; color: #444444; font-size: 125%; margin-bottom: 1rem; font-weight: 300; -moz-appearance: none; -webkit-appearance: none; display: inline-block; width: 100%; margin-top: 1px; background-color: #ffffff; height: 54px; } .where-to-buy-page-redesign #wtb-header .custom-select select { display: none; } .where-to-buy-page-redesign #wtb-header .distance-select { border-radius: 0 6px 0 0; margin-top: 1rem; margin-bottom: 0; position: absolute; z-index: 1; width: 45%; max-width: 150px; right: 0; } .where-to-buy-page-redesign #wtb-header .distance-select .select-selected { border-radius: 0 6px 0 0; padding: 1.4rem 2rem; } .where-to-buy-page-redesign #wtb-header .custom-select.distance-select { display: none; } .where-to-buy-page-redesign #wtb-header .custom-select.distance-select:before { display: block; position: absolute; content: ''; background: #9e9e9e; height: 100%; width: 1px; } .where-to-buy-page-redesign #wtb-header .select-selected { background-color: #ffffff; } .where-to-buy-page-redesign #wtb-header .select-selected:after { content: ''; display: block; width: 8px; height: 8px; border-right: 1px solid #444; border-bottom: 1px solid #444; position: absolute; right: 27px; top: 25px; -webkit-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg); transition: all 250ms; } .where-to-buy-page-redesign #wtb-header .select-selected.select-arrow-active:after { top: 29px; -webkit-transform: translateY(-50%) rotate(225deg); transform: translateY(-50%) rotate(225deg); } .where-to-buy-page-redesign #wtb-header .select-items div, .where-to-buy-page-redesign #wtb-header .select-selected { color: #444444; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none; border: 0 solid #444444; padding: 1.4rem 3rem; border-radius: 0 0 6px 6px; text-align: left; border-top: 1px solid #e1e1e1; } .where-to-buy-page-redesign #wtb-header .select-items { position: absolute; background-color: #f7f7f7; top: 100%; left: 0; right: 0; z-index: 99; height: 213px; overflow-y: auto; border-bottom: 1px solid #e1e1e1; } .where-to-buy-page-redesign #wtb-header .select-hide { display: none; } .where-to-buy-page-redesign #wtb-header .select-items div:hover, .where-to-buy-page-redesign #wtb-header .same-as-selected { background-color: rgba(0, 0, 0, 0.1); } .where-to-buy-page-redesign #wtb-header .btn-submit { color: #fff; padding: 15px 15px; background: #0090ff; border: 0 none; cursor: pointer; border-radius: 6px; font-size: 125%; font-weight: 600; width: 100%; } .where-to-buy-page-redesign #wtb-header .btn-submit img { width: 30px; height: 30px; margin-bottom: 1px; } .where-to-buy-page-redesign #wtb-header .iwrapper { position: relative; } .where-to-buy-page-redesign #wtb-header .iwrapper form { position: relative; } .where-to-buy-page-redesign #wtb-header .iwrapper a { display: none; width: 20px; height: 21px; position: absolute; left: 15px; top: 27px; z-index: 10; } .where-to-buy-page-redesign #wtb-header .iwrapper a img { display: block; width: auto; height: 70%; vertical-align: top; margin-top: 15%; margin-left: -5px; } .where-to-buy-page-redesign #wtb-header .hint { border: 0; color: #ffffff; background-color: #000000; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 70%; max-width: 380px; bottom: 130px; border-radius: 4px; padding: 3.2rem 3rem; font-size: 120%; display: inline-block; height: auto; box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.5); opacity: 0; z-index: 1000; } .where-to-buy-page-redesign #wtb-header .hint figcaption { text-transform: none; line-height: 1.9; text-align: center; } .where-to-buy-page-redesign #wtb-header .hint div { font-size: 100%; line-height: 1.9; } .where-to-buy-page-redesign #wtb-header .hint span { font-size: 100%; font-weight: 600; } .where-to-buy-page-redesign #wtb-header .hint img { margin-right: 2.4rem; height: 40px !important; max-width: 40px !important; } .where-to-buy-page-redesign #wtb-header .hint:before { content: ""; position: absolute; top: 99%; left: 50%; margin-left: -9px; border-width: 9px; border-style: solid; border-color: #000000 transparent transparent transparent; } .where-to-buy-page-redesign #wtb-header .hint.show-tooltip { -webkit-animation: bounce 5s ease-in-out; animation: bounce 5s ease-in-out; -webkit-transform-origin: bottom; transform-origin: bottom; } @-webkit-keyframes bounce { 0% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } 5% { -webkit-transform: translateX(-50%) scale(1.2); transform: translateX(-50%) scale(1.2); opacity: 0.9; } 6% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } 95% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); opacity: 0.9; } 100% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } } @keyframes bounce { 0% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } 5% { -webkit-transform: translateX(-50%) scale(1.2); transform: translateX(-50%) scale(1.2); opacity: 0.9; } 6% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } 95% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); opacity: 0.9; } 100% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } } .where-to-buy-page-redesign #wtb-filters-button { box-shadow: 0 2px 5px 0 #e1e5e8; background-color: #ffffff; display: none; position: relative; transition: opacity 2s ease; } .where-to-buy-page-redesign #wtb-filters-button.show-content { display: block; } .where-to-buy-page-redesign #wtb-filters-button .content { color: #0090ff; text-transform: uppercase; font-size: 1.8rem; font-weight: 600; } .where-to-buy-page-redesign #wtb-filters-button .content p { padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .where-to-buy-page-redesign #wtb-filters-button .content img { width: 24px; height: 24px; margin-right: 20px; } .where-to-buy-page-redesign [aria-hidden="true"] { transition: opacity 1s; width: 100vw; z-index: -10; opacity: 0; } .where-to-buy-page-redesign [aria-hidden="false"] { transition: opacity 1s; width: 100%; z-index: 1000; opacity: 1; } .where-to-buy-page-redesign #wtb-results-mobile, .where-to-buy-page-redesign #wtb-results-desktop { opacity: 0; display: none; position: absolute; transition: opacity 2s ease; } .where-to-buy-page-redesign #wtb-results-mobile.show-content, .where-to-buy-page-redesign #wtb-results-desktop.show-content { opacity: 1; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters { position: fixed; z-index: 10000; width: 100vw; height: 100vh; top: 50px; left: 0; background-color: #ffffff; opacity: 1; overflow-y: scroll; transition: opacity .25s, left 0s .25s; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .wtb-filters-close, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .wtb-filters-close, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .wtb-filters-close { padding: 2.4rem 1rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-transform: uppercase; font-weight: 600; font-size: 18px; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .wtb-filters-close img, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .wtb-filters-close img, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .wtb-filters-close img { width: 24px; height: 24px; margin-right: 20px; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .wrapper, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .wrapper, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .wrapper { padding-bottom: 6rem; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .filter, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .filter, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .filter { padding-top: 4rem; padding-bottom: 4rem; border-bottom: 1px solid #E1E5E8; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .filter.first, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .filter.first, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .filter.first { padding-top: 2rem; padding-bottom: 4rem; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .filter.last, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .filter.last, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .filter.last { border-bottom: 0; padding-bottom: 40px; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .filter-type, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .filter-type, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .filter-type { font-weight: 600; font-size: 1.6em; text-align: center; padding-bottom: 0.5rem; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .info-icon, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .info-icon, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .info-icon { width: 16px; height: 16px; margin: 16px 0 0 8px; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters input[type=checkbox].checkbox, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters input[type=checkbox].checkbox, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters input[type=checkbox].checkbox { position: absolute; z-index: -1000; left: -1000px; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters input[type=checkbox].checkbox + label.label, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters input[type=checkbox].checkbox + label.label, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters input[type=checkbox].checkbox + label.label { padding-left: 45px; height: 20px; display: inline-block; line-height: 18px; background-repeat: no-repeat; background-position: 0 0; font-size: 18px; vertical-align: middle; cursor: pointer; font-weight: 400; margin-top: 2.2rem; margin-left: 5rem; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters input[type=checkbox].checkbox:checked + label.label, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters input[type=checkbox].checkbox:checked + label.label, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters input[type=checkbox].checkbox:checked + label.label { background-image: url(/../../wp-content/themes/fibaro-wp-theme/img/common/checkmark_1.svg); } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters label.label, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters label.label, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters label.label { background-image: url(/../../wp-content/themes/fibaro-wp-theme/img/common/checkmark_0.svg); -webkit-touch-callout: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .btn-ok, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .btn-ok, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .btn-ok { color: #ffffff; font-size: 18px; padding: 15px 15px; background: #0090ff; border: 0 none; cursor: pointer; border-radius: 25px; font-weight: 600; width: 130px; height: 40px; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); margin-bottom: 100px; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .label-hint, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .label-hint, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .label-hint { border: 0; color: #ffffff; background-color: #000000; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 80%; max-width: 400px; top: 70px; border-radius: 4px; padding: 2.2rem 2.2rem; font-size: 18px; display: inline-block; height: auto; box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.5); z-index: 10; opacity: 0; transition: opacity 150ms ease-in-out; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .label-hint figcaption, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .label-hint figcaption, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .label-hint figcaption { text-transform: none; line-height: 1.6; text-align: center; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .label-hint div, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .label-hint div, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .label-hint div { font-size: 100%; line-height: 1.6; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .label-hint span, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .label-hint span, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .label-hint span { font-size: 100%; font-weight: 600; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .label-hint img, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .label-hint img, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .label-hint img { margin-right: 2.4rem; height: 40px !important; max-width: 40px !important; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .label-hint .close, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .label-hint .close, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .label-hint .close { text-align: right; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .label-hint .close img, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .label-hint .close img, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .label-hint .close img { width: 24px; height: 24px; margin-right: -10px; margin-top: -25px; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .label-hint.active, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .label-hint.active, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .label-hint.active { opacity: 1; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .labels-bg, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .labels-bg, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .labels-bg { position: absolute; width: 100%; height: 100%; top: 0; z-index: 20; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper { opacity: 0; overflow: hidden; margin: 0 auto; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .results-title, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .results-title, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .results-title { margin-top: 2.4rem; margin-bottom: 1rem; font-size: 20px; font-weight: 300; padding-left: 1px; text-align: center; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item { border-top: 1px solid #E1E5E8; background-color: #FFFFFF; padding: 25px; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item:last-of-type, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item:last-of-type, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item:last-of-type { border-bottom: 1px solid #E1E5E8; box-shadow: 0 1px 0 0 rgba(155, 155, 155, 0.2), 0 10px 60px 0 rgba(0, 0, 0, 0.02); margin-bottom: 3rem; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .company, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .company, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .company { font-size: 18px; font-weight: 600; margin-bottom: 6px; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .install_label, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .install_label, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .install_label { background-color: #4BC4FF; color: #ffffff; border-radius: 4px; padding: 4px 12px; margin-right: 10px; font-size: 80%; position: relative; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .buy_label, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .buy_label, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .buy_label { background-color: #494495; color: #ffffff; border-radius: 4px; padding: 4px 12px; margin-right: 10px; font-size: 80%; position: relative; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .demo_label, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .demo_label, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .demo_label { background-color: #E8308A; color: #ffffff; border-radius: 4px; padding: 4px 12px; margin-right: 10px; font-size: 80%; position: relative; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .category, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .category, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .category { margin-bottom: 28px; line-height: 2.4; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .address, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .address, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .address { font-size: 18px; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .link, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .link, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .link { margin: 28px 0 10px; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .distance-mobile, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .distance-mobile, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .distance-mobile { position: absolute; right: 5px; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .distance-desktop, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .distance-desktop, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .distance-desktop { display: none; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .distance_value, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .distance_value, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .distance_value { font-weight: 600; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item a { color: #ffffff; font-size: 14px; padding: 8px 40px; background: #0090ff; border: 0 none; cursor: pointer; border-radius: 25px; font-weight: 400; width: 130px; height: 40px; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item.online a, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item.online a, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item.online a { color: #444444; background: #F1F4F5; border: 1px solid #0090ff; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .no-results-wrapper, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .no-results-wrapper, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .no-results-wrapper { display: none; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .no-results-wrapper .no-results, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .no-results-wrapper .no-results, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .no-results-wrapper .no-results { text-align: center; margin-bottom: 2.4rem; padding: 0 25px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; font-weight: 600; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .no-results-wrapper .no-results img, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .no-results-wrapper .no-results img, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .no-results-wrapper .no-results img { width: 24px; height: 24px; margin-right: 20px; display: none; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .no-results-wrapper .no-results span, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .no-results-wrapper .no-results span, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .no-results-wrapper .no-results span { font-weight: 300; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .no-results-wrapper.active, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .no-results-wrapper.active, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .no-results-wrapper.active { display: block; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .search-inquery, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .search-inquery, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .search-inquery { font-weight: 600; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper.display, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper.display, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper.display { opacity: 1; transition: all 1s ease-in-out; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint, .where-to-buy-page-redesign #wtb-results-mobile .label-hint, .where-to-buy-page-redesign #wtb-results-desktop .label-hint { display: none; } .where-to-buy-page-redesign #popup-modal.modal { display: none; position: fixed; z-index: 110; padding-top: 53px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(19, 24, 32, 0.8); -webkit-filter: blur(10x); filter: blur(10x); } .where-to-buy-page-redesign #popup-modal .content { text-align: left; } .where-to-buy-page-redesign #popup-modal .modal-content { background-color: #fefefe; margin: auto auto 70px auto; border: 1px rgba(255, 255, 255, 0); width: 100%; max-width: 1000px; font-size: 18px; line-height: 1.4; border-radius: 4px 6px 4px 4px; position: relative; } .where-to-buy-page-redesign #popup-modal .row { width: 100%; } .where-to-buy-page-redesign #popup-modal .close { color: #ffffff; float: right; font-size: 38px; font-weight: 300; position: absolute; right: 0; top: 0; background-color: #4A4A4A; border-radius: 0 2px 0; padding: 0 16px; z-index: 10; } .where-to-buy-page-redesign #popup-modal .close:hover, .where-to-buy-page-redesign #popup-modal .close:focus { background-color: #0090ff; text-decoration: none; cursor: pointer; } .where-to-buy-page-redesign #popup-modal h2 { text-transform: uppercase; font-size: 34px; } .where-to-buy-page-redesign #popup-modal .install_label { background-color: #4BC4FF; color: #ffffff; border-radius: 4px; padding: 3px 12px; margin-right: 10px; font-size: 13px; position: relative; } .where-to-buy-page-redesign #popup-modal .buy_label { background-color: #494495; color: #ffffff; border-radius: 4px; padding: 3px 12px; margin-right: 10px; font-size: 13px; position: relative; } .where-to-buy-page-redesign #popup-modal .demo_label { background-color: #E8308A; color: #ffffff; border-radius: 4px; padding: 3px 12px; margin-right: 10px; font-size: 13px; position: relative; } .where-to-buy-page-redesign #popup-modal .subcategory { margin-top: 30px; font-size: 13px; } .where-to-buy-page-redesign #popup-modal .company { font-size: 24px; font-weight: 700; margin-bottom: 6px; } .where-to-buy-page-redesign #popup-modal .address_label, .where-to-buy-page-redesign #popup-modal .contact_details_label { margin: 25px 0 7px; font-weight: 600; } .where-to-buy-page-redesign #popup-modal .contact-details { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 0; margin: 5px 0; } .where-to-buy-page-redesign #popup-modal .additional-info { display: block; } .where-to-buy-page-redesign #popup-modal .additional-info div:first-of-type { padding-left: 0; } .where-to-buy-page-redesign #popup-modal .www_label, .where-to-buy-page-redesign #popup-modal .website_label { display: none; } .where-to-buy-page-redesign #popup-modal .telephone_label, .where-to-buy-page-redesign #popup-modal .email_label, .where-to-buy-page-redesign #popup-modal .www_label { padding: 0; } .where-to-buy-page-redesign #popup-modal .phone_label .mail_label a, .where-to-buy-page-redesign #popup-modal .website_label a { color: #0090ff; } .where-to-buy-page-redesign #popup-modal .phone_label .mail_label a:hover, .where-to-buy-page-redesign #popup-modal .website_label a:hover { border-bottom: 1px solid #0090ff; } .where-to-buy-page-redesign #popup-modal .assortment_label, .where-to-buy-page-redesign #popup-modal .opening_hours_label { margin: 35px 0 7px; font-weight: 600; } .where-to-buy-page-redesign #popup-modal .tab_link_label { margin: 35px 0 7px; } .where-to-buy-page-redesign #popup-modal .tab_link { font-size: 15px; } .where-to-buy-page-redesign #popup-modal .tab_link a { margin-right: 8px; } .where-to-buy-page-redesign #popup-modal .tab_link img { width: 14px; height: auto; margin: -3px 8px 0 0; } .where-to-buy-page-redesign #popup-modal .tab_link input { position: absolute; z-index: -100; opacity: 0.01; } .where-to-buy-page-redesign #popup-modal .tooltip { position: relative; display: inline-block; } .where-to-buy-page-redesign #popup-modal .tooltip .tooltiptext { visibility: hidden; width: auto; color: #00C14D; text-align: center; padding: 16px; font-weight: 600; position: absolute; z-index: 1; bottom: -140%; left: 130%; opacity: 0; transition: opacity 0.3s; border: 1px solid #00C14D; border-radius: 4px; background-color: #F2F7EC; } .where-to-buy-page-redesign #popup-modal .tooltip .tooltiptext::before { content: ""; position: absolute; top: 40%; left: -6px; margin-left: -5px; border-width: 5px; border-style: solid; border-color: transparent #00C14D transparent transparent; } .where-to-buy-page-redesign #popup-modal .tooltip .tooltiptext.copied::before { top: 53%; } .where-to-buy-page-redesign #popup-modal .tooltip:hover .tooltiptext { visibility: visible; opacity: 1; } .where-to-buy-page-redesign #popup-modal .modal-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; } .where-to-buy-page-redesign #popup-modal .modal-wrapper .label-hint { display: none; } .where-to-buy-page-redesign #popup-modal .show-map { background-color: #0090ff; padding: 15px 25px; border-radius: 4px; font-weight: 600; z-index: 10; text-align: center; max-width: 250px; margin: 40px 0 20px; } .where-to-buy-page-redesign #popup-modal .show-map a { color: #ffffff; } .where-to-buy-page-redesign #popup-modal .distance-mobile, .where-to-buy-page-redesign #popup-modal .distance-desktop { margin-top: 1rem; } .where-to-buy-page-redesign #popup-modal .distance_value { font-weight: 600; } .where-to-buy-page-redesign #labels { display: none; } @media (min-width: 544px) { .where-to-buy-page-redesign #wtb-header .bg { padding-bottom: 0; height: calc(100vh - 52px); transition: all 2s ease; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } .where-to-buy-page-redesign #wtb-header .active { height: 75vh; } .where-to-buy-page-redesign #wtb-header .content .hide { margin-top: -60px; } .where-to-buy-page-redesign #wtb-header .hint { width: 50%; padding: 3.2rem 4rem; } } @media only screen and (min-width: 640px) { .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item { border-left: 1px solid #E1E5E8; border-right: 1px solid #E1E5E8; } } @media (min-width: 768px) { .where-to-buy-page-redesign #wtb-header .content p { padding-bottom: 60px; } .where-to-buy-page-redesign #wtb-header .bg { padding-bottom: 0; height: calc(100vh - 52px); transition: all 2s ease; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } .where-to-buy-page-redesign #wtb-header .active { height: 45vh; } .where-to-buy-page-redesign #wtb-header .content .hide { margin-top: -80px; } .where-to-buy-page-redesign #wtb-header .hint { width: 60%; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .inputs-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .info-icon { margin: 24px 0 0 8px; } .where-to-buy-page-redesign #popup-modal .modal-content { width: 80%; margin-top: 10%; } } @media (min-width: 992px) { .where-to-buy-page-redesign #wtb-header .bg { padding-bottom: 0; height: calc(100vh - 52px); } .where-to-buy-page-redesign #wtb-header .active { height: 45vh; } .where-to-buy-page-redesign #wtb-header .hint { width: 50%; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item { padding: 25px 40px; border-bottom: 1px solid #E1E5E8; margin-bottom: 1.4rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .category, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .category, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .category { margin-bottom: 0; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .company, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .company, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .company { padding-right: 5px; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .link, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .link, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .link { margin: 0; text-align: center; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .distance-mobile, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .distance-mobile, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .distance-mobile { display: none; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .distance-desktop, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .distance-desktop, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .distance-desktop { display: block; margin: -1.7rem 0 1.7rem; text-align: center; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item a { transition: all 250ms; border: 1px solid #0090ff; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item a:hover, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item a:hover, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item a:hover { color: #0090ff; background-color: #ffffff; border: 1px solid #0090ff; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item.online .company, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item.online .company, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item.online .company { margin-bottom: 0; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .no-results-wrapper .no-results, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .no-results-wrapper .no-results, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .no-results-wrapper .no-results { border: 1px solid #656E7B; border-radius: 4px; background-color: #FFFFFF; padding: 25px 40px; text-align: left; -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .no-results-wrapper .no-results img, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .no-results-wrapper .no-results img, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .no-results-wrapper .no-results img { display: block; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .no-results-wrapper .no-results span, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .no-results-wrapper .no-results span, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .no-results-wrapper .no-results span { display: block; } .where-to-buy-page-redesign #popup-modal .modal-content { margin-top: 52px; } .where-to-buy-page-redesign #popup-modal .without_map { width: 60%; } .where-to-buy-page-redesign #popup-modal .modal-wrapper .label-hint { display: block; } .where-to-buy-page-redesign #popup-modal .map { background-color: #ffffff; width: 100%; height: auto; right: 1px; padding: 0; border-radius: 0 5px 4px 0; } .where-to-buy-page-redesign #popup-modal .map iframe { height: 100vh; max-height: 850px; margin-bottom: -6px; } .where-to-buy-page-redesign #popup-modal .map .iframe_map { background-position: 50% 50%; background-size: cover; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; overflow: hidden; } .where-to-buy-page-redesign #popup-modal .map img { max-height: 50vh; } .where-to-buy-page-redesign #popup-modal .bigger-map { position: absolute; background-color: #ffffff; padding: 25px 35px; border-radius: 4px 0 4px; right: 0; font-weight: 600; bottom: 0; z-index: 10; } .where-to-buy-page-redesign #popup-modal .bigger-map a { color: #444444; } .where-to-buy-page-redesign #popup-modal .bigger-map a:hover { color: #0090ff; } .where-to-buy-page-redesign #popup-modal .tooltip .tooltiptext { min-width: 250px; bottom: -80%; } .where-to-buy-page-redesign #popup-modal .tooltip .tooltiptext.copied::before { top: 40%; } } @media (min-width: 1200px) { .where-to-buy-page-redesign.fixed-grid main { overflow: visible; } .where-to-buy-page-redesign #wtb-header { width: auto; max-width: 2560px; } .where-to-buy-page-redesign #wtb-header .content { -webkit-transform: translateY(-45%); transform: translateY(-45%); } .where-to-buy-page-redesign #wtb-header .content h1 { font-size: 42px; padding-bottom: 0; } .where-to-buy-page-redesign #wtb-header .content p { font-size: 1.8rem; padding-bottom: 13px; } .where-to-buy-page-redesign #wtb-header .content .hide { margin-top: -70px; } .where-to-buy-page-redesign #wtb-header .content h1.two-rows.hide { margin-top: -120px; } .where-to-buy-page-redesign #wtb-header form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; box-shadow: 0 3px 6px 1px rgba(0, 0, 0, 0.2); margin-top: 5rem; border-radius: 10px; } .where-to-buy-page-redesign #wtb-header input { padding: 15px 30px; margin-top: 0; width: 100%; border-radius: 6px 0 0 6px; height: 54px; } .where-to-buy-page-redesign #wtb-header .distance-container { width: 45%; position: relative; } .where-to-buy-page-redesign #wtb-header .distance-container .distance-select { height: 54px; max-width: 130px; } .where-to-buy-page-redesign #wtb-header .distance-container .distance-select .select-selected { padding: 1.5rem 2rem; } .where-to-buy-page-redesign #wtb-header .distance-container .distance-select:before { width: 0; } .where-to-buy-page-redesign #wtb-header .custom-select { width: 250px; margin-top: 0; margin-bottom: 0; border-radius: 0; } .where-to-buy-page-redesign #wtb-header .select-items div, .where-to-buy-page-redesign #wtb-header .select-selected { padding: 15px 30px; border-radius: 0; border-left: 1px solid #e1e1e1; border-right: 1px solid #e1e1e1; } .where-to-buy-page-redesign #wtb-header .select-items div:first-of-type, .where-to-buy-page-redesign #wtb-header .select-selected:first-of-type { border-right: 0; } .where-to-buy-page-redesign #wtb-header .select-selected { height: 54px; border-radius: 0; border-top: 0; } .where-to-buy-page-redesign #wtb-header .select-selected::after { top: 26px; } .where-to-buy-page-redesign #wtb-header .select-selected.select-arrow-active:after { top: 31px; } .where-to-buy-page-redesign #wtb-header .btn-submit { width: 22%; font-size: 125%; border-radius: 0 6px 6px 0; padding: 13px 15px; height: 54px; } .where-to-buy-page-redesign #wtb-header .btn-submit img { margin-bottom: 2px; } .where-to-buy-page-redesign #wtb-header .iwrapper { position: relative; } .where-to-buy-page-redesign #wtb-header .iwrapper a { width: 40px; height: 21px; left: 160px; top: 17px; padding-left: 15px; } .where-to-buy-page-redesign #wtb-header .bg { height: calc(100vh - 64px); } .where-to-buy-page-redesign #wtb-header .active { height: 280px; } .where-to-buy-page-redesign #wtb-header .hint { width: 60%; left: 88%; bottom: 80px; padding: 2.2rem 4rem; } .where-to-buy-page-redesign #wtb-filters-overlay, .where-to-buy-page-redesign #wtb-results-mobile, .where-to-buy-page-redesign #wtb-results-desktop { padding: 5rem 0 8rem; opacity: 0; display: none; position: absolute; transition: opacity 2s ease; } .where-to-buy-page-redesign #wtb-filters-overlay.show-content, .where-to-buy-page-redesign #wtb-results-mobile.show-content, .where-to-buy-page-redesign #wtb-results-desktop.show-content { opacity: 1; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters { background-color: #F9FAFC; position: relative; overflow: visible; z-index: 0; width: 100%; height: auto; top: 0; border: 1px solid #E1E5E8; border-radius: 4px; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .filter-type, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .filter-type, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .filter-type { font-size: 1.3em; text-align: left; margin-left: 5rem; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .wrapper, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .wrapper, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .wrapper { padding-bottom: 0; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .filter.first, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .filter.first, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .filter.first { padding-top: 4rem; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .filter.last, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .filter.last, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .filter.last { padding-bottom: 4rem; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .info-icon, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .info-icon, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .info-icon { margin: 0; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters .label-hint, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters .label-hint, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters .label-hint { padding: 1.2rem 1.2rem; font-size: 10px; bottom: 12px; width: 140px; top: auto; left: calc(100% - 8px); } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters input[type=checkbox].checkbox + label.label, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters input[type=checkbox].checkbox + label.label, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters input[type=checkbox].checkbox + label.label { font-size: 14px; height: 18px; padding-left: 35px; position: relative; } .where-to-buy-page-redesign #wtb-filters-overlay .filters-wrapper .filters-title, .where-to-buy-page-redesign #wtb-results-mobile .filters-wrapper .filters-title, .where-to-buy-page-redesign #wtb-results-desktop .filters-wrapper .filters-title { margin-top: 3rem; font-size: 14px; font-weight: 300; padding-left: 3px; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper { padding-left: 5rem; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .results-title, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .results-title, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .results-title { margin-top: 3rem; margin-bottom: 0; font-size: 14px; text-align: left; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item { border-radius: 4px; box-shadow: 0 1px 0 0 rgba(155, 155, 155, 0.2), 0 10px 60px 0 rgba(0, 0, 0, 0.02); padding: 25px 40px; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .company, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .company, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .company { font-size: 1.3em; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .address, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .address, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .address { font-size: 1.1em; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .link, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .link, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .link { text-align: center; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .category, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .category, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .category { width: 115%; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item a { padding: 8px 30px; width: 110px; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint, .where-to-buy-page-redesign #wtb-results-mobile .label-hint, .where-to-buy-page-redesign #wtb-results-desktop .label-hint { border: 0; color: #ffffff; background-color: #000000; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 140px; bottom: 12px; border-radius: 4px; padding: 1.2rem 1.2rem; font-size: 10px; display: inline-block; height: auto; box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.5); z-index: 10; opacity: 0; transition: opacity 150ms ease-in-out; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint figcaption, .where-to-buy-page-redesign #wtb-results-mobile .label-hint figcaption, .where-to-buy-page-redesign #wtb-results-desktop .label-hint figcaption { text-transform: none; line-height: 1.6; text-align: center; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint div, .where-to-buy-page-redesign #wtb-results-mobile .label-hint div, .where-to-buy-page-redesign #wtb-results-desktop .label-hint div { font-size: 100%; line-height: 1.6; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint span, .where-to-buy-page-redesign #wtb-results-mobile .label-hint span, .where-to-buy-page-redesign #wtb-results-desktop .label-hint span { font-size: 100%; font-weight: 600; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint img, .where-to-buy-page-redesign #wtb-results-mobile .label-hint img, .where-to-buy-page-redesign #wtb-results-desktop .label-hint img { margin-right: 2.4rem; height: 40px !important; max-width: 40px !important; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint .close, .where-to-buy-page-redesign #wtb-results-mobile .label-hint .close, .where-to-buy-page-redesign #wtb-results-desktop .label-hint .close { display: none; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint.distance, .where-to-buy-page-redesign #wtb-results-mobile .label-hint.distance, .where-to-buy-page-redesign #wtb-results-desktop .label-hint.distance { bottom: 55px; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint.active, .where-to-buy-page-redesign #wtb-results-mobile .label-hint.active, .where-to-buy-page-redesign #wtb-results-desktop .label-hint.active { opacity: 1; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint:before, .where-to-buy-page-redesign #wtb-results-mobile .label-hint:before, .where-to-buy-page-redesign #wtb-results-desktop .label-hint:before { content: ""; position: absolute; top: 99%; left: 50%; margin-left: -9px; border-width: 9px; border-style: solid; border-color: #000000 transparent transparent transparent; } .where-to-buy-page-redesign #wtb-filters-overlay .label-hint.show-tooltip, .where-to-buy-page-redesign #wtb-results-mobile .label-hint.show-tooltip, .where-to-buy-page-redesign #wtb-results-desktop .label-hint.show-tooltip { -webkit-animation: bounce 5s ease-in-out; animation: bounce 5s ease-in-out; -webkit-transform-origin: bottom; transform-origin: bottom; } @-webkit-keyframes bounce { 0% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } 5% { -webkit-transform: translateX(-50%) scale(1.2); transform: translateX(-50%) scale(1.2); opacity: 0.9; } 6% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } 95% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); opacity: 0.9; } 100% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } } @keyframes bounce { 0% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } 5% { -webkit-transform: translateX(-50%) scale(1.2); transform: translateX(-50%) scale(1.2); opacity: 0.9; } 6% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } 95% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); opacity: 0.9; } 100% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } } .where-to-buy-page-redesign #popup-modal .modal { padding-top: 130px; } .where-to-buy-page-redesign #popup-modal .modal-content { margin-top: 5%; } .where-to-buy-page-redesign #popup-modal .modal-wrapper .content { padding-top: 5rem; padding-bottom: 4.5rem; } .where-to-buy-page-redesign #popup-modal .additional-info { display: -webkit-box; display: -ms-flexbox; display: flex; } .where-to-buy-page-redesign #popup-modal .map iframe { max-height: 670px; } .where-to-buy-page-redesign #popup-modal .label-hint { border: 0; color: #ffffff; background-color: #000000; position: absolute; left: 115%; width: 200px; height: 50px; top: -13px; border-radius: 4px; padding: 1.2rem 1.5rem; font-size: 90%; display: inline-block; box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.5); z-index: 10; opacity: 0; transition: opacity 150ms ease-in-out; } .where-to-buy-page-redesign #popup-modal .label-hint figcaption { text-transform: none; line-height: 1.6; text-align: center; } .where-to-buy-page-redesign #popup-modal .label-hint div { font-size: 100%; line-height: 1.6; } .where-to-buy-page-redesign #popup-modal .label-hint span { font-size: 100%; font-weight: 600; } .where-to-buy-page-redesign #popup-modal .label-hint img { margin-right: 2.4rem; height: 40px !important; max-width: 40px !important; } .where-to-buy-page-redesign #popup-modal .label-hint .close { display: none; } .where-to-buy-page-redesign #popup-modal .label-hint.active { opacity: 1; } .where-to-buy-page-redesign #popup-modal .label-hint:before { content: ""; position: absolute; top: 50%; left: 0; margin-left: -18px; border-width: 9px; border-style: solid; border-color: #000000 transparent transparent transparent; -webkit-transform: rotate(90deg) translateX(-50%); transform: rotate(90deg) translateX(-50%); } .where-to-buy-page-redesign #popup-modal .label-hint.show-tooltip { -webkit-animation: bounce 5s ease-in-out; animation: bounce 5s ease-in-out; -webkit-transform-origin: bottom; transform-origin: bottom; } @keyframes bounce { 0% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } 5% { -webkit-transform: translateX(-50%) scale(1.2); transform: translateX(-50%) scale(1.2); opacity: 0.9; } 6% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } 95% { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); opacity: 0.9; } 100% { -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); opacity: 0; } } } @media (min-width: 1600px) { .where-to-buy-page-redesign #wtb-header .content h1 { font-size: 50px; } .where-to-buy-page-redesign #wtb-header .content p { font-size: 2rem; padding-bottom: 13px; } .where-to-buy-page-redesign #wtb-header .content .hide { margin-top: -80px; } .where-to-buy-page-redesign #wtb-header .content .hide.height { height: 70px; } .where-to-buy-page-redesign #wtb-header .content h1.two-rows.hide { margin-top: -140px; } .where-to-buy-page-redesign #wtb-header input { height: 60px; } .where-to-buy-page-redesign #wtb-header .distance-container .distance-select { height: 60px; } .where-to-buy-page-redesign #wtb-header .custom-select { width: 350px; height: 60px; } .where-to-buy-page-redesign #wtb-header .select-selected { height: 60px; } .where-to-buy-page-redesign #wtb-header .select-selected::after { top: 28px; } .where-to-buy-page-redesign #wtb-header .select-selected.select-arrow-active:after { top: 33px; } .where-to-buy-page-redesign #wtb-header .select-items { height: 237px; } .where-to-buy-page-redesign #wtb-header .btn-submit { height: 60px; } .where-to-buy-page-redesign #wtb-header .iwrapper a { left: 235px; margin-top: 4px; } .where-to-buy-page-redesign #wtb-header .bg { height: calc(100vh - 80px); } .where-to-buy-page-redesign #wtb-header .active { height: 310px; } .where-to-buy-page-redesign #wtb-filters-overlay .wtb-filters input[type=checkbox].checkbox + label.label, .where-to-buy-page-redesign #wtb-results-mobile .wtb-filters input[type=checkbox].checkbox + label.label, .where-to-buy-page-redesign #wtb-results-desktop .wtb-filters input[type=checkbox].checkbox + label.label { margin: 2.2rem 0 0 4.5rem; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .company, .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .address, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .company, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .address, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .company, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .address { font-size: 1.3em; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .category, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .category, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .category { margin-bottom: 10px; width: 100%; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .link, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .link, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .link { position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .distance-desktop, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .distance-desktop, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .distance-desktop { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin: 0 0 0 5rem; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .distance_value, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .distance_value, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .distance_value { display: block; text-align: left; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item a { padding: 8px 40px; width: 140px; } .where-to-buy-page-redesign #popup-modal .modal-content { margin-top: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .where-to-buy-page-redesign #popup-modal .modal-wrapper .content { padding-bottom: 4.3rem; } .where-to-buy-page-redesign #popup-modal .without_map { width: 40%; } } @media (min-width: 2100px) { .where-to-buy-page-redesign #wtb-header .content { -webkit-transform: translateY(-50%); transform: translateY(-50%); } .where-to-buy-page-redesign #wtb-header .content h1 { font-size: 62px; } .where-to-buy-page-redesign #wtb-header .content p { font-size: 2.5rem; padding-bottom: 13px; } .where-to-buy-page-redesign #wtb-header .content .hide.height { height: 80px; } .where-to-buy-page-redesign #wtb-header input { height: 70px; } .where-to-buy-page-redesign #wtb-header .distance-container { width: 51%; } .where-to-buy-page-redesign #wtb-header .distance-container .distance-select { height: 70px; max-width: 160px; } .where-to-buy-page-redesign #wtb-header .distance-container .distance-select .select-selected { padding: 1.7rem 2rem; } .where-to-buy-page-redesign #wtb-header .custom-select { width: 400px; height: 70px; } .where-to-buy-page-redesign #wtb-header .select-selected { height: 70px; padding-top: 17px; } .where-to-buy-page-redesign #wtb-header .select-selected::after { width: 12px; height: 12px; top: 33px; } .where-to-buy-page-redesign #wtb-header .select-selected.select-arrow-active:after { top: 40px; } .where-to-buy-page-redesign #wtb-header .select-items { height: 260px; } .where-to-buy-page-redesign #wtb-header .btn-submit { height: 70px; width: 18%; } .where-to-buy-page-redesign #wtb-header .iwrapper a { left: 437px; margin-top: 9px; height: 24px; top: 16px; } .where-to-buy-page-redesign #wtb-header .active { height: 510px; } .where-to-buy-page-redesign #wtb-header .hint { width: 33%; left: 89%; bottom: 100px; padding: 4.2rem 7rem; font-size: 130%; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item .distance-desktop, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item .distance-desktop, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item .distance-desktop { margin: 0 0 0 8rem; } .where-to-buy-page-redesign #wtb-filters-overlay .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-mobile .results-wrapper .result-item a, .where-to-buy-page-redesign #wtb-results-desktop .results-wrapper .result-item a { padding: 10px 50px; } .where-to-buy-page-redesign #popup-modal .without_map { width: 30%; } } .patents-page #patents .content h1 { border-bottom: 1px solid #cccccc; margin-bottom: 4.8rem; padding-bottom: 2.4rem; } .patents-page #patents .content p { padding-bottom: 4.8rem; } .patents-page #patents .items img { height: 60px; width: auto; margin-bottom: 1.8rem; } .patents-page #patents .items a:before { content: "\2193"; display: inline-block; width: 22px; height: 22px; border: 1px solid #0090FF; border-radius: 50%; vertical-align: top; font-family: Helvetica, Arial, sans-serif; font-size: 87%; margin-right: .6rem; } .patents-page #patents .items a:after { display: none; } @media (min-width: 992px) { .patents-page #patents .items a:before { width: 24px; height: 24px; font-size: 82%; margin-right: .6rem; } } @media (min-width: 1200px) { .patents-page #patents .items img { height: 80px; } .patents-page #patents .items a:before { width: 28px; height: 28px; font-size: 82%; margin-right: .8rem; position: relative; top: 0; transition: all 250ms; } .patents-page #patents .items a:hover:before { color: #fff; background-color: #0090FF; } } @media (min-width: 1600px) { .patents-page #patents .content { padding-bottom: 0; } .patents-page #patents .items { padding-top: 6rem; padding-bottom: 4.8rem; } .patents-page #patents .items img { height: 80px; } .patents-page #patents .items a:before { width: 30px; height: 30px; font-size: 82%; margin-right: 1rem; } } .installers-landing .chosen-container { width: 100%; } .installers-landing .it-button { border-radius: 21px/50%; padding: 8px 24px; width: auto; font-weight: 600; border: 1px solid #0090ff; background-color: #0090ff; color: #fff; transition: all 250ms; outline: 0 !important; position: relative; } .installers-landing .it-button:disabled { background-color: #f0f0f0; border: 1px solid #f0f0f0; } .installers-landing .section-header { background-color: #fafcfc; z-index: 100; } .installers-landing .section-header .content { position: relative; top: 0; -webkit-transform: none; transform: none; } .installers-landing .section-header .top-line { display: inline-block; text-transform: uppercase; margin-bottom: 10px; letter-spacing: 1px; margin-left: -1px; font-size: 120%; } .installers-landing .section-header .bg { display: none; } .installers-landing .section-header h1 { font-weight: 600; } .installers-landing .section-header hr { width: 100px; border: 0; height: 2px; background-color: #0090ff; margin-bottom: 30px; } .installers-landing .section-header p { font-size: 120%; margin-bottom: 17px; } .installers-landing .section-header button { margin-bottom: 15px; vertical-align: top; } .installers-landing .section-header select { font-size: 120%; opacity: 1; margin-bottom: 15px; -webkit-appearance: none; appearance: none; outline: 0; background: transparent; border: 1px solid #0090ff; color: #0090ff; padding: 8px 50px 8px 20px; border-radius: 4px; background: url("../img/common/select-drop-custom.svg") no-repeat; background-position: right 10px top -26px; background-size: 16px auto; } .installers-landing .section-header .chosen-container { margin-bottom: 15px; font-size: 120%; color: #0090ff; } .installers-landing .section-header .chosen-results { color: #0090ff; } .installers-landing .section-header .chosen-container-active .chosen-single { box-shadow: none; } .installers-landing .section-header .chosen-container-single .chosen-single div { width: 20px; } .installers-landing .section-header .chosen-container-single .chosen-single div b { background-image: url("../img/common/select-drop-custom.svg") !important; background-repeat: no-repeat; background-size: 12px auto !important; background-position: 0 -14px; } .installers-landing .section-header .chosen-container-active.chosen-with-drop .chosen-single div b { background-position: 0 16px; } .installers-landing .section-header.image select { border: 1px solid #444444; color: #444444; } .installers-landing .section-header.image button { margin-top: 15px; } .installers-landing .section-header.image .chosen-container { color: #444; } .installers-landing .section-header.image .chosen-container .chosen-drop { border: 1px solid #444; } .installers-landing .section-header.image .chosen-results { color: #444444; } .installers-landing .section-header.image .chosen-container-single .chosen-single { border: 1px solid #444444; background-color: transparent; } .installers-landing .section-header.image .chosen-container-single .chosen-single div b { background-image: url("../img/common/select-drop-custom-black.svg") !important; } .installers-landing .hint.fibaroid { padding: 2.2rem; background-color: #E9F6FF; border: 1px solid #0090ff; border-radius: 8px; color: #444444; } .installers-landing .hint.fibaroid figcaption { text-transform: none; } .installers-landing .hint.fibaroid figcaption div { font-size: 12px; line-height: 18px; } .installers-landing .hint.fibaroid figcaption a { text-decoration: underline; } .installers-landing .hint.fibaroid img { margin-right: 1.2rem; height: 40px !important; max-width: 40px !important; width: auto !important; } .installers-landing #header .content { position: absolute; top: 50%; -webkit-transform: translateY(-65%); transform: translateY(-65%); padding: 0; z-index: 1; color: #fff; } .installers-landing #header .content h1 { text-transform: uppercase; padding-bottom: 0; } .installers-landing #header .content p { font-size: 1.8rem; } .installers-landing #header .content hr { color: transparent; border: 0; border-bottom: 1px solid #0090ff; display: inline-block; width: 120px; } .installers-landing #header .content .button { padding: 6px 25px; margin-top: 25px; } .installers-landing #header .bg { height: 470px; } .installers-landing #installer-app-phones .content { color: #fff; position: absolute; z-index: 10; } .installers-landing #installer-app-phones .content .app-icon { width: 45px; height: 45px; margin-right: 15px; margin-bottom: 5px; } .installers-landing #installer-app-phones .bg { margin-bottom: 10px; padding-bottom: 120%; } .installers-landing #installer-app-icons { margin-bottom: 10px; } .installers-landing #installer-app-icons img { width: 60px; height: 60px; } .installers-landing #installer-app-icons .content { padding-bottom: 0; } .installers-landing #installer-app-icons .icons { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .installers-landing #installer-app-icons .icons p { width: 100%; } .installers-landing #installer-app-icons .empty { display: -webkit-box; display: -ms-flexbox; display: flex; } .installers-landing #installer-app-icons .home-center, .installers-landing #installer-app-icons .savings, .installers-landing #installer-app-icons .clients, .installers-landing #installer-app-icons .alerts { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; margin: 0.5rem; padding: 15px 15px 25px; color: #676767; background: #f6f6f6; border-radius: 6px; width: 130px; height: 140px; font-size: 90%; } .installers-landing #installer-app-benefits { z-index: 1; } .installers-landing #installer-app-benefits img { width: 100%; height: 100%; } .installers-landing #installer-app-benefits .copy ul { text-align: left; } .installers-landing #installer-app-benefits .copy ul li { line-height: 1.7; } .installers-landing #installer-app-benefits .copy ul li:before { content: ''; width: 13px; height: 13px; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMS45MyAyMi4wMSI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOiMwMDkwZmY7fTwvc3R5bGU+PC9kZWZzPjx0aXRsZT5pdC1rZXk8L3RpdGxlPjxnIGlkPSJXYXJzdHdhXzIiIGRhdGEtbmFtZT0iV2Fyc3R3YSAyIj48ZyBpZD0iaWNvbnMiPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTIxLjczLDQsMTguNDgsNy4yOWExLDEsMCwwLDEtMS40MiwwTDE0LjY0LDQuODdhMSwxLDAsMCwxLDAtMS40MkwxNy44OS4yQTUuMzUsNS4zNSwwLDAsMCwxNS44LDAsNS41Miw1LjUyLDAsMCwwLDExLDQuNzhhNS42NCw1LjY0LDAsMCwwLC4yNiwyLjU0bDAsMEwuNywxNy45NGEyLjM4LDIuMzgsMCwwLDAsMy4zNywzLjM3bDEwLjYxLTEwLjZhNS42Myw1LjYzLDAsMCwwLDIuNDcuMjQsNS41Miw1LjUyLDAsMCwwLDQuNzQtNC44MkE1LjM1LDUuMzUsMCwwLDAsMjEuNzMsNFoiLz48L2c+PC9nPjwvc3ZnPg==); background-size: 100%; position: absolute; margin-left: -25px; margin-top: 5px; } .installers-landing #installer-app-benefits .copy img { margin: 20px 0; } .installers-landing #installer-app-benefits .copy h3 { padding-bottom: 14px; } .installers-landing #installer-app-badges { background-color: #F6F6F6; padding: 20px 0; } .installers-landing #installer-app-badges h3 { padding-bottom: 14px; } .installers-landing #installer-app-badges img { margin: 15px; width: 135px; height: 40px; } .installers-landing #installer-app-discounts { background-color: #E2E1E7; } .installers-landing #installer-app-discounts .hint { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 2.2rem; background-color: #0090ff; color: #fff; border: none; border-radius: 6px; text-align: left; margin-top: 1.5rem; } .installers-landing #installer-app-discounts .hint figcaption { text-align: left; text-transform: none; } .installers-landing #installer-app-discounts .hint figcaption div { font-size: 100%; line-height: 1.4; } .installers-landing #installer-app-discounts .hint figcaption div span { font-size: 100%; padding-top: 0; } .installers-landing #installer-app-discounts .bg { height: 0; padding-bottom: 66%; } .installers-landing #join-us .content { color: #fff; position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .installers-landing #join-us strong { font-weight: 400; } .installers-landing #join-us .bg { height: 280px; } .installers-landing #testimonials .content { color: #fff; position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .installers-landing #testimonials .content .swiper-container { padding-top: 2rem; } .installers-landing #testimonials .content .credits-wrapper { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .installers-landing #testimonials .content .credits-wrapper img { width: 80px; height: 80px; margin: 10px; } .installers-landing #testimonials .content .credits { text-align: center; padding-bottom: 20px; width: 100%; } .installers-landing #testimonials .content .credits strong { font-weight: 700; font-size: 1.3em; } .installers-landing #testimonials .content .credits span { color: #0090FF; display: block; margin-top: 10px; } .installers-landing #testimonials .content .credits p { padding-bottom: 0; } .installers-landing #testimonials .bg { height: 600px; } .installers-landing #idea .icons { margin-top: 20px; } .installers-landing #idea .icons img { height: 60px; width: auto; margin-bottom: 10px; } .installers-landing #smart-rangers { background-color: #e3f1fc; } .installers-landing #smart-rangers .bg { height: 0; padding-bottom: 65%; background-position: 0 50%; } .installers-landing #smart-rangers a { display: inline-block; margin-top: 20px; border-radius: 21px/50%; padding: 8px 24px; width: auto; font-weight: 600; border: 1px solid #0090ff; background-color: #0090ff; color: #fff; transition: all 250ms; outline: 0 !important; position: relative; text-transform: uppercase; } .installers-landing #smart-rangers a span { display: block; } .installers-landing #agenda { background-color: #f6f6f6; } .installers-landing #agenda ul { text-align: left; list-style: disc; margin-left: 1.25em; margin-bottom: 13px; } .installers-landing #agenda .bg { height: 0; padding-bottom: 36%; } .installers-landing #agenda a { display: inline-block; font-weight: 600; margin-top: 10px; } .installers-landing #agenda a img { width: 50px; height: auto; } .installers-landing #agenda a span { display: block; } .installers-landing #certificate { background: #142245; background: linear-gradient(to right, #142245 0%, #223f78 100%); } .installers-landing #certificate .content { color: #fff; } .installers-landing #certificate ul { text-align: left; list-style: disc; margin-left: 1.25em; margin-bottom: 13px; } .installers-landing #certificate .bg { display: none; } @media (min-width: 544px) { .installers-landing #installer-app-phones .bg { margin-bottom: 0; padding-bottom: 110%; -webkit-transform: translateY(-10%); transform: translateY(-10%); } .installers-landing #installer-app-icons { margin-top: -10%; margin-bottom: 10px; } .installers-landing #installer-app-icons .home-center, .installers-landing #installer-app-icons .savings, .installers-landing #installer-app-icons .clients, .installers-landing #installer-app-icons .alerts { margin: 1.7rem; padding: 15px 25px 25px; width: 170px; height: 170px; font-size: 100%; } .installers-landing #installer-app-benefits h3 { font-size: 21px; padding-bottom: 20px; } .installers-landing #testimonials .content .credits-wrapper { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .installers-landing #testimonials .content .credits-wrapper img { width: 90px; height: 90px; margin: 30px 20px; } .installers-landing #testimonials .content .credits { text-align: left; padding-bottom: 0; margin-right: 20px; width: auto; } .installers-landing #testimonials .bg { height: 500px; } } @media (min-width: 768px) { .installers-landing .section-header .top-line, .installers-landing .section-header p, .installers-landing .section-header button, .installers-landing .section-header select { font-size: 150%; } .installers-landing #header .content .button { border-radius: 16px / 50%; } .installers-landing #header .bg { height: 320px; } .installers-landing #installer-app-phones .bg { margin-bottom: 30px; padding-bottom: 0; -webkit-transform: translateY(-8%); transform: translateY(-8%); height: 600px; } .installers-landing #installer-app-icons { margin-top: -7%; margin-bottom: 10px; } .installers-landing #installer-app-icons .home-center, .installers-landing #installer-app-icons .savings, .installers-landing #installer-app-icons .clients, .installers-landing #installer-app-icons .alerts { margin: 0.7rem; padding: 15px 25px 25px; width: 170px; height: 170px; } .installers-landing #installer-app-discounts .bg { padding-bottom: 56%; } } @media (min-width: 992px) { .installers-landing #installer-app-icons { margin-top: -70px; margin-bottom: 10px; } .installers-landing #installer-app-icons .home-center, .installers-landing #installer-app-icons .savings, .installers-landing #installer-app-icons .clients, .installers-landing #installer-app-icons .alerts { margin: 1.7rem; padding: 15px 25px 25px; width: 170px; height: 170px; } .installers-landing #installer-app-benefits { margin-top: 60px; } .installers-landing #installer-app-benefits .copy { background-color: #F6F6F6; } .installers-landing #installer-app-benefits .copy h3 { text-align: left; } .installers-landing #installer-app-benefits .desktop-image { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .installers-landing #installer-app-badges { background-color: #ffffff; padding: 20px 0; } .installers-landing #installer-app-discounts .bg { padding-bottom: 46%; } } @media (min-width: 1200px) { .installers-landing .it-button:hover { background-color: #fff; color: #0090ff; } .installers-landing .it-button:disabled:hover { background-color: #f0f0f0; border: 1px solid #f0f0f0; color: #fff; } .installers-landing .section-header .content { text-align: left; position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .installers-landing .section-header .bg { display: block; padding-bottom: 0; height: 500px; background-size: auto 420px; background-position: right 100px top 40px; } .installers-landing .section-header .top-line { margin-bottom: 15px; } .installers-landing .section-header hr { margin-left: 0; margin-right: 0; margin-bottom: 40px; width: 135px; } .installers-landing .section-header p { margin-bottom: 24px; } .installers-landing .section-header select { opacity: 0; } .installers-landing .section-header .chosen-container { margin-bottom: 36px; font-size: 21px; } .installers-landing .section-header .chosen-container .chosen-drop { box-shadow: none; margin-top: -2px; } .installers-landing .section-header.image .bg { height: 520px; background-size: cover; background-position: 50% 50%; } .installers-landing #header .bg { height: 390px; } .installers-landing #installer-app-icons { margin-top: -60px; margin-bottom: 10px; } .installers-landing #installer-app-benefits { margin-top: 80px; } .installers-landing #installer-app-badges { padding: 20px 0 40px; } .installers-landing #installer-app-badges h3 { padding-bottom: 14px; } .installers-landing #installer-app-badges img { margin: 15px 25px; width: 135px; height: 40px; } .installers-landing #installer-app-discounts .hint { margin-top: 2.5rem; } .installers-landing #installer-app-discounts .bg { background-position: 100% 50%; padding-bottom: 0; height: 420px; } .installers-landing #join-us .bg { height: 300px; } .installers-landing #testimonials { margin-bottom: 4rem; } .installers-landing #idea .icons img { height: 70px; } .installers-landing #agenda .content, .installers-landing #certificate .content, .installers-landing #installer-app-discounts .content, .installers-landing #smart-rangers .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; text-align: left; } .installers-landing #agenda .bg { background-position: 100% 50%; padding-bottom: 0; height: 420px; } .installers-landing #agenda a:hover span { text-decoration: underline; } .installers-landing #agenda a img { width: 60px; margin-left: -12px; } .installers-landing #agenda a span { display: inline-block; } .installers-landing #smart-rangers { background-color: transparent; } .installers-landing #smart-rangers a:hover { background-color: #fff; color: #0090ff; } .installers-landing #smart-rangers .bg { height: 420px; padding-bottom: 0; background-position: 50% 50%; } .installers-landing #certificate { background: none; } .installers-landing #certificate .bg { display: block; background-position: 83% 50%; height: 370px; } .installers-landing #certificate .bg.de { display: block; background-position: 71% 50%; height: 450px; } } @media (min-width: 1600px) { .installers-landing .section-header hr { margin-bottom: 50px; width: 170px; } .installers-landing .section-header .bg { height: 590px; background-size: auto 480px; background-position: right 120px top 50px; } .installers-landing .section-header.image .bg { height: 610px; } .installers-landing #installer-app-phones .bg { margin-bottom: 30px; -webkit-transform: translateY(-2%); transform: translateY(-2%); } .installers-landing #installer-app-icons { margin-top: -40px; margin-bottom: 10px; } .installers-landing #installer-app-icons .home-center, .installers-landing #installer-app-icons .savings, .installers-landing #installer-app-icons .clients, .installers-landing #installer-app-icons .alerts { margin: 1.7rem; padding: 15px 25px 25px; width: 190px; height: 190px; } .installers-landing #installer-app-badges h3 { padding-bottom: 16px; } .installers-landing #installer-app-badges img { margin: 15px 30px; width: 155px; height: 46px; } .installers-landing #installer-app-discounts .bg { height: 500px; } .installers-landing #join-us .bg { height: 360px; } .installers-landing #idea .icons img { height: 85px; } .installers-landing #agenda a img { width: 75px; } .installers-landing #agenda .bg { height: 500px; } .installers-landing #smart-rangers .bg { height: 540px; } .installers-landing #certificate .bg { background-position: 90% 50%; height: 450px; } .installers-landing .it-button { border-radius: 26px/50%; padding: 8px 30px; } } @media (min-width: 2100px) { .installers-landing .it-button { border-radius: 28px/50%; padding: 8px 30px; } .installers-landing .section-header .top-line { margin-bottom: 20px; } .installers-landing .section-header .bg { height: 690px; background-size: auto 580px; background-position: right 163px top 50px; } .installers-landing .section-header hr { margin-bottom: 80px; width: 260px; } .installers-landing .section-header.image .bg { height: 840px; } .installers-landing #installer-app-phones .bg { margin-bottom: 30px; -webkit-transform: translateY(-6%); transform: translateY(-6%); height: 810px; } .installers-landing #installer-app-icons { margin-top: -70px; margin-bottom: 10px; } .installers-landing #installer-app-icons .home-center, .installers-landing #installer-app-icons .savings, .installers-landing #installer-app-icons .clients, .installers-landing #installer-app-icons .alerts { margin: 1.7rem; padding: 15px 35px 25px; width: 220px; height: 220px; } .installers-landing #installer-app-benefits { margin-top: 130px; } .installers-landing #installer-app-benefits .copy h3 { font-size: 24px; line-height: 1.4; } .installers-landing #installer-app-badges { padding: 80px 0 80px; } .installers-landing #installer-app-badges img { margin: 20px 40px; width: 155px; height: 46px; } .installers-landing #installer-app-discounts .bg { height: 620px; } .installers-landing #join-us .bg { height: 400px; } .installers-landing #testimonials .bg { height: 550px; } .installers-landing #idea p { padding-left: 60px; padding-right: 60px; } .installers-landing #idea .icons img { height: 96px; } .installers-landing #agenda a img { width: 90px; } .installers-landing #agenda .bg { height: 620px; } .installers-landing #smart-rangers .bg { height: 710px; } .installers-landing #certificate .bg { background-position: 100% 50%; height: 485px; } } .installers-landing-subpage #header .content { position: absolute; top: 50%; -webkit-transform: translateY(-65%); transform: translateY(-65%); padding: 0; z-index: 1; color: #fff; } .installers-landing-subpage #header .content h1 { text-transform: uppercase; padding-bottom: 0; } .installers-landing-subpage #header .content p { font-size: 1.8rem; } .installers-landing-subpage #header .content hr { color: transparent; border: 0; border-bottom: 1px solid #0090ff; display: inline-block; width: 120px; } .installers-landing-subpage #header .content .button { padding: 6px 25px; margin-top: 25px; } .installers-landing-subpage #header .bg { height: 470px; } .installers-landing-subpage #agenda.grill { background-color: #191718; color: #fff; } .installers-landing-subpage #agenda.grill .bg { padding-bottom: 85%; } .installers-landing-subpage #free-event-list { background-color: #fbfefc; } .installers-landing-subpage #free-event-list #free-event-wrapper { width: 100%; margin-top: 50px; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-line-pack: start; align-content: flex-start; -webkit-overflow-scrolling: touch; } .installers-landing-subpage #free-event-list .free-event-list { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: start; align-content: flex-start; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .installers-landing-subpage #free-event-list .free-event-item { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: 270px; background-color: #fff; border-radius: 8px; padding-top: 24px; padding-bottom: 90px; text-align: left; position: relative; box-shadow: 0 2px 12px #efefef; margin: 0 20px 50px; } .installers-landing-subpage #free-event-list .free-event-item .date { padding: 0 0 0 28px; margin-bottom: 24px; } .installers-landing-subpage #free-event-list .free-event-item .location { padding: 0 30px 0 66px; background: url("../img/common/iconpin.svg") 26px 0 no-repeat; background-size: 36px auto; } .installers-landing-subpage #free-event-list .free-event-item .day { font-size: 43px; font-weight: 600; line-height: 1; float: left; margin-right: 6px; } .installers-landing-subpage #free-event-list .free-event-item .weekday { color: #a2a2a2; font-size: 14px; } .installers-landing-subpage #free-event-list .free-event-item .monthyear { font-weight: 600; font-size: 14px; } .installers-landing-subpage #free-event-list .free-event-item .city { font-weight: 600; text-transform: uppercase; line-height: 1.2; font-size: 18px; margin-bottom: 3px; } .installers-landing-subpage #free-event-list .free-event-item .address { line-height: 1.2; font-size: 14px; } .installers-landing-subpage #free-event-list .free-event-item a { border-radius: 16px/50%; padding: 6px 0; width: 65%; font-weight: 600; font-size: 90%; text-transform: uppercase; text-align: center; border: 1px solid #05B31C; background-color: #05B31C; color: #fff; box-shadow: 0 3px 5px rgba(5, 179, 28, 0.35); transition: all 250ms; outline: 0 !important; position: absolute; bottom: 24px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .installers-landing-subpage #free-event-list .free-event-itemlast-item a { width: 75%; } .installers-landing-subpage #free-event-list .free-event-item.last-item { background: #fff url("../img/cant-find.png") no-repeat; background-size: 50px; text-align: center; background-position: 50% 20px; padding-top: 90px; padding-bottom: 20px; } .installers-landing-subpage #popup-forms .modal { display: none; position: fixed; z-index: 110; padding-top: 53px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0, 0, 0, 0.8); } .installers-landing-subpage #popup-forms .modal-content { background-color: #fefefe; margin: auto auto 70px auto; padding: 20px; border: 1px solid #888; width: 100%; max-width: 1000px; font-size: 120%; } .installers-landing-subpage #popup-forms .close { color: #aaaaaa; float: right; font-size: 28px; font-weight: bold; } .installers-landing-subpage #popup-forms .close:hover, .installers-landing-subpage #popup-forms .close:focus { color: #0090ff; text-decoration: none; cursor: pointer; } .installers-landing-subpage #popup-forms label { text-align: left; font-size: 120%; } .installers-landing-subpage #popup-forms h2 { text-transform: uppercase; font-size: 34px; } @media (min-width: 544px) { .installers-landing-subpage #free-event-list .free-event-item { margin: 0 100px 50px; } } @media screen and (min-width: 640px) { .installers-landing-subpage #free-event-list { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .installers-landing-subpage .free-event-item { margin: 0 22px 50px; } .installers-landing-subpage .free-event-item.last-item { background-size: 50px; background-position: 50% 25px; padding-top: 100px; } } @media (min-width: 768px) { .installers-landing-subpage #header .content { top: 25%; -webkit-transform: translateY(0%); transform: translateY(0%); } .installers-landing-subpage #header .bg { height: 320px; } .installers-landing-subpage #free-event-list .free-event-item { margin: 0 20px 50px; } .installers-landing-subpage #popup-forms .modal-content { width: 80%; } } @media (min-width: 992px) { .installers-landing-subpage #free-event-list .free-event-item { margin: 0 26px 50px; } } @media (min-width: 1200px) { .installers-landing-subpage #header .bg { height: 390px; } .installers-landing-subpage #free-event-list .free-event-item { width: 252px; margin: 0 15px 50px; } .installers-landing-subpage #free-event-list .free-event-item a:hover { background-color: #fff; color: #05B31C; } .installers-landing-subpage #agenda.grill .bg { height: 440px; padding-bottom: 0; } .installers-landing-subpage #popup-forms .modal { padding-top: 130px; } } @media (min-width: 1600px) { .installers-landing-subpage #free-event-list .free-event-item { padding-top: 36px; padding-bottom: 100px; border-radius: 12px; margin: 0 20px 60px; width: 316px; } .installers-landing-subpage #free-event-list .free-event-item .date { padding: 0 0 0 36px; margin-bottom: 36px; } .installers-landing-subpage #free-event-list .free-event-item .location { padding: 0 30px 0 70px; background: url("../img/common/iconpin.svg") 30px 0 no-repeat; background-size: 36px auto; } .installers-landing-subpage #free-event-list .free-event-item .day { font-size: 54px; } .installers-landing-subpage #free-event-list .free-event-item .weekday, .installers-landing-subpage #free-event-list .free-event-item .monthyear { font-size: 18px; } .installers-landing-subpage #free-event-list .free-event-item .city { font-size: 21px; } .installers-landing-subpage #free-event-list .free-event-item .address { font-size: 16px; } .installers-landing-subpage #free-event-list .free-event-item.last-item { background-size: 70px; background-position: 50% 30px; padding-top: 130px; } } @media (min-width: 2100px) { .installers-landing-subpage #free-event-list .free-event-item { padding-top: 48px; padding-bottom: 120px; margin: 0 30px 70px; width: 417px; } .installers-landing-subpage #free-event-list .free-event-item .date { padding: 0 40px; margin-bottom: 48px; } .installers-landing-subpage #free-event-list .free-event-item .location { padding: 0 40px 0 92px; background: url("../img/common/iconpin.svg") 44px 0 no-repeat; background-size: 46px auto; } .installers-landing-subpage #free-event-list .free-event-item .day { font-size: 63px; } .installers-landing-subpage #free-event-list .free-event-item .weekday, .installers-landing-subpage #free-event-list .free-event-item .monthyear { font-size: 21px; } .installers-landing-subpage #free-event-list .free-event-item .city { font-size: 24px; } .installers-landing-subpage #free-event-list .free-event-item .address { font-size: 19px; } .installers-landing-subpage #free-event-list .free-event-item a { border-radius: 21px/50%; padding: 8px 0; } .installers-landing-subpage #free-event-list .free-event-item.last-item { background-size: 70px; background-position: 50% 30px; padding-top: 140px; } } .distributors-page #header .content { position: absolute; z-index: 10; top: 0; -webkit-transform: translateY(0); transform: translateY(0); } .distributors-page #header .content h1 { padding-bottom: 0; color: #fff; font-size: 2.6rem; } .distributors-page #header .content h1 span { font-weight: 700; } .distributors-page #header .content .button.button-buy { padding: 6px 26px; border-radius: 18px / 50%; background-color: #0090ff; transition: all 250ms; font-weight: 700; text-transform: uppercase; margin-top: 20px; } .distributors-page #header .content a { color: #fff; } .distributors-page #header .bg { padding-bottom: 148%; } .distributors-page #benefits .content { font-size: 90%; } .distributors-page #benefits .content ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 20px 0; } .distributors-page #benefits .content li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; background-repeat: no-repeat; margin-bottom: 4rem; width: 50%; } .distributors-page #benefits .content li img { height: 60px; width: auto; margin-bottom: 1.6rem; } .distributors-page #benefits .content li span { text-align: center; display: block; width: 100%; } .distributors-page #tablet { background-color: #000318; } .distributors-page #tablet .content { position: relative; } .distributors-page #tablet ul, .distributors-page #tablet ol { list-style: initial; text-align: left; } .distributors-page #tablet .bg { padding-bottom: 70%; } .distributors-page #experience-center .content { position: relative; color: #444; } .distributors-page #experience-center .bg { padding-bottom: 78%; } .distributors-page #certificate .content { position: relative; color: #444; } .distributors-page #certificate .bg { padding-bottom: 66%; } .distributors-page #form .content { text-align: left; } .distributors-page #form .content h2 { text-align: center; text-transform: uppercase; } @media (min-width: 544px) { .distributors-page #header .bg { padding-bottom: 98%; } .distributors-page #tablet .bg { padding-bottom: 55%; } } @media (min-width: 768px) { .distributors-page #header .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .distributors-page #header .bg { padding-bottom: 0; height: 350px; } .distributors-page #benefits .content li { margin-top: 2rem; width: 20%; } .distributors-page #benefits .content li img { height: 70px; } .distributors-page #tablet .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left; } .distributors-page #tablet .bg { padding-bottom: 45%; background-position: 55% 50%; } .distributors-page #experience-center .bg { padding-bottom: 50%; } .distributors-page #certificate .bg { padding-bottom: 50%; } } @media (min-width: 992px) { .distributors-page #header .content h1 { font-size: 3.4rem; } } @media (min-width: 1200px) { .distributors-page #header .content h1 { font-size: 4rem; } .distributors-page #benefits .content li { margin-bottom: 0; } .distributors-page #benefits .content span { padding: 0 10px; } .distributors-page #tablet .bg { padding-bottom: 37%; background-position: 63% 50%; } .distributors-page #experience-center .bg { padding-bottom: 31%; } .distributors-page #certificate .bg { padding-bottom: 31%; } } @media (min-width: 1600px) { .distributors-page #header .content h1 { font-size: 4.6rem; } .distributors-page #tablet .bg { padding-bottom: 30%; background-position: 50% 50%; } } @media (min-width: 2100px) { .distributors-page #header .content h1 { font-size: 6rem; } .distributors-page #tablet .bg { padding-bottom: 20%; } } .campaing-fall-2017 .section-header { background-color: #001c62; } .campaing-fall-2017 .section-header .content { color: #fff; top: 100%; -webkit-transform: translateY(-100%); transform: translateY(-100%); } .campaing-fall-2017 .section-header .bg { height: 290px; padding-bottom: 0; } .campaing-fall-2017 .section-header h1 { font-size: 13px; line-height: 1.4; } .campaing-fall-2017 .section-header a { display: inline-block; margin-bottom: 10px; } .campaing-fall-2017 .section-header a img { width: 50px; height: auto; margin-bottom: 10px; } .campaing-fall-2017 .section-header a span { display: block; color: #fff; font-size: 24px; } .campaing-fall-2017 .section-header video { display: block; width: 100%; height: auto; opacity: .5; } .campaing-fall-2017 .usecase .bg { padding-bottom: 58%; } .campaing-fall-2017 .usecase hr { display: inline-block; width: 100px; border: 0; height: 1px; background-color: #444; margin-left: 0; margin-right: 0; margin-bottom: 20px; } .campaing-fall-2017 #your-home { background-color: #edeae5; } .campaing-fall-2017 #your-home .content { padding-bottom: 0; } .campaing-fall-2017 #your-home .bg { padding-bottom: 64%; } .campaing-fall-2017 #links .col-phoneS-12 { padding: 0; } .campaing-fall-2017 #links a { display: block; width: 100%; position: relative; color: #fff; } .campaing-fall-2017 #links a:nth-of-type(1) { border-bottom: 3px solid #fff; } .campaing-fall-2017 #links img { width: 100%; height: auto; margin: 0; padding: 0; } .campaing-fall-2017 #links .wrapper { width: 100%; position: absolute; z-index: 10; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; } .campaing-fall-2017 #devices { background: #f7f7f7; background: radial-gradient(ellipse at center top, #ffffff 0%, #f7f7f7 100%); } .campaing-fall-2017 #devices .device h3 { font-size: 21px; margin-bottom: 10px; } .campaing-fall-2017 #devices .device span { display: block; margin-bottom: 10px; } .campaing-fall-2017 #devices .device img { height: 180px; width: auto; } .campaing-fall-2017 #devices .swiper-container { margin-top: 20px; padding-bottom: 1px; } .campaing-fall-2017 #devices .swiper-pagination { position: relative; top: 0; bottom: 0; margin-top: 25px; } .campaing-fall-2017 #devices .swiper-pagination-bullet { background-color: transparent; border: 1px solid #0090ff; opacity: 1; } .campaing-fall-2017 #devices .swiper-pagination-bullet-active { background-color: #0090ff; } .campaing-fall-2017 .morelink { display: inline-block; position: relative; padding: 8px 45px 8px 30px; border-radius: 18px/50%; background-color: #0090ff; border: 1px solid #0090ff; color: #fff; transition: all 250ms; margin-top: 10px; } .campaing-fall-2017 .morelink:after { content: ''; display: block; position: absolute; top: 50%; right: 16px; z-index: 2; width: 12px; height: 12px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .campaing-fall-2017 .morelink.reverse { background-color: transparent; color: #0090ff; } .campaing-fall-2017 .morelink.reverse:after { border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; } @media (min-width: 544px) { .campaing-fall-2017 #your-home .bg { padding-bottom: 40%; } } @media (min-width: 768px) { .campaing-fall-2017 .section-header h1 { font-size: 16px; } .campaing-fall-2017 .section-header a img { width: 70px; } .campaing-fall-2017 .section-header a span { font-size: 28px; } .campaing-fall-2017 #reseller .content { padding-top: 4.8rem; padding-bottom: 4.8rem; } .campaing-fall-2017 #links a { width: 50%; float: left; } .campaing-fall-2017 #links a:nth-of-type(1) { border-bottom: none; border-right: 2px solid #fff; } .campaing-fall-2017 #links a:nth-of-type(2) { border-left: 2px solid #fff; } } @media (min-width: 992px) { .campaing-fall-2017 .usecase .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left; } .campaing-fall-2017 .usecase .bg { width: 50%; padding-bottom: 35%; } .campaing-fall-2017 .usecase .bg.bg-right { left: 50%; } .campaing-fall-2017 .usecase.right .content { text-align: right; } } @media (min-width: 1200px) { .campaing-fall-2017 .section-header .content { top: 90%; } .campaing-fall-2017 .usecase .bg { padding-bottom: 29%; } .campaing-fall-2017 #your-home .bg { padding-bottom: 27%; } .campaing-fall-2017 #devices .swiper-pagination { display: none; } .campaing-fall-2017 #devices .swiper-button-prev { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMoAAADKCAYAAADkZd+oAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggTWFjaW50b3NoIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdBNjhFM0Y5QzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdBNjhFM0ZBQzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6N0E2OEUzRjdDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6N0E2OEUzRjhDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4qpWmPAAAfAElEQVR42uxd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"); left: 20px; } .campaing-fall-2017 #devices .swiper-button-next { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMoAAADKCAYAAADkZd+oAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggTWFjaW50b3NoIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdBNjhFM0ZEQzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdBNjhFM0ZFQzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6N0E2OEUzRkJDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6N0E2OEUzRkNDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7eJnu3AAAfeUlEQVR42uxd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"); right: 20px; } .campaing-fall-2017 #devices .swiper-button-prev, .campaing-fall-2017 #devices .swiper-button-next { width: 50px; height: 50px; background-size: 50px; top: 28%; } .campaing-fall-2017 #devices .swiper-container { margin-top: 40px; padding-left: 30px; padding-right: 30px; } .campaing-fall-2017 #links a { overflow: hidden; } .campaing-fall-2017 #links a img { transition: all 1500ms ease-in-out; } .campaing-fall-2017 #links a:hover img { -webkit-transform: scale(1.05); transform: scale(1.05); } .campaing-fall-2017 .morelink { margin-top: 15px; } .campaing-fall-2017 .morelink:hover { background-color: rgba(255, 255, 255, 0.9); color: #0090ff; } .campaing-fall-2017 .morelink:hover:after { border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; } .campaing-fall-2017 .morelink.reverse:hover { background-color: #0090ff; color: #fff; } .campaing-fall-2017 .morelink.reverse:hover:after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; } } @media (min-width: 1600px) { .campaing-fall-2017 .section-header h1 { font-size: 18px; } .campaing-fall-2017 .section-header a { margin-bottom: 15px; } .campaing-fall-2017 .section-header a img { width: 90px; margin-bottom: 15px; } .campaing-fall-2017 .section-header a span { font-size: 32px; } .campaing-fall-2017 #devices .device h3 { font-size: 24px; } .campaing-fall-2017 #devices .swiper-container { margin-bottom: 20px; } .campaing-fall-2017 .morelink { margin-top: 20px; border-radius: 20px/50%; } .campaing-fall-2017.party #devices .swiper-button-prev, .campaing-fall-2017.party #devices .swiper-button-next { display: none; } } @media (min-width: 2100px) { .campaing-fall-2017 .section-header h1 { font-size: 21px; } .campaing-fall-2017 .section-header a { margin-bottom: 20px; } .campaing-fall-2017 .section-header a img { width: 110px; margin-bottom: 20px; } .campaing-fall-2017 .section-header a span { font-size: 42px; } .campaing-fall-2017 .usecase hr { width: 130px; } .campaing-fall-2017 #devices .device h3 { font-size: 28px; } .campaing-fall-2017 #devices .swiper-container { margin-top: 60px; } .campaing-fall-2017 .morelink { border-radius: 22px/50%; } .campaing-fall-2017.grandpa #devices .swiper-button-prev, .campaing-fall-2017.grandpa #devices .swiper-button-next { display: none; } } .homekit-lp #header .bg { padding-bottom: 100%; background-position: 50% 50%; } .homekit-lp #header h1 { text-transform: uppercase; color: #fff; line-height: 130%; font-size: 25px; margin-top: 8%; padding-bottom: 0; } .homekit-lp #header.section-big-image .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .homekit-lp #header .sub-header { color: #fff; font-size: 25px; text-transform: uppercase; padding-bottom: 0; } .homekit-lp #header .claim { font-size: 20px; color: #fff; padding-top: 10%; } .homekit-lp #mesh { background-color: #efece7; } .homekit-lp #mesh .content { padding-bottom: 0; } .homekit-lp #mesh .bg { background-size: auto 100%; position: relative; height: 0; } .homekit-lp #mesh .homekit { width: 180px; padding: 20px 0 35px; } .homekit-lp #mesh .badges { width: 100%; height: auto; position: absolute; } .homekit-lp #video.section-video-player { height: 300px; } .homekit-lp #video.section-video-player .content h2 { text-transform: none; } .homekit-lp #video.section-video-player .content p { padding-bottom: 20px; } .homekit-lp #intuitive-app { background-color: #ffffff; } .homekit-lp #intuitive-app .content { padding-bottom: 0; } .homekit-lp #intuitive-app .bg { background-size: auto 100%; position: relative; height: 0; padding-bottom: 72%; } .homekit-lp #intuitive-app .appstore { width: 180px; padding: 20px 0 35px; } .homekit-lp #intuitive-app .icons { width: 100%; margin: 30px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .homekit-lp #intuitive-app .icons li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; } .homekit-lp #intuitive-app .icons li img { height: 40px; margin: 0 auto 15px; } .homekit-lp #intuitive-app .icons li span { display: block; color: #0090ff; } .homekit-lp #devices { background: #ffffff; } .homekit-lp #devices .remotes h2 { text-transform: uppercase; } .homekit-lp #devices .remotes, .homekit-lp #devices .dashes h2 { display: inline-block; position: relative; margin-top: 40px; } .homekit-lp #devices .dashes h2:before, .homekit-lp #devices .dashes h2:after { content: ''; display: inline-block; position: absolute; top: 20%; z-index: 2; width: 40px; height: 8px; border-bottom: 1px solid #444; transition: all 250ms; } .homekit-lp #devices .dashes h2:before { left: -80px; } .homekit-lp #devices .dashes h2:after { right: -80px; } .homekit-lp #devices .device h3 { font-size: 21px; margin-bottom: 10px; } .homekit-lp #devices .device span { display: block; margin-bottom: 10px; } .homekit-lp #devices .device img { height: 180px; width: auto; } .homekit-lp #devices .swiper-container { margin-top: 20px; } .homekit-lp #devices .swiper-pagination { position: relative; top: 0; bottom: 0; margin-top: 25px; } .homekit-lp #devices .swiper-pagination-bullet { background-color: transparent; border: 1px solid #0090ff; opacity: 1; } .homekit-lp #devices .swiper-pagination-bullet-active { background-color: #0090ff; } .homekit-lp #devices .device .button img { height: auto; width: 100%; cursor: default; margin: 40px 0 20px; } .homekit-lp #devices .device .button:hover { cursor: default; } .homekit-lp .learnmore { display: inline-block; position: relative; margin-bottom: 15px; } .homekit-lp .learnmore:after { content: ''; display: block; position: absolute; top: 50%; left: 110%; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .homekit-lp .morelink { display: inline-block; position: relative; width: 175px; padding: 8px 0; border-radius: 18px/50%; background-color: #0090ff; border: 1px solid #0090ff; color: #fff; transition: all 250ms; margin-top: 20px; } .homekit-lp .morelink.reverse { background-color: transparent; color: #0090ff; } .homekit-lp .container-fluid .where-to-buy { background-image: -ms-linear-gradient(0deg, #132647 0%, #213e73 50%, #132647 100%); } .homekit-lp.fixed-grid .section-product-footer .top { background: #132647; } .homekit-lp.fixed-grid .section-product-footer { display: none; } .homekit-lp.fixed-grid main h1 { margin-top: 8%; } /* ---- particles.js container ---- */ .homekit-lp #particles-js { width: 100%; height: 100%; position: absolute; } @media (min-width: 544px) { .homekit-lp #header h1 { font-size: 35px; margin-top: 8%; } .homekit-lp #header.section-big-image .content { top: 0; -webkit-transform: translateY(0); transform: translateY(0); } .homekit-lp #header .bg { padding-bottom: 60%; } .homekit-lp #header .sub-header { font-size: 35px; } } @media (min-width: 768px) { .homekit-lp #header .bg { padding-bottom: 35%; background-position: 100% 50%; } .homekit-lp #mesh { overflow: auto; } .homekit-lp #mesh .content { position: absolute; z-index: 10; } .homekit-lp #mesh .bg { height: 0px; margin: 140px 0 0 0; padding-bottom: 33%; overflow: hidden; } .homekit-lp #mesh .homekit { width: 140px; position: absolute; bottom: 20px; padding: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 1; } .homekit-lp .button-text span { margin: 0 40px; } .homekit-lp #intuitive-app { overflow: auto; } .homekit-lp #intuitive-app .content { position: absolute; z-index: 10; } .homekit-lp #intuitive-app .bg { height: 210px; margin: 270px 0 80px; padding: 0; } .homekit-lp #intuitive-app .appstore { width: 180px; position: absolute; bottom: -40px; padding: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 1; } .homekit-lp #reseller .content { padding-top: 4.8rem; padding-bottom: 4.8rem; } } @media (min-width: 1200px) { .homekit-lp #header h1 { font-size: 55px; margin-top: 5%; } .homekit-lp #header .sub-header { font-size: 55px; } .homekit-lp #header .claim { font-size: 25px; padding-top: 15%; } .homekit-lp #mesh .homekit { bottom: 30px; width: 180px; } .homekit-lp #intuitive-app .bg { padding-bottom: 24%; } .homekit-lp #intuitive-app .bg { margin: 220px 0 80px; } .homekit-lp #intuitive-app .appstore { bottom: 0px; } .homekit-lp #intuitive-app .icons li:nth-of-type(2) { margin: 0 40px; } .homekit-lp #devices .swiper-pagination { display: none; } .homekit-lp #devices .swiper-button-prev { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMoAAADKCAYAAADkZd+oAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggTWFjaW50b3NoIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdBNjhFM0Y5QzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdBNjhFM0ZBQzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6N0E2OEUzRjdDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6N0E2OEUzRjhDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4qpWmPAAAfAElEQVR42uxd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"); left: 20px; } .homekit-lp #devices .swiper-button-next { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMoAAADKCAYAAADkZd+oAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggTWFjaW50b3NoIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdBNjhFM0ZEQzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdBNjhFM0ZFQzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6N0E2OEUzRkJDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6N0E2OEUzRkNDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7eJnu3AAAfeUlEQVR42uxd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"); right: 20px; } .homekit-lp #devices .swiper-button-prev, .homekit-lp #devices .swiper-button-next { width: 50px; height: 50px; background-size: 50px; top: 34%; } .homekit-lp #devices .swiper-container { margin-top: 20px; padding-left: 30px; padding-right: 30px; padding-bottom: 20px; } .homekit-lp .morelink { margin-top: 15px; } .homekit-lp .morelink:hover { background-color: rgba(255, 255, 255, 0.9); color: #0090ff; } .homekit-lp .morelink.reverse:hover { background-color: #0090ff; color: #fff; } } @media (min-width: 1600px) { .homekit-lp #header h1 { font-size: 60px; margin-top: 8%; } .homekit-lp #header .sub-header { font-size: 60px; } .homekit-lp #mesh .homekit { bottom: 40px; } .homekit-lp #devices .device h3 { font-size: 24px; } .homekit-lp #devices .swiper-container { margin-bottom: 20px; } .homekit-lp .morelink { margin-top: 20px; border-radius: 20px/50%; } .homekit-lp #devices .swiper-button-prev, .homekit-lp #devices .swiper-button-next { display: none; } .homekit-lp .button-text span { margin: 0 80px; } .homekit-lp #video.section-video-player { height: 370px; } } @media (min-width: 2100px) { .homekit-lp #mesh .homekit { bottom: 80px; width: 280px; } .homekit-lp #intuitive-app .appstore { bottom: 20px; width: 280px; } .homekit-lp #devices .device h3 { font-size: 28px; } .homekit-lp #devices .swiper-container { margin-top: 20px; } .homekit-lp .morelink { border-radius: 22px/50%; width: 220px; } .homekit-lp #video.section-video-player { height: 470px; } } .error-404 .icon-404 { width: 160px; padding: 35px 0 30px; } @media (min-width: 1200px) { .error-404 .icon-404 { width: 210px; padding: 35px 0 30px; } } @media (min-width: 1600px) { .error-404 .icon-404 { width: 260px; padding: 35px 0 30px; } } @media (min-width: 2100px) { .error-404 .icon-404 { width: 310px; padding: 35px 0 30px; } .error-404 .info h1 { font-size: 6.4rem; letter-spacing: 0.05em; } .error-404 .info p { font-size: 2.4rem; } } .use-cases header div:nth-of-type(4) { display: none; } .use-cases main { margin-top: 103px; } .use-cases .generator { margin-top: -53px; } .use-cases .generator.offset { margin-top: 100px; } .use-cases .generator .hf-message { display: none; } .use-cases .generator .content { position: absolute; z-index: 1; color: #FFFFFF; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .use-cases .generator .content .intro-wrapper, .use-cases .generator .content .first-wrapper, .use-cases .generator .content .second-wrapper, .use-cases .generator .content .third-wrapper, .use-cases .generator .content .forth-wrapper, .use-cases .generator .content .fifth-wrapper { width: 100%; opacity: 0; transition: opacity 450ms ease-in-out, -webkit-transform 0s ease-in-out 500ms; transition: opacity 450ms ease-in-out, transform 0s ease-in-out 500ms; transition: opacity 450ms ease-in-out, transform 0s ease-in-out 500ms, -webkit-transform 0s ease-in-out 500ms; position: absolute; top: 50%; -webkit-transform: translate(-200%, -50%); transform: translate(-200%, -50%); } .use-cases .generator .content .intro-wrapper.active, .use-cases .generator .content .first-wrapper.active, .use-cases .generator .content .second-wrapper.active, .use-cases .generator .content .third-wrapper.active, .use-cases .generator .content .forth-wrapper.active, .use-cases .generator .content .fifth-wrapper.active { opacity: 1; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); transition: opacity 500ms ease-in-out 500ms, -webkit-transform 0s ease-in-out; transition: opacity 500ms ease-in-out 500ms, transform 0s ease-in-out; transition: opacity 500ms ease-in-out 500ms, transform 0s ease-in-out, -webkit-transform 0s ease-in-out; } .use-cases .generator .content .intro-wrapper { color: #0090FF; } .use-cases .generator .content .intro-wrapper h2 { line-height: 1.4; } .use-cases .generator .content .intro-wrapper h2 br { display: none; } .use-cases .generator .content .forth-wrapper { width: 100%; } .use-cases .generator .content .forth-wrapper .home-quote { display: none; } .use-cases .generator .content .forth-wrapper .home-quote.active { display: block; } .use-cases .generator .content .forth-wrapper .quote { font-style: italic; font-size: 20px; padding-bottom: 2rem; line-height: 1.4; } .use-cases .generator .content .forth-wrapper .quote br { display: none; } .use-cases .generator .content .forth-wrapper .author { color: #0090ff; font-size: 1.1em; } .use-cases .generator .content .forth-wrapper .disclaimer { padding-top: 40px; color: #0090FF; } .use-cases .generator .content .forth-wrapper .loader, .use-cases .generator .content .forth-wrapper .loader:before, .use-cases .generator .content .forth-wrapper .loader:after { border-radius: 50%; width: 2.5em; height: 2.5em; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation: load7 1.8s infinite ease-in-out; animation: load7 1.8s infinite ease-in-out; } .use-cases .generator .content .forth-wrapper .loader { color: #0090ff; font-size: 5px; margin: 50px auto 0; position: relative; text-indent: -9999em; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-animation-delay: -0.16s; animation-delay: -0.16s; } .use-cases .generator .content .forth-wrapper .loader:before, .use-cases .generator .content .forth-wrapper .loader:after { content: ''; position: absolute; top: 0; } .use-cases .generator .content .forth-wrapper .loader:before { left: -3.5em; -webkit-animation-delay: -0.32s; animation-delay: -0.32s; } .use-cases .generator .content .forth-wrapper .loader:after { left: 3.5em; } @-webkit-keyframes load7 { 0%, 80%, 100% { box-shadow: 0 2.5em 0 -1.3em; } 40% { box-shadow: 0 2.5em 0 0; } } @keyframes load7 { 0%, 80%, 100% { box-shadow: 0 2.5em 0 -1.3em; } 40% { box-shadow: 0 2.5em 0 0; } } .use-cases .generator .content .fifth-wrapper .choose { color: #ffffff; padding-bottom: 1rem; font-size: 180%; } .use-cases .generator .content .fifth-wrapper .choose span { color: #ffffff; border-bottom: 0 solid #ffffff; } .use-cases .generator .content .fifth-wrapper .choose span:hover { cursor: auto; } .use-cases .generator .content .fifth-wrapper p.choose.Q2, .use-cases .generator .content .fifth-wrapper p.choose.Q3 { display: inline-block; } .use-cases .generator .content .choose { color: #0090FF; padding-bottom: 1rem; } .use-cases .generator .content .choose span { color: #ffffff; border-bottom: 1px solid #ffffff; } .use-cases .generator .content .choose span:hover { cursor: pointer; } .use-cases .generator .content .question { margin-bottom: 1rem; } .use-cases .generator .content .question h2 { padding-top: 13px; } .use-cases .generator .content input[type="radio"] { display: none; cursor: pointer; } .use-cases .generator .content label { cursor: pointer; min-width: 50px; display: inline-block; position: relative; } .use-cases .generator .content .radio span.custom > span { margin: 5px; display: inline-block; white-space: nowrap; color: #30a5ff; padding: 0.4rem 2.2rem 0.5rem; border-radius: 50px; font-size: 1.3em; font-weight: 400; background-color: rgba(0, 144, 255, 0.17); } .use-cases .generator .content .radio span.custom > span:hover { color: #ffffff; background-color: rgba(0, 144, 255, 0.3); } .use-cases .generator .content .radio .custom { display: inline; } .use-cases .generator .content .radio input:checked + span.custom > span { color: #ffffff; background-color: #0090ff; } .use-cases .generator .content .btn-next, .use-cases .generator .content .send { display: inline-block; color: #0090ff; border: 0 solid #0090ff; padding: 0.4rem 3.2rem; border-radius: 50px; font-size: 1.1em; font-weight: 400; background-color: #ffffff; outline: none; margin-top: 5rem; cursor: pointer; } .use-cases .generator .content .btn-next.disabled, .use-cases .generator .content .send.disabled { color: rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 255, 0.15); } @-webkit-keyframes shake { 10%, 90% { -webkit-transform: translate3d(-1px, 0, 0); transform: translate3d(-1px, 0, 0); } 20%, 80% { -webkit-transform: translate3d(2px, 0, 0); transform: translate3d(2px, 0, 0); } 30%, 50%, 70% { -webkit-transform: translate3d(-4px, 0, 0); transform: translate3d(-4px, 0, 0); } 40%, 60% { -webkit-transform: translate3d(4px, 0, 0); transform: translate3d(4px, 0, 0); } } @keyframes shake { 10%, 90% { -webkit-transform: translate3d(-1px, 0, 0); transform: translate3d(-1px, 0, 0); } 20%, 80% { -webkit-transform: translate3d(2px, 0, 0); transform: translate3d(2px, 0, 0); } 30%, 50%, 70% { -webkit-transform: translate3d(-4px, 0, 0); transform: translate3d(-4px, 0, 0); } 40%, 60% { -webkit-transform: translate3d(4px, 0, 0); transform: translate3d(4px, 0, 0); } } .use-cases .generator .content .apply-shake { -webkit-animation: shake 0.42s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; animation: shake 0.42s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; } .use-cases .generator .content .pagination .bullet { display: inline-block; color: #fff; border: 1px solid #ffffff; padding: 2px; width: 20px; height: 20px; border-radius: 50% 50%; font-size: 0.7em; outline: none; margin: 1rem 0.3rem; opacity: 0.2; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .use-cases .generator .content .pagination .bullet.active { opacity: 1; } .use-cases .generator .content .pagination .bullet.visited { opacity: 1; transition: opacity 1s ease-out 600ms; } .use-cases .generator .content .pagination .bullet.current { color: #444; background-color: #fff; } .use-cases .generator .content .pagination .bullet.pointer { cursor: pointer; } .use-cases .generator .bg { height: calc(100vh - 50px); transition: all 1s ease-out; min-height: 550px; background-color: #070E24; } .use-cases .generator .bg.loaded { height: 50vh; min-height: auto; } .use-cases .generator.light .content { color: #0477D0; } .use-cases .generator.light .content .intro-wrapper { color: #0477D0; } .use-cases .generator.light .content .forth-wrapper .author { color: #0477D0; } .use-cases .generator.light .content .forth-wrapper .disclaimer { color: #0477D0; } .use-cases .generator.light .content .forth-wrapper .loader { color: #0477D0; } .use-cases .generator.light .content .fifth-wrapper .choose, .use-cases .generator.light .content #fifth-wrapper .choose { color: #0477D0; } .use-cases .generator.light .content .fifth-wrapper .choose span, .use-cases .generator.light .content #fifth-wrapper .choose span { border-bottom: 0 solid #ffffff; } .use-cases .generator.light .content .button-replay { color: #0477D0; } .use-cases .generator.light .content .button-replay:after { background: url("../img/common/replay-usecase.svg") no-repeat 50% 50%; } .use-cases .generator.light .content .button-replay:hover { color: #0477D0; } .use-cases .generator.light .content .choose { color: #7E7E7E; } .use-cases .generator.light .content .choose span { color: #0477D0; border-bottom: 1px solid #0477D0; } .use-cases .generator.light .content .radio span.custom > span { color: #0477D0; background-color: rgba(255, 255, 255, 0.35); padding: 0.8rem 3.2rem 0.8rem; font-weight: 300; } .use-cases .generator.light .content .radio span.custom > span:hover { color: #0477D0; background-color: rgba(255, 255, 255, 0.75); } .use-cases .generator.light .content .radio input:checked + span.custom > span { background-color: #0477D0; color: #ffffff; } .use-cases .generator.light .content .btn-next, .use-cases .generator.light .content .send { color: #fff; border: 0 solid #0477D0; background-color: #0477D0; } .use-cases .generator.light .content .btn-next.disabled, .use-cases .generator.light .content .send.disabled { color: rgba(255, 255, 255, 0.6); background-color: rgba(4, 119, 208, 0.25); } .use-cases .generator.light .content .pagination .bullet { border: 0 solid #7E7E7E; background-color: #ffffff; color: #444; padding: 3px; } .use-cases .generator.light .bg { background-color: #DDD; } .use-cases .results .case { display: none; } .use-cases .results .case.visible { display: block; } .use-cases .section-header { padding-bottom: 150px; background-color: #f6f6f6; } .use-cases .section-header .content { top: 0; -webkit-transform: translateY(0%); transform: translateY(0%); color: #fff; text-align: left; } .use-cases .section-header .content .dark-font { color: #444444; } .use-cases .section-header .content .garden-font { color: #ffffff; } .use-cases .section-header .content h1 { font-weight: 600; } .use-cases .section-header .content h1 span { display: block; font-size: 60%; font-weight: 300; padding-top: 10px; } .use-cases .section-header .content .extra-margin span { margin-top: .75em; } .use-cases .section-header .bg { height: 105vh; transition: all 1s ease-out; } .use-cases .section-header .bg .copy { position: absolute; bottom: 0; left: 50%; -webkit-transform: translate(-50%, 50%); transform: translate(-50%, 50%); width: 90%; max-width: 480px; padding: 20px; color: #fff; text-align: center; background: #0b1135; background: linear-gradient(to right, #072655 0, #0b1135 100%); border-radius: 8px; box-shadow: 0 7px 21px 0 rgba(0, 0, 0, 0.25); } .use-cases .section-header .bg .copy p:last-of-type { padding-bottom: 0; } .use-cases .section-header .bg .copy.garden { background: #3d5614; background: linear-gradient(to right, #083d11 0, #3d5614 100%); } .use-cases .section-header .bg .copy.security { background: #072655; background: linear-gradient(to right, #0b1135 0, #072655 100%); } .use-cases .section-header .bg .copy.multimedia { background: #0d193c; background: linear-gradient(to right, #0d193c 0, #38285d 100%); } .use-cases .section-header .bg .copy.safety { background: #222a50; background: linear-gradient(to right, #222a50 0, #3a4365 100%); } .use-cases .section-header .bg img { display: none; } .use-cases .section-header .bg.loaded { height: 85vh; } .use-cases .section-header.redesign { padding-bottom: 0; background-color: #070b1f; } .use-cases .section-header.redesign .content { top: 50%; -webkit-transform: translateY(-55%); transform: translateY(-55%); } .use-cases .section-header.redesign .content h1 { text-align: center; } .use-cases .section-header.redesign .bg.loaded { height: 40vh; opacity: 0.4; } .use-cases .video-section { height: 250px; } .use-cases .video-section .content { font-size: 16px; } .use-cases .video-section .button.button-play { width: 40px; height: 40px; margin-top: 2.4rem; margin-bottom: 2.4rem; } .use-cases .video-section .button.button-play:before { width: 38px; height: 38px; } .use-cases .video-section .button.button-play:after { width: 40px; height: 40px; background-size: 40px 40px; } .use-cases .video-section .button span { font-size: 16px; width: 250px; visibility: visible; color: #ffffff; top: 120%; position: absolute; left: -260%; } .use-cases .video-section.fixed-height { height: 400px; } .use-cases .video-section.fixed-height h1 { font-size: 26px; } .use-cases .video-section.fixed-height h1 br { display: none; } .use-cases .video-section.fixed-height .button.button-play { width: auto; margin-left: 50px; } .use-cases .video-section.fixed-height .button.button-play:before { left: -30px; } .use-cases .video-section.fixed-height .button.button-play:after { left: -50px; } .use-cases .video-section.fixed-height .button span { position: relative; width: auto; left: 0; top: 5px; } .use-cases .video-section.fixed-height .video-icon { width: 100px; height: auto; } .use-cases .usecase-cards h2 { padding: 2.4rem 0 4.4rem; } .use-cases .usecase-cards .flipped-image { -webkit-transform: scaleX(-1); transform: scaleX(-1); } .use-cases .usecase-cards .swiper-slide { border-radius: 10px; background-color: #070b1f; box-shadow: 0 24px 30px -15px rgba(0, 0, 0, 0.35); margin-bottom: 60px; margin-top: 1.4rem; } .use-cases .usecase-cards .swiper-slide img { width: 100%; border-radius: 10px 10px 0 0; } .use-cases .usecase-cards .swiper-slide .icons-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 15% 0; min-height: 115px; } .use-cases .usecase-cards .swiper-slide .icons-wrapper img { width: auto; height: 74px; border-radius: 0; } .use-cases .usecase-cards .swiper-slide .icons-wrapper span { display: block; color: #fff; } .use-cases .usecase-cards .swiper-pagination-bullet { background: transparent; opacity: 1; border: solid 1px #0090ff; } .use-cases .usecase-cards .swiper-pagination-bullet-active { background: #0090ff; } .use-cases .cases-wrapper-redesign { background-color: #f6f6f6; padding-bottom: 5.4rem; padding-top: 52px; } .use-cases .cases-wrapper-redesign h2 { padding: 2.4rem 0 2.4rem; } .use-cases .cases-wrapper-redesign .case { background-color: #fff; padding-left: 0; padding-right: 0; margin-bottom: 5.4rem; } .use-cases .cases-wrapper-redesign .case .content { padding: 4.4rem 0 2.4rem; } .use-cases .cases-wrapper-redesign .case h3 { font-size: 22px; font-weight: 700; padding-bottom: 2.4rem; } .use-cases .cases-wrapper-redesign .case ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; max-width: 480px; margin: 1.2rem auto; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .use-cases .cases-wrapper-redesign .case li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 33%; margin-bottom: 15px; } .use-cases .cases-wrapper-redesign .case li span { color: #a7a7a7; padding-top: 5px; font-size: 11px; text-align: center; } .use-cases .cases-wrapper-redesign .case li img { width: 70px; } .use-cases .cases-wrapper-redesign .case li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-decoration: none; text-align: center; } .use-cases .cases-wrapper-redesign .case li a span { color: #0090ff; border-bottom: 1px solid transparent; transition: all 250ms; } .use-cases .cases-wrapper-redesign .case li a:hover span { border-bottom: 1px solid #0090ff; } .use-cases .cases-wrapper-redesign .case .image-wrapper img { width: 100%; height: auto; } .use-cases .cases-wrapper-redesign .case .image-wrapper img.flipped-image { -webkit-transform: scaleX(-1); transform: scaleX(-1); } .use-cases .cases-wrapper-redesign .case .image-wrapper figure { margin: 0 0 0; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint { border: 0; color: #ffffff; background-color: #0090ff; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 90%; max-width: 380px; bottom: -40px; height: 70px; border-radius: 8px; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint figcaption { text-align: left; text-transform: none; line-height: 1.5; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint div { font-size: 100%; line-height: 1.2; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint span { font-size: 100%; font-weight: 600; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint img { margin-right: 2.4rem; height: 40px !important; max-width: 40px !important; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint.alexa-scene { display: inline-block; height: auto; bottom: inherit; top: -30px; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint.alexa-scene figcaption { text-align: center; text-transform: none; line-height: 1.5; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint.alexa-scene span { display: inline-block; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint.alexa-scene div { margin: 8px 0; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint.alexa-scene:after { content: ''; display: block; position: absolute; bottom: -5px; right: 23px; z-index: -1; width: 30px; height: 20px; background-color: #0090ff; -webkit-transform: rotate(50deg) skewX(50deg); transform: rotate(50deg) skewX(50deg); } .use-cases .cases-wrapper-redesign .case:last-of-type { margin-bottom: 0; } .use-cases .cases-wrapper-redesign .case#must_01 li { width: 75%; } .use-cases .cases-wrapper-redesign .case#must_01 li img { margin-bottom: 1em; } .use-cases .cases-wrapper-redesign .case#must_02 .logos { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .use-cases .cases-wrapper-redesign .case#must_02 .logos img { width: 150px; height: auto; margin: 1rem; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding-bottom: 2.4rem; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category img { width: 70px; height: auto; margin-left: -15px; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category p { text-align: left; padding-bottom: 5px; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category h4 { font-size: 18px; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .description { font-size: 20px; padding-bottom: 2.4rem; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .button { display: inline-block; position: relative; padding: 6px 40px 6px 30px; border-radius: 20px; color: #0090ff; transition: all 250ms; margin: 1rem 0 2.4rem; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .button:after { content: ''; display: block; position: absolute; top: 51%; right: 30px; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .button:hover { background-color: #0090ff; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .button:hover a { color: #fff; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .button:hover:after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .use-cases .cases-wrapper-redesign .hour { padding-bottom: 2.4rem; margin-top: -2.4rem; } .use-cases .cases-wrapper-redesign .hour .pre-hour { background: linear-gradient(#01cae8, #4485ef); width: 2px; height: 55px; margin-left: 50%; } .use-cases .cases-wrapper-redesign .hour .middle-hour { margin: 20px 0; } .use-cases .cases-wrapper-redesign .hour .middle-hour h2, .use-cases .cases-wrapper-redesign .hour .middle-hour p { padding: 0; } .use-cases .cases-wrapper-redesign .hour .middle-hour p { font-size: 18px; } .use-cases .cases-wrapper-redesign .hour .post-hour { background: linear-gradient(#7a4df5, #a124f9); width: 2px; height: 55px; margin-left: 50%; } .use-cases .integrations .button { display: inline-block; position: relative; padding: 6px 40px 6px 30px; border-radius: 20px; border: 1px solid #0090ff; color: #0090ff; transition: all 250ms; margin: 20px 0 0; } .use-cases .integrations .button:after { content: ''; display: block; position: absolute; top: 51%; right: 30px; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .use-cases .integrations .button:hover { background-color: #0090ff; } .use-cases .integrations .button:hover a { color: #fff; } .use-cases .integrations .button:hover:after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .use-cases .integrations .bg { padding-bottom: 30%; } .use-cases .integrations .bg2 { display: none; } .use-cases .integrations.garden { padding-top: 3.4rem; padding-bottom: 4.4rem; } .use-cases .one-app { background-color: #c6c9cf; } .use-cases .one-app.dark { background-color: #ffffff; } .use-cases .one-app.mood { background-color: #544143; } .use-cases .one-app.mood h2, .use-cases .one-app.mood p { color: #ffffff; } .use-cases .one-app.mood .download { background-color: #544143; } .use-cases .one-app.climate { background-color: #f2f3f7; } .use-cases .one-app.lighting { background-color: #03103a; } .use-cases .one-app.lighting .content { color: #ffffff; } .use-cases .one-app.lighting .download { color: #ffffff; background-color: #03103a; } .use-cases .one-app .content .download { display: none; } .use-cases .one-app .button { display: inline-block; position: relative; padding: 6px 40px 6px 30px; border-radius: 20px; border: 1px solid #0090ff; color: #0090ff; transition: all 250ms; margin: 20px 0 0; } .use-cases .one-app .button:after { content: ''; display: block; position: absolute; top: 51%; right: 30px; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .use-cases .one-app .button:hover { background-color: #0090ff; } .use-cases .one-app .button:hover a { color: #fff; } .use-cases .one-app .button:hover:after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .use-cases .one-app .download { text-align: center; padding: 4.4rem 0; background-color: #f2f3f7; } .use-cases .one-app .download span { font-weight: 700; } .use-cases .one-app .download img { margin: 5px 5px; width: 120px; height: auto; } .use-cases .one-app .bg { padding-bottom: 94%; } .use-cases .find-expert { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .use-cases .find-expert .content { padding-top: 7.4rem; padding-bottom: 7.4rem; } .use-cases .find-expert h2 { font-size: 2.1em; line-height: 1.4; } .use-cases .find-expert h2 br { display: none; } .use-cases .find-expert .expert-button { display: inline-block; position: relative; padding: 8px 30px 8px 30px; border-radius: 10px; transition: all 250ms; margin: 20px 0 0; background-image: linear-gradient(to right, #3b8ff7, #2b52db); cursor: pointer; } .use-cases .find-expert .expert-button a { color: #ffffff; font-size: 1.2em; } .use-cases .find-expert .expert-button:hover { background-image: linear-gradient(to right, #1c41b0, #1c41b0); } .use-cases .find-expert .expert-button:hover a { color: #ffffff; } .use-cases .find-expert.garden { background-color: #f6f6f6; } .use-cases .find-expert.garden .content { padding-top: 0; padding-bottom: 6.4rem; } .use-cases .voice-control .content { position: absolute; z-index: 1; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .use-cases .voice-control .content h2 { color: #ffffff; } .use-cases .voice-control .content .swiper-container { color: #fff; font-style: italic; font-size: 22px; } .use-cases .voice-control .content .swiper-container .swiper-wrapper { margin-bottom: 35px; } .use-cases .voice-control .content .swiper-container .swiper-pagination-bullet { background: transparent; opacity: 1; border: solid 1px #0090ff; } .use-cases .voice-control .content .swiper-container .swiper-pagination-bullet-active { background: #0090ff; } .use-cases .voice-control .content .logos { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 25px 0 20px; } .use-cases .voice-control .content .logos img { height: 30px; width: auto; margin: 3px 5px; } .use-cases .voice-control .content .button { display: inline-block; position: relative; padding: 6px 35px 6px 25px; border-radius: 20px; border: 1px solid #0090ff; color: #0090ff; transition: all 250ms; margin: 20px 0 0; } .use-cases .voice-control .content .button:after { content: ''; display: block; position: absolute; top: 51%; right: 25px; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .use-cases .voice-control .content .button:hover { background-color: #0090ff; } .use-cases .voice-control .content .button:hover a { color: #fff; } .use-cases .voice-control .content .button:hover:after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .use-cases .voice-control .content .hint.blue { background-color: #0090ff; color: #ffffff; border-color: #0090ff; border-radius: 10px; margin-bottom: 1em; } .use-cases .voice-control .content .hint.blue figcaption { text-align: center; text-transform: none; padding: 10px 20px; position: relative; } .use-cases .voice-control .content .hint.blue figcaption:after { content: ''; display: block; position: absolute; bottom: -16px; left: 10px; z-index: -1; width: 30px; height: 20px; background-color: #0090ff; -webkit-transform: rotate(90deg) skewX(40deg); transform: rotate(90deg) skewX(40deg); } .use-cases .voice-control .content .hint.blue figcaption div { line-height: 1.2; } .use-cases .voice-control .bg { height: 350px; } .use-cases .voice-control .bg.garden { height: 400px; } .use-cases .share { background: #15315e; color: #ffffff; height: 240px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; /* Solid icons get a fill */ } .use-cases .share .resp-sharing-button__link, .use-cases .share .resp-sharing-button__icon { display: inline-block; } .use-cases .share .resp-sharing-button__link { text-decoration: none; color: #fff; margin: 1em 1em 0 1em; } .use-cases .share .resp-sharing-button { border-radius: 25px; transition: 25ms ease-out; padding: 0.5em 0.55em; } .use-cases .share .resp-sharing-button__icon svg { width: 1.5em; height: 1.5em; vertical-align: middle; } .use-cases .share .resp-sharing-button__icon--solid, .use-cases .share .resp-sharing-button__icon--solidcircle { fill: #fff; stroke: none; } .use-cases .share .resp-sharing-button--facebook { border: 1px solid #ffffff; } .use-cases .share .resp-sharing-button--facebook:hover, .use-cases .share .resp-sharing-button--facebook:active { background-color: #3b5998; border: 1px solid #3b5998; } .use-cases .share .resp-sharing-button--twitter { border: 1px solid #ffffff; } .use-cases .share .resp-sharing-button--twitter:hover, .use-cases .share .resp-sharing-button--twitter:active { background-color: #55acee; border: 1px solid #55acee; } .use-cases .find-more-possibilities { color: #ffffff; background-color: #070E24; } .use-cases .find-more-possibilities h2 { padding-bottom: 0; } .use-cases .other-devices { background-color: #F6F6F6; width: 100%; max-width: 2560px; } .use-cases .other-devices h2 { padding: 2.4rem 0 2.4rem; } .use-cases .other-devices .swiper-container { overflow: visible; } .use-cases .other-devices .swiper-wrapper .device { width: 100%; text-align: center; background: #fff; border-radius: 20px; overflow: hidden; margin-bottom: 45px; padding-bottom: 30px; } .use-cases .other-devices .swiper-wrapper .device img { width: 100%; height: auto; display: block; border-radius: 20px; margin-top: -10%; } .use-cases .other-devices .swiper-wrapper .device h3 { font-weight: 700; display: block; padding: 2.4rem 0 1rem; font-size: 22px; margin-top: -25%; } .use-cases .other-devices .swiper-wrapper .device p { display: none; } .use-cases .other-devices .swiper-wrapper .device .link { margin-top: 30px; display: inline-block; position: relative; padding: 6px 43px 6px 35px; } .use-cases .other-devices .swiper-wrapper .device .link:after { content: ''; display: block; position: absolute; top: 51%; right: 30px; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .use-cases .other-devices .swiper-pagination-bullet { background: transparent; opacity: 1; border: solid 1px #0090ff; } .use-cases .other-devices .swiper-pagination-bullet-active { background: #0090ff; } .use-cases .other-devices .button { display: inline-block; position: relative; padding: 6px 40px 6px 30px; border-radius: 20px; border: 1px solid #0090ff; color: #0090ff; transition: all 250ms; margin: 20px 0; } .use-cases .other-devices .button:after { content: ''; display: block; position: absolute; top: 51%; right: 30px; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .use-cases .other-devices .button:hover { background-color: #0090ff; } .use-cases .other-devices .button:hover a { color: #fff; } .use-cases .other-devices .button:hover:after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .use-cases .features { padding-bottom: 3.6rem; width: auto; max-width: 2560px; } .use-cases .features .hidden { display: none; } .use-cases .features .swiper-slide .wrapper { padding: 0 2.4rem; } .use-cases .features .swiper-slide ul { text-align: center; padding: 0 2.4rem; } .use-cases .features .swiper-slide ul li { margin-bottom: 1.2rem; } .use-cases .features .swiper-slide img { width: 100%; border-radius: 8px; margin: 1.2rem 0 3.6rem; box-shadow: 0 24px 31px -15px rgba(0, 0, 0, 0.35); } .use-cases .features .swiper-pagination { position: relative; bottom: 0; margin-top: 2.4rem; } .use-cases .features:before { content: ""; background-color: #f6f6f6; position: absolute; height: 140px; width: 100%; } .use-cases .cases { background-color: #f6f6f6; padding-bottom: 6rem; } .use-cases .cases > .content { padding-top: 7.2rem; } .use-cases .cases h2 { padding-bottom: 78px; } .use-cases .cases h3 { font-size: 26px; } .use-cases .cases hr { display: inline-block; width: 120px; height: 0; border: 0; border-bottom: 2px solid #0090ff; margin: 1.2rem 0; } .use-cases .cases .case { padding-bottom: 12rem; } .use-cases .cases .case:last-of-type { padding-bottom: 0; } .use-cases .cases .case .content { padding-top: 0; padding-bottom: 8.4rem; background-color: #fff; } .use-cases .cases .case ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; max-width: 480px; margin: 1.2rem auto; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .use-cases .cases .case li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 50%; } .use-cases .cases .case li span { color: #a7a7a7; } .use-cases .cases .case li img { width: 90px; } .use-cases .cases .case li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-decoration: none; } .use-cases .cases .case li a span { color: #0090ff; border-bottom: 1px solid transparent; transition: all 250ms; } .use-cases .cases .case li a:hover span { border-bottom: 1px solid #0090ff; } .use-cases .cases .case .hifi { height: 90px; width: 129px; } .use-cases .cases .case-tag { background-color: #0090FF; border-radius: 50%; width: 80px; height: 80px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .use-cases .cases .case-tag img { max-width: 60%; max-height: 60%; } .use-cases .cases .case-tag.head { position: relative; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin-top: -2.4rem; margin-bottom: -1.8rem; } .use-cases .cases .figure { position: relative; } .use-cases .cases .image-wrapper { width: 90%; max-width: 480px; box-shadow: 0 24px 70px -15px rgba(0, 0, 0, 0.35); border-radius: 8px; margin: -4.8rem auto 0; position: relative; } .use-cases .cases .image-wrapper img { width: 100%; border-radius: 8px; } .use-cases .cases .image-wrapper figure { margin: 0 0 0; } .use-cases .cases .image-wrapper .hint { border: 0; color: #ffffff; background-color: #0090ff; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 90%; max-width: 380px; bottom: -40px; height: 70px; border-radius: 8px; } .use-cases .cases .image-wrapper .hint figcaption { text-align: left; text-transform: none; line-height: 1.5; } .use-cases .cases .image-wrapper .hint div { font-size: 100%; line-height: 1.2; } .use-cases .cases .image-wrapper .hint span { font-size: 100%; font-weight: 600; } .use-cases .cases .image-wrapper .hint img { margin-right: 2.4rem; height: 40px !important; max-width: 40px !important; } .use-cases .cases .image-wrapper .hint.home-cinema { display: inline-block; height: auto; bottom: -8%; } .use-cases .cases .image-wrapper .hint.home-cinema figcaption { text-align: center; text-transform: none; line-height: 1.5; } .use-cases .cases .image-wrapper .hint.home-cinema span { display: inline-block; } .use-cases .cases .image-wrapper .hint.home-cinema:before { content: ''; display: block; position: absolute; top: -5px; right: 23px; z-index: -1; width: 30px; height: 20px; background-color: #0090ff; -webkit-transform: rotate(105deg) skewX(50deg); transform: rotate(105deg) skewX(50deg); } .use-cases .cases .image-wrapper .hint.safe-fortress { display: inline-block; height: auto; bottom: inherit; top: -30px; } .use-cases .cases .image-wrapper .hint.safe-fortress figcaption { text-align: center; text-transform: none; line-height: 1.5; } .use-cases .cases .image-wrapper .hint.safe-fortress span { display: inline-block; } .use-cases .cases .image-wrapper .hint.safe-fortress div { margin: 8px 0; } .use-cases .cases .image-wrapper .hint.safe-fortress:after { content: ''; display: block; position: absolute; bottom: -5px; left: 23px; z-index: -1; width: 30px; height: 20px; background-color: #0090ff; -webkit-transform: rotate(105deg) skewX(50deg); transform: rotate(105deg) skewX(50deg); } .use-cases #usecase-icon-menu { background-color: #f6f6f6; } .use-cases #usecase-icon-menu p { color: #444444; padding-top: 10px; } .use-cases #usecase-icon-menu img { width: 50%; height: auto; } .use-cases #usecase-icon-menu h2 { font-size: 26px; line-height: 1.4; } .use-cases #usecase-icon-menu .swiper-scrollbar { margin: 20px auto 40px; } .use-cases #usecase-icon-menu .swiper-scrollbar-drag { cursor: move; /* fallback if grab cursor is unsupported */ cursor: -webkit-grab; cursor: grab; } .use-cases #usecase-icon-menu .swiper-container { margin-bottom: 2.4rem; } .use-cases #usecase-icon-menu .swiper-container .swiper-scrollbar { bottom: 13px; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide { -ms-flex-item-align: end; align-self: flex-end; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide .col-phoneS-12 { padding-left: 0; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide .more { display: none; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide:nth-of-type(2n) .content .col-phoneS-12 { padding-right: 0; } .use-cases #usecase-icon-menu .usecase-button { display: inline-block; position: relative; padding: 8px 30px 8px 30px; border-radius: 10px; transition: all 250ms; margin: 20px 0 0; background-image: linear-gradient(to right, #3b8ff7, #2b52db); cursor: pointer; } .use-cases #usecase-icon-menu .usecase-button a { color: #ffffff; font-size: 1.2em; } .use-cases #usecase-icon-menu .usecase-button:hover { background-image: linear-gradient(to right, #1c41b0, #1c41b0); } .use-cases #usecase-icon-menu .usecase-button:hover a { color: #ffffff; } .use-cases #use-case-nav-wrapper { background-color: #f6f6f6; } .use-cases #use-case-nav { height: 260px; padding: 24px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background-position: 50% 50%; background-size: cover; color: #fff; -webkit-transform: translateY(50%); transform: translateY(50%); opacity: 0; transition: all 0.75s cubic-bezier(0.4, 0, 0.2, 1); } .use-cases #use-case-nav h2 a { color: inherit; display: inline-block; padding-bottom: 4px; transition: all 500ms; } .use-cases #use-case-nav h2 a:after { content: '\2192'; padding-left: 16px; position: absolute; opacity: 0; transition: 0.6s; -webkit-transform: translateX(-40px); transform: translateX(-40px); } .use-cases #use-case-nav h2 a:hover:after { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } .use-cases #use-case-nav a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .use-cases #use-case-nav h2, .use-cases #use-case-nav a { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; } .use-cases #use-case-nav > a { color: #fff; font-size: 170%; border-bottom: 1px solid #fff; padding-bottom: 2px; font-weight: 600; } .use-cases #use-case-nav.inview { -webkit-transform: translateY(0%); transform: translateY(0%); opacity: 1; } .use-cases #use-case-nav-overlay { position: fixed; z-index: 10000; width: 100vw; height: 100vh; top: 0; left: -100%; background-color: #070E24; opacity: .01; overflow: hidden; transition: opacity .5s, left 0s .5s; } .use-cases #use-case-nav-overlay .swiper-pagination-bullet { background: #fff; opacity: 0.3; } .use-cases #use-case-nav-overlay .swiper-pagination-bullet-active { opacity: 1; background: #007aff; } .use-cases #use-case-nav-overlay * ::selection { background-color: transparent; } .use-cases #use-case-nav-overlay #use-case-nav-close { position: absolute; top: 24px; right: 24px; opacity: 0; transition: opacity 1s ease-out .5s; } .use-cases #use-case-nav-overlay #use-case-nav-close img { width: 24px; height: 24px; } .use-cases #use-case-nav-overlay h2 { text-align: center; margin-bottom: 80px; padding-bottom: 0; color: #fff; } .use-cases #use-case-nav-overlay .wrapper { position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); opacity: 0; transition: opacity 1s ease-out .5s; } .use-cases #use-case-nav-overlay .swiper-pagination { position: relative; margin: 30px; } .use-cases #use-case-nav-overlay .swiper-pagination .swiper-pagination-bullet { margin: 0 5px; } .use-cases #use-case-nav-overlay .swiper-container { overflow: visible; } .use-cases #use-case-nav-overlay.active { left: 0; opacity: 1; transition: opacity .5s; } .use-cases #use-case-nav-overlay.active #use-case-nav-close, .use-cases #use-case-nav-overlay.active .wrapper { opacity: 1; } .use-cases #top-use-case-nav { position: relative; z-index: 9999; top: 0; width: 100%; height: 51px; background-color: #070e24; border-bottom: 1px solid #024274; box-shadow: 0 0 0 transparent; } .use-cases #top-use-case-nav .use-cases-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 52px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; } .use-cases #top-use-case-nav .use-cases-link a { font-weight: 600; margin-left: 6px; text-decoration: none; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; } .use-cases #top-use-case-nav .use-cases-link a:after { content: ''; display: inline-block; width: 8px; height: 8px; border-bottom: 1px solid #fff; border-left: 1px solid #fff; -webkit-transform: rotate(-45deg) translateY(-3px); transform: rotate(-45deg) translateY(-3px); margin-left: 8px; } .use-cases #top-use-case-nav.generator-top-menu-mobile { display: none; } .use-cases #top-use-case-nav.generator-top-menu-mobile.active { display: block; } .use-cases .slides { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; width: 100%; } .use-cases .slide { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; position: relative; height: auto; border-right: 2px solid #070e24; background-color: #fff; overflow: hidden; cursor: -webkit-grab; cursor: grab; } .use-cases .slide:active { cursor: -webkit-grabbing; cursor: grabbing; } .use-cases .slide:last-of-type { border-right: none; } .use-cases .slide .dark-font { color: #444444; } .use-cases .slide .garden-font { color: #ffffff; } .use-cases .slide img { width: 100%; height: 100%; } .use-cases .slide h3, .use-cases .slide div { position: absolute; color: #fff; } .use-cases .slide h3 { font-size: 16px; top: 12px; left: 12px; font-weight: 600; } .use-cases .slide h3 span { display: block; margin-top: .25em; font-weight: 300; } .use-cases .slide div { bottom: 12px; left: 12px; } .use-cases .swiper-scrollbar { position: relative; height: 2px; width: 80%; background-color: #ccc; margin: 100px auto 0; } .use-cases .swiper-scrollbar-drag { position: relative; height: 2px; background-color: #444; cursor: -webkit-grab; cursor: grab; } .use-cases .swiper-scrollbar-drag:active { cursor: -webkit-grabbing; cursor: grabbing; } .use-cases .swiper-scrollbar-drag:before { content: ''; display: block; height: 20px; width: 100%; z-index: -1; pointer-events: auto; -webkit-transform: translateY(-10px); transform: translateY(-10px); } .use-cases.main main { margin-top: 52px; } .use-cases.main .section-header { padding-bottom: 0; } .use-cases.main .section-header .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-60%); transform: translateY(-60%); } .use-cases.main .section-header .content h1 { font-weight: 300; font-size: 22px; text-align: center; } .use-cases.main .section-header .content h1 span { display: block; font-size: 140%; font-weight: 400; padding-top: 10px; line-height: 1.4; } .use-cases.main .section-header .content p { font-weight: 300; font-size: 18px; text-align: center; padding-top: 25px; } .use-cases.main .section-header h1, .use-cases.main .section-header img { opacity: 0; -webkit-transform: translateX(0); transform: translateX(0); transition: all 1s ease-out; pointer-events: none; } .use-cases.main .section-header.active h1, .use-cases.main .section-header.active img { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); pointer-events: none; } .use-cases.main .section-header #menu-wrapper { margin-top: 30px; opacity: 0.0001; -webkit-transform: translateX(60px); transform: translateX(60px); transition: all 0.7s ease-out; } .use-cases.main .section-header #menu-wrapper .swiper-container { overflow: visible; } .use-cases.main .section-header #menu-wrapper .swiper-pagination { position: relative; margin-top: 15px; } .use-cases.main .section-header #menu-wrapper .swiper-pagination .swiper-pagination-bullet { background: #fff; opacity: 0.3; margin: 0 5px; } .use-cases.main .section-header #menu-wrapper .swiper-pagination .swiper-pagination-bullet-active { opacity: 1; background: #007aff; } .use-cases.main .section-header #menu-wrapper .slide { border-right: 2px solid transparent; background-color: transparent; } .use-cases.main .section-header #menu-wrapper.active { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } .use-cases.main .section-header #bg-fadeout { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); transition: all 0.9s ease-out; } .use-cases.main .section-header #bg-fadeout.active { opacity: 0.05; -webkit-transform: translateX(0); transform: translateX(0); } .use-cases.main .section-header .bg-wrapper { background-color: rgba(7, 14, 36, 0.95); } .use-cases.main .section-header .bg-wrapper .bg { padding-bottom: 172%; } .use-cases.main #use-case-nav-overlay { background-color: rgba(7, 14, 36, 0.95); color: #ffffff; } .use-cases.main #use-case-nav-overlay .swiper-scrollbar { background-color: transparent; } .use-cases.generator .cases-wrapper-redesign h1, .use-cases.generator .cases-wrapper-redesign h2 { font-size: 26px; padding: 2.4rem 0 2.4rem; } .use-cases #secondary-nav { display: none; } .use-cases #secondary-nav .items { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .use-cases #secondary-nav .title { max-width: 95%; font-size: 14px; padding: 7px 0; font-weight: 300; } .use-cases #secondary-nav .title span { font-weight: 600; } .use-cases #secondary-nav .actions { width: 5%; margin-left: 12px; } .use-cases #use-case-nav-desktop { display: none; } .use-cases #simple-mobile-top-menu { display: none; } @media screen and (max-width: 767px) and (orientation: landscape) { .use-cases .section-header .bg { height: 100vh; padding-bottom: 0; } } @media (max-width: 767px) { .use-cases .cases .case li.plus { display: none; } .cases-wrapper-redesign .case li.plus { display: none; } } @media (min-width: 544px) { .use-cases .voice-control .content .logos img { height: 45px; margin: 3px 10px; } } @media (min-width: 768px) { .use-cases .generator .content .forth-wrapper .quote { font-size: 26px; padding-bottom: 2rem; } .use-cases .generator .content .forth-wrapper .quote br { display: block; } .use-cases .generator .content .question { margin-bottom: 2rem; } .use-cases .generator .content .question h2 { font-size: 34px; } .use-cases .generator .content .radio span.custom > span { padding: 0.4rem 3.2rem 0.5rem; } .use-cases .section-header h1 { font-size: 48px; } .use-cases .section-header .bg { padding-bottom: 0; height: 100vh; } .use-cases .section-header .bg .copy { font-size: 120%; padding: 30px; } .use-cases .section-header .bg.loaded { padding-bottom: 0; height: 80vh; } .use-cases .video-section { height: 280px; } .use-cases .video-section.fixed-height .button.button-play { margin-top: 4.4rem; } .use-cases .features:before { height: 200px; } .use-cases .cases-wrapper-redesign .case .image-wrapper { height: 350px; overflow: hidden; } .use-cases .cases-wrapper-redesign .case .image-wrapper img { width: 100%; height: auto; position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .use-cases .cases-wrapper-redesign .case .image-wrapper img.flipped-image { -webkit-transform: translateY(-50%) scaleX(-1); transform: translateY(-50%) scaleX(-1); } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint.alexa-scene { top: 30px; } .use-cases .cases-wrapper-redesign .case ul { margin: 2.4rem auto; max-width: none; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .use-cases .cases-wrapper-redesign .case li { width: auto; margin-bottom: 0; } .use-cases .cases-wrapper-redesign .case li img { width: 50px; } .use-cases .cases-wrapper-redesign .case li.plus { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; max-width: 80px; position: relative; } .use-cases .cases-wrapper-redesign .case li.plus:before, .use-cases .cases-wrapper-redesign .case li.plus:after { content: ''; display: block; height: 2px; width: 12px; background-color: #cdcdcd; position: absolute; top: 25%; } .use-cases .cases-wrapper-redesign .case li.plus:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .use-cases .cases-wrapper-redesign .case#must_01 li { width: auto; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .button { border: 1px solid #0090ff; } .use-cases .cases-wrapper-redesign .hour .pre-hour, .use-cases .cases-wrapper-redesign .hour .post-hour { height: 70px; } .use-cases .integrations .bg { padding-bottom: 29%; } .use-cases .one-app { background-color: #67707F; } .use-cases .one-app .bg { padding-bottom: 50%; } .use-cases .one-app .button { display: inline-block; position: relative; padding: 6px 40px 6px 30px; border-radius: 20px; border: 1px solid #ffffff; color: #ffffff; transition: all 250ms; margin: 20px 0 0; } .use-cases .one-app .button a { color: #fff; } .use-cases .one-app .button:after { content: ''; display: block; position: absolute; top: 51%; right: 30px; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #ffffff; border-bottom: 1px solid #ffffff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .use-cases .one-app .button:hover { background-color: #0090ff; border: 1px solid #0090ff; } .use-cases .one-app .button:hover a { color: #fff; } .use-cases .one-app .button:hover:after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .use-cases .one-app.dark .button { border: 1px solid #0090ff; color: #0090ff; } .use-cases .one-app.dark .button a { color: #0090ff; } .use-cases .one-app.dark .button:after { border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; } .use-cases .one-app.dark .button:hover a { color: #fff; } .use-cases .one-app.dark .button:hover:after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .use-cases .one-app.mood .button, .use-cases .one-app.climate .button { border: 1px solid #0090ff; color: #0090ff; } .use-cases .one-app.mood .button a, .use-cases .one-app.climate .button a { color: #0090ff; } .use-cases .one-app.mood .button:after, .use-cases .one-app.climate .button:after { border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; } .use-cases .one-app.mood .button:hover, .use-cases .one-app.climate .button:hover { background-color: #0090ff; } .use-cases .one-app.mood .button:hover a, .use-cases .one-app.climate .button:hover a { color: #fff; } .use-cases .one-app.mood .button:hover:after, .use-cases .one-app.climate .button:hover:after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .use-cases .one-app.climate .content { color: #444444; } .use-cases .one-app .download { padding: 5rem 0; } .use-cases .one-app .download img { margin: 20px 10px 5px; width: 160px; } .use-cases .one-app .content { color: #ffffff; } .use-cases .one-app .content.dark-font { color: #444444; } .use-cases .find-expert .content { padding-top: 9.4rem; padding-bottom: 9.4rem; } .use-cases .voice-control .content .swiper-container { font-size: 26px; } .use-cases .voice-control .content .logos img { height: 55px; margin: 3px 15px; } .use-cases .voice-control .bg { height: 370px; } .use-cases .cases .case ul { margin: 2.4rem auto; max-width: none; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .use-cases .cases .case li { width: auto; } .use-cases .cases .case li.plus { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; max-width: 80px; position: relative; } .use-cases .cases .case li.plus:before, .use-cases .cases .case li.plus:after { content: ''; display: block; height: 2px; width: 22px; background-color: #cdcdcd; position: absolute; top: 35%; } .use-cases .cases .case li.plus:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .use-cases.main .section-header .content p { font-size: 20px; padding-top: 0; padding-bottom: 20px; } .use-cases.main .section-header #menu-wrapper { margin-top: 60px; } } @media screen and (max-width: 1199px) and (orientation: landscape) { .use-cases #use-case-nav-overlay h2 { display: none; } .use-cases .slide { width: 45vw; } .use-cases .slide:last-of-type { width: calc(45vw - 1px); } } @media (min-width: 992px) { .use-cases .section-header { padding-bottom: 160px; } .use-cases .features .hidden { display: block; padding-bottom: 58px; } .use-cases .features h2 ~ p { font-size: 26px; text-align: center; } .use-cases .features .swiper-slide .wrapper { text-align: left; padding: 0 2px; } .use-cases .features .swiper-slide ul { padding: 0 2.4rem; } .use-cases .cases-wrapper-redesign .case .image-wrapper { height: 500px; } .use-cases .find-expert h2 br { display: block; } .use-cases .other-devices .devices-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .use-cases .other-devices .devices-wrapper .device { width: 33%; padding: 30px 20px; text-align: left; } .use-cases .other-devices .devices-wrapper .device img { width: 100%; height: auto; display: block; } .use-cases .other-devices .devices-wrapper .device h3 { font-weight: 700; display: block; padding: 2.4rem 0 1rem; font-size: 22px; } .use-cases .other-devices .devices-wrapper .device .link { display: inline-block; position: relative; padding: 6px 43px 6px 0; } .use-cases .other-devices .devices-wrapper .device .link:after { content: ''; display: block; position: absolute; top: 51%; right: 30px; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .use-cases #use-case-nav-overlay h2 { display: block; } .use-cases .slide h3 { font-size: 21px; top: 18px; left: 18px; } .use-cases .slide div { bottom: 18px; left: 18px; } .use-cases .swiper-scrollbar { width: 60%; } .use-cases.main .section-header .content h1 { font-size: 26px; } .use-cases.main .section-header .bg-wrapper .bg { padding-bottom: 56%; } } @media (min-width: 1200px) { .use-cases main { margin-top: 64px; } .use-cases.fixed-grid section.section-header { width: auto; max-width: 2560px; } .use-cases .subnav-active #secondary-nav { display: none; } .use-cases .generator { width: 100%; margin-top: 0; } .use-cases .generator.offset { margin-top: 0; } .use-cases .generator .content .question { margin-bottom: 2rem; } .use-cases .generator .content .radio span.custom > span { margin: 12px 8px; } .use-cases .generator .content .button-replay { position: absolute; display: block; margin-top: 25vh; right: 10px; max-width: 160px; margin-left: -8.33333%; } .use-cases .generator .content .button-replay:hover { transition: 0.5s all; } .use-cases .generator .content .button-replay:hover:after { -webkit-transform: translateY(-50%) rotate(360deg); transform: translateY(-50%) rotate(360deg); } .use-cases .generator .content .intro-wrapper h2 br { display: block; } .use-cases .generator .content .forth-wrapper .loader { margin: 70px auto 0; } .use-cases .generator .bg { height: calc(100vh - 64px); } .use-cases .generator .bg.loaded { margin-top: 50px; } .use-cases.generator #secondary-nav { display: none; } .use-cases.generator #secondary-nav.active { display: block; } .use-cases .section-header h1, .use-cases .section-header img { opacity: 0; -webkit-transform: translateY(40px); transform: translateY(40px); transition: all 1s ease-out; } .use-cases .section-header .content { top: 70px; } .use-cases .section-header.active h1, .use-cases .section-header.active img { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .use-cases .section-header .bg { height: 105vh; transition: all 1s ease-out; } .use-cases .section-header .bg .copy { max-width: 600px; padding: 40px; } .use-cases .section-header .bg img { display: inline-block; width: 40px; position: absolute; left: 50%; bottom: 15%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation: pulsateScrollIcon 4s ease-in-out 2s infinite; animation: pulsateScrollIcon 4s ease-in-out 2s infinite; } .use-cases .section-header .bg.loaded { height: 85vh; } .use-cases .section-header img { cursor: pointer; } .use-cases .section-header.redesign .content { top: calc(50% + 30px); -webkit-transform: translateY(-50%); transform: translateY(-50%); } .use-cases .section-header.redesign .content h1 { text-align: left; } .use-cases .section-header.redesign .bg.loaded { height: 60vh; } .use-cases .devices-menu .row { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .use-cases .devices-menu .row .list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; max-width: 100%; } .use-cases .devices-menu .row .list img { width: 70%; max-width: 150px; margin-bottom: 1.2rem; } .use-cases .devices-menu .row .list a { display: inline-block; color: #444444; -ms-flex-item-align: end; align-self: flex-end; } .use-cases .devices-menu .row h2 { font-size: 18px; padding-bottom: 26px; } .use-cases .video-section { width: 100%; max-width: 2560px; height: 300px; background-image: none; } .use-cases .video-section video { width: 100%; height: auto; opacity: 1; } .use-cases .video-section .content { font-size: 18px; } .use-cases .video-section .button span { font-size: 18px; } .use-cases .video-section.fixed-height { margin-top: 66px; height: 360px; } .use-cases .video-section.fixed-height h1 { font-size: 32px; line-height: 1.4; } .use-cases .video-section.fixed-height h1 br { display: block; } .use-cases .video-section.fixed-height video { width: 115%; } .use-cases .video-section.fixed-height .video-icon { width: 120px; } .use-cases .usecase-cards .row { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .use-cases .usecase-cards .row h2 { text-align: left; padding: 0; } .use-cases .usecase-cards .swiper-slide { margin: 60px 0 80px; } .use-cases .usecase-cards .swiper-slide .icons-wrapper { min-height: 95px; } .use-cases .usecase-cards .swiper-slide .icons-wrapper img { height: 54px; } .use-cases .usecase-cards .swiper-button-prev { background-image: url("data:image/png;base64,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"); right: 60px; left: auto; width: 40px; height: 40px; background-size: 40px; -webkit-transform: rotate(0); transform: rotate(0); border-right: 0; border-bottom: 0; top: 95%; } .use-cases .usecase-cards .swiper-button-next { background-image: url("data:image/png;base64,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"); right: 1px; left: auto; width: 40px; height: 40px; background-size: 40px; top: 95%; } .use-cases .cases-wrapper { background-color: #f6f6f6; } .use-cases .cases-wrapper-redesign { padding-bottom: 6.4rem; padding-top: 0; } .use-cases .cases-wrapper-redesign .col-desktopS-12 { padding-right: 0; padding-left: 0; } .use-cases .cases-wrapper-redesign .case { position: relative; margin-bottom: 6.4rem; } .use-cases .cases-wrapper-redesign .case .content { position: relative; text-align: left; padding: 2.4rem 0; height: 408px; } .use-cases .cases-wrapper-redesign .case .content .container { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100%; } .use-cases .cases-wrapper-redesign .case .image-wrapper { position: absolute; top: 0; width: 50%; left: 50%; height: auto; } .use-cases .cases-wrapper-redesign .case .image-wrapper img { top: 0; -webkit-transform: translateY(0); transform: translateY(0); } .use-cases .cases-wrapper-redesign .case .image-wrapper img.flipped-image { -webkit-transform: translateY(0) scaleX(-1); transform: translateY(0) scaleX(-1); } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint figcaption { font-size: 18px; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint.alexa-scene { top: 40px; } .use-cases .cases-wrapper-redesign .case ul { margin-bottom: 0; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .use-cases .cases-wrapper-redesign .case li img { width: 40px; } .use-cases .cases-wrapper-redesign .case li.plus { max-width: 30px; } .use-cases .cases-wrapper-redesign .case.left .image-wrapper { left: 0; } .use-cases .cases-wrapper-redesign .case.txt-right .content .offset-desktopS-1 { margin-left: 58.33333%; } .use-cases .cases-wrapper-redesign .case.txt-right .image-wrapper { left: 0; } .use-cases .cases-wrapper-redesign .case#must_02 .logos { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; } .use-cases .cases-wrapper-redesign .case#must_02 .logos img { width: 100px; height: auto; margin: 1.5rem 1rem 0 0; } .use-cases .cases-wrapper-redesign .case#must_02 .logos img:nth-of-type(1) { margin: 1.5rem 1rem 0 -1rem; } .use-cases .cases-wrapper-redesign .case#must_02 .logos img:nth-of-type(2) { margin: 1.5rem 1rem 0 -1rem; } .use-cases .cases-wrapper-redesign .case#must_02 .logos img:nth-of-type(3) { margin: 1.5rem 1rem 0 1.5rem; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category { -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; padding-bottom: 2.4rem; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .description { padding-top: 2.4rem; } .use-cases .cases-wrapper-redesign .hour { margin-top: -3.4rem; } .use-cases .integrations { overflow: hidden; } .use-cases .integrations h2 { padding: 0 20px 13px; } .use-cases .integrations .content { position: absolute; z-index: 1; } .use-cases .integrations .bg { margin-top: 6.2rem; margin-bottom: 4.2rem; position: relative; } .use-cases .integrations .bg2 { position: absolute; display: block; margin: 0; opacity: 0; transition: all 1000ms; } .use-cases .integrations .bg2.inview { opacity: 1; } .use-cases .integrations .button { margin-top: 240px; } .use-cases .integrations.garden { padding-bottom: 1.4rem; } .use-cases .one-app { width: 100%; max-width: 2560px; } .use-cases .one-app h2 { padding-bottom: 2.4rem; } .use-cases .one-app.climate .content { color: #ffffff; } .use-cases .one-app .content { position: absolute; z-index: 1; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .use-cases .one-app .content .download { display: block; background-color: transparent; text-align: left; padding-bottom: 0; padding-top: 8rem; } .use-cases .one-app .content .download img { margin: 0 10px 0 0; width: 110px; } .use-cases .one-app .download { display: none; } .use-cases .one-app .bg { padding-bottom: 0; height: 520px; } .use-cases .find-expert { width: 100%; max-width: 2560px; } .use-cases .find-expert .content { padding-top: 11.4rem; padding-bottom: 11.4rem; } .use-cases .find-expert h2 { font-size: 2.5em; } .use-cases .voice-control { width: 100%; max-width: 2560px; } .use-cases .voice-control .content .logos { margin: 30px 0 30px; } .use-cases .voice-control .content .logos img { height: 50px; margin: 3px 15px; } .use-cases .voice-control .bg { height: 420px; } .use-cases .voice-control .bg.garden { height: 420px; } .use-cases .share { width: 100%; max-width: 2560px; } .use-cases .find-more-possibilities { width: 100%; max-width: 2560px; } .use-cases .other-devices h2 { padding: 2.4rem 0 3.6rem; } .use-cases .other-devices .devices-wrapper .device h3 { padding: 3.4rem 0 2.4rem; } .use-cases .other-devices .button { margin: 40px 0; } .use-cases #usecase-icon-menu { font-size: 13px; padding: 0 0 2rem 0; width: 100%; max-width: 2560px; } .use-cases #usecase-icon-menu img { width: 60%; } .use-cases #usecase-icon-menu .content { padding: 0; } .use-cases #usecase-icon-menu .usecase-button a { font-size: 13px; } .use-cases #usecase-icon-menu .swiper-container { padding-top: 10px; padding-bottom: 25px; margin-bottom: -25px; max-width: 1140px; } .use-cases #usecase-icon-menu .swiper-container .swiper-wrapper { padding: 0 10px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide p { padding-bottom: 0; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide .content { padding-top: 2rem; padding-bottom: 3rem; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide .more { display: block; opacity: 0; color: #0090ff; margin-top: 5px; margin-bottom: -5px; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide .more:hover { border-bottom: 0 solid #ffffff; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide .more:after { width: 6px; height: 6px; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide:hover p:nth-of-type(1) { color: #7c00ff; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide:hover .more { transition: opacity 0.3s ease-in-out; opacity: 1; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide .border { width: 87%; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide .border::after { content: ''; position: absolute; z-index: -1; width: 87%; height: 100%; border-radius: 5px; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2); transition: opacity 0.3s ease-in-out; opacity: 0; top: 0; left: 0; } .use-cases #usecase-icon-menu .swiper-container .swiper-slide .border:hover::after { opacity: 1; } .use-cases .cases { padding-bottom: 12.4rem; } .use-cases .cases h2 { padding-bottom: 48px; } .use-cases .cases .case { position: relative; padding-bottom: 0; margin-bottom: 12.4rem; } .use-cases .cases .case .content { width: 60%; padding-top: 4.8rem; padding-bottom: 3.2rem; border-radius: 8px; box-shadow: 0 42px 50px -25px rgba(0, 0, 0, 0.15); transition: all 0.75s cubic-bezier(0.4, 0, 0.2, 1); -webkit-transform: translateX(-40%); transform: translateX(-40%); opacity: 0; } .use-cases .cases .case .content p { padding: 0 2.4rem; } .use-cases .cases .case .content h3 span { display: block; } .use-cases .cases .case .image-wrapper { transition: all 0.75s cubic-bezier(0.4, 0, 0.2, 1); -webkit-transform: translateY(-50%) translateX(40%); transform: translateY(-50%) translateX(40%); opacity: 0; } .use-cases .cases .case.inview .content { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } .use-cases .cases .case.inview .image-wrapper { -webkit-transform: translateY(-50%) translateX(0); transform: translateY(-50%) translateX(0); opacity: 1; } .use-cases .cases .case:last-of-type { margin-bottom: 0; } .use-cases .cases .image-wrapper { max-width: 440px; margin: 0; position: absolute; top: 50%; left: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .use-cases .cases .image-wrapper .hint { width: 75%; max-width: 430px; bottom: -85px; height: 100px; -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); transition: -webkit-transform .25s ease-in-out .85s; transition: transform .25s ease-in-out .85s; transition: transform .25s ease-in-out .85s, -webkit-transform .25s ease-in-out .85s; } .use-cases .cases .image-wrapper .hint.inview { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } .use-cases .cases .case-tag { -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); transition: -webkit-transform .25s ease-in-out .85s; transition: transform .25s ease-in-out .85s; transition: transform .25s ease-in-out .85s, -webkit-transform .25s ease-in-out .85s; } .use-cases .cases .case-tag.side { position: absolute; top: 50%; } .use-cases .cases .case.right .content { position: relative; left: 40%; -webkit-transform: translateX(40%); transform: translateX(40%); opacity: 0; } .use-cases .cases .case.right .image-wrapper { left: 11.5%; -webkit-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); opacity: 0; } .use-cases .cases .case.right .case-tag { left: 100%; } .use-cases .cases .case.inview .content { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } .use-cases .cases .case.inview .image-wrapper { -webkit-transform: translateY(-50%) translateX(0); transform: translateY(-50%) translateX(0); opacity: 1; } .use-cases .cases .case.inview .case-tag { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .use-cases #use-case-nav { height: 360px; padding: 32px; display: none; } .use-cases #use-case-nav-desktop { display: block; background-color: #070E24; } .use-cases #use-case-nav-desktop #menu-wrapper { -webkit-transform: translateY(50%); transform: translateY(50%); opacity: 0; transition: all 0.75s cubic-bezier(0.4, 0, 0.2, 1); background-color: #070E24; padding-bottom: 30px; } .use-cases #use-case-nav-desktop #menu-wrapper .swiper-scrollbar { margin: 30px auto 0; height: 3px; background-color: #2e395c; } .use-cases #use-case-nav-desktop #menu-wrapper .swiper-scrollbar-drag { height: 3px; background-color: #7f8492; } .use-cases #use-case-nav-desktop #menu-wrapper .slide { border-right: 2px solid transparent; background-color: transparent; width: 22vw; } .use-cases #use-case-nav-desktop #menu-wrapper .slide h3 { font-size: 14px; } .use-cases #use-case-nav-desktop #menu-wrapper .slide img { transition: all 0.6s ease-out; } .use-cases #use-case-nav-desktop #menu-wrapper .slide img:hover { -webkit-transform: scale(1.15); transform: scale(1.15); transition: all 0.6s ease-out; } .use-cases #use-case-nav-desktop.inview #menu-wrapper { -webkit-transform: translateY(0%); transform: translateY(0%); opacity: 1; } .use-cases #use-case-nav-overlay h2 { margin-bottom: 60px; } .use-cases #top-use-case-nav { display: none; height: 64px; border-bottom: 0; } .use-cases #top-use-case-nav .use-cases-link { height: 64px; font-size: 16px; } .use-cases #top-use-case-nav .use-cases-link a:after { width: 12px; height: 12px; -webkit-transform: rotate(-45deg) translateY(-4px); transform: rotate(-45deg) translateY(-4px); margin-left: 12px; } .use-cases #top-use-case-nav.generator-top-menu-mobile.active { display: none; } .use-cases .slides-wrapper { position: relative; overflow: hidden; } .use-cases .slides { width: auto; overflow: visible; } .use-cases .slide { width: 28vw; } .use-cases .slide:last-of-type { width: calc(28vw - 2px); } .use-cases .overlay-image { position: absolute; top: 0; } .use-cases .swiper-scrollbar { margin: 80px auto 0; } .use-cases #secondary-nav { height: 68px; display: block; background-color: #070e24; border-bottom: 1px solid #070e24; } .use-cases #secondary-nav .current { color: #ffffff !important; } .use-cases #secondary-nav .items .links { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .use-cases #secondary-nav .items .links a { color: #888888; margin-left: 0; margin-right: 5px; width: 12.5%; background-size: 100% 100% !important; transition: background-image 0s; background-image: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/second-nav-bg.png); background-repeat: no-repeat; background-position: center -80px; line-height: 1.2; } .use-cases #secondary-nav .items .links a:hover { font-weight: 600; color: #ffffff; } .use-cases #secondary-nav .items .title, .use-cases #secondary-nav .items .category-name { display: none; } .use-cases #secondary-nav:hover { height: 105px; } .use-cases #secondary-nav:hover .items { height: 104px; transition: all 0.5s; } .use-cases #secondary-nav:hover .items .links a { height: 80px; line-height: 45px; border-radius: 8px; transition: background-image 0.8s ease-in-out; transition-delay: 100ms; } .use-cases #secondary-nav:hover .items .links a:nth-child(1) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-lighting-nav.jpg) no-repeat center; } .use-cases #secondary-nav:hover .items .links a:nth-child(2) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-gates-nav.jpg) no-repeat center; } .use-cases #secondary-nav:hover .items .links a:nth-child(3) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-climate-nav.jpg) no-repeat center; } .use-cases #secondary-nav:hover .items .links a:nth-child(4) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-safety-nav.jpg) no-repeat center; } .use-cases #secondary-nav:hover .items .links a:nth-child(5) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-security-nav.jpg) no-repeat center; } .use-cases #secondary-nav:hover .items .links a:nth-child(6) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-multimedia-nav.jpg) no-repeat center; } .use-cases #secondary-nav:hover .items .links a:nth-child(7) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-mood-nav.jpg) no-repeat center; } .use-cases #secondary-nav:hover .items .links a:nth-child(8) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-garden-nav.jpg) no-repeat center; } .use-cases.us #secondary-nav .items .links { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .use-cases.us #secondary-nav .items .links a { width: 13.5%; margin-right: 10px; } .use-cases.us #secondary-nav .items .title, .use-cases.us #secondary-nav .items .category-name { display: none; } .use-cases.us #secondary-nav:hover .items .links a:nth-child(1) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-multimedia-nav.jpg) no-repeat center; } .use-cases.us #secondary-nav:hover .items .links a:nth-child(2) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-mood-nav.jpg) no-repeat center; } .use-cases.us #secondary-nav:hover .items .links a:nth-child(3) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-lighting-nav.jpg) no-repeat center; } .use-cases.us #secondary-nav:hover .items .links a:nth-child(4) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-safety-nav.jpg) no-repeat center; } .use-cases.us #secondary-nav:hover .items .links a:nth-child(5) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-climate-nav.jpg) no-repeat center; } .use-cases.us #secondary-nav:hover .items .links a:nth-child(6) { background: url(https://fibaro.com/en/wp-content/uploads/sites/5/2018/05/use-cases-garden-nav.jpg) no-repeat center; } .use-cases.main #secondary-nav { display: none; } .use-cases.main .section-header .content p { font-size: 20px; } .use-cases.main #menu-wrapper .slides a img { transition: all 0.6s ease-out; } .use-cases.main #menu-wrapper .slides a:hover img { -webkit-transform: scale(1.15); transform: scale(1.15); transition: all 0.6s ease-out; } } @media (min-width: 1600px) { .use-cases main { margin-top: 80px; } .use-cases .generator .content .title, .use-cases .generator .content .choose { font-size: 110%; } .use-cases .generator .content .question h2 { font-size: 50px; } .use-cases .generator .content .send { margin-top: 6rem; } .use-cases .generator .content .forth-wrapper .quote { font-size: 36px; padding-bottom: 3rem; } .use-cases .generator .content .forth-wrapper .author { font-size: 1.2em; } .use-cases .generator .content .fifth-wrapper .choose { font-size: 250%; } .use-cases .generator .content .button-replay { margin-top: 26vh; } .use-cases .generator .bg { height: calc(100vh - 80px); } .use-cases .section-header .bg .copy { max-width: 720px; } .use-cases .section-header .content { top: 90px; } .use-cases .section-header.redesign .content { top: calc(50% + 40px); } .use-cases .features h2 ~ p { font-size: 32px; padding-bottom: 2.4rem; } .use-cases .features:before { height: 250px; } .use-cases .video-section.fixed-height { margin-top: 82px; height: 450px; } .use-cases .video-section.fixed-height .video-icon { width: 140px; } .use-cases .usecase-cards .swiper-slide .icons-wrapper { min-height: 115px; } .use-cases .usecase-cards .swiper-slide .icons-wrapper img { height: 74px; } .use-cases .cases-wrapper-redesign { padding-bottom: 9.4rem; } .use-cases .cases-wrapper-redesign .case { margin-bottom: 9.4rem; } .use-cases .cases-wrapper-redesign .case .content { height: 516px; } .use-cases .cases-wrapper-redesign .case h3 { font-size: 26px; padding-bottom: 3.4rem; } .use-cases .cases-wrapper-redesign .case p { padding-bottom: 22px; } .use-cases .cases-wrapper-redesign .case#must_02 .logos img { width: 110px; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category { padding-bottom: 5.4rem; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category img { width: 90px; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category h4 { font-size: 24px; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .description { font-size: 26px; padding-bottom: 3.4rem; } .use-cases .cases-wrapper-redesign .hour { margin-top: -5.4rem; } .use-cases .cases-wrapper-redesign .hour .pre-hour, .use-cases .cases-wrapper-redesign .hour .post-hour { height: 90px; } .use-cases .cases-wrapper-redesign .hour .middle-hour p { font-size: 24px; } .use-cases .integrations .bg { margin-top: 8.2rem; margin-bottom: 8.2rem; } .use-cases .integrations .bg2 { margin-top: 0; } .use-cases .integrations .button { margin-top: 310px; } .use-cases .integrations.garden { padding-bottom: 0; } .use-cases .one-app h2 { padding-bottom: 3.4rem; } .use-cases .one-app .button { margin: 30px 0 0; } .use-cases .one-app .content .download { padding-top: 10rem; } .use-cases .one-app .content .download img { width: 140px; } .use-cases .one-app .bg { height: 700px; } .use-cases .find-expert .content { padding-top: 12.4rem; padding-bottom: 12.4rem; } .use-cases .find-expert.garden .content { padding-top: 0; padding-bottom: 9.4rem; } .use-cases .voice-control .content .swiper-container { font-size: 28px; } .use-cases .share { height: 280px; } .use-cases .other-devices h2 { padding: 2.4rem 0 4.6rem; } .use-cases .other-devices .devices-wrapper .device { padding: 30px 30px; } .use-cases .other-devices .devices-wrapper .device h3 { font-size: 26px; padding: 4.4rem 0 2.4rem; } .use-cases .other-devices .button { margin: 50px 0; } .use-cases #usecase-icon-menu { padding: 0 0 3rem 0; margin-top: -5rem; font-size: 15px; } .use-cases #usecase-icon-menu h2 { font-size: 36px !important; } .use-cases #usecase-icon-menu .swiper-container { padding-top: 30px; max-width: 1440px; } .use-cases #usecase-icon-menu .usecase-button a { font-size: 15px; } .use-cases .cases { padding-bottom: 18rem; } .use-cases .cases > .content { padding-top: 8rem; } .use-cases .cases h3 { font-size: 32px; } .use-cases .cases .case { margin-bottom: 18rem; } .use-cases .cases .case .content { padding-top: 7.2rem; padding-bottom: 6rem; } .use-cases .cases .case li span { font-size: 110%; } .use-cases .cases .case li img { width: 110px; } .use-cases .cases .case .hifi { height: 110px; width: 158px; } .use-cases .cases .image-wrapper { max-width: 550px; } .use-cases .cases .image-wrapper .hint { max-width: 360px; height: 110px; bottom: -90px; } .use-cases .cases .case-tag { width: 100px; height: 100px; } .use-cases #use-case-nav { height: 420px; } .use-cases #use-case-nav-desktop #menu-wrapper .slide h3 { font-size: 16px; } .use-cases #top-use-case-nav { height: 82px; } .use-cases #top-use-case-nav .use-cases-link { height: 82px; } .use-cases #use-case-nav-overlay h2 { margin-bottom: 80px; } .use-cases .slide h3 { font-size: 26px; top: 32px; left: 48px; } .use-cases .slide div { bottom: 24px; left: 48px; } .use-cases .swiper-scrollbar { margin: 100px auto 0; } .use-cases.main .section-header .content h1 { font-size: 36px; } .use-cases.main .section-header .content p { font-size: 25px; padding-bottom: 30px; } .use-cases.generator .cases-wrapper-redesign h1, .use-cases.generator .cases-wrapper-redesign h2 { font-size: 32px; } .use-cases #secondary-nav { height: 84px; } .use-cases #secondary-nav .items .links a { background-position: center -100px; background-size: 100% 100% !important; background-image: url(https://www.fibaro.com/pl/wp-content/uploads/sites/5/2018/05/second-nav-bg.png); background-repeat: no-repeat; } .use-cases #secondary-nav:hover { height: 126px; } .use-cases #secondary-nav:hover .items { height: 124px; } .use-cases #secondary-nav:hover .items .links a { height: 100px; line-height: 55px; } } @media (min-width: 2100px) { .use-cases .generator .content .question { margin-bottom: 3rem; } .use-cases .generator .content .question .choose { padding-bottom: 2.5rem; } .use-cases .generator .content .question h2 { font-size: 55px; } .use-cases .generator .content .btn-next, .use-cases .generator .content .send { margin-top: 7rem; } .use-cases .generator .content .intro-wrapper h2 br { display: none; } .use-cases .generator .content .forth-wrapper .quote { font-size: 40px; padding-bottom: 4rem; } .use-cases .generator .content .forth-wrapper .author { font-size: 1.4em; } .use-cases .generator .content .forth-wrapper .loader { margin: 110px auto 0; } .use-cases .generator .content .pagination .bullet { padding: 0; } .use-cases .section-header { padding-bottom: 180px; } .use-cases .section-header h1 { font-size: 72px; } .use-cases .section-header .bg .copy { max-width: 920px; padding: 50px; } .use-cases .section-header .bg img { width: 50px; } .use-cases .section-header .content { top: 110px; } .use-cases .features { padding-bottom: 7.2rem; } .use-cases .features h2 ~ p { font-size: 42px; } .use-cases .features:before { height: 300px; } .use-cases .video-section { height: 340px; } .use-cases .video-section.fixed-height { height: 500px; } .use-cases .video-section.fixed-height h1 { font-size: 46px; } .use-cases .video-section.fixed-height .button.button-play { margin-top: 7.4rem; } .use-cases .video-section.fixed-height .video-icon { width: 160px; } .use-cases .usecase-cards .swiper-slide .icons-wrapper { min-height: 150px; } .use-cases .usecase-cards .swiper-slide .icons-wrapper img { height: 94px; } .use-cases .usecase-cards .swiper-button-prev, .use-cases .usecase-cards .swiper-button-next { top: 96%; } .use-cases .cases-wrapper-redesign { padding-bottom: 11.4rem; } .use-cases .cases-wrapper-redesign .case { margin-bottom: 11.4rem; } .use-cases .cases-wrapper-redesign .case .content { height: 690px; } .use-cases .cases-wrapper-redesign .case li.plus:before, .use-cases .cases-wrapper-redesign .case li.plus:after { top: 30%; } .use-cases .cases-wrapper-redesign .case li img { width: 60px; } .use-cases .cases-wrapper-redesign .case h3 { font-size: 36px; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint { max-width: 620px; border-radius: 12px; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint figcaption { font-size: 28px; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint.alexa-scene { top: 50px; } .use-cases .cases-wrapper-redesign .case .image-wrapper .hint.alexa-scene:after { width: 80px; height: 40px; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category { padding-bottom: 10rem; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category p { font-size: 1.1em; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .category h4 { font-size: 26px; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .description { font-size: 32px; padding-bottom: 5.4rem; } .use-cases .cases-wrapper-redesign .case.day-of-smart-home .button { margin-bottom: 10rem; } .use-cases .cases-wrapper-redesign .hour { margin-top: -8.4rem; } .use-cases .cases-wrapper-redesign .hour .pre-hour, .use-cases .cases-wrapper-redesign .hour .post-hour { height: 100px; } .use-cases .cases-wrapper-redesign .hour .middle-hour p { font-size: 26px; } .use-cases .integrations .button { margin-top: 410px; } .use-cases .one-app .content .download { padding-top: 12rem; } .use-cases .one-app .content .download img { width: 160px; } .use-cases .one-app .bg { height: 900px; } .use-cases .find-expert .content { padding-top: 15.4rem; padding-bottom: 15.4rem; } .use-cases .find-expert.garden .content { padding-top: 0; padding-bottom: 11.4rem; } .use-cases .voice-control .content .swiper-container { font-size: 36px; } .use-cases .voice-control .content .swiper-container .swiper-wrapper { margin-bottom: 45px; } .use-cases .voice-control .content .logos { margin: 50px 0; } .use-cases .voice-control .content .logos img { height: 60px; margin: 3px 20px; } .use-cases .voice-control .bg { height: 550px; } .use-cases .voice-control .bg.garden { height: 550px; } .use-cases .share { height: 340px; } .use-cases .other-devices h2 { padding: 2.4rem 0 5.6rem; } .use-cases .other-devices .devices-wrapper .device { padding: 40px 40px; } .use-cases .other-devices .devices-wrapper .device h3 { font-size: 36px; padding: 4.4rem 0 3.4rem; } .use-cases .other-devices .devices-wrapper .device .link { padding: 16px 43px 17px 0; } .use-cases .other-devices .button { margin: 50px 0; } .use-cases #usecase-icon-menu { font-size: 18px; padding: 0 0 4rem 0; } .use-cases #usecase-icon-menu h2 { font-size: 45px !important; } .use-cases .cases { padding-bottom: 24rem; } .use-cases .cases > .content { padding-top: 12.4rem; padding-bottom: 9.2rem; } .use-cases .cases h3 { font-size: 42px; } .use-cases .cases hr { margin: 2.4rem 0 1.8rem; } .use-cases .cases .case { margin-bottom: 24rem; } .use-cases .cases .case .content { padding-top: 9.6rem; padding-bottom: 9.6rem; } .use-cases .cases .case .content p { padding: 0 4.8rem; } .use-cases .cases .case ul { margin: 4.8rem auto 2.4rem; } .use-cases .cases .image-wrapper { max-width: 730px; } .use-cases .cases .image-wrapper .hint { height: 140px; max-width: 430px; bottom: -105px; } .use-cases .cases .case-tag { width: 140px; height: 140px; } .use-cases #use-case-nav { height: 520px; } .use-cases #top-use-case-nav .use-cases-link { font-size: 18px; } .use-cases #use-case-nav-overlay h2 { margin-bottom: 90px; } .use-cases .slide h3 { font-size: 42px; top: 48px; left: 72px; } .use-cases .slide div { bottom: 32px; left: 72px; } .use-cases .swiper-scrollbar { margin: 120px auto 0; } .use-cases.main .section-header .content h1 { font-size: 50px; } .use-cases.main .section-header .content p { font-size: 30px; padding-bottom: 40px; } .use-cases.main .section-header #menu-wrapper { margin-top: 100px; } .use-cases.main .slide h3 { font-size: 26px; } .use-cases.generator .cases-wrapper-redesign h1, .use-cases.generator .cases-wrapper-redesign h2 { font-size: 42px; } .use-cases #secondary-nav .items .links a { background-position: center -130px; background-size: 100% 100% !important; background-image: url(https://www.fibaro.com/pl/wp-content/uploads/sites/5/2018/05/second-nav-bg.png); background-repeat: no-repeat; } .use-cases #secondary-nav:hover { height: 156px; } .use-cases #secondary-nav:hover .items { height: 154px; } .use-cases #secondary-nav:hover .items .links a { height: 130px; line-height: 80px; background-position: center 0; } } @-webkit-keyframes pulsateScrollIcon { 0%, 10%, 20% { -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } 5%, 15% { -webkit-transform: translate(-50%, calc(-50% + 10px)); transform: translate(-50%, calc(-50% + 10px)); } } @keyframes pulsateScrollIcon { 0%, 10%, 20% { -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } 5%, 15% { -webkit-transform: translate(-50%, calc(-50% + 10px)); transform: translate(-50%, calc(-50% + 10px)); } } .regulations .custom-footer { background-color: #f9f9f9; } .regulations #header .content h1 { color: #ffffff; } .regulations #header .bg { padding-bottom: 47.4%; } .regulations #tabs .tab p { padding-bottom: 1.4rem; } .regulations #tabs .tab p:last-of-type { padding-bottom: 2.4rem; } .regulations #tabs label { margin-bottom: 0; } .regulations #tabs label::after { content: ''; display: block; width: 8px; height: 8px; border-right: 1px solid #444; border-bottom: 1px solid #444; position: absolute; right: 0; margin-top: -14px; margin-right: 5px; -webkit-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg); transition: all 250ms; } .regulations #tabs .tabs { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .regulations #tabs .tabs label { width: 100%; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; display: block; cursor: pointer; transition: background ease 0.2s; text-align: left; padding-bottom: 1rem; font-size: 1.6rem; border-top: 1px solid #eee; padding-top: 1rem; } .regulations #tabs .tabs label:first-of-type { border-top: 0; } .regulations #tabs .tabs .tab { -webkit-box-ordinal-group: 100; -ms-flex-order: 99; order: 99; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; width: 100%; display: none; padding: 2rem 0 0; text-align: left; } .regulations #tabs .tabs input[type="radio"] { position: absolute; opacity: 0; } .regulations #tabs .tabs input[type="radio"]:checked + label { font-weight: 600; } .regulations #tabs .tabs input[type="radio"]:checked + label::after { -webkit-transform: translateY(-15%) rotate(225deg); transform: translateY(-15%) rotate(225deg); } .regulations #tabs .tabs input[type="radio"]:checked + label + .tab { display: block; border-top: 1px solid #eee; } @media (min-width: 768px) { .regulations .custom-footer { background-color: #eeeeee; } .regulations #header .bg { padding-bottom: 0; height: 350px; } } @media (max-width: 991px) { .regulations #tabs .tabs .tab, .regulations #tabs .tabs label { -webkit-box-ordinal-group: initial; -ms-flex-order: initial; order: initial; } } @media (min-width: 992px) { .regulations #tabs .tabs label { width: auto; margin-top: 0.2rem; padding: 1rem 5rem 2rem 0; margin-right: 0.2rem; border-top: 0; font-size: inherit; } .regulations #tabs .tabs .tab { padding: 5rem 0 0; } .regulations #tabs label::after { display: none; } } @media (min-width: 1600px) { .regulations #tabs .tabs label { font-size: 2.3rem; } } .smart-things main { margin-top: 52px; } .smart-things #smart-header.section-product-header { height: 440px; } .smart-things #smart-header.section-product-header .bg { width: 100%; height: 480px; } .smart-things #smart-header.section-product-header .bg .logo-wrapper img { width: 200px; height: auto; position: absolute; top: 50px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-things #smart-header.section-product-header .bg .phone-wrapper img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-things #one-app { background-image: linear-gradient(to bottom, #0a131c, #132549); color: #ffffff; } .smart-things #one-app p { color: #ffffff; } .smart-things #one-app .content .col-phoneS-10 { z-index: 2; } .smart-things #one-app .a-store { margin: 20px; } .smart-things #one-app .g-store { margin: 0 20px; } .smart-things #one-app .oneapp { width: 130%; margin-left: -15%; margin-bottom: -40px; z-index: 1; position: relative; } .smart-things .section-product-footer { width: 100%; display: none; } @media (min-width: 544px) { .smart-things #one-app .a-store, .smart-things #one-app .g-store { margin: 40px 20px 0 20px; } } @media (min-width: 768px) { .smart-things #smart-header.section-product-header { height: 480px; } .smart-things #smart-header.section-product-header .bg { height: 480px; } .smart-things #smart-header.section-product-header .bg .logo-wrapper img { width: 200px; top: 50px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper img { width: 250px; bottom: -40px; } .smart-things #devices .title h2 { font-size: 300%; } .smart-things #one-app .oneapp { width: 100%; margin-left: 0; } .smart-things .cases-wrapper h2 { font-size: 300%; } } @media (min-width: 992px) { .smart-things #smart-header.section-product-header { height: 740px; } .smart-things #smart-header.section-product-header .bg { height: 740px; } .smart-things #smart-header.section-product-header .bg .logo-wrapper img { width: 340px; top: 80px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper img { width: 380px; bottom: -60px; } } @media (min-width: 1200px) { .smart-things main { margin-top: 64px; } .smart-things #smart-header { width: 100%; } .smart-things #smart-header.section-product-header { height: 550px; } .smart-things #smart-header.section-product-header .bg { position: absolute; top: 0; height: 550px; padding-bottom: 0; background-image: none; } .smart-things #smart-header.section-product-header .bg .logo-wrapper img { width: 358px; top: 230px; -webkit-transform: translateX(-160%); transform: translateX(-160%); } .smart-things #smart-header.section-product-header .bg .phone-wrapper img { width: 310px; bottom: 0; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(1) { bottom: 176px; width: 263px; -webkit-transform: scale(1) translateX(-50%); transform: scale(1) translateX(-50%); -webkit-transform-origin: left; transform-origin: left; transition: box-shadow 500ms, -webkit-transform 500ms; transition: transform 500ms, box-shadow 500ms; transition: transform 500ms, box-shadow 500ms, -webkit-transform 500ms; z-index: 2; cursor: pointer; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(2) { bottom: 176px; width: 263px; -webkit-transform: scale(1) translateX(-50%); transform: scale(1) translateX(-50%); -webkit-transform-origin: left; transform-origin: left; transition: box-shadow 500ms, -webkit-transform 500ms; transition: transform 500ms, box-shadow 500ms; transition: transform 500ms, box-shadow 500ms, -webkit-transform 500ms; z-index: 2; cursor: pointer; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(2).active { opacity: 0; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(3) { bottom: 114px; width: 263px; z-index: 1; cursor: pointer; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(4) { bottom: 114px; width: 263px; z-index: 1; cursor: pointer; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(4).active { opacity: 0; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(5) { bottom: 51px; width: 263px; z-index: 1; cursor: pointer; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(6) { bottom: 51px; width: 263px; z-index: 1; cursor: pointer; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(6).active { opacity: 0; } .smart-things #smart-header.section-product-header .bg .arrow-wrapper { opacity: 0; transition: opacity 500ms; } .smart-things #smart-header.section-product-header .bg .arrow-wrapper img { width: 180px; height: auto; position: absolute; top: 300px; left: 50%; -webkit-transform: scaleY(-1) rotate(345deg) translateX(100%); transform: scaleY(-1) rotate(345deg) translateX(100%); } .smart-things #smart-header.section-product-header .bg .arrow-wrapper span { color: #ffffff; font-size: 26px; font-family: 'Patrick Hand', cursive; position: absolute; top: 390px; left: 50%; -webkit-transform: rotate(7deg) translateX(120%); transform: rotate(7deg) translateX(120%); width: 200px; text-align: center; line-height: 1; letter-spacing: 1.5px; } .smart-things #smart-header.section-product-header .bg.onEnter .phone-wrapper .buttons img:nth-of-type(1) { bottom: 176px; width: 263px; -webkit-transform: scale(1.25) translateX(-50%); transform: scale(1.25) translateX(-50%); transition: -webkit-transform 0ms 500ms; transition: transform 0ms 500ms; transition: transform 0ms 500ms, -webkit-transform 0ms 500ms; box-shadow: 0 30px 25px -15px rgba(0, 0, 0, 0.2); } .smart-things #smart-header.section-product-header .bg.onEnter .phone-wrapper .buttons img:nth-of-type(2) { bottom: 176px; width: 263px; opacity: 1; -webkit-transform: scale(1.25) translateX(-50%); transform: scale(1.25) translateX(-50%); transition: -webkit-transform 500ms; transition: transform 500ms; transition: transform 500ms, -webkit-transform 500ms; box-shadow: 0 30px 25px -15px rgba(0, 0, 0, 0.2); -webkit-animation: blink normal 1s; animation: blink normal 1s; -webkit-animation-delay: 500ms; animation-delay: 500ms; } @-webkit-keyframes blink { 0% { opacity: 1; } 16.6% { opacity: 0; } 33.3% { opacity: 1; } 50% { opacity: 0; } 66.5% { opacity: 1; } 83.2% { opacity: 0; } 100% { opacity: 1; } } @keyframes blink { 0% { opacity: 1; } 16.6% { opacity: 0; } 33.3% { opacity: 1; } 50% { opacity: 0; } 66.5% { opacity: 1; } 83.2% { opacity: 0; } 100% { opacity: 1; } } .smart-things #smart-header.section-product-header .bg.onEnter .arrow-wrapper { opacity: 1; transition: opacity 500ms; } .smart-things #smart-header.section-product-header .bg1, .smart-things #smart-header.section-product-header .bg2, .smart-things #smart-header.section-product-header .bg3, .smart-things #smart-header.section-product-header .bg4, .smart-things #smart-header.section-product-header .bg5, .smart-things #smart-header.section-product-header .bg6, .smart-things #smart-header.section-product-header .bg7, .smart-things #smart-header.section-product-header .bg8 { width: 100%; height: 100%; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; position: absolute; top: 0; opacity: 0; } .smart-things #smart-header.section-product-header .bg1.active, .smart-things #smart-header.section-product-header .bg2.active, .smart-things #smart-header.section-product-header .bg3.active, .smart-things #smart-header.section-product-header .bg4.active, .smart-things #smart-header.section-product-header .bg5.active, .smart-things #smart-header.section-product-header .bg6.active, .smart-things #smart-header.section-product-header .bg7.active, .smart-things #smart-header.section-product-header .bg8.active { opacity: 1; } .smart-things #smart-header.section-product-header .bg1 { opacity: 1; } .smart-things #devices .content { padding-top: 5.2rem; padding-bottom: 5.2rem; } .smart-things #one-app { width: 100%; } .smart-things #one-app p { padding-left: 50px; padding-right: 50px; } .smart-things #one-app .content { padding-top: 5.2rem; padding-bottom: 5.2rem; } .smart-things #one-app .a-store, .smart-things #one-app .g-store { margin: 30px 15px; width: 25%; } .smart-things #one-app .oneapp { margin-top: -90px; margin-bottom: -125px; } .smart-things .cases-wrapper .cases .case .content p { padding: 0 2.4rem 4.8rem; } .smart-things .cases-wrapper .cases h2 { padding-top: 60px; } } @media (min-width: 1600px) { .smart-things main { margin-top: 80px; } .smart-things #smart-header.section-product-header { height: 770px; } .smart-things #smart-header.section-product-header .bg { height: 770px; } .smart-things #smart-header.section-product-header .bg .logo-wrapper img { top: 340px; -webkit-transform: translateX(-190%); transform: translateX(-190%); } .smart-things #smart-header.section-product-header .bg .phone-wrapper img { width: 440px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(1) { bottom: 253px; width: 372px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(2) { bottom: 253px; width: 372px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(3) { bottom: 163px; width: 372px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(4) { bottom: 163px; width: 372px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(5) { bottom: 74px; width: 372px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(6) { bottom: 74px; width: 372px; } .smart-things #smart-header.section-product-header .bg .arrow-wrapper img { width: 200px; top: 400px; -webkit-transform: scaleY(-1) rotate(345deg) translateX(130%); transform: scaleY(-1) rotate(345deg) translateX(130%); } .smart-things #smart-header.section-product-header .bg .arrow-wrapper span { font-size: 28px; top: 510px; -webkit-transform: rotate(7deg) translateX(170%); transform: rotate(7deg) translateX(170%); } .smart-things #smart-header.section-product-header .bg.onEnter .phone-wrapper .buttons img:nth-of-type(1) { bottom: 253px; width: 372px; } .smart-things #smart-header.section-product-header .bg.onEnter .phone-wrapper .buttons img:nth-of-type(2) { bottom: 253px; width: 372px; } .smart-things #devices .content { padding-top: 6.8rem; padding-bottom: 6.8rem; } .smart-things #one-app p { padding-left: 70px; padding-right: 70px; } .smart-things #one-app .content { padding-top: 6.8rem; padding-bottom: 6.8rem; } .smart-things #one-app .oneapp { margin-bottom: -185px; } .smart-things .cases-wrapper .cases h2 { padding-top: 90px; } } @media (min-width: 2100px) { .smart-things #smart-header.section-product-header { height: 1000px; } .smart-things #smart-header.section-product-header .bg { height: 1000px; } .smart-things #smart-header.section-product-header .bg .logo-wrapper img { width: 478px; top: 430px; -webkit-transform: translateX(-190%); transform: translateX(-190%); } .smart-things #smart-header.section-product-header .bg .phone-wrapper img { width: 580px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(1) { bottom: 331px; width: 492px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(2) { bottom: 331px; width: 492px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(3) { bottom: 214px; width: 492px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(4) { bottom: 214px; width: 492px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(5) { bottom: 96px; width: 492px; } .smart-things #smart-header.section-product-header .bg .phone-wrapper .buttons img:nth-of-type(6) { bottom: 96px; width: 492px; } .smart-things #smart-header.section-product-header .bg .arrow-wrapper img { width: 270px; top: 510px; -webkit-transform: scaleY(-1) rotate(345deg) translateX(130%); transform: scaleY(-1) rotate(345deg) translateX(130%); } .smart-things #smart-header.section-product-header .bg .arrow-wrapper span { font-size: 40px; top: 650px; -webkit-transform: rotate(7deg) translateX(250%); transform: rotate(7deg) translateX(250%); } .smart-things #smart-header.section-product-header .bg.onEnter .phone-wrapper .buttons img:nth-of-type(1) { bottom: 331px; width: 492px; } .smart-things #smart-header.section-product-header .bg.onEnter .phone-wrapper .buttons img:nth-of-type(2) { bottom: 331px; width: 492px; } .smart-things #one-app p { padding-left: 90px; padding-right: 90px; } .smart-things #one-app .oneapp { margin-top: -110px; margin-bottom: -225px; } .smart-things #one-app .a-store, .smart-things #one-app .g-store { margin: 50px 15px; } .smart-things .cases-wrapper .cases h2 { padding-top: 110px; } } .bundles main { margin-top: 103px; } .bundles #header .bg { margin-bottom: 5%; } .bundles #header .content { position: absolute; z-index: 1; color: #ffffff; top: 8%; } .bundles #header .content h1 { font-weight: 400; font-size: 26px; padding-bottom: 13px; text-transform: none; margin-top: 0; line-height: 1.2; } .bundles #header .content h2 { font-weight: 400; font-size: 26px; padding-bottom: 13px; } .bundles #header .content.shutters { position: absolute; z-index: 1; color: #ffffff; top: 50%; -webkit-transform: translateY(-80%); transform: translateY(-80%); } .bundles #header .content.shutters h1 { font-weight: 400; font-size: 26px; padding-bottom: 13px; text-transform: none; margin-top: 0; line-height: 1.2; } .bundles #header .content.shutters h2 { font-weight: 400; font-size: 26px; padding-bottom: 13px; } .bundles #features h2 { font-size: 2.8rem; padding-bottom: 2.4rem; } .bundles #features p { font-size: 1.4rem; line-height: 1.5; padding-bottom: 2.4rem; } .bundles #features .icons { z-index: 1; } .bundles #features .icons ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .bundles #features .icons ul > li { margin: 20px 33px; border-radius: 7px; width: 80px; height: 130px; position: relative; color: #0090ff; } .bundles #features .icons ul > li div { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .bundles #features .icons ul > li div div { position: absolute; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); left: 50%; width: 140px; padding-top: 15px; } .bundles #features .icons ul img { width: 60px; height: 60px; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .bundles #devices { background-color: #F6F6F6; } .bundles #devices h2 { font-size: 2.8rem; padding-bottom: 2.4rem; } .bundles #devices h3 { font-weight: 400; } .bundles #devices .device img { height: 160px; width: auto; } .bundles #benefits { color: #ffffff; } .bundles #benefits h2 { font-size: 2.8rem; padding-bottom: 2.4rem; } .bundles #benefits .icons ul { margin-top: 2rem; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding-bottom: 20%; } .bundles #benefits .icons li { -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; display: block; background-repeat: no-repeat; margin-bottom: 4rem; width: 100%; } .bundles #benefits .icons li img { height: 60px; width: auto; margin-bottom: 10px; } .bundles #benefits .icons li span { text-align: center; display: inline-block; width: 220px; } .bundles #benefits .icons li h3 { padding: 1.5rem 0; font-size: 125%; font-weight: 400; } .bundles #benefits .content { background: linear-gradient(0deg, #2B6AD8 0%, #0E2D62 100%); } .bundles #benefits .packshot { width: 60%; max-width: 500px; left: 50%; position: relative; -webkit-transform: translateX(-50%); transform: translateX(-50%); margin-top: -20%; margin-bottom: 3.4rem; } .bundles #cases-wrapper h2 { font-size: 2.8rem; padding-bottom: 2.4rem; } .bundles #cases-wrapper .content { padding-top: 2.4rem; margin-bottom: 1.4rem; } .bundles #cases-wrapper .heading-text { font-size: 1.4rem; line-height: 1.5; } .bundles #other-bundles .col-phoneS-12 { padding: 0; } .bundles #other-bundles a { display: block; width: 100%; position: relative; color: #fff; } .bundles #other-bundles img { width: 130%; height: auto; margin: 0 0 0 50%; padding: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .bundles #other-bundles h2 { font-size: 21px; padding-bottom: 10px; line-height: 1.2; margin-bottom: 5px; } .bundles #other-bundles h2 span { font-size: 21px; text-transform: uppercase; font-weight: 600; } .bundles #other-bundles span { font-size: 13px; } .bundles #other-bundles .wrapper { width: 95%; position: absolute; z-index: 10; top: 28%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; } .bundles #other-bundles .morelink { display: inline-block; position: relative; padding: 8px 45px 8px 30px; border-radius: 18px/50%; background-color: #0090ff; border: 1px solid #0090ff; color: #fff; transition: all 250ms; width: auto; margin-top: 0; } .bundles #other-bundles .morelink:after { content: ''; display: block; position: absolute; top: 50%; right: 32px; z-index: 2; width: 8px; height: 8px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .bundles #secondary-nav { display: block; } .bundles #section-product-footer .top a { color: #0090FF; letter-spacing: 0; text-transform: none; } .bundles.homekit-lp.fixed-grid .section-product-footer { display: block; } @media (min-width: 544px) { .bundles #header .bg { padding-bottom: 85%; margin-bottom: 5%; } .bundles #header .content { top: 15%; } .bundles #header .content.shutters { top: 12%; -webkit-transform: translateY(0); transform: translateY(0); } .bundles #features .icons ul > li { margin: 20px 35px; } .bundles #benefits .icons ul { margin-top: 4rem; } .bundles #benefits .icons li img { height: 70px; } .bundles #other-bundles img { width: 100%; margin: 0; -webkit-transform: translateX(0); transform: translateX(0); } .bundles #other-bundles h2 { font-size: 26px; line-height: 1.4; margin-bottom: 10px; } .bundles #other-bundles h2 span { font-size: 26px; } } @media (min-width: 768px) { .bundles #header .bg { padding-bottom: 65%; margin-bottom: 5%; background-position: 50% 50%; } .bundles #header .content { top: 15%; } .bundles #header .content h1 { font-size: 30px; } .bundles #header .content h2 { font-size: 30px; } .bundles #header .content.shutters { top: 10%; } .bundles #header .content.shutters h1 { font-size: 30px; } .bundles #header .content.shutters h2 { font-size: 30px; } .bundles #devices .device img { height: 180px; width: auto; } .bundles #benefits .icons li { width: 50%; } .bundles #benefits .packshot { margin-bottom: 4.4rem; } .bundles #other-bundles h2 { line-height: 1.6; margin-bottom: 15px; } } @media (min-width: 992px) { .bundles #header .content { top: 20%; } .bundles #header .content h1 { font-size: 40px; } .bundles #header .content h2 { font-size: 40px; } .bundles #header .content.shutters { top: 10%; } .bundles #header .content.shutters h1 { font-size: 40px; } .bundles #header .content.shutters h2 { font-size: 40px; } .bundles #features h2 { font-size: 3.2rem; } .bundles #features p { font-size: 1.6rem; } .bundles #features .icons ul > li { margin: 20px 45px; } .bundles #devices h2 { font-size: 3.2rem; } .bundles #benefits h2 { font-size: 3.2rem; } .bundles #benefits .icons ul { padding-bottom: 17%; } .bundles #benefits .icons li { width: 33.33%; } .bundles #benefits .icons li img { height: 90px; } .bundles #benefits .packshot { width: 40%; margin-top: -17%; } .bundles #cases-wrapper .content { padding-top: 3.6rem; padding-bottom: 3.6rem; } .bundles #cases-wrapper .heading-text { font-size: 1.6rem; } } @media (min-width: 1200px) { .bundles main { margin-top: 129px; } .bundles #header .bg { padding-bottom: 63%; margin-bottom: 0; } .bundles #header .content { top: 25%; } .bundles #header .content h2 { font-size: 40px; } .bundles #header .content.lighting { top: 18%; } .bundles #header .content.lighting h2 { font-size: 40px; } .bundles #header .content.shutters { top: 14%; } .bundles #header .content.shutters h2 { font-size: 40px; } .bundles #features h2 { font-size: 4rem; } .bundles #features p { font-size: 1.8rem; } .bundles #features .content { padding-top: 5.5rem; padding-bottom: 5.5rem; } .bundles #features .icons ul { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .bundles #features .icons ul > li { margin: 80px 75px 0; } .bundles #features .icons ul > li div div { width: 200px; } .bundles #features .icons ul img { width: 80px; height: 80px; } .bundles #devices h2 { font-size: 4rem; } .bundles #devices .content { padding-top: 5.5rem; padding-bottom: 5.5rem; } .bundles #benefits h2 { font-size: 4rem; } .bundles #benefits .content { padding-top: 5.5rem; padding-bottom: 5.5rem; } .bundles #benefits .icons ul { margin-top: 4.5rem; padding-bottom: 140px; } .bundles #benefits .icons li svg { height: 110px; width: auto; } .bundles #benefits .icons li span { text-align: center; display: inline-block; width: 240px; } .bundles #benefits .packshot { margin-top: -180px; margin-bottom: 0; -webkit-transform: translateX(-53%); transform: translateX(-53%); } .bundles #cases-wrapper { background-color: #ffffff; } .bundles #cases-wrapper h2 { font-size: 4rem; } .bundles #cases-wrapper .content { padding-top: 5.5rem; padding-bottom: 5.5rem; } .bundles #cases-wrapper .cases { background-color: #ffffff; } .bundles #cases-wrapper .cases .case .content { box-shadow: 0 8px 50px -10px rgba(0, 0, 0, 0.15); } .bundles #cases-wrapper #case1 { margin-top: 4rem; } .bundles #cases-wrapper .heading-text { font-size: 1.8rem; } .bundles #other-bundles h2 { font-size: 28px; line-height: 1.6; margin-bottom: 15px; } .bundles #other-bundles h2 span { font-size: 28px; } .bundles #other-bundles .morelink:hover { background-color: rgba(255, 255, 255, 0.9); color: #0090ff; } .bundles #other-bundles .morelink:hover:after { border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; } .bundles #secondary-nav { height: 65px; background-color: #f6f6f6; border-bottom: 1px solid #e1e1e1; } .bundles #secondary-nav:hover { height: 65px; } .bundles #secondary-nav:hover .items { height: 64px; } } @media (min-width: 1600px) { .bundles main { margin-top: 160px; } .bundles #header .content h1 { font-size: 48px; } .bundles #header .content h2 { font-size: 48px; } .bundles #header .content.lighting h1, .bundles #header .content.shutters h1 { font-size: 48px; } .bundles #header .content.lighting h2, .bundles #header .content.shutters h2 { font-size: 48px; } .bundles #features h2 { font-size: 4.8rem; } .bundles #features p { font-size: 2rem; } .bundles #features .content { padding-top: 7rem; padding-bottom: 7rem; } .bundles #features .icons ul > li div div { width: 250px; } .bundles #features .icons ul > li img { width: 90px; height: 90px; } .bundles #devices h2 { font-size: 4.8rem; } .bundles #devices .content { padding-top: 7rem; padding-bottom: 7rem; } .bundles #devices .swiper-container { margin-top: 30px; } .bundles #devices .device img { height: 200px; width: auto; } .bundles #benefits h2 { font-size: 4.8rem; } .bundles #benefits .content { padding-top: 7rem; padding-bottom: 7rem; } .bundles #benefits .icons ul { margin-top: 4.8rem; padding-bottom: 190px; } .bundles #benefits .icons li svg { height: 130px; width: auto; } .bundles #benefits .icons li span { text-align: center; display: inline-block; width: 260px; } .bundles #benefits .packshot { max-width: 600px; margin-top: -220px; } .bundles #cases-wrapper h2 { font-size: 4.8rem; } .bundles #cases-wrapper .content { padding-top: 7rem; padding-bottom: 7rem; } .bundles #cases-wrapper #case1 { margin-top: 6rem; } .bundles #cases-wrapper .heading-text { font-size: 2rem; } .bundles #other-bundles h2 { font-size: 34px; line-height: 1.4; } .bundles #other-bundles h2 span { font-size: 34px; } .bundles #other-bundles span { font-size: 18px; } .bundles #other-bundles .morelink { border-radius: 50px; } .bundles #secondary-nav { height: 81px; } .bundles #secondary-nav:hover { height: 81px; } .bundles #secondary-nav:hover .items { height: 80px; } } @media (min-width: 2100px) { .bundles #header .content { top: 26%; } .bundles #header .content h1 { font-size: 70px; } .bundles #header .content h2 { font-size: 70px; } .bundles #header .content.lighting h1, .bundles #header .content.shutters h1 { font-size: 70px; } .bundles #header .content.lighting h2, .bundles #header .content.shutters h2 { font-size: 70px; } .bundles #features h2 { font-size: 6rem; } .bundles #features .icons ul { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .bundles #features .icons ul > li { margin: 80px 115px 30px; } .bundles #features .icons ul > li div div { width: 250px; } .bundles #features .icons ul > li img { width: 90px; height: 90px; } .bundles #devices h2 { font-size: 6rem; } .bundles #devices .swiper-container { margin-top: 40px; } .bundles #devices .device img { height: 250px; width: auto; } .bundles #benefits h2 { font-size: 6rem; } .bundles #benefits .icons ul { margin-top: 6.4rem; padding-bottom: 250px; } .bundles #benefits .icons li svg { height: 160px; width: auto; } .bundles #benefits .icons li span { text-align: center; display: inline-block; width: 300px; } .bundles #benefits .packshot { max-width: 750px; margin-top: -260px; margin-bottom: 9.2rem; } .bundles #cases-wrapper h2 { font-size: 6rem; } .bundles #cases-wrapper #case1 { margin-top: 8rem; } .bundles #other-bundles h2 { font-size: 44px; line-height: 1.4; margin-bottom: 35px; } .bundles #other-bundles h2 span { font-size: 44px; } .bundles #other-bundles span { font-size: 22px; } } .application .f-trans { transition: all 0.2s ease-in-out; -webkit-backface-visibility: hidden; } .application .m-trans { transition: all 0.4s ease-in-out; -webkit-backface-visibility: hidden; } .application .s-trans { transition: all 0.6s ease-in-out; -webkit-backface-visibility: hidden; } .application #header { background-color: #000103; color: #ffffff; } .application #header .ces { padding: 20px 0; } .application #header .apple, .application #header .android { width: auto; height: 42px; margin: 0 10px; } .application #header .bg { width: 100%; padding-bottom: 65%; } .application #header .bg .header-alt-image { width: 100%; height: auto; position: absolute; top: 0; opacity: 0; } .application #header .bg .header-alt-image.active { opacity: 1; } .application #dashboard { height: 830px; } .application #dashboard .content h2 { color: #518EBB; } .application #dashboard .content p { color: #444444; padding-bottom: 0; } .application #dashboard .content .haptic { display: -webkit-box; display: -ms-flexbox; display: flex; text-align: left; font-size: 85%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 2rem; } .application #dashboard .content .haptic img { margin: 0 20px 0 10px; width: 100%; max-width: 70px; height: 100%; } .application #dashboard .animation-wrapper { position: absolute; left: 50%; -webkit-transform: translate(-50%, -23%); transform: translate(-50%, -23%); } .application #dashboard .animation-wrapper .flow-layer { position: absolute; overflow: visible; box-sizing: border-box; border-style: solid; border-width: 0; -webkit-animation-duration: 7.15s; animation-duration: 7.15s; } .application #dashboard .animation-wrapper .flow-artboard { width: 1011px; height: 1024px; overflow: hidden; position: relative; padding: 0; margin: 0; background-color: #FFFFFF; -webkit-transform: scale(0.5); transform: scale(0.5); } .application #dashboard .animation-wrapper #circles { width: 710px; height: 657px; left: 500px; top: 498.5px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #rooms_bottom { width: 794px; height: 120px; left: 506px; top: 743px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0; box-shadow: 0 0 3px transparent; clip-path: url(#rooms_bottom-mask); -webkit-clip-path: url(#rooms_bottom-mask); } .application #dashboard .animation-wrapper #mask_1 { width: 794px; height: 120px; left: 397px; top: 60px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0; box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #mask_1-svg { position: absolute; fill: url(#mask_1-fill); stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper #rooms_bottom_1 { width: 898.425px; height: 65px; left: 676.212px; top: 59.5px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0.29; box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #devices_bottom { width: 1011px; height: 120px; left: 505.5px; top: 623px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0.25; box-shadow: 0 0 3px transparent; clip-path: url(#devices_bottom-mask); -webkit-clip-path: url(#devices_bottom-mask); -webkit-animation: devices_bottom-animation 7.15s ease-in-out 0s both; animation: devices_bottom-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper #mask_2 { width: 1011px; height: 120px; left: 505.5px; top: 60px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0; box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #mask_2-svg { position: absolute; fill: #000000; stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper #bitmap { width: 1034.14px; height: 114px; left: 155.67px; top: 59px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0; box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #scenes_bottom { width: 889.151px; height: 120px; left: 505.575px; top: 476px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0.59; box-shadow: 0 0 3px transparent; clip-path: url(#scenes_bottom-mask); -webkit-clip-path: url(#scenes_bottom-mask); -webkit-animation: scenes_bottom-animation 7.15s ease-in-out 0s both; animation: scenes_bottom-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper #mask_3 { width: 889.151px; height: 120px; left: 444.575px; top: 60px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0; box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #mask_3-svg { position: absolute; fill: #D8D8D8; stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper #scenes_bottom_1 { width: 902.789px; height: 119px; left: 725.395px; top: 59.5px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0.25; box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #extra_bonus_motrpenis { width: 1011px; height: 1024px; left: 505.5px; top: 512px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #combined_shape { width: 1011px; height: 1024px; left: 505.5px; top: 512px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #combined_shape-svg { position: absolute; fill: url(#combined_shape-fill); stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper #phone { width: 644px; height: 953px; left: 557px; top: 547.5px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #rooms { width: 333px; height: 71px; left: 505.5px; top: 745.5px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; clip-path: url(#rooms-mask); -webkit-clip-path: url(#rooms-mask); } .application #dashboard .animation-wrapper #mask_4 { width: 333px; height: 71px; left: 166.5px; top: 35.5px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #mask_4-svg { position: absolute; fill: transparent; stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper #rooms_1 { width: 898.425px; height: 65px; left: 446.212px; top: 32.5px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #scenes { width: 333px; height: 120px; left: 505.5px; top: 476px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; clip-path: url(#scenes-mask); -webkit-clip-path: url(#scenes-mask); } .application #dashboard .animation-wrapper #mask_5 { width: 333px; height: 120px; left: 166.5px; top: 60px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0; box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #mask_5-svg { position: absolute; fill: transparent; stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper #scenes_1 { width: 902.789px; height: 119px; left: 448.99px; top: 60.3px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #devices { width: 333px; height: 151px; left: 505.5px; top: 611.5px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; clip-path: url(#devices-mask); -webkit-clip-path: url(#devices-mask); } .application #dashboard .animation-wrapper #mask_6 { width: 333px; height: 151px; left: 166.5px; top: 75.5px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); opacity: 0; box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #mask_6-svg { position: absolute; fill: #D8D8D8; stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper #bitmap_1 { width: 1034.14px; height: 114px; left: -180.929px; top: 86px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #devices_1 { width: 22px; height: 2px; left: 652.5px; top: 557px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #devices_1-svg { position: absolute; fill: #518EBB; stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper #scenes_2 { width: 22px; height: 2px; left: 584px; top: 407px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #scenes_2-svg { position: absolute; fill: #518EBB; stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper #rooms_2 { width: 22px; height: 2px; left: 584px; top: 701px; -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); box-shadow: 0 0 3px transparent; } .application #dashboard .animation-wrapper #rooms_2-svg { position: absolute; fill: #518EBB; stroke-miterlimit: 10; stroke-width: 0; } .application #dashboard .animation-wrapper path { fill-rule: evenodd; } .application #dashboard .animation-wrapper svg { overflow: visible; } .application #dashboard .animation-wrapper.active #rooms_bottom { -webkit-animation: rooms_bottom-animation 7.15s ease-in-out 0s both; animation: rooms_bottom-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #rooms_bottom_1 { -webkit-animation: rooms_bottom_1-animation 7.15s ease-in-out 0s both; animation: rooms_bottom_1-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #bitmap { -webkit-animation: bitmap-animation 7.15s ease-in-out 0s both; animation: bitmap-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #scenes_bottom_1 { -webkit-animation: scenes_bottom_1-animation 7.15s ease-in-out 0s both; animation: scenes_bottom_1-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #rooms_1 { -webkit-animation: rooms_1-animation 7.15s ease-in-out 0s both; animation: rooms_1-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #scenes_1 { -webkit-animation: scenes_1-animation 7.15s ease-in-out 0s both; animation: scenes_1-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #bitmap_1 { -webkit-animation: bitmap_1-animation 7.15s ease-in-out 0s both; animation: bitmap_1-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #devices_1 { -webkit-animation: devices_1-animation 7.15s ease-in-out 0s both; animation: devices_1-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #devices_1-svg { -webkit-animation: devices_1-svg-animation 7.15s ease-in-out 0s both; animation: devices_1-svg-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #scenes_2 { -webkit-animation: scenes_2-animation 7.15s ease-in-out 0s both; animation: scenes_2-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #scenes_2-svg { -webkit-animation: scenes_2-svg-animation 7.15s ease-in-out 0s both; animation: scenes_2-svg-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #rooms_2 { -webkit-animation: rooms_2-animation 7.15s ease-in-out 0s both; animation: rooms_2-animation 7.15s ease-in-out 0s both; } .application #dashboard .animation-wrapper.active #rooms_2-svg { -webkit-animation: rooms_2-svg-animation 7.15s ease-in-out 0s both; animation: rooms_2-svg-animation 7.15s ease-in-out 0s both; } .application #dashboard .image-wrapper { display: none; } .application #dashboard .button-replay { position: absolute; display: block; opacity: 0; right: 0; margin-top: -29%; left: 50%; -webkit-transform: translateX(-40%); transform: translateX(-40%); max-width: 160px; } .application #dashboard .button-replay:hover { transition: 0.5s all; } .application #dashboard .button-replay:hover:after { -webkit-transform: translateY(-50%) rotate(360deg); transform: translateY(-50%) rotate(360deg); } .application #themes { margin-bottom: -5px; } .application #themes .content { position: absolute; z-index: 1; } .application #themes .content h2 { color: #518EBB; } .application #themes .content p { color: #444444; padding-bottom: 0; } .application #themes .bg { height: 550px; } .application #themes .bg-second { opacity: 0; } .application #themes .bg-third { opacity: 0; } .application #access { margin-bottom: -1px; } .application #access .content { background-color: #040C1F; } .application #access .content h2 { color: #518EBB; } .application #access .content p { padding-bottom: 0; color: #ffffff; } .application #access .widget { height: 0; padding-bottom: 66.6666666%; position: relative; overflow: hidden; } .application #access .home, .application #access .work { position: absolute; height: 100%; width: 100%; top: 0; left: 0; background-size: auto 100%; background-repeat: no-repeat; } .application #access .home { width: 15%; } .application #access .handle { content: ''; width: 50px; height: 50px; border-radius: 50%; background: transparent url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IldhcnN0d2FfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCA3MC40IDQzIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA3MC40IDQzOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6I0ZGRkZGRjt9PC9zdHlsZT48Zz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNOC4yLDIxLjVMMjQuNiw1YzAuOS0wLjksMS0yLjUsMC4xLTMuNmwtMC4xLTAuMWMtMS4xLTEuMS0yLjgtMS4xLTMuOSwwTDIuNCwxOS42Yy0wLjUsMC41LTAuOCwxLjItMC44LDEuOWMwLDAuNywwLjMsMS40LDAuOCwxLjlsMTguMywxOC4zbDAuMiwwLjJjMC42LDAuNCwxLjIsMC42LDEuNywwLjZjMC43LDAsMS40LTAuMywxLjktMC44YzAuNS0wLjUsMC44LTEuMiwwLjgtMS45YzAtMC43LTAuMy0xLjQtMC44LTEuOUw4LjIsMjEuNXoiLz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNNjgsMTkuNkw0OS43LDEuM2MtMC40LTAuNS0xLjEtMC44LTEuOC0wLjhjLTAuNywwLTEuNSwwLjItMiwwLjhjLTAuNSwwLjQtMC44LDEuMS0wLjgsMS44YzAsMC44LDAuMywxLjUsMC44LDJsMTYuNCwxNi40TDQ1LjksMzcuOWwtMC4yLDAuMmMtMC40LDAuNi0wLjYsMS4yLTAuNiwxLjdjMCwxLjUsMS4yLDIuNywyLjcsMi43YzAuOCwwLDEuNS0wLjMsMS45LTAuOEw2OCwyMy40QzY5LDIyLjQsNjksMjAuNyw2OCwxOS42eiBNNjcuMSwyMC42TDY3LjEsMjAuNkw2Ny4xLDIwLjZMNjcuMSwyMC42eiIvPjwvZz48L3N2Zz4=") no-repeat 50% 50%; background-size: 60%; position: absolute; cursor: -webkit-grab; cursor: grab; left: 15%; top: 50%; margin-top: -25px; margin-left: -25px; border: 2px solid #ffffff; } .application #access .handle:before, .application #access .handle:after { content: ''; display: block; position: absolute; width: 0; height: 2000px; left: 23px; border-left: 1px solid white; border-right: 1px solid white; margin-top: 47px; } .application #access .handle:before { top: -2047px; } .application #one-login { margin-bottom: -5px; background-color: #000; } .application #one-login .content { position: absolute; z-index: 1; background-color: #000; background: linear-gradient(to bottom, black 0%, rgba(125, 185, 232, 0) 100%); } .application #one-login .content h2 { color: #518EBB; } .application #one-login .content p { color: #ffffff; padding-bottom: 0; } .application #one-login .bg { opacity: 1; height: 500px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } .application #one-login .bg .video-area { opacity: 1; } .application #one-login .bg .video-area .video { max-width: 1920px; } .application #one-login .code-area { position: absolute; width: 100%; height: 45%; top: 10%; overflow: hidden; z-index: -1; display: none; } .application #one-login .code-area .code-slide { text-align: center; opacity: 0; } .application #one-login .code-area .code-slide.active { opacity: 1; } .application #one-login .codeAnimation.active { -webkit-animation: codeAnimation 15s infinite; animation: codeAnimation 15s infinite; } .application #pre-parallax .content { margin: 2.4rem 0; } .application #pre-parallax .content h2 { color: #518EBB; } .application #pre-parallax .content p { color: #444444; padding-bottom: 0; } .application #parallax { height: 670px; } .application #parallax h2 { color: #518EBB; } .application #parallax p { color: #444444; padding-bottom: 0; } .application #parallax .content { display: none; } .application #app-icon { background: linear-gradient(to bottom, #040C1F 50%, #ffffff 50%); } .application #app-icon .content { padding: 0; } .application #app-icon .icon { margin: 6rem 0 0; width: 100%; height: auto; max-width: 200px; } .application #download h2 { color: #518EBB; } .application #download .content { padding-top: 0; } .application #download .a-store { margin: 10px; width: 90%; } .application #download .g-store { margin: 0 10px; width: 90%; } .application #download .badges { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; } .application #download .bg { overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background-position: 50% 100%; margin-bottom: -1px; } .application #download .mobile-bg { background-size: cover; padding-bottom: 41%; margin-top: 5rem; } @media (min-width: 544px) { .application #dashboard { height: 750px; } .application #one-login .bg { height: 450px; } } @media (min-width: 768px) { .application #header .content { padding-top: 7rem; } .application #dashboard { height: 1020px; } .application #dashboard .animation-wrapper { -webkit-transform: translate(-50%, -10%); transform: translate(-50%, -10%); } .application #dashboard .animation-wrapper .flow-artboard { -webkit-transform: scale(0.8); transform: scale(0.8); } .application #dashboard .button-replay { margin-top: -17%; opacity: 0; } .application #parallax { height: 600px; } .application #access .widget { padding-bottom: 62.5%; } .application #access .content { position: absolute; z-index: 1; background-color: transparent; } .application #access .content p { color: #ffffff; } .application #access .widget.dragging { cursor: -webkit-grabbing; cursor: grabbing; } .application #access .widget.dragging .handle { cursor: -webkit-grabbing; cursor: grabbing; } .application #themes .bg { height: 0; padding-bottom: 90%; } .application #one-login .bg { height: 550px; } } @media (min-width: 992px) { .application #header { background-color: transparent; } .application #header .content { position: absolute; text-align: left; z-index: 1; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); padding-top: inherit; } .application #header .apple, .application #header .android { margin: 10px 30px 0 0; } .application #header .bg { width: 100%; height: auto; padding-bottom: 0; background-image: none; } .application #header .bg .video { line-height: 0; padding-top: 4rem; background-color: #000103; } .application #header .bg .header-alt-image { top: 4rem; } .application #header .bg .reveal { width: 100%; height: 0; position: absolute; left: 0; z-index: 1; bottom: -5px; } .application #dashboard { height: 1120px; } .application #dashboard .button-replay { margin-top: -18%; } .application #pre-parallax { display: none; } .application #parallax { height: 500px; } .application #parallax .content { display: block; text-align: left; } .application #themes .content { text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .application #themes .bg { height: 0; padding-bottom: 48%; } .application #one-login .content { top: 5%; } .application #one-login .bg { height: 620px; } .application #download .content { padding-bottom: 0; } .application #download .bg { height: 330px; } .application #download .bg .android { width: 336px; height: 521px; position: absolute; bottom: 0; -webkit-transform: translate(48%, 54%); transform: translate(48%, 54%); transition: -webkit-transform 650ms ease-out; transition: transform 650ms ease-out; transition: transform 650ms ease-out, -webkit-transform 650ms ease-out; } .application #download .bg .ios { width: 436px; height: 680px; position: absolute; bottom: 0; -webkit-transform: translate(-7%, 60%); transform: translate(-7%, 60%); transition: -webkit-transform 500ms ease-out; transition: transform 500ms ease-out; transition: transform 500ms ease-out, -webkit-transform 500ms ease-out; } } @media (min-width: 1200px) { .application #header .content { opacity: 0; transition: opacity 1s ease-out 3s; } .application #header .content.active { opacity: 1; } .application #header .apple, .application #header .android { margin: 0 10px; } .application #dashboard { height: 950px; } .application #dashboard .content { text-align: left; } .application #dashboard .content .haptic { margin-top: 3rem; } .application #dashboard .content .haptic img { margin: 0 20px 0 0; } .application #dashboard .content img { width: 100%; height: 100%; } .application #dashboard .content .row { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .application #dashboard .height-fix { height: 740px; } .application #parallax { height: 800px; background: linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%); } .application #one-login .bg { height: 800px; } .application #app-icon .icon { margin: 7rem 0 2rem; } .application #download .content { padding-bottom: 0; } .application #download .bg { height: 350px; } .application #download .bg .android.active { -webkit-transform: translate(48%, 39%); transform: translate(48%, 39%); } .application #download .bg .ios.active { -webkit-transform: translate(-7%, 55%); transform: translate(-7%, 55%); } } @media (min-width: 1600px) { .application #header .bg .video { padding-top: 0; } .application #header .bg .header-alt-image { top: 0; } .application #dashboard { height: 1200px; } .application #dashboard .content .haptic { margin-top: 4rem; } .application #dashboard .content .haptic img { max-width: 100px; } .application #dashboard .animation-wrapper { -webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%); } .application #dashboard .animation-wrapper .flow-artboard { -webkit-transform: scale(1); transform: scale(1); } .application #dashboard .height-fix { height: 970px; } .application #dashboard .button-replay { margin-top: -10%; } .application #parallax { height: 900px; } .application #app-icon .icon { margin: 8rem 0 2rem; width: 220px; } .application #one-login .bg { height: 1000px; } .application #download .a-store, .application #download .g-store { width: 180px; } .application #download .bg { margin-top: 10rem; -webkit-transform: translateY(-15%) scale(1.3); transform: translateY(-15%) scale(1.3); } } @media (min-width: 2100px) { .application #parallax { height: 1100px; } .application #app-icon .icon { width: 240px; } .application #one-login .bg { height: 1200px; } .application #download .a-store, .application #download .g-store { width: 210px; } } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE10+ CSS styles go here */ .application #dashboard { height: auto; margin-bottom: -7rem; } .application #dashboard .animation-wrapper { display: none; } .application #dashboard .image-wrapper { display: block; } .application #dashboard .image-wrapper img { width: 100%; height: auto; } } @media all and (-ms-high-contrast: none) and (min-width: 544px), (-ms-high-contrast: active) and (min-width: 544px) { .application #dashboard { height: auto; } } @media all and (-ms-high-contrast: none) and (min-width: 768px), (-ms-high-contrast: active) and (min-width: 768px) { .application #dashboard { height: auto; } } @media all and (-ms-high-contrast: none) and (min-width: 992px), (-ms-high-contrast: active) and (min-width: 992px) { .application #dashboard { height: auto; margin-bottom: 0; } .application #dashboard .image-wrapper img { width: 70%; } .application #download .bg .android { -webkit-transform: translate(0, 54%); transform: translate(0, 54%); } .application #download .bg .ios { -webkit-transform: translate(-57%, 60%); transform: translate(-57%, 60%); } } @media all and (-ms-high-contrast: none) and (min-width: 1200px), (-ms-high-contrast: active) and (min-width: 1200px) { .application #dashboard { height: auto; } .application #dashboard .image-wrapper { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .application #download .content { padding-bottom: 0; } .application #download .bg .android.active { -webkit-transform: translate(0, 39%); transform: translate(0, 39%); } .application #download .bg .ios.active { -webkit-transform: translate(-57%, 55%); transform: translate(-57%, 55%); } } @media all and (-ms-high-contrast: none) and (min-width: 2100px), (-ms-high-contrast: active) and (min-width: 2100px) { .application #dashboard .content img { width: 70%; height: auto; } .application #dashboard .image-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } @supports (-ms-ime-align: auto) { { /* IE Edge 12+ CSS styles go here */ } .application #dashboard { height: auto; margin-bottom: -7rem; } .application #dashboard .animation-wrapper { display: none; } .application #dashboard .image-wrapper { display: block; } .application #dashboard .image-wrapper img { width: 100%; height: auto; } @media (min-width: 544px) { .application #dashboard { height: auto; } } @media (min-width: 768px) { .application #dashboard { height: auto; } } @media (min-width: 992px) { .application #dashboard { height: auto; margin-bottom: 0; } .application #dashboard .image-wrapper img { width: 70%; } } @media (min-width: 1200px) { .application #dashboard { height: auto; } .application #dashboard .image-wrapper { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } } @media (min-width: 2100px) { .application #dashboard .content img { width: 70%; height: auto; } .application #dashboard .image-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } } .application #performance .counter-area { margin: 10px 0; } .application #performance .counter-area .nr-container { color: #518EBB; font-weight: 600; font-size: 26px; } .application #performance .counter-area .nr-container span { font-size: 60px; } .application #performance .counter-area .description { font-size: 16px; } .application #performance .phone-area { margin-top: 50px; margin-bottom: 30px; } .application #performance .phone-area .phone .phone-app { position: absolute; margin-top: 7.8%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .application #performance .phone-area .phone .phone-app.active { margin-top: 0; } .application #performance .phone-area .phone .phone-element { width: 100%; } .application #performance .phone-area .phone .phone-element img { width: 100%; height: auto; } .application #newsiri { background-color: #040C1F; padding-bottom: 30px; } .application #newsiri button:focus { outline: 0; cursor: pointer; } .application #newsiri .content { text-align: left; z-index: 1; } .application #newsiri .swiper-slide .slide1-content { -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; width: 100%; } .application #newsiri .swiper-slide .slide1-content h2 { color: #518EBB; margin-top: 30px; } .application #newsiri .swiper-slide .slide1-content .title-description { height: 330px; } .application #newsiri .swiper-slide .bg { background-color: #040C1F; padding-bottom: 20%; } .application #newsiri .swiper-slide .bg .notification-wrapper { bottom: 50%; position: absolute; } .application #newsiri .swiper-slide .bg .notification-wrapper.homepod { bottom: 27%; } .application #newsiri .swiper-slide .bg .bg-up { height: 300px; } .application #newsiri .swiper-slide .bg .fireplace1 img { width: 100%; border-radius: 25px; } .application #newsiri .swiper-slide .bg .siri-phone .phone-bg { position: absolute; bottom: -20%; width: 60%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .application #newsiri .swiper-slide .bg .siri-phone .phone-bg.spotlight-video { width: 39.7%; bottom: -8.9%; left: 50.2%; } .application #newsiri .swiper-slide .bg .siri-phone .suggestions-phone { opacity: 0; } .application #newsiri .swiper-slide .bg .siri-phone .suggestions-phone.active { opacity: 1; } .application #newsiri .swiper-slide .bg .fireplace_blue, .application #newsiri .swiper-slide .bg .homepod1, .application #newsiri .swiper-slide .bg .suggestion1, .application #newsiri .swiper-slide .bg .spotlight { width: calc(100% - 11px); position: absolute; opacity: 0; } .application #newsiri .swiper-slide .bg .fireplace_blue.active, .application #newsiri .swiper-slide .bg .homepod1.active, .application #newsiri .swiper-slide .bg .suggestion1.active, .application #newsiri .swiper-slide .bg .spotlight.active { opacity: 1; } .application #newsiri .swiper-slide .bg .homepod2, .application #newsiri .swiper-slide .bg .suggestion2 { height: auto; width: 100%; } .application #newsiri .swiper-pagination-bullets { top: 330px; left: 0; width: 100%; } .application #newsiri .swiper-pagination-bullet { background: #518EBB; margin: 0 15px; transition: all 0.2s ease-in-out; } .application #newsiri .swiper-pagination-bullet-active { width: 30px; border-radius: 6px; } .application #newsiri .notification { position: absolute; background-color: #518EBB; border-radius: 50px; width: 195px; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 5px; top: 30%; opacity: 0; -webkit-transform: scale(0.1); transform: scale(0.1); } .application #newsiri .notification.active { -webkit-transform: translateY(-50px) scale(1); transform: translateY(-50px) scale(1); opacity: 1; } .application #newsiri .notification.white { background-color: #FFFFFF; color: #393939; margin-top: 80px; right: -5%; left: unset; } .application #newsiri .notification p { font-size: 12px; font-style: italic; line-height: 16px; margin: 0; padding: 0 0 0 12px; } .application #newsiri .notification img { width: 33px; height: 33px; } .application #use-cases { background-color: #040C1F; padding-bottom: 30px; } .application #use-cases button:focus { outline: 0; cursor: pointer; } .application #use-cases .content { text-align: left; z-index: 1; } .application #use-cases .swiper-slide .slide1-content { -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; width: 100%; } .application #use-cases .swiper-slide .slide1-content h2 { color: #518EBB; margin-top: 30px; } .application #use-cases .swiper-slide .slide1-content .title-description { height: 320px; } .application #use-cases .swiper-slide .bg { background-color: #040C1F; padding-bottom: 20%; } .application #use-cases .swiper-slide .bg .bg-up { height: 300px; } .application #use-cases .swiper-slide .bg .fireplace1 img { width: 100%; border-radius: 25px; } .application #use-cases .swiper-slide .bg .siri-phone img { position: absolute; bottom: -20%; width: 60%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .application #use-cases .swiper-pagination-bullets { top: 320px; left: 0; width: 100%; } .application #use-cases .swiper-pagination-bullet { background: #518EBB; margin: 0 15px; transition: all 0.2s ease-in-out; } .application #use-cases .swiper-pagination-bullet-active { width: 30px; border-radius: 6px; } .application #use-cases .notification { position: absolute; background-color: #518EBB; border-radius: 50px; width: 125px; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 5px; top: 30%; opacity: 0; -webkit-transform: scale(0.1); transform: scale(0.1); } .application #use-cases .notification.active { -webkit-transform: translateY(-50px) scale(1); transform: translateY(-50px) scale(1); opacity: 1; } .application #use-cases .notification.white { background-color: #FFFFFF; color: #393939; margin-top: 80px; right: -5%; left: unset; } .application #use-cases .notification p { font-size: 10px; font-style: italic; line-height: 12px; margin: 0; padding: 0; } .application #use-cases .notification img { width: 27px; height: 27px; } .application #m-learning-mobile .content { padding-bottom: 0; } .application #m-learning-mobile .content h2 { color: #518EBB; } .application #m-learning-mobile .content .message { border-radius: 10px; background-color: #518EBB; color: #FFF; box-shadow: 0 20px 60px 0 rgba(0, 0, 0, 0.15); margin-bottom: 30px; margin-top: 20px; text-align: center; } .application #m-learning-mobile .content .message p { padding: 30px; } .application #m-learning-mobile .phone-area { padding-top: 30px; } .application #m-learning-mobile .phone-area img { margin-bottom: -2px; width: 100%; } .application #m-learning-desktop { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .application #m-learning-desktop .content { position: absolute; padding-bottom: 100px; z-index: 1; } .application #m-learning-desktop .content .container .content-fade { -webkit-transform: translateX(50px); transform: translateX(50px); opacity: 0; } .application #m-learning-desktop .content .container .content-fade.active { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } .application #m-learning-desktop .content .container h2 { color: #518EBB; text-align: left; } .application #m-learning-desktop .content .container .message { margin-top: 20px; border-radius: 10px; background-color: #518EBB; text-align: left; color: #FFF; box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.15); } .application #m-learning-desktop .content .container .message p { padding: 30px; } .application #m-learning-desktop .button-replay { position: absolute; display: block; opacity: 0; right: 0; margin-top: 50px; left: 50%; -webkit-transform: translateX(-40%); transform: translateX(-40%); max-width: 160px; } .application #m-learning-desktop .button-replay:hover { transition: 0.5s all; } .application #m-learning-desktop .button-replay:hover:after { -webkit-transform: translateY(-50%) rotate(360deg); transform: translateY(-50%) rotate(360deg); } @media (min-width: 544px) { .application #use-cases .swiper-slide .slide1-content .title-description { height: 250px; } .application #use-cases .swiper-pagination-bullets { top: 250px; } .application #newsiri .swiper-slide .bg .notification-wrapper.homepod { bottom: 30%; } .application #newsiri .swiper-slide .slide1-content .title-description { height: 270px; } .application #newsiri .swiper-pagination-bullets { top: 270px; } .application #m-learning-mobile .swiper-container .swiper-slide .slide-bg .col-phoneS-6 .text-content .phone-icon { width: 50px; height: 50px; } .application #m-learning-mobile .swiper-container .swiper-slide .slide-bg .col-phoneS-6 .text-content p { margin-top: 10px; font-size: 14px; } } @media (min-width: 768px) { .application #newsiri .notification { width: 310px; } .application #newsiri .notification p { font-size: 18px; line-height: 24px; padding: 5px 0 0 68px; position: absolute; width: 68%; } .application #newsiri .notification img { width: 48px; height: 48px; margin: 5px; } .application #newsiri .notification.white { margin-top: 130px; } .application #m-learning-mobile .swiper-container .swiper-slide .slide-bg .col-phoneS-6 .text-content .phone-icon { width: 70px; height: 70px; } .application #m-learning-mobile .swiper-container .swiper-slide .slide-bg .col-phoneS-6 .text-content p { margin-top: 10px; font-size: 16px; } } @media (min-width: 992px) { .application #newsiri { padding-bottom: 0; margin-bottom: -1px; } .application #newsiri .swiper-slide .slide1-content .title-description { height: unset; } .application #newsiri .swiper-slide .slide1-content .siri-phone .phone-bg { height: 450px; } .application #newsiri .swiper-slide .slide1-content .siri-phone .siriwave { position: absolute; margin: 0 65px; bottom: 160px; } .application #newsiri .swiper-slide .bg { padding-bottom: 0; } .application #newsiri .swiper-slide .bg .notification-wrapper { bottom: 70%; height: auto; } .application #newsiri .swiper-slide .bg .notification-wrapper.homepod { bottom: 45%; } .application #newsiri .swiper-slide .bg .fireplace1 img { border-radius: 0; } .application #newsiri .swiper-slide .bg .siri-phone .phone-bg { bottom: 50%; width: auto; left: 99%; height: 450px; -webkit-transform: translate(-50%, 50%); transform: translate(-50%, 50%); } .application #newsiri .swiper-slide .bg .siri-phone .phone-bg.spotlight-video { bottom: 52.2%; width: auto; left: 99.1%; height: 380px; } .application #newsiri .swiper-slide .bg .siri-phone .siriwave { position: absolute; margin: 0 -5px; bottom: 130px; width: 160px; left: 100%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .application #newsiri .swiper-slide .bg .siri-phone .siriwave.homepod { bottom: 340px; width: 230px; } .application #newsiri .swiper-slide .bg .video { -webkit-transform: translateX(100%); transform: translateX(100%); } .application #newsiri .swiper-slide .bg .fireplace_blue, .application #newsiri .swiper-slide .bg .homepod1, .application #newsiri .swiper-slide .bg .suggestion1, .application #newsiri .swiper-slide .bg .spotlight { width: 100%; } .application #newsiri .swiper-pagination-bullets { bottom: 50px; top: inherit; left: 0.5%; } .application #newsiri .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .application #newsiri .swiper-pagination { position: relative; margin-bottom: -30px; } .application #newsiri .swiper-button-next { display: block; background: none; border-right: 2px solid rgba(255, 255, 255, 0.25); border-bottom: 2px solid rgba(255, 255, 255, 0.25); width: 72px; height: 72px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); right: 45px; } .application #newsiri .swiper-button-prev { display: block; background: none; border-right: 2px solid rgba(255, 255, 255, 0.25); border-bottom: 2px solid rgba(255, 255, 255, 0.25); width: 72px; height: 72px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; -webkit-transform: rotate(135deg); transform: rotate(135deg); left: 45px; } .application #newsiri .slider-buttons { position: absolute; bottom: 0; left: 0; z-index: 100; width: 150px; background-color: #040C1F; } .application #newsiri .slider-buttons button { margin: 0; border: 0; padding: 25px; cursor: pointer; background-color: #040C1F; } .application #newsiri .notification.white { margin-top: 90px; } .application #use-cases { padding-bottom: 0; } .application #use-cases .swiper-slide .slide1-content .title-description { height: unset; } .application #use-cases .swiper-slide .slide1-content .siri-phone .phone-bg { height: 450px; } .application #use-cases .swiper-slide .slide1-content .siri-phone .siriwave { position: absolute; margin: 0 65px; bottom: 160px; } .application #use-cases .swiper-slide .bg { padding-bottom: 0; } .application #use-cases .swiper-slide .bg .fireplace1 img { border-radius: 0; } .application #use-cases .swiper-slide .bg .siri-phone img { bottom: 4%; width: 50%; left: 99%; } .application #use-cases .swiper-pagination-bullets { bottom: 50px; top: inherit; left: 0.5%; } .application #use-cases .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .application #use-cases .swiper-pagination { position: relative; margin-bottom: -30px; } .application #use-cases .swiper-button-next { display: block; background: none; border-right: 2px solid rgba(255, 255, 255, 0.25); border-bottom: 2px solid rgba(255, 255, 255, 0.25); width: 72px; height: 72px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); right: 45px; } .application #use-cases .swiper-button-prev { display: block; background: none; border-right: 2px solid rgba(255, 255, 255, 0.25); border-bottom: 2px solid rgba(255, 255, 255, 0.25); width: 72px; height: 72px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; -webkit-transform: rotate(135deg); transform: rotate(135deg); left: 45px; } .application #use-cases .slider-buttons { position: absolute; bottom: 0; left: 0; z-index: 100; width: 150px; background-color: #040C1F; } .application #use-cases .slider-buttons button { margin: 0; border: 0; padding: 25px; cursor: pointer; background-color: #040C1F; } .application #m-learning-desktop .bg .video-area video { margin-bottom: -10px; width: 102%; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } } @media (min-width: 1200px) { .application #newsiri .swiper-slide .bg .notification-wrapper { bottom: 60%; } .application #newsiri .swiper-slide .bg .notification-wrapper.homepod { bottom: 40%; } .application #newsiri .swiper-slide .bg .siri-phone .phone-bg { height: 88%; bottom: 46%; } .application #newsiri .swiper-slide .bg .siri-phone .phone-bg.spotlight-video { bottom: 48.3%; height: 74.2%; left: 99.1%; } .application #newsiri .swiper-slide .bg .siri-phone .siriwave { bottom: 22%; width: 27%; } .application #newsiri .swiper-slide .bg .siri-phone .siriwave.homepod { bottom: 67%; width: 42%; } .application #newsiri .swiper-pagination-bullets { bottom: 70px; } .application #use-cases .swiper-slide .slide1-content .siri-phone .phone-bg { height: 550px; } .application #use-cases .swiper-slide .slider-buttons { width: unset; } } @media (min-width: 1600px) { .application #newsiri .swiper-slide .bg .notification-wrapper { bottom: 65%; } .application #newsiri .swiper-slide .bg .notification-wrapper.homepod { bottom: 43%; } .application #newsiri .swiper-slide .bg .siri-phone .phone-bg { bottom: 46%; } .application #newsiri .swiper-slide .bg .siri-phone .siriwave { bottom: 22%; } .application #newsiri .swiper-pagination-bullets { bottom: 90px; } .application #newsiri .notification { width: 380px; } .application #newsiri .notification p { font-size: 22px; line-height: 26px; padding: 10px 0 10px 88px; width: 68%; } .application #newsiri .notification img { width: 66px; height: 66px; margin: 5px; } .application #newsiri .notification.white { margin-top: 160px; } .application #newsiri .notification.homepod { margin-top: 120px; } .application #use-cases .swiper-slide .slide1-content .siri-phone .phone-bg { height: 800px; } } @media (min-width: 2100px) { .application #performance .phone-area { margin-top: 100px; } .application #newsiri .swiper-pagination-bullets { bottom: 110px; } .application #newsiri .notification { width: 460px; } .application #newsiri .notification p { font-size: 26px; line-height: 34px; padding: 10px 0 10px 100px; width: 68%; } .application #newsiri .notification img { width: 80px; height: 80px; margin: 5px; } .application #newsiri .notification.white { margin-top: 200px; } .application #newsiri .notification.homepod { margin-top: 150px; } .application #use-cases .swiper-slide .slide1-content .siri-phone .phone-bg { height: 1050px; } .application #m-learning-desktop .content .container .message { border-radius: 20px; } .application #m-learning-desktop .content .container .message p { font-size: 26px; } } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE10+ CSS styles go here */ } @media all and (-ms-high-contrast: none) and (min-width: 992px), (-ms-high-contrast: active) and (min-width: 992px) { .application #m-learning-desktop .content .container .content-fade { -webkit-transform: translate(50px -50%); transform: translate(50px -50%); } .application #m-learning-desktop .content .container .content-fade.active { -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } } .all-products #header { background-color: #eeeeee; } .all-products #header h1 { font-weight: 700; } .all-products #header .content { padding-bottom: 0; } .all-products #header .filters { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 30px; } .all-products #header .filters div { padding: 15px 0; width: 130px; text-align: center; color: #444444; } .all-products #header .filters div.active { background-color: #ffffff; color: #0090ff; cursor: pointer; font-weight: 600; border-radius: 10px 10px 0 0; } .all-products #header .filters div:hover { color: #0090ff; cursor: pointer; } .all-products #products .results { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .all-products #products .results a { color: #444444; } .all-products #products .results .break { display: none; } .all-products #products .bundles { width: 100%; overflow: hidden; margin: 20px 0; } .all-products #products .bundles p { font-size: 24px; color: #7e7e7e; position: relative; display: inline-block; } .all-products #products .bundles p:before, .all-products #products .bundles p:after { content: ""; position: absolute; height: 1px; border-bottom: 1px solid #dbdbdb; top: 18px; width: 1000%; } .all-products #products .bundles p:before { right: 100%; margin-right: 15px; } .all-products #products .bundles p:after { left: 100%; margin-left: 15px; } .all-products #products .item { width: 0; height: 0; display: none; margin: 15px 0; } .all-products #products .item img { width: 90%; padding-bottom: 5px; } .all-products #products .item .txt { display: none; } .all-products #products .item.active { width: 50%; height: auto; display: block; } @media (min-width: 768px) { .all-products #header h1 { margin-top: 2rem; } .all-products #products .item img { width: 80%; } .all-products #products .item.active { width: 25%; } } @media (min-width: 1200px) { .all-products #header { width: auto; max-width: 2560px; } .all-products #products .item { padding: 10px 10px; margin: 5px 10px; border-radius: 10px; transition: all 150ms ease-out; } .all-products #products .item .description { min-height: 40px; padding: 0 5%; } .all-products #products .item .txt { display: block; font-size: 90%; color: #0090FF; opacity: 0; transition: all 150ms ease-out; } .all-products #products .item.active { width: 18%; } .all-products #products .item:hover { box-shadow: 0 3px 15px 0 rgba(0, 0, 0, 0.15); } .all-products #products .item:hover .txt { opacity: 1; } .all-products #products .item img { width: 100%; } .all-products #products .results .break { -ms-flex-preferred-size: 100%; flex-basis: 100%; width: 0; height: 0; overflow: hidden; display: inline-block; } } @media (min-width: 1600px) { .all-products #header h1 { font-size: 32px; } .all-products #header .filters { margin: 50px 0 0 0; } .all-products #header .filters div { width: 180px; } .all-products #products .item { margin: 10px 10px; } } @media (min-width: 2100px) { .all-products #header h1 { font-size: 42px; } .all-products #header .filters div { width: 200px; padding: 20px 0; } } .ring { width: 150px; height: 150px; position: absolute; display: block; z-index: 100; } .ring span { position: absolute; display: block; width: 100%; height: 100%; border-radius: 50%; background: radial-gradient(circle at center, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 50%, white 100%); -webkit-transform: scale(0.3); transform: scale(0.3); opacity: 0; -webkit-animation: ring 1.8s ease-in infinite; animation: ring 1.8s ease-in infinite; } .ring span:nth-of-type(1) { -webkit-animation-delay: .6s; animation-delay: .6s; } .ring span:nth-of-type(2) { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; } .ring.icon { width: 188px; height: 188px; } .ring.icon span { -webkit-transform: scale(0.6); transform: scale(0.6); -webkit-animation-name: ring-icon; animation-name: ring-icon; } .ring i { display: block; position: absolute; width: 60%; height: 60%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 50%; } .ring i.heating { background: url("../img/common/heating.svg") no-repeat center; background-size: 50% 50%; } .ring i.cooling { background: url("../img/common/cooling.svg") no-repeat center; background-size: 50% 50%; } .ring i.lighting { background: url("../img/common/white-bulb.svg") no-repeat center; background-size: 50% 50%; } .ring.red span { background: radial-gradient(circle at center, rgba(255, 73, 31, 0) 0%, rgba(255, 73, 31, 0) 50%, #ff491f 100%); } .ring.red i { background-color: #ff491f; } .ring.blue span { background: radial-gradient(circle at center, rgba(0, 144, 255, 0) 0%, rgba(0, 144, 255, 0) 50%, #0090ff 100%); } .ring.blue i { background-color: #0090ff; } @-webkit-keyframes ring { 0% { -webkit-transform: scale(0.3); transform: scale(0.3); opacity: 0; } 20% { -webkit-transform: scale(0.3); transform: scale(0.3); opacity: 1; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 0; } } @keyframes ring { 0% { -webkit-transform: scale(0.3); transform: scale(0.3); opacity: 0; } 20% { -webkit-transform: scale(0.3); transform: scale(0.3); opacity: 1; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 0; } } @-webkit-keyframes ring-icon { 0% { -webkit-transform: scale(0.6); transform: scale(0.6); opacity: 0; } 20% { -webkit-transform: scale(0.6); transform: scale(0.6); opacity: 1; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 0; } } @keyframes ring-icon { 0% { -webkit-transform: scale(0.6); transform: scale(0.6); opacity: 0; } 20% { -webkit-transform: scale(0.6); transform: scale(0.6); opacity: 1; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 0; } } .single-product section .sub-extra { width: 100%; } .single-product .bg-second { position: absolute; width: 100%; height: 100%; background-size: cover; } .single-product .content.dashed-heading h2 { position: relative; padding-bottom: 22px; margin-bottom: 18px; } .single-product .content.dashed-heading h2:after { content: ''; display: inline-block; width: 60px; height: 2px; background-color: #0090ff; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .section-product-header { height: 380px; } .section-product-header .content { width: 100%; position: absolute; z-index: 10; top: 0; left: 0; padding-top: 5rem; } .section-product-header .bg { width: 100%; height: 380px; } .section-video-player { overflow: hidden; height: 200px; width: 100%; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; } .section-video-player video { width: auto; height: 100%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .section-video-player video::-webkit-media-controls { display: none; } .section-video-player .content { color: #fff; width: 100%; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; } .section-video-player .content h2 { text-transform: uppercase; padding-bottom: 0.25em; } .section-scroll-slide { overflow: hidden; height: 280px; } .section-scroll-slide .content { color: #fff; width: 100%; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; } .section-scroll-slide .bg { width: 100%; height: 100%; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; position: relative; top: 0; } .section-big-image .content { position: absolute; z-index: 10; } .section-content-image img, .section-video-reveal img { max-width: 100%; width: auto; height: auto; } .section-info-two-column-image .content, .section-info-two-column-image-left .content { width: 100%; position: relative; } .section-info-two-column-image img, .section-info-two-column-image-left img { width: 100%; height: auto; } .section-three-column .container-fluid { padding-left: 0; padding-right: 0; } .section-three-column img { width: 100%; height: auto; } .section-content-image .content, .section-content-image .sub-extra, .section-big-image .content, .section-big-image .sub-extra, .section-inter .content, .section-inter .sub-extra, .section-siri .content, .section-siri .sub-extra, .section-homekit-enabled .content, .section-homekit-enabled .sub-extra, .section-info-two-column-image .content, .section-info-two-column-image .sub-extra, .section-info-two-column-image-left .content, .section-info-two-column-image-left .sub-extra, .section-packshot-slider .content, .section-packshot-slider .sub-extra, .section-feature-slider .content, .section-feature-slider .sub-extra, .section-interactive .content, .section-interactive .sub-extra, .section-video-reveal .content, .section-video-reveal .sub-extra, .section-product-sizing .content, .section-product-sizing .sub-extra, .section-bin .content, .section-bin .sub-extra { padding-top: 2.4rem; padding-bottom: 2.4rem; } .section-siri .content img { display: inline-block; width: 100px; margin-left: 3px; } .section-siri .content br { display: none; } .section-siri .siriwave { width: 100%; max-width: 730px; height: 90px; display: inline-block; margin-bottom: 2.4rem; } .section-homekit-enabled .content { position: absolute; z-index: 10; } .section-homekit-enabled .content img { width: 100px; } .section-packshot-slider { background: #ffffff; background: linear-gradient(to bottom, #eaeaea 0%, #ffffff 100%); } .section-packshot-slider .swiper-wrapper { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .section-packshot-slider .swiper-wrapper, .section-packshot-slider .swiper-slide { box-sizing: border-box; } .section-packshot-slider ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 3rem; } .section-packshot-slider li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: -webkit-box; display: -ms-flexbox; display: flex; background-repeat: no-repeat; padding-top: 60px; margin-bottom: 2rem; width: 33.33%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .section-packshot-slider li span { display: inline-block; width: 90%; font-size: 78%; } .section-packshot-slider li.bluetooth { background-image: url("../img/common/choose-bt.svg"); background-size: 36px 36px; background-position: 50% 12px; } .section-packshot-slider li.battery { background-image: url("../img/common/choose-battery.svg"); background-size: 32px 32px; background-position: 50% 10px; } .section-packshot-slider li.scene { background-image: url("../img/common/choose-scene.svg"); background-size: 32px 32px; background-position: 50% 15px; } .section-packshot-slider li.siri { background-image: url("../img/common/choose-siri.svg"); background-size: 32px 36px; background-position: 50% 15px; } .section-packshot-slider li.ios9 { background-image: url("../img/common/choose-ios.svg"); background-size: 40px 36px; background-position: 50% 15px; } .section-packshot-slider li.sharing { background-image: url("../img/common/choose-users.svg"); background-size: 40px 36px; background-position: 50% 15px; } .section-packshot-slider li.wireless { background-image: url("../img/common/choose-wifi.svg"); background-size: 40px 40px; background-position: 50% 10px; } .section-packshot-slider li.smart { background-image: url("../img/common/choose-notifications.svg"); background-size: 40px 40px; background-position: 50% 10px; } .section-packshot-slider li.mobile { background-image: url("../img/common/choose-ios-android.svg"); background-size: 48px 40px; background-position: 50% 10px; } .section-packshot-slider li.range { background-image: url("../img/common/choose-range.svg"); background-size: 48px 40px; background-position: 50% 10px; } .section-packshot-slider li.eftypes { background-image: url("../img/common/icon-plugtypes.svg"); background-size: 35px 35px; background-position: 50% 15px; } .section-packshot-slider li.rechargable { background-image: url("../img/icons/icon_rechargable.svg"); background-size: 40px 40px; background-position: 50% 12px; } .section-packshot-slider li.lightning { background-image: url("../img/icons/icon_lightning.svg"); background-size: 48px 48px; background-position: 50% 5px; } .section-packshot-slider li.usbcharger { background-image: url("../img/icons/usb-charging-icon.svg"); background-size: 40px 40px; background-position: 50% 10px; } .section-packshot-slider img { display: block; max-width: 260px; margin: 0 auto; } .section-packshot-slider .buttons { margin-top: 3rem; margin-bottom: 2rem; } .section-packshot-slider .buttons a { display: inline-block; margin: 0 .5rem; padding: .5rem 2rem; min-width: 130px; border: 1px solid #0090FF; border-radius: 16px/50%; transition: all 250ms; } .section-packshot-slider .buttons a:hover, .section-packshot-slider .buttons a.active { color: #fff; background-color: #0090FF; text-decoration: none; } .section-product-sizing .content .col-1 img, .section-product-sizing .content .col-2 img { max-width: 290px; margin-top: 2.4rem; margin-bottom: 2.4rem; } .section-product-sizing .content .col-3 img { width: 100%; max-width: 480px; } .section-product-sizing.product-sizing-background { background: #eaeaea; background: linear-gradient(to bottom, #ffffff 0%, #ffffff 43%, #eaeaea 82%, #eaeaea 85%, #ffffff 100%); } .section-product-sizing.product-sizing-background-alt { background: #eaeaea; background: linear-gradient(to bottom, #ffffff 0%, #ffffff 43%, #eaeaea 76%, #ffffff 85%, #ffffff 86%, #e8e8e8 100%); } .section-feature-slider .row > div { box-sizing: border-box; } .section-product-footer .container { width: 100%; max-width: 2560px; } .section-product-footer .top { background-image: none; } .section-product-footer .top .content { padding-top: 5rem; padding-bottom: 6rem; color: #fff; } .section-product-footer .top .content a { display: inline-block; color: #fff; padding: 8px 60px 8px 60px; border-radius: 15px; background-color: #0090ff; text-transform: uppercase; font-size: 18px; letter-spacing: 2px; font-weight: 400; transition: all 250ms; } .section-product-footer .top .content a:hover { color: #fff; background-color: #007ae4; } .section-product-footer .top .content h2 { display: none; } .section-product-footer .sub { background-color: #f6f6f6; } .section-product-footer .sub .content { padding-top: 1.2rem; padding-bottom: 1.2rem; } .section-product-footer .sub .content a { display: inline-block; position: relative; margin-top: 2.4rem; margin-bottom: 2.4rem; padding: 0 1.3rem; } .section-product-footer .sub .content a img { display: block; height: 100px; width: auto; margin: 0 auto; } .section-product-footer .sub .content a span { font-size: 1.3rem; } .section-product-footer .sub .content a span:after { content: ""; display: inline-block; width: 6px; height: 6px; border-top: 1px solid #0090FF; border-right: 1px solid #0090FF; background-color: transparent; -webkit-transform: rotate(45deg) translate(1px, -2px); transform: rotate(45deg) translate(1px, -2px); } .chat-bubble { display: inline-block; position: relative; z-index: 1; padding: 12px 26px; margin-bottom: 3.6rem; font-style: italic; background-color: #173e64; border: 1px solid #6cfff3; border-radius: 12px; color: #6cfff3; } .chat-bubble:after { content: ''; position: absolute; bottom: -18px; display: block; width: 38px; height: 21px; background: url("../img/common/chat-bubble-tip.svg") no-repeat; background-size: contain; z-index: 2; } .chat-bubble.chat-bubble-response { border-color: #3ac5fe; color: #3ac5fe; } .chat-bubble.chat-bubble-response:after { right: 24px; background: url("../img/common/chat-bubble-tip-reverse.svg") no-repeat; } .section-footnotes#footnotes { background-color: #fbfbfb; } .section-footnotes#footnotes .content { padding: 2.4rem 0 1.8rem; font-size: 1rem; text-align: left; } .section-footnotes#footnotes .content p { padding-bottom: .6rem; } @media screen and (min-width: 360px) { .section-product-footer .sub .content a span { font-size: inherit; } .section-product-footer .sub .content a span:after { width: 8px; height: 8px; } } @media (min-width: 544px) { .single-product .section-video-player video { width: 100%; height: auto; } } @media (min-width: 768px) { .anim-up { -webkit-transform: translateX(-40%); transform: translateX(-40%); } .section-product-header { height: 660px; } .section-product-header .bg { height: 660px; } .section-product-header .content { padding-top: 10rem; } .section-video-player { height: 280px; } .section-scroll-slide .bg { width: 100%; height: 200%; top: -90%; } .section-siri .content img { width: 150px; } .section-siri .siriwave { height: 130px; } .section-homekit-enabled .content img { width: 160px; margin-top: 1rem; } .section-packshot-slider img { max-width: 320px; } .section-product-sizing .content .col-1 img, .section-product-sizing .content .col-2 img { max-width: 320px; margin-top: 2.4rem; margin-bottom: 0; } .section-product-sizing .content .col-1 { text-align: right; } .section-product-sizing .content .col-1 img { margin-right: 2.4rem; } .section-product-sizing .content .col-2 { text-align: left; } .section-product-sizing .content .col-2 img { margin-left: 2.4rem; } .section-footnotes#footnotes .content { font-size: 1.1rem; } } @media (min-width: 992px) { .section-product-header { height: 730px; } .section-product-header .bg { height: 730px; } .section-product-header .content { padding-top: 12rem; } .section-content-image .content, .section-content-image .sub-extra, .section-big-image .content, .section-big-image .sub-extra, .section-inter .content, .section-inter .sub-extra, .section-siri .content, .section-siri .sub-extra, .section-homekit-enabled .content, .section-homekit-enabled .sub-extra, .section-info-two-column-image .content, .section-info-two-column-image .sub-extra, .section-info-two-column-image-left .content, .section-info-two-column-image-left .sub-extra, .section-packshot-slider .content, .section-packshot-slider .sub-extra, .section-feature-slider .content, .section-feature-slider .sub-extra, .section-interactive .content, .section-interactive .sub-extra, .section-video-reveal .content, .section-video-reveal .sub-extra, .section-product-sizing .content, .section-product-sizing .sub-extra, .section-bin .content, .section-bin .sub-extra { padding-top: 3.6rem; padding-bottom: 3.6rem; } .section-big-image .content { top: 0; left: 0; width: 100%; } .section-big-image .bg { height: 0; padding-bottom: 56.25%; } .section-scroll-slide h2 { font-size: 4.8rem; } .section-packshot-slider ul { margin-top: 3rem; } .section-packshot-slider img { margin: 0; display: inline-block; } .section-packshot-slider .col-2 { text-align: right; } .section-packshot-slider .buttons a { min-width: 190px; } .typo-light .content { color: #fff; } } @media (min-width: 1200px) { .section-product-header { height: auto; } .section-product-header .bg { height: 0; padding-bottom: 56.25%; } .section-product-header .content { padding-top: 10rem; } .section-content-image .content, .section-content-image .sub-extra, .section-big-image .content, .section-big-image .sub-extra, .section-inter .content, .section-inter .sub-extra, .section-siri .content, .section-siri .sub-extra, .section-homekit-enabled .content, .section-homekit-enabled .sub-extra, .section-info-two-column-image .content, .section-info-two-column-image .sub-extra, .section-info-two-column-image-left .content, .section-info-two-column-image-left .sub-extra, .section-packshot-slider .content, .section-packshot-slider .sub-extra, .section-feature-slider .content, .section-feature-slider .sub-extra, .section-interactive .content, .section-interactive .sub-extra, .section-video-reveal .content, .section-video-reveal .sub-extra, .section-product-sizing .content, .section-product-sizing .sub-extra, .section-bin .content, .section-bin .sub-extra { padding-top: 5rem; padding-bottom: 5rem; } .section-video-player { height: 430px; background-color: #000; } .section-video-player video { opacity: .5; } .section-scroll-slide { height: 560px; } .section-scroll-slide h2 { font-size: 6rem; } .section-homekit-enabled .content img { width: 170px; } .section-packshot-slider img { max-width: 380px; } .section-packshot-slider ul { margin-top: 5rem; } .section-packshot-slider .buttons { margin-top: 4.8rem; } .section-packshot-slider .buttons a { margin: 0 1.5rem; padding: .5rem 2.4rem; border-radius: 20px/50%; } .section-product-sizing .content .col-1 img, .section-product-sizing .content .col-2 img { max-width: 400px; } .section-product-sizing .content .col-3 img { max-width: 600px; } .section-video-reveal video { max-width: 100%; } .section-product-footer .top .content { padding-top: 7.6rem; padding-bottom: 7.6rem; } .section-product-footer .top .content a { font-size: 22px; } .section-product-footer .sub .content { padding-top: 3.5rem; padding-bottom: 3.5rem; } .section-product-footer .sub .content a { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .section-product-footer .sub .content a span { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } .section-product-footer .sub .content a:hover span { border-bottom: 1px solid #0090FF; } } @media (min-width: 1600px) { .single-product .content.dashed-heading h2 { padding-bottom: 26px; margin-bottom: 20px; } .single-product .content.dashed-heading h2:after { width: 75px; } .section-content-image .content, .section-content-image .sub-extra, .section-big-image .content, .section-big-image .sub-extra, .section-inter .content, .section-inter .sub-extra, .section-siri .content, .section-siri .sub-extra, .section-homekit-enabled .content, .section-homekit-enabled .sub-extra, .section-info-two-column-image .content, .section-info-two-column-image .sub-extra, .section-info-two-column-image-left .content, .section-info-two-column-image-left .sub-extra, .section-packshot-slider .content, .section-packshot-slider .sub-extra, .section-feature-slider .content, .section-feature-slider .sub-extra, .section-interactive .content, .section-interactive .sub-extra, .section-video-reveal .content, .section-video-reveal .sub-extra, .section-product-sizing .content, .section-product-sizing .sub-extra, .section-bin .content, .section-bin .sub-extra { padding-top: 7rem; padding-bottom: 7rem; } .section-homekit-enabled .content img { width: 210px; } .section-packshot-slider img { max-width: 460px; margin-top: 2rem; } .section-packshot-slider ul { margin-top: 7rem; } .section-packshot-slider li span { width: 140px; } .section-packshot-slider .buttons a { margin: 0 2.5rem; border-radius: 22px/50%; } .section-product-sizing .content .col-1 img, .section-product-sizing .content .col-2 img { max-width: 460px; } .section-footnotes#footnotes .content { padding: 3.6rem 0 3rem; } .section-packshot-slider li { padding-top: 70px; } .section-packshot-slider li.bluetooth { background-size: 44px 44px; background-position: 50% 12px; } .section-packshot-slider li.battery { background-size: 50px 50px; background-position: 50% 10px; } .section-packshot-slider li.scene { background-size: 40px 40px; background-position: 50% 15px; } .section-packshot-slider li.siri { background-size: 40px 45px; background-position: 50% 15px; } .section-packshot-slider li.ios9 { background-size: 50px 45px; background-position: 50% 15px; } .section-packshot-slider li.sharing { background-size: 50px 45px; background-position: 50% 15px; } .section-packshot-slider li.wireless { background-size: 50px 50px; background-position: 50% 10px; } .section-packshot-slider li.smart { background-size: 50px 50px; background-position: 50% 10px; } .section-packshot-slider li.mobile { background-size: 60px 50px; background-position: 50% 10px; } .section-packshot-slider li.range { background-size: 60px 50px; background-position: 50% 10px; } .section-packshot-slider li.eftypes { background-size: 44px 44px; background-position: 50% 15px; } .section-packshot-slider li.rechargable { background-size: 50px 50px; background-position: 50% 12px; } .section-packshot-slider li.lightning { background-size: 60px 60px; background-position: 50% 5px; } .section-packshot-slider li.usbcharger { background-size: 48px 48px; background-position: 50% 10px; } } @media (min-width: 2100px) { .single-product .content.dashed-heading h2 { padding-bottom: 32px; margin-bottom: 26px; } .section-product-footer .top .content a { font-size: 26px; } } .keyfob #section1 { height: 400px; } .keyfob #section1 .content { padding-top: 5rem; text-transform: uppercase; } .keyfob #section1 .content h1 { padding-bottom: 0; letter-spacing: 10px; margin-right: -10px; } .keyfob #section1 .content p { font-size: 1.8rem; } .keyfob #section1 .content hr { color: transparent; border-bottom: 1px solid #444444; display: inline-block; width: 120px; } .keyfob #section1 .bg { width: 100%; height: 400px; } .keyfob #section1 a { display: block; width: 36px; height: 32px; background-size: contain; position: absolute; z-index: 100; bottom: 30px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .keyfob #section1 a span { font-size: 0; color: transparent; text-indent: 20000em; } .keyfob #section2 h2 { padding-bottom: 1.2rem; } .keyfob #section3 .content { padding-bottom: 0; } .keyfob #section3 .col-1 img { width: 90%; margin-bottom: 3rem; max-width: 785px; } .keyfob #section5 .content { padding-bottom: 0; } .keyfob #section5 img { margin-top: 3rem; margin-bottom: 3rem; } .keyfob #section6 .content { padding-bottom: 0; padding-top: 0; } .keyfob #section7 .col-1 img { margin-bottom: 3rem; } .keyfob #section7 .col-2 img { max-width: 360px; } .keyfob #section8 { padding-bottom: 3rem; } .keyfob #section8 .col-1 { border-bottom: 1px solid #e5e5e5; margin-bottom: 4rem; } .keyfob #section8 .col-1 img { max-width: 390px; margin-bottom: 1rem; } .keyfob #section8 .col-2 img { max-width: 440px; margin-bottom: 1rem; } .keyfob #section9 { background-size: auto 360px; padding-bottom: 6rem; } .keyfob #section9 .content { padding-bottom: 0; } .keyfob #section9 .col-1 img { max-width: 260px; } .keyfob #section9 .col-2 { padding-top: 180px; } .keyfob #section9 .col-2 .hidden-tabletP-up { max-width: 260px; } .keyfob #section10 .content { padding-bottom: 0; } .keyfob #section10 .col-1 img { width: 85%; max-width: 425px; margin-top: 2.4rem; margin-bottom: 2.4rem; } .keyfob #section11 p { padding-bottom: 0; } .keyfob #section11 .bg { height: 330px; } .keyfob #section12 .bg { height: 330px; } .keyfob #section12 .swiper-slide { background-color: #fff; } .keyfob #section12 .content { padding-bottom: 0; } .keyfob #section12 .content ul { width: 100%; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .keyfob #section12 .content li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: 50%; text-align: left; padding-bottom: 2rem; padding-right: 2rem; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .keyfob #section12 .content li:before { content: ""; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: 36px; height: 36px; background-repeat: no-repeat; background-position: 0 0; background-size: 22px 22px; } .keyfob #section12 .content li.square:before { background-image: url("../img/common/button-01.svg"); } .keyfob #section12 .content li.circle:before { background-image: url("../img/common/button-02.svg"); } .keyfob #section12 .content li.cross:before { background-image: url("../img/common/button-03.svg"); } .keyfob #section12 .content li.triangle:before { background-image: url("../img/common/button-04.svg"); } .keyfob #section12 .content li.minus:before { background-image: url("../img/common/button-05.svg"); } .keyfob #section12 .content li.plus:before { background-image: url("../img/common/button-06.svg"); } .keyfob #section14 .content { position: relative; } .keyfob #section14 p { padding-bottom: 0; } .keyfob #section14 .bg { height: 280px; } .keyfob #section15 .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .keyfob #section15 .bg { background-position: 75% 50%; height: 420px; } .keyfob #section16 .bg { height: 420px; } .keyfob #section17 .bg { height: 575px; } .keyfob #section18 { margin-bottom: -2.4rem; } .keyfob #section18 .content { padding-bottom: 0; } .keyfob #section18 .features { width: 100%; } .keyfob #section18 .features ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 4rem; } .keyfob #section18 .features li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; background-repeat: no-repeat; padding-top: 70px; margin-bottom: 2rem; width: 50%; } .keyfob #section18 .features li.battery { background-image: url("../img/common/features-battery.svg"); background-size: 50px 50px; background-position: 50% 10px; } .keyfob #section18 .features li.battery span { display: inline-block; width: 120px; } .keyfob #section18 .features li.wireless { background-image: url("../img/common/features-wireless.svg"); background-size: 50px 50px; background-position: 50% 10px; } .keyfob #section18 .features li.wireless span { display: inline-block; width: 120px; } .keyfob #section18 .features li.activation { background-image: url("../img/common/features-activation.svg"); background-size: 40px 40px; background-position: 50% 15px; } .keyfob #section18 .features li.actions { background-image: url("../img/common/features-actions.svg"); background-size: 50px 50px; background-position: 50% 10px; } .keyfob #ip54 .content { position: absolute; z-index: 10; } .keyfob #ip54 .bg { height: 550px; } .keyfob .icon-slider { margin: 0 auto 3rem; width: 90%; max-width: 460px; } .keyfob .icon-slider ul { list-style: none; } .keyfob .icon-slider li { display: inline-block; height: 56px; background-repeat: no-repeat; background-position: 50% 50%; } .keyfob .icon-slider li.steer-projector { background-image: url("../img/common/steer-projector.svg"); background-size: 36.8px 20px; } .keyfob .icon-slider li.steer-gamepad { background-image: url("../img/common/steer-gamepad.svg"); background-size: 33.6px 25.6px; } .keyfob .icon-slider li.steer-video { background-image: url("../img/common/steer-video.svg"); background-size: 33.6px 33.6px; } .keyfob .icon-slider li.steer-lights { background-image: url("../img/common/steer-lights.svg"); background-size: 25.6px 40px; } .keyfob .icon-slider li.steer-music { background-image: url("../img/common/steer-music.svg"); background-size: 32.8px 36.8px; } .keyfob .icon-slider li.steer-fan { background-image: url("../img/common/steer-fan.svg"); background-size: 28px 38.4px; } .keyfob .icon-slider li.steer-bulb { background-image: url("../img/common/steer-bulb.svg"); background-size: 22.4px 37.6px; } .keyfob .icon-slider li.steer-windows { background-image: url("../img/common/steer-windows.svg"); background-size: 31.2px 42.4px; } .keyfob .icon-slider li.steer-security { background-image: url("../img/common/steer-security.svg"); background-size: 23.2px 36.8px; } .keyfob .icon-slider li.steer-temperature { background-image: url("../img/common/steer-temperature.svg"); background-size: 16.8px 42.4px; } @media (max-width: 543px) { .keyfob #section15 .content h2, .keyfob #section15 .content p { padding-right: 1rem; } } @media (min-width: 544px) { .keyfob #section9 { background-size: auto 430px; background-position: 50% 140px; } .keyfob #section9 .col-2 { padding-top: 200px; } .keyfob #section12 .bg { height: 330px; width: 100%; } .keyfob #section12 .content { padding-bottom: 2.4rem; } .keyfob #section12 .content ul { width: 80%; margin: 0 auto; } .keyfob #ip54 .bg { height: 590px; } .keyfob .icon-slider li.steer-projector { background-size: 46px 25px; } .keyfob .icon-slider li.steer-gamepad { background-size: 42px 32px; } .keyfob .icon-slider li.steer-video { background-size: 42px 42px; } .keyfob .icon-slider li.steer-lights { background-size: 32px 50px; } .keyfob .icon-slider li.steer-music { background-size: 41px 46px; } .keyfob .icon-slider li.steer-fan { background-size: 35px 48px; } .keyfob .icon-slider li.steer-bulb { background-size: 28px 47px; } .keyfob .icon-slider li.steer-windows { background-size: 39px 53px; } .keyfob .icon-slider li.steer-security { background-size: 29px 46px; } .keyfob .icon-slider li.steer-temperature { background-size: 21px 53px; } } @media (min-width: 768px) { .keyfob #section1 { height: 660px; } .keyfob #section1 .bg { height: 660px; } .keyfob #section1 .content { padding-top: 10rem; } .keyfob #section1 a { width: 45px; height: 40px; bottom: 60px; } .keyfob #section7 .content p { width: 60%; margin-left: auto; margin-right: auto; } .keyfob #section7 .col-1 img { margin-top: 5rem; } .keyfob #section8 .content { padding-bottom: 3rem; } .keyfob #section8 .content h2 { margin-bottom: 2.4rem; } .keyfob #section8 .col-1 { border-bottom: none; border-right: 1px solid #e5e5e5; margin-bottom: 0; } .keyfob #section8 .col-1 img { max-width: 273px; margin-bottom: 3rem; } .keyfob #section8 .col-2 img { max-width: 308px; margin-bottom: 3rem; } .keyfob #section9 { background-size: auto 490px; } .keyfob #section9 .content { padding-top: 32rem; text-align: left; } .keyfob #section9 .col-1 { text-align: left; } .keyfob #section9 .col-1 img { margin: 0 auto; display: block; } .keyfob #section9 .col-2 { padding-top: 0; } .keyfob #section9 .col-2 img { position: absolute; width: auto; left: -16rem; top: -6rem; } .keyfob #section11 { width: 100%; height: 0; padding-bottom: 90%; } .keyfob #section11 .content { width: 100%; position: absolute; z-index: 1; color: #fff; } .keyfob #section11 .content p { padding: 0 12rem; } .keyfob #section11 .lights { position: absolute; z-index: 0; width: 100%; height: 100%; top: 0; } .keyfob #section11 .lights .lamp { position: absolute; width: 100%; height: 100%; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; display: none; } .keyfob #section11 .lights .remote { position: absolute; z-index: 1; bottom: 110px; left: 70%; -webkit-transform: scale(0.65); transform: scale(0.65); } .keyfob #section11 .lights .remote p { color: #fff; width: 220px; text-align: center; font-size: 2rem; margin: 0 auto; padding-bottom: 2.4rem; } .keyfob #section11 .lights .remote p span { display: inline-block; width: 35px; height: 35px; text-indent: -10000em; vertical-align: middle; background-repeat: no-repeat; background-position: center center; } .keyfob #section11 .lights .remote div { position: relative; width: 267px; height: 310px; } .keyfob #section11 .lights .remote a { position: absolute; display: block; width: 60px; height: 45px; top: 45px; } .keyfob #section11 .lights .remote .x { left: 50px; } .keyfob #section11 .lights .remote .triangle { left: 150px; } .keyfob #section12 .content ul { width: 70%; margin: 0 auto; } .keyfob #section12 .content li { height: 50px; } .keyfob #section12 .content p { padding-left: 8rem; padding-right: 8rem; } .keyfob #section15 .bg { background-position: 50% 50%; } .keyfob #section17 .content p { padding-left: 7rem; padding-right: 7rem; } .keyfob #section18 .features li { width: 25%; padding-top: 10rem; } .keyfob #section18 .features li.battery { background-size: 70px 70px; background-position: 50% 20px; } .keyfob #section18 .features li.wireless { background-size: 70px 60px; background-position: 50% 20px; } .keyfob #section18 .features li.activation { background-size: 55px 55px; background-position: 50% 25px; } .keyfob #section18 .features li.actions { background-size: 70px 70px; background-position: 50% 20px; } .keyfob #section19 .content img { max-width: 740px; } .keyfob #ip54 .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .keyfob #ip54 .bg { height: 0; padding-bottom: 37.5%; } .keyfob .icon-slider { max-width: 570px; margin: 2rem auto 4rem; } } @media (min-width: 992px) { .keyfob #section1 { height: 730px; } .keyfob #section1 .bg { height: 730px; } .keyfob #section1 .content { padding-top: 12rem; } .keyfob #section1 a { bottom: 100px; } .keyfob #section3 .col-1 img { width: 80%; margin-bottom: 4rem; margin-top: 2rem; } .keyfob #section7 .col-1 img { margin-top: 3rem; } .keyfob #section8 .col-1 p, .keyfob #section8 .col-2 p { max-width: 400px; margin-right: auto; margin-left: auto; } .keyfob #section9 { background-size: auto 540px; } .keyfob #section9 .content { padding-top: 35rem; } .keyfob #section11 { height: 790px; padding: 0; } .keyfob #section11 .content p { padding: 0 10rem; } .keyfob #section11 .lights .remote { -webkit-transform: scale(0.75); transform: scale(0.75); } .keyfob #section12 .content { position: absolute; z-index: 10; text-align: left; } .keyfob #section12 .content p { padding-right: 12rem; padding-left: 0; padding-bottom: 2em; } .keyfob #section12 .content ul { margin: 0; } .keyfob #section12 .content li { width: 100%; } .keyfob #section12 .content li:before { width: 60px; height: 60px; background-size: 32px 32px; } .keyfob #section12 .content li.square.white:before { background-image: url("../img/common/button-01-white.svg"); } .keyfob #section12 .content li.circle.white:before { background-image: url("../img/common/button-02-white.svg"); } .keyfob #section12 .content li.cross.white:before { background-image: url("../img/common/button-03-white.svg"); } .keyfob #section12 .content li.triangle.white:before { background-image: url("../img/common/button-04-white.svg"); } .keyfob #section12 .content li.minus.white:before { background-image: url("../img/common/button-05-white.svg"); } .keyfob #section12 .content li.plus.white:before { background-image: url("../img/common/button-06-white.svg"); } .keyfob #section12 .bg { height: 0; padding-bottom: 57%; } .keyfob #section12 .slide2 .content { color: #fff; } .keyfob #section14 .content { position: absolute; color: #fff; } .keyfob #section18 { margin-bottom: -5.4rem; } } @media (min-width: 1200px) { .keyfob #section1 { height: auto; } .keyfob #section1 .bg { height: 0; padding-bottom: 52%; } .keyfob #section1 .content { padding-top: 10rem; } .keyfob #section1 .content h1 { letter-spacing: 30px; margin-right: -30px; } .keyfob #section1 .content p { font-size: 2.4rem; letter-spacing: 1px; } .keyfob #section1 .content hr { margin-top: 1.6rem; color: transparent; border-bottom: 1px solid #444444; display: inline-block; width: 160px; } .keyfob #section1 a { bottom: 130px; } .keyfob #section3 .col-1 img { width: 70%; margin-bottom: 6rem; margin-top: 3rem; } .keyfob #section5 video { margin-bottom: 55px; } .keyfob #section7 .content p { width: 50%; margin-left: auto; margin-right: auto; } .keyfob #section7 .col-1 { padding-top: 2rem; } .keyfob #section7 .col-1 img { margin-top: 5rem; width: 120%; float: right; } .keyfob #section7 .col-2 { padding-top: 2rem; } .keyfob #section7 .col-2 img { max-width: 480px; } .keyfob #section8 .col-1 p, .keyfob #section8 .col-2 p { max-width: 440px; margin-right: auto; margin-left: auto; } .keyfob #section8 .col-1 img { max-width: 390px; } .keyfob #section8 .col-2 img { max-width: 440px; } .keyfob #section9 { background-size: auto auto; } .keyfob #section9 .content { padding-top: 52rem; } .keyfob #section11 { padding-bottom: 0; height: 1010px; } .keyfob #section11 .lights .remote { bottom: 180px; -webkit-transform: scale(0.9); transform: scale(0.9); } .keyfob #section12 .content li { height: 70px; font-size: 120%; } .keyfob #section12 .content li:before { width: 70px; height: 70px; background-size: 36px 36px; } .keyfob #section18 .features { margin-top: 4rem; } .keyfob #section18 .features li { width: 50%; } .keyfob #section18 .col-2 img { margin-top: 2rem; } .keyfob #section19 .content img { max-width: 860px; } } @media (min-width: 1600px) { .keyfob #section5 video { margin-top: 85px; } .keyfob #section7 .content { padding-bottom: 0; } .keyfob #section7 .content p { width: 70%; padding-bottom: 4.8rem; } .keyfob #section7 .col-1 img { margin-top: 2rem; } .keyfob #section8 .col-1 p, .keyfob #section8 .col-2 p { max-width: 480px; } .keyfob #section11 { padding-bottom: 0; height: 1280px; } .keyfob #section11 .lights .remote { bottom: 290px; -webkit-transform: scale(1); transform: scale(1); } .keyfob #section12 .content li { height: 90px; font-size: 130%; } .keyfob #section12 .content li:before { width: 90px; height: 70px; background-size: 48px 48px; } .keyfob #section14 .bg { padding: 0; height: 960px; } .keyfob #section16 .bg { padding: 0; height: 893px; } .keyfob #section18 .features li { width: 50%; } .keyfob #section18 .features li.battery span, .keyfob #section18 .features li.wireless span { width: 180px; } } @media (min-width: 2100px) { .keyfob #section1 .content p { font-size: 3rem; letter-spacing: 1.5px; } .keyfob #section7 .col-1 img { width: 100%; } .keyfob #section11 { padding-bottom: 0; height: 1490px; } .keyfob #section11 .lights .remote { bottom: 350px; } .keyfob #section12 .content li { height: 110px; font-size: 140%; } .keyfob #section12 .content li:before { width: 100px; height: 90px; background-size: 60px 60px; } .keyfob #section18 .features { margin-top: 6rem; } } .dws .rings, .door-window-sensor .rings { position: absolute; height: 100%; width: 300px; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .dws .rings .ring, .door-window-sensor .rings .ring { position: absolute; -webkit-transform: scale(0.35); transform: scale(0.35); } .dws .section-scroll-colors, .door-window-sensor .section-scroll-colors { background: #eaeaea; background: linear-gradient(to bottom, #eaeaea 0%, #ffffff 33.33%, #ffffff 66.66%, #eaeaea 100%); overflow: hidden; height: 260px; position: relative; } .dws .section-scroll-colors .content, .door-window-sensor .section-scroll-colors .content { width: 100%; position: absolute; z-index: 10; } .dws .section-scroll-colors .content h2, .door-window-sensor .section-scroll-colors .content h2 { display: inline-block; height: 10rem; } .dws .section-scroll-colors .content h2 span, .door-window-sensor .section-scroll-colors .content h2 span { color: #0090FF; font-size: 15rem; margin-left: -4rem; margin-right: -2rem; vertical-align: middle; } .dws .section-scroll-colors .colors, .door-window-sensor .section-scroll-colors .colors { width: 100%; height: 100%; position: absolute; } .dws .section-scroll-colors .bg, .door-window-sensor .section-scroll-colors .bg { background-repeat: no-repeat; background-position: 50% 50%; background-size: auto 170px; position: absolute; top: 0; } .dws #section1, .door-window-sensor #section1 { height: 380px; background: #f3f3f3; background: radial-gradient(ellipse at center, #ffffff 0%, #f3f3f3 63%, #cbcbcd 100%); } .dws #section1 .content, .door-window-sensor #section1 .content { padding-top: 4rem; } .dws #section1 .content h1, .door-window-sensor #section1 .content h1 { display: inline-block; } .dws #section1 .anim, .door-window-sensor #section1 .anim { width: 1000px; height: 1000px; position: absolute; top: 57%; left: 50%; -webkit-transform: translate(-50%, -47.5%) scale(0.3); transform: translate(-50%, -47.5%) scale(0.3); } .dws #section1 .anim div, .door-window-sensor #section1 .anim div { position: absolute; background-repeat: no-repeat; background-size: 100%; opacity: 0; } .dws #section1 .anim-big, .door-window-sensor #section1 .anim-big { width: 523px; height: 584px; left: 17px; top: 300px; } .dws #section1 .anim-small, .door-window-sensor #section1 .anim-small { width: 321px; height: 335px; left: 656px; top: 445px; } .dws #section1 .anim-diode, .door-window-sensor #section1 .anim-diode { left: 277px; top: 93px; width: 90px; height: 90px; } .dws #section4 .content .col-1 img, .door-window-sensor #section4 .content .col-1 img { max-width: 290px; } .dws #section4 .content ul, .door-window-sensor #section4 .content ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 3rem; } .dws #section4 .content li, .door-window-sensor #section4 .content li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; background-repeat: no-repeat; padding-top: 70px; margin-bottom: 2rem; width: 50%; } .dws #section4 .content li span, .door-window-sensor #section4 .content li span { display: inline-block; } .dws #section4 .content li.reed, .door-window-sensor #section4 .content li.reed { background-image: url("../img/common/4func-door.svg"); background-size: 50px 50px; background-position: 50% 10px; } .dws #section4 .content li.antifraud, .door-window-sensor #section4 .content li.antifraud { background-image: url("../img/common/4func-lock.svg"); background-size: 50px 50px; background-position: 50% 10px; } .dws #section4 .content li.temp, .door-window-sensor #section4 .content li.temp { background-image: url("../img/common/4func-temp.svg"); background-size: 50px 50px; background-position: 50% 15px; } .dws #section4 .content li.alarm, .door-window-sensor #section4 .content li.alarm { background-image: url("../img/common/4func-alarm.svg"); background-size: 50px 50px; background-position: 50% 10px; } .dws #section6, .door-window-sensor #section6 { background-color: #e7e5e6; } .dws #section6 .content, .door-window-sensor #section6 .content { padding-bottom: 0; } .dws #section6 ul, .door-window-sensor #section6 ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 63%; position: relative; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .dws #section6 li, .door-window-sensor #section6 li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; text-align: left; margin-bottom: 2rem; color: #0090ff; width: 100%; } .dws #section6 li:before, .door-window-sensor #section6 li:before { content: ""; display: block; width: 50px; height: 50px; border: 1px solid #0090ff; border-radius: 50%; background-repeat: no-repeat; float: left; margin-right: 12px; } .dws #section6 li span, .door-window-sensor #section6 li span { display: block; text-transform: uppercase; line-height: 1; } .dws #section6 li span:nth-child(1), .door-window-sensor #section6 li span:nth-child(1) { font-size: 1.2rem; margin-top: 7px; } .dws #section6 li span:nth-child(2), .door-window-sensor #section6 li span:nth-child(2) { font-size: 2.4rem; } .dws #section6 li.temp:before, .door-window-sensor #section6 li.temp:before { background-image: url("../img/common/4func-temp.svg"); background-size: 36px 36px; background-position: 50% 50%; } .dws #section6 li.door:before, .door-window-sensor #section6 li.door:before { background-image: url("../img/common/small-door.svg"); background-size: 30px 30px; background-position: 50% 50%; } .dws #section7 ul, .door-window-sensor #section7 ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 3rem; } .dws #section7 li, .door-window-sensor #section7 li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; background-repeat: no-repeat; padding-top: 70px; margin-bottom: 2rem; width: 50%; } .dws #section7 li span, .door-window-sensor #section7 li span { display: inline-block; width: 90px; } .dws #section7 li.roof, .door-window-sensor #section7 li.roof { background-image: url("../img/common/apps-roof-window.svg"); background-size: 50px 50px; background-position: 50% 10px; } .dws #section7 li.entrance, .door-window-sensor #section7 li.entrance { background-image: url("../img/common/apps-entrance-door.svg"); background-size: 50px 50px; background-position: 50% 10px; } .dws #section7 li.garage, .door-window-sensor #section7 li.garage { background-image: url("../img/common/apps-garage-door.svg"); background-size: 70px 50px; background-position: 50% 10px; } .dws #section7 li.window, .door-window-sensor #section7 li.window { background-image: url("../img/common/apps-window.svg"); background-size: 50px 50px; background-position: 50% 10px; } .dws #section7 li.gate, .door-window-sensor #section7 li.gate { background-image: url("../img/common/apps-gate.svg"); background-size: 76px 50px; background-position: 50% 10px; } .dws #section7 li.door, .door-window-sensor #section7 li.door { background-image: url("../img/common/apps-door.svg"); background-size: 50px 50px; background-position: 50% 10px; } .dws #section7 li.sliding, .door-window-sensor #section7 li.sliding { background-image: url("../img/common/apps-sliding-gate.svg"); background-size: 80px 50px; background-position: 50% 10px; } .dws #section7 li.safety, .door-window-sensor #section7 li.safety { background-image: url("../img/common/apps-safety-gate.svg"); background-size: 50px 50px; background-position: 50% 10px; } .dws .section-homekit-enabled .content, .door-window-sensor .section-homekit-enabled .content { text-align: left; } .dws .section-homekit-enabled .content p, .door-window-sensor .section-homekit-enabled .content p { width: 180px; } .dws .section-homekit-enabled .bg, .door-window-sensor .section-homekit-enabled .bg { padding-bottom: 0; height: 500px; } .dws .section-siri, .door-window-sensor .section-siri { background-image: url("../img/products/dws/siri-mobile.jpg"); } .dws #section10 .bg, .door-window-sensor #section10 .bg { height: 420px; } .dws #section11 .content, .door-window-sensor #section11 .content { background-color: #e1e1e1; position: relative; } .dws #section11 .bg, .door-window-sensor #section11 .bg { height: 290px; padding: 0; } .dws #section11 .rings .blue, .door-window-sensor #section11 .rings .blue { top: 71px; left: 97px; } .dws #section11 .rings .red, .door-window-sensor #section11 .rings .red { top: 120px; left: -25px; } .dws #section11 .rings .blue.icon, .door-window-sensor #section11 .rings .blue.icon { top: -30px; left: 185px; } .dws #section12 .content, .door-window-sensor #section12 .content { position: relative; } .dws #section12 .bg, .door-window-sensor #section12 .bg { height: 220px; padding-bottom: 0; } .dws #section12 .rings .white, .door-window-sensor #section12 .rings .white { -webkit-transform: scale(0.65); transform: scale(0.65); top: -39px; left: -53px; } .dws #section13 .content, .door-window-sensor #section13 .content { background-color: #eaeaea; position: relative; } .dws #section13 .bg, .door-window-sensor #section13 .bg { padding-bottom: 0; height: 600px; } .dws #section13 .rings .white, .door-window-sensor #section13 .rings .white { -webkit-transform: scale(0.65); transform: scale(0.65); top: 470px; left: 54px; } .dws #section14 .content, .door-window-sensor #section14 .content { background-color: #eaeaea; position: relative; } .dws #section14 .bg, .door-window-sensor #section14 .bg { padding-bottom: 0; height: 600px; } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { -webkit-transform: scale(0.65); transform: scale(0.65); top: 372px; left: 35px; } .dws #section15 .content, .door-window-sensor #section15 .content { background-color: #eaeaea; position: relative; } .dws #section15 .bg, .door-window-sensor #section15 .bg { height: 600px; } .dws #section16 .bg, .door-window-sensor #section16 .bg { height: 380px; } .dws #section18 .content, .door-window-sensor #section18 .content { background-color: #463c2d; position: relative; } .dws #section18 .bg, .door-window-sensor #section18 .bg { height: 380px; } .dws #section19 .bg, .door-window-sensor #section19 .bg { height: 480px; } .dws #section19 .rings .red, .door-window-sensor #section19 .rings .red { -webkit-transform: scale(0.65); transform: scale(0.65); top: 187px; left: -22px; } .dws #section20, .door-window-sensor #section20 { overflow: hidden; } .dws #section20 .content, .door-window-sensor #section20 .content { background-color: #dfc08c; position: relative; } .dws #section20 .bg, .door-window-sensor #section20 .bg { height: 380px; padding: 0; } .dws #section20 .rings .white, .door-window-sensor #section20 .rings .white { -webkit-transform: scale(0.65); transform: scale(0.65); left: 207px; top: -53px; } .dws #section20 .rings .blue, .door-window-sensor #section20 .rings .blue { left: -20px; top: 0; } .dws #section21, .door-window-sensor #section21 { background: #cbcbcd; background: linear-gradient(to top right, #cbcbcd 0%, #f3f3f3 100%); } .dws #section21 .content, .door-window-sensor #section21 .content { position: relative; } .dws #section21 ul, .door-window-sensor #section21 ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 210px; position: relative; -webkit-transform: translateX(-50%); transform: translateX(-50%); left: 50%; } .dws #section21 li, .door-window-sensor #section21 li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; text-align: left; margin-bottom: 2rem; color: #0090ff; } .dws #section21 li:before, .door-window-sensor #section21 li:before { content: ""; display: block; width: 50px; height: 50px; border: 1px solid #0090ff; border-radius: 50%; background-repeat: no-repeat; float: left; margin-right: 12px; } .dws #section21 li span, .door-window-sensor #section21 li span { display: block; text-transform: uppercase; line-height: 1; } .dws #section21 li span:nth-child(1), .door-window-sensor #section21 li span:nth-child(1) { font-size: 1.2rem; margin-top: 5px; } .dws #section21 li span:nth-child(2), .door-window-sensor #section21 li span:nth-child(2) { font-size: 2.8rem; } .dws #section21 li.safety, .door-window-sensor #section21 li.safety { width: 55%; } .dws #section21 li.safety:before, .door-window-sensor #section21 li.safety:before { background-image: url("../img/common/apps-safety-gate.svg"); background-size: 30px 30px; background-position: 50% 50%; } .dws #section21 .bg, .door-window-sensor #section21 .bg { height: 260px; } .dws .section-product-footer, .door-window-sensor .section-product-footer { background-color: #fff; } @media (max-width: 767px) { .dws .section-scroll-colors .bg.top, .dws .section-scroll-colors .bg.bottom, .door-window-sensor .section-scroll-colors .bg.top, .door-window-sensor .section-scroll-colors .bg.bottom { top: 110px; } } @media (min-width: 544px) { .dws .rings, .door-window-sensor .rings { width: 420px; } .dws #section1 .content, .door-window-sensor #section1 .content { padding-top: 5rem; } .dws #section1 .content h1, .door-window-sensor #section1 .content h1 { width: 340px; } .dws #section6 ul, .door-window-sensor #section6 ul { width: 100%; max-width: 460px; margin: 0 auto; } .dws #section6 li:before, .door-window-sensor #section6 li:before { width: 70px; height: 70px; margin-right: 15px; } .dws #section6 li.temp, .door-window-sensor #section6 li.temp { width: 55%; } .dws #section6 li.temp:before, .door-window-sensor #section6 li.temp:before { background-size: 46px 46px; } .dws #section6 li.door, .door-window-sensor #section6 li.door { width: 45%; } .dws #section6 li.door:before, .door-window-sensor #section6 li.door:before { background-size: 40px 40px; } .dws #section6 li span:nth-child(1), .door-window-sensor #section6 li span:nth-child(1) { margin-top: 15px; } .dws #section10 .bg, .door-window-sensor #section10 .bg { height: 410px; } .dws #section11 .bg, .door-window-sensor #section11 .bg { height: 380px; } .dws #section11 .rings .ring, .door-window-sensor #section11 .rings .ring { -webkit-transform: scale(0.4); transform: scale(0.4); } .dws #section11 .rings .blue, .door-window-sensor #section11 .rings .blue { top: 117px; left: 163px; } .dws #section11 .rings .blue.plain, .door-window-sensor #section11 .rings .blue.plain { -webkit-transform: scale(0.5); transform: scale(0.5); } .dws #section11 .rings .red, .door-window-sensor #section11 .rings .red { top: 190px; left: 5px; } .dws #section11 .rings .blue.icon, .door-window-sensor #section11 .rings .blue.icon { top: -10px; left: 285px; } .dws #section12 .bg, .door-window-sensor #section12 .bg { height: 360px; } .dws #section12 .rings .white, .door-window-sensor #section12 .rings .white { -webkit-transform: scale(0.8); transform: scale(0.8); top: -13px; left: -74px; } .dws #section13 .rings .white, .door-window-sensor #section13 .rings .white { -webkit-transform: scale(0.8); transform: scale(0.8); top: 660px; left: 105px; } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { -webkit-transform: scale(0.8); transform: scale(0.8); top: 527px; left: 82px; } .dws #section13 .bg, .dws #section14 .bg, .dws #section15 .bg, .door-window-sensor #section13 .bg, .door-window-sensor #section14 .bg, .door-window-sensor #section15 .bg { height: 810px; } .dws #section18 .bg, .door-window-sensor #section18 .bg { height: 460px; } .dws #section19 .bg, .door-window-sensor #section19 .bg { height: 520px; } .dws #section19 .rings .red, .door-window-sensor #section19 .rings .red { -webkit-transform: scale(0.8); transform: scale(0.8); top: 209px; left: 29px; } .dws #section20 .bg, .door-window-sensor #section20 .bg { height: 460px; } .dws #section20 .rings .ring, .door-window-sensor #section20 .rings .ring { -webkit-transform: scale(0.4); transform: scale(0.4); } .dws #section20 .rings .white, .door-window-sensor #section20 .rings .white { -webkit-transform: scale(0.8); transform: scale(0.8); top: -50px; left: 295px; } .dws #section20 .rings .blue, .door-window-sensor #section20 .rings .blue { top: 29px; left: 25px; } .dws #section21 .bg, .door-window-sensor #section21 .bg { height: 390px; } .dws #section21 li:before, .door-window-sensor #section21 li:before { width: 70px; height: 70px; margin-right: 15px; } .dws #section21 li.safety:before, .door-window-sensor #section21 li.safety:before { background-size: 40px 40px; } .dws #section21 li span:nth-child(1), .door-window-sensor #section21 li span:nth-child(1) { margin-top: 15px; } } @media (max-width: 991px) { .dws .section-packshot-slider .slide2 .col-2 img, .door-window-sensor .section-packshot-slider .slide2 .col-2 img { margin-top: -90px; } } @media (min-width: 768px) { .dws .section-scroll-colors, .door-window-sensor .section-scroll-colors { height: 600px; } .dws .section-scroll-colors .content, .door-window-sensor .section-scroll-colors .content { top: 50%; -webkit-transform: translateY(-90%); transform: translateY(-90%); } .dws .section-scroll-colors .bg, .door-window-sensor .section-scroll-colors .bg { background-size: cover; } .dws .rings, .door-window-sensor .rings { width: 600px; } .dws #section1, .door-window-sensor #section1 { height: 660px; } .dws #section1 .anim, .door-window-sensor #section1 .anim { top: 50%; -webkit-transform: translate(-50%, -50%) scale(0.6); transform: translate(-50%, -50%) scale(0.6); } .dws #section1 .content h1, .door-window-sensor #section1 .content h1 { width: auto; } .dws .section-product-sizing .content .col-1 img, .door-window-sensor .section-product-sizing .content .col-1 img { margin-top: 10.2rem; } .dws #section4 .content ul li, .door-window-sensor #section4 .content ul li { width: 25%; } .dws #section4 .content ul li span, .door-window-sensor #section4 .content ul li span { width: 80%; } .dws #section6 ul, .door-window-sensor #section6 ul { left: 0; -webkit-transform: none; transform: none; } .dws #section7 li, .door-window-sensor #section7 li { width: 33.33%; } .dws #section8 .content p, .door-window-sensor #section8 .content p { width: 320px; } .dws #section10 .bg, .door-window-sensor #section10 .bg { padding: 0; height: 480px; } .dws #section11 .bg, .door-window-sensor #section11 .bg { height: 520px; } .dws #section11 .rings .ring, .door-window-sensor #section11 .rings .ring { -webkit-transform: scale(0.5); transform: scale(0.5); } .dws #section11 .rings .blue, .door-window-sensor #section11 .rings .blue { top: 185px; left: 278px; } .dws #section11 .rings .blue.plain, .door-window-sensor #section11 .rings .blue.plain { -webkit-transform: scale(0.6); transform: scale(0.6); } .dws #section11 .rings .red, .door-window-sensor #section11 .rings .red { top: 290px; left: 65px; } .dws #section11 .rings .blue.icon, .door-window-sensor #section11 .rings .blue.icon { top: 20px; left: 455px; } .dws #section12 .bg, .door-window-sensor #section12 .bg { height: 440px; } .dws #section12 .rings .white, .door-window-sensor #section12 .rings .white { -webkit-transform: scale(0.9); transform: scale(0.9); top: -1px; left: -31px; } .dws #section13, .door-window-sensor #section13 { background-color: #eaeaea; } .dws #section13 .content, .door-window-sensor #section13 .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; } .dws #section13 .content .col-phoneS-10, .door-window-sensor #section13 .content .col-phoneS-10 { height: 416px; } .dws #section13 .content img, .door-window-sensor #section13 .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; } .dws #section13 .bg, .door-window-sensor #section13 .bg { position: relative; height: 440px; width: 57%; left: 43%; background-size: auto 440px; background-position: -15px 0; } .dws #section13 .rings, .door-window-sensor #section13 .rings { width: 480px; left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .dws #section13 .rings .white, .door-window-sensor #section13 .rings .white { -webkit-transform: scale(0.9); transform: scale(0.9); top: 290px; left: 210px; } .dws #section14 .content, .door-window-sensor #section14 .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; } .dws #section14 .content .col-phoneS-10, .door-window-sensor #section14 .content .col-phoneS-10 { height: 416px; } .dws #section14 .content img, .door-window-sensor #section14 .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-40%); transform: translateX(-40%); } .dws #section14 .bg, .door-window-sensor #section14 .bg { height: 440px; background-position: -240px 0; } .dws #section14 .rings, .door-window-sensor #section14 .rings { width: 480px; left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { -webkit-transform: scale(0.9); transform: scale(0.9); top: 159px; left: 72px; } .dws #section15 .content, .door-window-sensor #section15 .content { position: absolute; background-color: transparent; } .dws #section15 .bg, .door-window-sensor #section15 .bg { height: 460px; background-position: 0 100%; } .dws #section16 .bg, .door-window-sensor #section16 .bg { height: 520px; } .dws #section18 .content, .door-window-sensor #section18 .content { background-color: transparent; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left; } .dws #section19 .content, .door-window-sensor #section19 .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left; } .dws #section19 .rings .red, .door-window-sensor #section19 .rings .red { -webkit-transform: scale(0.9); transform: scale(0.9); top: 39px; left: 340px; } .dws #section20 .bg, .door-window-sensor #section20 .bg { height: 500px; } .dws #section20 .rings .ring, .door-window-sensor #section20 .rings .ring { -webkit-transform: scale(0.5); transform: scale(0.5); } .dws #section20 .rings .white, .door-window-sensor #section20 .rings .white { -webkit-transform: scale(0.9); transform: scale(0.9); top: -48px; left: 496px; } .dws #section20 .rings .blue, .door-window-sensor #section20 .rings .blue { top: 19px; left: 205px; } .dws #section21, .door-window-sensor #section21 { background: linear-gradient(to top right, #cbcbcd 0%, #f3f3f3 50%); } .dws #section21 .content, .door-window-sensor #section21 .content { position: absolute; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .dws #section21 .bg, .door-window-sensor #section21 .bg { position: relative; height: 440px; width: 55%; left: 45%; background-size: auto 440px; background-position: -310px 0; } .dws #section21 ul, .door-window-sensor #section21 ul { width: auto; position: relative; -webkit-transform: translateX(0); transform: translateX(0); left: 0; } } @media screen and (min-width: 970px) { .dws #section14 .bg, .door-window-sensor #section14 .bg { background-position: -200px 0; } .dws #section14 .rings, .door-window-sensor #section14 .rings { left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { -webkit-transform: scale(0.9); transform: scale(0.9); top: 159px; left: 112px; } } @media (min-width: 992px) { .dws .rings, .door-window-sensor .rings { width: 850px; } .dws #section1, .door-window-sensor #section1 { height: 730px; } .dws #section1 .anim, .door-window-sensor #section1 .anim { -webkit-transform: translate(-50%, -50%) scale(0.75); transform: translate(-50%, -50%) scale(0.75); } .dws #section6 .content, .door-window-sensor #section6 .content { position: absolute; } .dws #section6 ul, .door-window-sensor #section6 ul { position: absolute; left: 66%; top: 120px; } .dws #section6 li.temp, .dws #section6 li.door, .door-window-sensor #section6 li.temp, .door-window-sensor #section6 li.door { width: 100%; } .dws #section6 img, .door-window-sensor #section6 img { height: 340px; margin-top: 10rem; } .dws #section10 .bg, .door-window-sensor #section10 .bg { height: 580px; } .dws #section11 .content, .door-window-sensor #section11 .content { background-color: transparent; position: absolute; } .dws #section11 .content p, .door-window-sensor #section11 .content p { width: 600px; margin-left: auto; margin-right: auto; } .dws #section11 .bg, .door-window-sensor #section11 .bg { height: 820px; } .dws #section11 .rings .ring, .door-window-sensor #section11 .rings .ring { -webkit-transform: scale(0.6); transform: scale(0.6); } .dws #section11 .rings .blue, .door-window-sensor #section11 .rings .blue { top: 335px; left: 433px; } .dws #section11 .rings .blue.plain, .door-window-sensor #section11 .rings .blue.plain { -webkit-transform: scale(0.7); transform: scale(0.7); } .dws #section11 .rings .red, .door-window-sensor #section11 .rings .red { top: 520px; left: 115px; } .dws #section11 .rings .blue.icon, .door-window-sensor #section11 .rings .blue.icon { top: 90px; left: 730px; } .dws #section12 .content, .door-window-sensor #section12 .content { position: absolute; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .dws #section12 .bg, .door-window-sensor #section12 .bg { height: 450px; background-size: auto 450px; } .dws #section12 .rings .white, .door-window-sensor #section12 .rings .white { -webkit-transform: scale(1.2); transform: scale(1.2); top: 2px; left: 324px; } .dws #section13 .content .col-phoneS-10, .door-window-sensor #section13 .content .col-phoneS-10 { height: 485px; } .dws #section13 .content img, .door-window-sensor #section13 .content img { width: 280px; } .dws #section13 .bg, .door-window-sensor #section13 .bg { height: 520px; width: 55%; left: 45%; background-size: cover; background-position: 0 0; } .dws #section13 .rings .white, .door-window-sensor #section13 .rings .white { -webkit-transform: scale(1); transform: scale(1); top: 350px; left: 275px; } .dws #section14 .content .col-phoneS-10, .door-window-sensor #section14 .content .col-phoneS-10 { height: 485px; } .dws #section14 .content img, .door-window-sensor #section14 .content img { width: 280px; } .dws #section14 .bg, .door-window-sensor #section14 .bg { height: 520px; background-position: -260px 0; } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { -webkit-transform: scale(1); transform: scale(1); top: 200px; left: 123px; } .dws #section19 .bg, .door-window-sensor #section19 .bg { padding-bottom: 0; height: 590px; } .dws #section19 .rings .red, .door-window-sensor #section19 .rings .red { -webkit-transform: scale(1); transform: scale(1); top: 54px; left: 483px; } .dws #section20 .content, .door-window-sensor #section20 .content { background-color: transparent; position: absolute; } .dws #section20 .bg, .door-window-sensor #section20 .bg { height: 760px; } .dws #section20 .rings .ring, .door-window-sensor #section20 .rings .ring { -webkit-transform: scale(0.6); transform: scale(0.6); } .dws #section20 .rings .white, .door-window-sensor #section20 .rings .white { -webkit-transform: scale(1); transform: scale(1); top: -32px; left: 764px; } .dws #section20 .rings .blue, .door-window-sensor #section20 .rings .blue { top: 105px; left: 330px; } .dws #section21 .content, .door-window-sensor #section21 .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .dws #section21 .bg, .door-window-sensor #section21 .bg { position: relative; height: 460px; padding-bottom: 0; width: 100%; left: 0; background-size: cover; background-position: -160px 0; } } @media screen and (min-width: 1140px) { .dws #section13 .bg, .door-window-sensor #section13 .bg { width: 53%; left: 47%; } .dws #section14 .bg, .door-window-sensor #section14 .bg { background-position: -215px 0; } .dws #section21 .bg, .door-window-sensor #section21 .bg { background-position: -100px 0; } } @media (min-width: 1200px) { .dws #section1, .door-window-sensor #section1 { height: auto; } .dws #section1 .content h1, .door-window-sensor #section1 .content h1 { margin-top: 2rem; } .dws #section1 .anim, .door-window-sensor #section1 .anim { top: 53%; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .dws #section1 .bg, .door-window-sensor #section1 .bg { padding-bottom: 0; height: 850px; } .dws .section-product-sizing .content .col-1 img, .door-window-sensor .section-product-sizing .content .col-1 img { margin-top: 12rem; } .dws #section4 .content ul, .door-window-sensor #section4 .content ul { margin-top: 3rem; } .dws #section4 .content .col-1 img, .door-window-sensor #section4 .content .col-1 img { max-width: 450px; } .dws #section6, .door-window-sensor #section6 { background-color: #ececec; overflow: hidden; } .dws #section6 ul, .door-window-sensor #section6 ul { position: relative; left: 0; top: 220px; -webkit-transform: scale(1.2); transform: scale(1.2); } .dws #section6 li.temp, .dws #section6 li.door, .door-window-sensor #section6 li.temp, .door-window-sensor #section6 li.door { width: 50%; } .dws #section6 video, .door-window-sensor #section6 video { display: block; height: 530px; width: auto; } .dws #section7 ul, .door-window-sensor #section7 ul { margin-top: 3rem; } .dws #section7 li, .door-window-sensor #section7 li { width: 16.66%; } .dws #section7 li span, .door-window-sensor #section7 li span { width: auto; } .dws #section8 .content p, .door-window-sensor #section8 .content p { width: 490px; } .dws #section8 .bg, .door-window-sensor #section8 .bg { height: 630px; } .dws #section10 .bg, .door-window-sensor #section10 .bg { padding: 0; height: 780px; } .dws #section11 .bg, .door-window-sensor #section11 .bg { height: 900px; } .dws #section11 .rings, .door-window-sensor #section11 .rings { width: 900px; } .dws #section11 .rings .ring, .door-window-sensor #section11 .rings .ring { position: absolute; -webkit-transform: scale(0.7); transform: scale(0.7); } .dws #section11 .rings .blue, .door-window-sensor #section11 .rings .blue { top: 375px; left: 468px; } .dws #section11 .rings .blue.plain, .door-window-sensor #section11 .rings .blue.plain { -webkit-transform: scale(0.8); transform: scale(0.8); } .dws #section11 .rings .red, .door-window-sensor #section11 .rings .red { top: 580px; left: 110px; } .dws #section11 .rings .blue.icon, .door-window-sensor #section11 .rings .blue.icon { top: 120px; left: 790px; } .dws #section12 .bg, .door-window-sensor #section12 .bg { height: 590px; background-size: auto 594px; } .dws #section12 .rings .white, .door-window-sensor #section12 .rings .white { -webkit-transform: scale(1.5); transform: scale(1.5); top: 25px; left: 316px; } .dws #section13 .content .col-phoneS-10, .door-window-sensor #section13 .content .col-phoneS-10 { height: 615px; } .dws #section13 .content img, .door-window-sensor #section13 .content img { width: 380px; } .dws #section13 .bg, .door-window-sensor #section13 .bg { height: 660px; } .dws #section13 .rings .white, .door-window-sensor #section13 .rings .white { -webkit-transform: scale(1.2); transform: scale(1.2); top: 460px; left: 370px; } .dws #section14 .content .col-phoneS-10, .door-window-sensor #section14 .content .col-phoneS-10 { height: 605px; } .dws #section14 .content img, .door-window-sensor #section14 .content img { width: 380px; transition: all 500ms 75ms; -webkit-transform: translateX(-40%) translateY(75px); transform: translateX(-40%) translateY(75px); } .dws #section14.active .content img, .door-window-sensor #section14.active .content img { -webkit-transform: translateX(-40%) translateY(0); transform: translateX(-40%) translateY(0); } .dws #section14 .bg, .door-window-sensor #section14 .bg { height: 650px; background-position: -300px 0; } .dws #section14 .rings, .door-window-sensor #section14 .rings { width: 800px; } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { -webkit-transform: scale(1.2); transform: scale(1.2); top: 270px; left: 198px; } .dws #section15 .bg, .door-window-sensor #section15 .bg { padding: 0; height: 740px; } .dws #section19 .bg, .door-window-sensor #section19 .bg { height: 740px; } .dws #section19 .rings .red, .door-window-sensor #section19 .rings .red { -webkit-transform: scale(1.2); transform: scale(1.2); top: 86px; left: 515px; } .dws #section20 .bg, .door-window-sensor #section20 .bg { height: 800px; } .dws #section20 .rings .ring, .door-window-sensor #section20 .rings .ring { -webkit-transform: scale(0.7); transform: scale(0.7); } .dws #section20 .rings .white, .door-window-sensor #section20 .rings .white { -webkit-transform: scale(1.2); transform: scale(1.2); top: -32px; left: 786px; } .dws #section20 .rings .blue, .door-window-sensor #section20 .rings .blue { top: 142px; left: 330px; } .dws #section21 .bg, .door-window-sensor #section21 .bg { height: 520px; background-position: 0 0; } .dws #section21 ul, .door-window-sensor #section21 ul { -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scale(1.2); transform: scale(1.2); } } @media screen and (min-width: 1420px) { .dws #section14 .bg, .door-window-sensor #section14 .bg { background-position: -170px 0; } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { left: 328px; } } @media (min-width: 1600px) { .dws .rings, .door-window-sensor .rings { width: 1000px; } .dws .section-product-sizing .content .col-1 img, .door-window-sensor .section-product-sizing .content .col-1 img { margin-top: 13.6rem; } .dws #section1 .content h1, .door-window-sensor #section1 .content h1 { margin-top: 5rem; } .dws #section1 .bg, .door-window-sensor #section1 .bg { height: 980px; } .dws #section6 ul, .door-window-sensor #section6 ul { -webkit-transform: scale(1.5); transform: scale(1.5); } .dws #section6 video, .door-window-sensor #section6 video { height: 580px; } .dws #section8 .content p, .door-window-sensor #section8 .content p { width: 540px; } .dws #section8 .bg, .door-window-sensor #section8 .bg { height: 850px; } .dws #section10 .bg, .door-window-sensor #section10 .bg { height: 1020px; } .dws #section11 .bg, .door-window-sensor #section11 .bg { padding: 0; height: 1285px; } .dws #section11 .rings .ring, .door-window-sensor #section11 .rings .ring { position: absolute; -webkit-transform: scale(0.85); transform: scale(0.85); } .dws #section11 .rings .blue, .door-window-sensor #section11 .rings .blue { top: 567px; left: 505px; } .dws #section11 .rings .blue.plain, .door-window-sensor #section11 .rings .blue.plain { -webkit-transform: scale(0.95); transform: scale(0.95); } .dws #section11 .rings .red, .door-window-sensor #section11 .rings .red { top: 880px; left: -10px; } .dws #section11 .rings .blue.icon, .door-window-sensor #section11 .rings .blue.icon { top: 200px; left: 985px; } .dws #section12 .bg, .door-window-sensor #section12 .bg { height: 780px; background-size: auto 780px; } .dws #section12 .rings .white, .door-window-sensor #section12 .rings .white { -webkit-transform: scale(1.7); transform: scale(1.7); top: 58px; left: 381px; } .dws #section13 .content .col-phoneS-10, .door-window-sensor #section13 .content .col-phoneS-10 { height: 792px; } .dws #section13 .content img, .door-window-sensor #section13 .content img { width: 460px; transition: all 500ms 75ms; -webkit-transform: translateX(-40%) translateY(100px); transform: translateX(-40%) translateY(100px); } .dws #section13 .content h2, .door-window-sensor #section13 .content h2 { margin-top: 6rem; } .dws #section13.active .content img, .door-window-sensor #section13.active .content img { -webkit-transform: translateX(-40%) translateY(0); transform: translateX(-40%) translateY(0); } .dws #section13 .bg, .door-window-sensor #section13 .bg { height: 850px; } .dws #section13 .rings .white, .door-window-sensor #section13 .rings .white { -webkit-transform: scale(1.7); transform: scale(1.7); top: 620px; left: 490px; } .dws #section14 .content .col-phoneS-10, .door-window-sensor #section14 .content .col-phoneS-10 { height: 785px; } .dws #section14 .content img, .door-window-sensor #section14 .content img { width: 460px; transition: all 500ms 75ms; -webkit-transform: translateX(-40%) translateY(100px); transform: translateX(-40%) translateY(100px); } .dws #section14 .bg, .door-window-sensor #section14 .bg { height: 840px; background-position: -420px 0; } .dws #section14 .rings, .door-window-sensor #section14 .rings { width: 1300px; } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { -webkit-transform: scale(1.7); transform: scale(1.7); top: 369px; left: 245px; } .dws #section15 .bg, .door-window-sensor #section15 .bg { height: 900px; } .dws #section16 .bg, .door-window-sensor #section16 .bg { padding: 0; height: 1028px; } .dws #section19 .bg, .door-window-sensor #section19 .bg { height: 920px; } .dws #section19 .rings .red, .door-window-sensor #section19 .rings .red { -webkit-transform: scale(1.7); transform: scale(1.7); top: 126px; left: 630px; } .dws #section20 .bg, .door-window-sensor #section20 .bg { height: 1286px; padding: 0; } .dws #section20 .rings .ring, .door-window-sensor #section20 .rings .ring { -webkit-transform: scale(0.85); transform: scale(0.85); } .dws #section20 .rings .white, .door-window-sensor #section20 .rings .white { -webkit-transform: scale(1.7); transform: scale(1.7); top: -8px; left: 1123px; } .dws #section20 .rings .blue, .door-window-sensor #section20 .rings .blue { top: 250px; left: 410px; } .dws #section21 .bg, .door-window-sensor #section21 .bg { height: 680px; background-position: 0 0; } .dws #section21 ul, .door-window-sensor #section21 ul { -webkit-transform: scale(1.5); transform: scale(1.5); } } @media screen and (min-width: 1860px) { .dws #section14 .bg, .door-window-sensor #section14 .bg { background-position: -250px 0; } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { left: 415px; } } @media (min-width: 2100px) { .dws #section1 .bg, .door-window-sensor #section1 .bg { height: 1080px; } .dws #section6 ul, .door-window-sensor #section6 ul { top: 160px; -webkit-transform: scale(1.5); transform: scale(1.5); } .dws #section8 .bg, .door-window-sensor #section8 .bg { height: 1030px; } .dws #section10 .bg, .door-window-sensor #section10 .bg { height: 1238px; } .dws #section12 .bg, .door-window-sensor #section12 .bg { height: 950px; background-size: auto 957px; } .dws #section12 .rings .white, .door-window-sensor #section12 .rings .white { top: 84px; left: 371px; } .dws #section13 .content .col-phoneS-10, .door-window-sensor #section13 .content .col-phoneS-10 { height: 992px; } .dws #section13 .content img, .door-window-sensor #section13 .content img { width: 580px; transition: all 500ms 75ms; -webkit-transform: translateX(-40%) translateY(125px); transform: translateX(-40%) translateY(125px); } .dws #section13 .content h2, .door-window-sensor #section13 .content h2 { margin-top: 12rem; } .dws #section13 .bg, .door-window-sensor #section13 .bg { height: 1050px; } .dws #section13 .rings .white, .door-window-sensor #section13 .rings .white { top: 780px; left: 620px; } .dws #section14 .content .col-phoneS-10, .door-window-sensor #section14 .content .col-phoneS-10 { height: 892px; } .dws #section14 .content img, .door-window-sensor #section14 .content img { width: 580px; transition: all 500ms 75ms; -webkit-transform: translateX(-40%) translateY(125px); transform: translateX(-40%) translateY(125px); } .dws #section14 .bg, .door-window-sensor #section14 .bg { height: 947px; background-position: -200px 0; } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { top: 425px; left: 560px; } .dws #section15 .bg, .door-window-sensor #section15 .bg { padding: 0; height: 1150px; } .dws #section19 .bg, .door-window-sensor #section19 .bg { height: 1070px; } .dws #section19 .rings .red, .door-window-sensor #section19 .rings .red { top: 158px; left: 664px; } .dws #section21 .bg, .door-window-sensor #section21 .bg { height: 760px; background-position: 0 0; } } @media screen and (min-width: 2150px) { .dws #section5 .bg.top, .dws #section5 .bg.bottom, .door-window-sensor #section5 .bg.top, .door-window-sensor #section5 .bg.bottom { background-size: auto 750px; } } @media screen and (min-width: 2300px) { .dws #section14 .bg, .door-window-sensor #section14 .bg { background-position: 0 0; } .dws #section14 .rings .white, .door-window-sensor #section14 .rings .white { left: 760px; } } .swipe #section1 .content { position: relative; padding-top: 5rem; } .swipe #section1 .content h1 { text-transform: uppercase; padding-bottom: 0; } .swipe #section1 .content img { width: 100%; height: auto; display: inline-block; } .swipe #section2 .content img { width: 100%; max-width: 1200px; margin-bottom: 2.4rem; } .swipe #section4 .content { position: relative; } .swipe #section4 .bg { height: 310px; padding: 0; background-position: -80px 0; background-size: auto 100%; } .swipe #section5 .container-fluid { padding-left: 0; padding-right: 0; } .swipe #section5 .content { padding-bottom: 1rem; } .swipe #section5 .content p { padding-bottom: 4.8rem; } .swipe #section6 .content { position: absolute; z-index: 10; top: 45%; -webkit-transform: translateY(-50%); transform: translateY(-50%); color: #fff; } .swipe #section6 .content h2 span { font-size: 165%; vertical-align: sub; } .swipe #section6.white .white, .swipe #section6.black .black { visibility: visible; } .swipe #section6.white .black, .swipe #section6.black .white { visibility: hidden; } .swipe #section6 button { display: block; margin: 0 auto; color: #fff; border: 1px solid #fff; background-color: transparent; font-size: 66.6%; } .swipe #section6 [data-swap-class=black] { display: none; } .swipe #section6.white .content { color: #000; } .swipe #section6.white button { color: #000; border: 1px solid #000; } .swipe #section6.white [data-swap-class=white] { display: none; } .swipe #section6.white [data-swap-class=black] { display: block; } .swipe #section6 .bg { padding-bottom: 85%; } .swipe #section6 .bg sub { position: absolute; bottom: 35px; left: 22%; -webkit-transform: translateX(-50%); transform: translateX(-50%); color: #fff; font-size: 60%; opacity: .7; } .swipe #section6 .bg img { position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); height: 100%; } .swipe #section7 { height: 390px; } .swipe #section7 .content { padding-bottom: 0; } .swipe #section8 .content { position: absolute; z-index: 10; } .swipe #section8 .bg { height: 500px; padding: 0; background-position: 50% 0; background-size: auto 100%; } .swipe #section9 .content { position: absolute; } .swipe #section9 .bg { height: 320px; padding: 0; background-position: 50% 100%; background-size: auto 150px; } .swipe #section11 .content { position: relative; } .swipe #section11 .bg { padding-bottom: 60%; } .swipe #section12 .content { position: relative; } .swipe #section12 .bg { padding-bottom: 52.5%; height: 0; } .swipe #section12.empty .bg .empty, .swipe #section12 .bg .full { visibility: visible; } .swipe #section12.empty .bg .full, .swipe #section12 .bg .empty { visibility: hidden; } .swipe #section12 .bg img { position: absolute; top: 0; height: 100%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .swipe #section13 .content { position: relative; } .swipe #section13 .sub-extra { text-align: center; } .swipe #section13 .bg { padding-bottom: 74%; } .swipe #section14 { background-color: #000000; } .swipe #section14 .content { position: relative; } .swipe #section14 .bg { height: 330px; padding: 0; background-position: 0 0; background-size: auto 100%; } .swipe #section15 .content { position: relative; } .swipe #section15 .bg { height: 0; padding-bottom: 57%; } .swipe #section15 .heating { position: absolute; padding: 6px 0 5px; width: 106px; height: 54px; top: 42%; left: 20%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: .8; border: 1px solid #1fb3ef; border-radius: 6px; text-align: center; color: #1fb3ef; } .swipe #section15 .heating span, .swipe #section15 .heating p { display: block; margin: 0; padding: 0; font-weight: 400; } .swipe #section15 .heating span { font-size: 1rem; } .swipe #section15 .heating p { font-size: 1.6rem; } .swipe #section16 .content { position: relative; } .swipe #section16 .bg { padding-bottom: 47.75%; } .swipe #section17 .content { position: relative; } .swipe #section17 .bg { padding-bottom: 81.58%; } .swipe #section18 .content { position: relative; } .swipe #section18 .bg { padding-bottom: 67.5%; } .swipe #section19 .content { position: relative; } .swipe #section19 .bg { padding-bottom: 54.9%; } .swipe #section20 .content { position: relative; } .swipe #section20 .bg { padding-bottom: 73.77%; } .swipe #section21 .content { position: relative; } .swipe #section21 .bg { padding-bottom: 67.8%; } @media screen and (min-width: 450px) { .swipe #section8 .bg { height: 610px; background-position: 50% -220px; background-size: auto 140%; } .swipe #section9 .bg { background-size: auto 180px; } .swipe #section14 .bg { height: 380px; } } @media (min-width: 544px) { .swipe #section1 .bg { height: 280px; } .swipe #section4 .bg { height: 380px; background-position: -20px 0; } .swipe #section6 button { padding: 4px 8px; } .swipe #section7 { height: 460px; } .swipe #section9 .bg { height: 370px; background-size: auto 250px; } .swipe #section14 .bg { height: 540px; } .swipe #section15 .heating { top: 44%; -webkit-transform: scale(1.2) translate(-50%, -50%); transform: scale(1.2) translate(-50%, -50%); } } @media (min-width: 768px) { .swipe #section4 .bg { height: 470px; background-position: 0 0; } .swipe #section6 button { font-size: 100%; padding: 6px 28px 8px; } .swipe #section6 .bg { padding-bottom: 65%; } .swipe #section6 .bg sub { bottom: 50px; left: 30%; } .swipe #section7 { height: 680px; } .swipe #section8 .bg { height: 630px; background-position: 50% 0; background-size: auto 100%; } .swipe #section9 .bg { height: 430px; background-size: auto 430px; } .swipe #section12 .content span { display: inline-block; position: relative; top: 120px; } .swipe #section12 .content span:after { content: ""; display: block; width: 1.2em; height: 1.2em; position: absolute; left: 50%; top: 140%; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); border-right: 1px solid #000; border-bottom: 1px solid #000; } .swipe #section14 .content { position: absolute; } .swipe #section14 .bg { height: 580px; } .swipe #section15 .heating { top: 46%; -webkit-transform: scale(1.4) translate(-50%, -50%); transform: scale(1.4) translate(-50%, -50%); } .swipe #section18 .bg { padding-bottom: 46.875%; } } @media (min-width: 992px) { .swipe #section1 .col-phoneS-12:first-child { margin-bottom: 4rem; } .swipe #section4 .content { position: absolute; } .swipe #section4 .bg { height: 680px; background-position: -190px 0; } .swipe #section5 .content p { padding-bottom: 6rem; } .swipe #section8 .bg { height: 710px; } .swipe #section9 .bg { height: 550px; background-size: auto 580px; } .swipe #section11 .bg { padding-bottom: 46.328%; } .swipe #section12 .content span { top: 160px; } .swipe #section13 .content { position: relative; } .swipe #section13 .sub-extra { text-align: left; } .swipe #section13 .bg { padding-bottom: 49%; } .swipe #section13 .bg img { width: 50%; height: auto; position: absolute; right: 0; bottom: -80%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .swipe #section14 { border-top: 15px solid #fff; } .swipe #section14 .bg { height: 670px; } .swipe #section15 .heating { top: 48%; -webkit-transform: scale(1.6) translate(-50%, -50%); transform: scale(1.6) translate(-50%, -50%); } .swipe #section16 .content { position: absolute; } .swipe #section16 .bg { padding: 0; height: 640px; } .swipe #section16 .bg img { width: 50%; position: absolute; z-index: 100; bottom: 0; -webkit-transform: translateY(60%); transform: translateY(60%); } .swipe #section17 .content { position: absolute; top: 250px; color: #fff; text-align: left; } .swipe #section17 .bg { padding: 0; height: 780px; } .swipe #section19 .content { position: absolute; top: 60px; color: #fff; text-align: left; } .swipe #section19 .bg { background-position: 0 50%; padding: 0; height: 570px; } .swipe #section19 .bg img { width: 34.75%; position: absolute; -webkit-transform: translateY(20px); transform: translateY(20px); bottom: 0; } .swipe #section20 .content { position: absolute; text-align: left; } .swipe #section20 .bg { padding: 0; height: 610px; } .swipe #section21 .bg { padding-bottom: 55%; } } @media (min-width: 1200px) { .swipe #section1 .col-phoneS-12:first-child { margin-bottom: 6rem; } .swipe #section4 .bg { height: 845px; background-position: -200px 0; } .swipe #section6 button { padding: 10px 46px 12px; border-width: 2px; } .swipe #section6.white button { border-width: 2px; } .swipe #section6 .bg { padding-bottom: 47.5%; } .swipe #section8 .bg { height: 840px; } .swipe #section7 { height: 830px; } .swipe #section9 .bg { height: 670px; background-size: auto 680px; } .swipe #section10 .content { position: absolute; color: #fff; z-index: 100; padding-bottom: 0; } .swipe #section11 .content { position: absolute; color: #fff; text-align: left; } .swipe #section12 .content { position: absolute; } .swipe #section12 .content span { top: 10px; } .swipe #section12 .bg { padding-bottom: 72.5%; } .swipe #section13 { padding-top: 11rem; } .swipe #section13 .content { position: absolute; text-align: left; } .swipe #section14 .bg { height: 780px; } .swipe #section15 .content { position: absolute; text-align: left; top: 40px; } .swipe #section15 .bg { padding-bottom: 0; height: 860px; background-position: 0 0; } .swipe #section15 .heating { top: 51%; left: 32%; -webkit-transform: scale(1.75) translate(-50%, -50%); transform: scale(1.75) translate(-50%, -50%); } .swipe #section15 .heating span { font-weight: 300; } .swipe #section16 .bg { height: 760px; } .swipe #section17 .content { top: 350px; } .swipe #section17 .content h2, .swipe #section17 .content p { width: 400px; } .swipe #section17 .bg { height: 1040px; } .swipe #section18 .content { position: absolute; color: #fff; padding-top: 7rem; } .swipe #section19 .content { top: 80px; } .swipe #section19 .bg { height: 760px; } .swipe #section19 .bg img { z-index: 100; -webkit-transform: translateY(12%); transform: translateY(12%); } .swipe #section20 .bg { height: 760px; } .swipe #section21 .content { position: absolute; text-align: left; } .swipe #section21 .bg { background-position: 0 50%; padding: 0; height: 820px; } } @media screen and (min-width: 1366px) { .swipe #section12 .content span { top: 50px; } .swipe #section21 .bg { height: 900px; } } @media (min-width: 1600px) { .swipe #section1 .col-phoneS-12:first-child { margin-bottom: 9rem; } .swipe #section4 .bg { height: 995px; background-position: -150px 0; } .swipe #section6 button { padding: 14px 62px 16px; } .swipe #section7 { height: 990px; } .swipe #section8 .bg { height: 1040px; } .swipe #section9 .bg { height: 920px; background-size: auto 945px; } .swipe #section12 .content span { top: 0; } .swipe #section12 .bg { padding-bottom: 61.5%; } .swipe #section13 .sub-extra { padding-bottom: 13rem; } .swipe #section14 .bg { height: 1050px; } .swipe #section15 .content { top: 60px; } .swipe #section15 .content p { padding-right: 3rem; } .swipe #section15 .bg { height: 1220px; } .swipe #section15 .heating { top: 51%; left: 32%; -webkit-transform: scale(2.2) translate(-50%, -50%); transform: scale(2.2) translate(-50%, -50%); } .swipe #section16 .content { top: 50px; } .swipe #section16 .bg { height: 1000px; } .swipe #section17 .content { top: 460px; } .swipe #section17 .content h2, .swipe #section17 .content p { width: 470px; } .swipe #section17 .bg { height: 1370px; } .swipe #section18 .content { padding-top: 11rem; } .swipe #section19 .content { top: 130px; } .swipe #section19 .bg { height: 990px; } .swipe #section20 .content { top: 60px; } .swipe #section20 .bg { height: 1000px; } .swipe #section21 .bg { height: 1130px; } } @media screen and (min-width: 1760px) { .swipe #section12 .content span { top: 26px; } } @media screen and (min-width: 1900px) { .swipe #section4 .bg { background-position: -60px 0; } .swipe #section12 .content span { top: 54px; } } @media (min-width: 2100px) { .swipe #section1 .col-phoneS-12:first-child { margin-bottom: 12rem; } .swipe #section4 .bg { height: 1200px; background-position: 0 0; } .swipe #section6 button { padding: 18px 92px 20px; } .swipe #section7 { height: 1140px; } .swipe #section8 .bg { height: 1200px; } .swipe #section12 .content span { top: 40px; } .swipe #section12 .bg { padding-bottom: 51.5%; } .swipe #section13 .sub-extra { padding-bottom: 18rem; } .swipe #section14 .bg { height: 1200px; } .swipe #section15 .content { top: 80px; } .swipe #section15 .heating { top: 51%; left: 26%; -webkit-transform: scale(2.8) translate(-50%, -50%); transform: scale(2.8) translate(-50%, -50%); } .swipe #section16 .content { top: 100px; } .swipe #section16 .bg { height: 1360px; } .swipe #section17 .content { top: 580px; } .swipe #section17 .content h2 { width: 590px; } .swipe #section17 .bg { height: 1670px; } .swipe #section18 .content { padding-top: 14rem; } .swipe #section19 .content { top: 150px; } .swipe #section19 .bg { height: 1200px; } .swipe #section20 .content { top: 90px; } .swipe #section20 .bg { height: 1200px; } .swipe #section21 .content p { width: 820px; } .swipe #section21 .bg { height: 1200px; } } @media screen and (min-width: 2300px) { .swipe #section12 .content span { top: 70px; } } .swipe-anim { margin-top: 100px; } .swipe-anim a, .swipe-anim img { display: block; position: absolute; } .swipe-anim .anim, .swipe-anim ul, .swipe-anim #anim-blank { position: absolute; left: 50%; width: 1210px; height: 1080px; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scale(0.16) translate(-41%, 0); transform: scale(0.16) translate(-41%, 0); } .swipe-anim .anim { -webkit-perspective: 2000px; perspective: 2000px; } .swipe-anim ul { padding: 0; margin: 0; list-style: none; } .swipe-anim li { display: block; position: absolute; } .swipe-anim h3 { font-size: 80px; font-weight: bold; } .swipe-anim p { display: none; } .desktop .swipe-anim p { display: block; } @media (min-width: 544px) { .swipe-anim .anim, .swipe-anim ul, .swipe-anim #anim-blank { -webkit-transform: scale(0.22) translate(-41%, 0); transform: scale(0.22) translate(-41%, 0); } } @media (min-width: 768px) { .swipe-anim { margin-top: 200px; } .swipe-anim h3 { font-size: 60px; } .swipe-anim .anim, .swipe-anim ul, .swipe-anim #anim-blank { -webkit-transform: scale(0.35) translate(-41%, 0); transform: scale(0.35) translate(-41%, 0); } } @media (min-width: 1200px) { .swipe-anim { margin-top: 100px; } .swipe-anim h3 { font-size: 20px; } .swipe-anim .anim, .swipe-anim ul, .swipe-anim #anim-blank { -webkit-transform: scale(0.55) translate(-50%, 0); transform: scale(0.55) translate(-50%, 0); } } @media (min-width: 1600px) { .swipe-anim .anim, .swipe-anim ul, .swipe-anim #anim-blank { -webkit-transform: scale(0.7) translate(-50%, 0); transform: scale(0.7) translate(-50%, 0); } } @media (min-width: 2100px) { .swipe-anim .anim, .swipe-anim ul, .swipe-anim #anim-blank { -webkit-transform: scale(0.8) translate(-50%, 0); transform: scale(0.8) translate(-50%, 0); } } #anim-frame { top: 0; left: 27px; } #anim-screen { top: 150px; left: 141px; } #anim-sensor { top: 260px; left: 83px; } #anim-back { top: 397px; left: 0; } #anim-frame-pt { width: 866px; height: 468px; padding-right: 250px; padding-top: 60px; left: -450px; top: -405px; } @media (min-width: 1200px) { #anim-frame-pt { width: 664px; min-height: 131px; padding-right: 364px; padding-top: 0; left: -375px; top: -75px; } } #anim-screen-pt { text-align: right; width: 524px; height: 165px; padding-left: 150px; padding-top: 40px; left: 925px; top: 95px; } @media (min-width: 1200px) { #anim-screen-pt { text-align: left; width: 540px; min-height: 108px; padding-left: 320px; padding-top: 0; left: 925px; top: 135px; } } #anim-sensor-pt { text-align: right; width: 456px; min-height: 164px; padding-left: 100px; padding-bottom: 50px; left: 995px; top: 375px; } @media (min-width: 1200px) { #anim-sensor-pt { text-align: left; width: 570px; min-height: 105px; padding-left: 320px; left: 925px; top: 295px; } } #anim-back-pt { text-align: right; width: 445px; min-height: 69px; padding-top: 100px; left: 925px; top: 785px; } @media (min-width: 1200px) { #anim-back-pt { text-align: left; width: 510px; min-height: 45px; padding-left: 200px; padding-top: 24px; left: 925px; top: 785px; } } #anim-power-pt { width: 984px; min-height: 80px; left: -445px; top: 465px; padding-right: 380px; padding-top: 50px; } .the-button .multi-click * { pointer-events: none; } .the-button .section-product-footer { background-color: #fafafa; } .the-button .section-homekit-enabled .content img { position: absolute; top: 460px; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .the-button .section-homekit-enabled .bg { padding-bottom: 0; height: 530px; background-size: 490px auto; background-position: 50% 95%; } .the-button .section-packshot-slider .col-2 { padding-top: 3.2rem; text-align: center !important; } .the-button #section1 { background: #e75748; background: linear-gradient(to bottom, #e75748 0%, #f68650 100%); color: #fff; height: 470px; overflow: hidden; } .the-button #section1 .content { padding-top: 5rem; } .the-button #section1 .content h1 img { display: inline-block; height: 35px; position: relative; top: -3px; } .the-button #section1 .big-button { position: relative; padding-bottom: 57.87%; width: 60%; margin: 20px auto 0; left: .5%; cursor: pointer; } .the-button #section1 .big-button div { position: absolute; width: 100%; height: 100%; top: 0; background-repeat: no-repeat; background-size: 100%; background-position: top left; } .the-button #section1 .col-phoneS-10 p { display: inline-block; } .the-button #section1 .start { position: relative; margin-top: 3rem; } .the-button #section1 .start:after { content: ""; display: block; width: 1.2em; height: 1.2em; position: absolute; left: 50%; top: 60%; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .the-button #section2 { z-index: 1000; } .the-button #section2 .content p { padding-bottom: .25em; } .the-button #section3 .content img { height: 70px; width: auto; margin-bottom: 3rem; } .the-button #section3 .content p { display: inline-block; max-width: 280px; border-bottom: 1px solid #e3e3e3; padding-bottom: 4rem; } .the-button #section3 .content .col-phoneS-12 { padding-top: 4rem; } .the-button #section3 .content .col-phoneS-12:last-child p { border-bottom: none; } .the-button #section4 .content { text-align: left; position: absolute; z-index: 10; } .the-button #section4.light .content { color: #fff; } .the-button #section4 .bg { padding-bottom: 100%; } .the-button #section4 .bg > picture { display: block; position: absolute; height: 100%; width: auto; left: -39%; } .the-button #section4 .bg > picture img { height: 100%; width: auto; } .the-button #section4 .bg .button { position: absolute; width: 24%; left: 10%; bottom: 16%; cursor: pointer; } .the-button #section4 .bg .button img { position: absolute; width: 100%; } .the-button #section5 { margin-top: 3rem; } .the-button #section5 .content { text-align: left; position: relative; } .the-button #section5 .bg { position: absolute; top: 0; background-size: 200px auto; background-position: 100% 30px; padding-bottom: 110%; } .the-button #section5 img { margin-top: 5rem; max-width: 300px; } .the-button #section6 { background: #f3f3f3; background: radial-gradient(ellipse at center, #ffffff 0%, #f9f9f9 60%, #cbcbcd 100%); } .the-button #section7 .content { position: relative; } .the-button #section7 .bg { padding-bottom: 65%; } .the-button #section8 .content { color: #fff; text-align: right; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .the-button #section8 .content h2 { padding-bottom: 0.4rem; } .the-button #section8 .content p { display: inline-block; padding-bottom: 0; } .the-button #section8 .bg { padding-bottom: 42%; } .the-button #section9 .bg { padding-bottom: 90%; } .the-button #section10 .content { position: relative; } .the-button #section10 .bg { padding-bottom: 62.8%; } .the-button #section11 .content { position: relative; } .the-button #section11 .bg { padding-bottom: 60%; } .the-button #section12 .bg { position: relative; height: 0; padding-bottom: 64.7%; width: 100%; margin-top: 20px; } .the-button #section12 .bg div { position: absolute; width: 100%; height: 100%; background-repeat: no-repeat; background-position: top left; background-size: 86%; } .the-button #section12 .feature { width: 28%; margin: 0 2%; display: inline-block; } .the-button #section12 .feature .desc { width: 100%; } .the-button #section12 .feature .desc span, .the-button #section12 .feature .desc p { display: none; } .the-button #section12 .feature .icon { width: 100%; float: left; clear: both; height: 0; padding-bottom: 100%; background-size: auto 100%; background-position: left; } .the-button #section12.one .feature .icon.light, .the-button #section12.two .feature .icon.projector, .the-button #section12.three .feature .icon.fan { background-position: right; } .the-button #section13 .bg { background-position: 50% 100%; padding-bottom: 89%; } .the-button #section13 .bg .sub-extra { position: absolute; bottom: 10px; padding-bottom: 0; } .the-button #section13 .bg p { font-size: .75em; padding-bottom: 0; } .the-button #section14 .bg { background-position: 50% 100%; background-size: cover; padding-bottom: 99.5%; } .the-button #section14 span.button { display: block; width: 125px; height: 30px; margin: 0 auto; background-size: 100% auto; } .the-button #section14.changed .content { color: #fff; } .the-button #section14.changed span.button { background-position: 0 0; } .the-button #section15 .content { position: relative; } .the-button #section15 .content p { padding-bottom: 0; } .the-button #section15 .bg { padding-bottom: 66%; } .the-button #section16 .content { position: relative; } .the-button #section16 .content p { padding-bottom: 0; } .the-button #section16 .bg { padding-bottom: 59%; } .the-button #section17 .content { position: relative; color: #fff; background-color: #ce9a66; } .the-button #section17 .bg { padding-bottom: 92.75%; } .the-button #section18 .content { position: relative; } .the-button #section18 .bg { padding-bottom: 70.5%; } .the-button #section19 .content { position: relative; } .the-button #section19 .bg { padding-bottom: 74%; } .the-button #section20 .content { color: #fff; } .the-button #section20 .bg { background-position: 0 100%; padding-bottom: 104.6%; } .the-button #section21 { background-color: #fafafa; } .the-button #section21 .content { position: relative; } .the-button #section21 .content img { width: 100%; height: auto; max-width: 1000px; } .the-button .find-a-store-custom-button { margin-top: 50px; } @media screen and (min-width: 350px) { .the-button #section4 .bg { padding-bottom: 92%; } .the-button #section13 .content p { padding-left: 3rem; padding-right: 3rem; } } @media screen and (min-width: 410px) { .the-button #section1 { height: 490px; } .the-button #section5 .bg { background-size: 200px auto; background-position: 100% 0; padding-bottom: 110%; } .the-button #section5 img { margin-top: 7rem; max-width: 300px; } .the-button #section8 .bg { padding-bottom: 38%; } .the-button #section9 .bg { padding-bottom: 80%; } } @media (min-width: 544px) { .the-button .section-homekit-enabled .content img { top: 370px; } .the-button .section-homekit-enabled .bg { height: 440px; } .the-button #section1 { height: 510px; } .the-button #section4 .content { top: 40%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .the-button #section4 .bg { padding-bottom: 78%; } .the-button #section4 .bg > picture { left: -16%; } .the-button #section5 { margin-top: 5rem; } .the-button #section5 .bg { background-size: 220px auto; background-position: 100% 0; padding-bottom: 110%; } .the-button #section5 img { margin-top: 7rem; margin-bottom: 2rem; max-width: 300px; } .the-button #section13 .bg { padding-bottom: 76%; } .the-button #section14 .bg { padding-bottom: 76%; } .the-button #section14 span.button { -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: scale(1.4); transform: scale(1.4); } .the-button #section20 .bg { padding-bottom: 86%; } } @media (min-width: 768px) { .the-button .section-homekit-enabled .content { text-align: left; } .the-button .section-homekit-enabled .content img { position: relative; top: 0; -webkit-transform: translateX(0); transform: translateX(0); } .the-button .section-homekit-enabled .bg { background-position: 45% 50%; background-size: cover; } .the-button #section1 { height: 570px; } .the-button #section3 .content p { border-bottom: none; padding-bottom: 3rem; } .the-button #section3 .content .col-phoneS-12 { padding-top: 3rem; border-right: 1px solid #e3e3e3; } .the-button #section3 .content .col-phoneS-12:last-child { border-right: none; } .the-button #section4 .bg { padding-bottom: 46.787%; } .the-button #section4 .bg > picture { left: 0; } .the-button #section4 .bg .button { bottom: 33%; } .the-button #section5 { margin-top: 0; } .the-button #section5 .content { margin-top: 5rem; position: absolute; } .the-button #section5 .bg { position: relative; background-size: auto 100%; background-position: 100% 0; padding-bottom: 56.25%; } .the-button #section5 img { margin-top: 7rem; margin-bottom: 2rem; max-width: 340px; } .the-button #section7 .content { position: absolute; text-align: right; top: 34%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .the-button #section7 .content p br { display: none; } .the-button #section7 .bg { padding-bottom: 46.875%; } .the-button #section12 .bg { position: absolute; height: 0; padding-bottom: 64.7%; width: 60%; top: 170px; } .the-button #section12 .bg div { position: absolute; width: 100%; height: 100%; background-repeat: no-repeat; background-position: top left; background-size: 86%; } .the-button #section12 .feature { width: 100%; display: block; position: relative; float: right; } .the-button #section12 .feature .desc { width: 50%; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left; } .the-button #section12 .feature .desc h3 { font-size: 1.6em; } .the-button #section12 .feature .desc span, .the-button #section12 .feature .desc p { display: inline-block; } .the-button #section12 .feature .icon { width: 50%; height: 0; float: right; padding-bottom: 50%; } .the-button #section13 .content { text-align: left; } .the-button #section13 .bg { padding-bottom: 46.875%; } .the-button #section14 .bg { padding-bottom: 67%; } .the-button #section15 .content { position: absolute; } .the-button #section17 .content p br { display: none; } .the-button #section17 .bg { padding-bottom: 56.25%; } .the-button #section18 .bg { padding-bottom: 46.875%; } .the-button #section19 .bg { padding-bottom: 47%; } .the-button #section20 .bg { padding-bottom: 48.5%; } } @media (min-width: 992px) { .the-button #section1 { padding-bottom: 0; height: 730px; } .the-button #section1 .content h1 img { height: 42px; top: -4px; } .the-button #section5 img { max-width: 430px; } .the-button #section8 .content h2 { padding-bottom: 2.4rem; } .the-button #section9 .bg { padding-bottom: 58%; } .the-button #section10 .content { position: absolute; text-align: right; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .the-button #section10 .content p { display: inline-block; width: 350px; } .the-button #section10 .bg { background-position: 0 0; background-size: 50% auto; padding-bottom: 31%; } .the-button #section11 .content { position: absolute; text-align: left; } .the-button #section11 .bg { padding-bottom: 46.875%; } .the-button #section13 .content p { padding-left: 0; padding-right: 0; } .the-button #section14 .bg { padding-bottom: 52%; } .the-button #section14 span.button { -webkit-transform: scale(1.7); transform: scale(1.7); } .the-button #section15 .bg { padding-bottom: 56%; } .the-button #section16 { overflow: hidden; } .the-button #section16 .content { position: absolute; top: 0; } .the-button #section16 .bg { margin-top: 80px; background-position: 0 100%; padding-bottom: 46.875%; } .the-button #section17 .content { position: absolute; background-color: transparent; text-align: right; top: 40%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .the-button #section18 .content { position: absolute; } } @media (min-width: 1200px) { .the-button .section-homekit-enabled .content a:hover { border-bottom: 1px solid #0090ff; } .the-button .section-homekit-enabled .bg { height: 500px; } .the-button #section1 { height: 0; padding-bottom: 56.25%; } .the-button #section1 .content h1 img { height: 46px; top: -5px; } .the-button #section1 .start { margin-top: 4rem; } .the-button #section4 .content p { max-width: 560px; } .the-button #section5 img { max-width: 480px; } .the-button #section6 { background: #fff; background: linear-gradient(to bottom, #dcdfe1 0, #fff 33%, #fff 86%, #dcdfe1 100%); } .the-button #section6 video { margin: 55px 0; width: 100%; max-width: 1690px; } .the-button #section6 .content p { display: inline-block; width: 800px; } .the-button #section8 .bg { padding-bottom: 23.6%; } .the-button #section10 .content p { width: 390px; } .the-button #section12 .feature, .the-button #section12 .content { z-index: 100; } .the-button #section12 .content p { display: inline-block; width: 80%; } .the-button #section12 .bg { top: 190px; width: 70%; } .the-button #section13 .bg .sub-extra { bottom: 30px; } .the-button #section14 .content p { display: inline-block; width: 460px; } .the-button #section14 .bg { padding-bottom: 46.875%; } .the-button #section14 span.button { -webkit-transform: scale(2.3) translateY(5px); transform: scale(2.3) translateY(5px); } .the-button .find-a-store-custom-button { margin-top: 60px; margin-bottom: 20px; } } @media (min-width: 1600px) { .the-button .section-homekit-enabled .bg { height: 660px; } .the-button #section1 .content .start { margin-top: 14rem; } .the-button #section1 .content h1 { margin-top: 4.8rem; } .the-button #section1 .content h1 img { height: 50px; top: -6px; } .the-button #section5 img { margin-top: 25rem; max-width: 630px; } .the-button #section6 { background: linear-gradient(to bottom, #dcdfe1 0, #fff 32%, #fff 86%, #dcdfe1 100%); } .the-button #section7 .content { top: 26%; } .the-button #section7 .content p br { display: block; } .the-button #section10 .content p { width: 460px; } .the-button #section12 .bg { top: 210px; width: 70%; } .the-button #section14 .content p { width: 510px; } .the-button #section14 span.button { -webkit-transform: scale(2.7) translateY(10px); transform: scale(2.7) translateY(10px); } .the-button #section15 .bg { padding-bottom: 46.875%; } .the-button .find-a-store-custom-button { margin-top: 80px; } } @media (min-width: 2100px) { .the-button .section-homekit-enabled .bg { height: 740px; } .the-button #section1 .content .start { margin-top: 26rem; } .the-button #section1 .content h1 img { height: 66px; top: -8px; } .the-button #section5 img { margin-top: 40rem; max-width: 750px; } .the-button #section6 { background: linear-gradient(to bottom, #dcdfe1 0, #fff 27%, #fff 90%, #dcdfe1 100%); } .the-button #section14 span.button { -webkit-transform: scale(3.2) translateY(10px); transform: scale(3.2) translateY(10px); } .the-button #section17 .content p br { display: block; } } .flood-sensor .section-product-footer { background-color: #fff; } .flood-sensor .section-product-sizing .content .col-2 img { max-width: 240px; } .flood-sensor .section-product-sizing .content .col-3 img { margin-top: 3rem; max-width: 300px; } .flood-sensor .section-homekit-enabled .content img { position: absolute; top: 410px; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .flood-sensor .section-homekit-enabled .content .button-buy { position: absolute; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 442px; } .flood-sensor .section-homekit-enabled .bg { padding-bottom: 0; height: 510px; } .flood-sensor #section5 .icons { position: relative; width: 100%; } .flood-sensor #section5 .icons img { width: 100%; } .flood-sensor #section5 .icons ul { position: relative; width: 90%; max-width: 440px; margin: 0 auto; height: 100%; list-style: none; } .flood-sensor #section5 .icons ul li { width: 30%; margin: 0 10%; text-align: center; float: left; height: 170px; font-size: 0.8em; } .flood-sensor #section5 .icons div { margin-top: 2rem; max-width: 440px; margin-left: auto; margin-right: auto; } .flood-sensor #section9 .content { background-color: #eaeaea; position: relative; } .flood-sensor #section9 .bg { padding-bottom: 137.5%; } .flood-sensor #section10 .content { background-color: #f1f1f3; position: relative; } .flood-sensor #section10 .bg { padding-bottom: 145.5%; } .flood-sensor #section11 .bg { padding-bottom: 78%; } .flood-sensor #section12 .content { position: relative; } .flood-sensor #section12 .content img, .flood-sensor #section12 .content svg { width: 85%; height: auto; max-width: 360px; } .flood-sensor #section12 .bg { padding-bottom: 53%; } .flood-sensor #section13 .content { position: relative; background: #fff; } .flood-sensor #section13 .bg { padding-bottom: 60.25%; } .flood-sensor #section15 .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .flood-sensor #section15 .content img, .flood-sensor #section15 .content svg { width: 70%; height: auto; max-width: 320px; } .flood-sensor #section15 .bg { padding-bottom: 135%; } .flood-sensor #section16 .content { position: relative; color: #444444; } .flood-sensor #section16 .content img, .flood-sensor #section16 .content svg { width: 60%; height: auto; max-width: 320px; } .flood-sensor #section16 .bg { padding-bottom: 77.4%; } .flood-sensor #section17 .col-phoneS-3 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .flood-sensor #section17 .col-phoneS-3 img { max-width: 100%; } @media (min-width: 544px) { .flood-sensor .section-homekit-enabled .content img { position: absolute; top: 330px; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .flood-sensor .section-homekit-enabled .content .button-buy { position: absolute; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 370px; } .flood-sensor .section-homekit-enabled .bg { height: 450px; } } @media (min-width: 768px) { .flood-sensor .section-product-sizing .content .col-1 img { margin-top: 15rem; } .flood-sensor .section-product-sizing .content .col-2 img { max-width: 290px; } .flood-sensor .section-product-sizing .content .col-3 img { max-width: 480px; margin-top: 4rem; } .flood-sensor .section-homekit-enabled .content { text-align: left; } .flood-sensor .section-homekit-enabled .content img { position: relative; top: 0; -webkit-transform: translateX(0); transform: translateX(0); } .flood-sensor .section-homekit-enabled .content .button-buy { position: relative; -webkit-transform: translateX(0); transform: translateX(0); top: 3rem; padding: 6px 25px; } .flood-sensor #section5 .icons ul { max-width: 600px; } .flood-sensor #section5 .icons ul li { width: 16.3%; margin: 0 8.5%; text-align: center; float: left; height: 170px; } .flood-sensor #section9 { background-color: #f1f1f3; } .flood-sensor #section9 .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; } .flood-sensor #section9 .content .col-phoneS-10 { height: 356px; } .flood-sensor #section9 .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; } .flood-sensor #section9 .bg { padding-bottom: 0; height: 380px; width: 50%; } .flood-sensor #section10 { background-color: #f1f1f3; } .flood-sensor #section10 .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; } .flood-sensor #section10 .content .col-phoneS-10 { height: 376px; } .flood-sensor #section10 .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; } .flood-sensor #section10 .bg { padding-bottom: 0; height: 400px; width: 50%; left: 50%; } .flood-sensor #section11 .bg { padding-bottom: 0; height: 380px; } .flood-sensor #section12 .content { position: absolute; z-index: 10; } .flood-sensor #section12 .content img, .flood-sensor #section12 .content svg { position: relative; left: 60%; max-width: 210px; } .flood-sensor #section12 .bg { padding-bottom: 0; height: 380px; } .flood-sensor #section13 .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); background: transparent; text-align: left; } .flood-sensor #section13 .bg { padding-bottom: 0; height: 380px; background-position: 100% 50%; } .flood-sensor #section15 .bg { padding-bottom: 0; height: 380px; } .flood-sensor #section16 .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); color: #fff; } .flood-sensor #section16 .bg { padding-bottom: 0; height: 380px; } } @media (min-width: 992px) { .flood-sensor .section-scroll-slide { margin-top: 0; margin-bottom: 0; } .flood-sensor #section9 .content img { width: 280px; } .flood-sensor #section9 .content .col-phoneS-10 { height: 376px; } .flood-sensor #section9 .bg { height: 410px; } .flood-sensor #section10 .content .col-phoneS-10 { height: 456px; } .flood-sensor #section10 .content img { width: 280px; } .flood-sensor #section10 .bg { height: 490px; } .flood-sensor #section12 .content img { left: 40%; max-width: 250px; } .flood-sensor #section12 .bg { height: 450px; } .flood-sensor #section13 .bg { height: 450px; } .flood-sensor #section15 .bg { height: 450px; } .flood-sensor #section16 .bg { height: 450px; } .flood-sensor #section17 .col-phoneS-3 { margin-top: 2rem; margin-bottom: 2rem; } } @media (min-width: 1200px) { .flood-sensor .section-product-sizing .content .col-1 img { margin-top: 19rem; } .flood-sensor .section-product-sizing .content .col-2 img { max-width: 320px; } .flood-sensor .section-product-sizing .content .col-3 img { margin-top: 9rem; max-width: 600px; } .flood-sensor .section-homekit-enabled .content .button-buy { padding: 6px 35px; top: 4rem; } .flood-sensor .section-homekit-enabled .bg { height: 560px; } .flood-sensor .section-product-header .bg { padding-bottom: 0; height: 680px; } .flood-sensor .section-product-header .bg video { width: auto; height: 100%; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .flood-sensor #section5 .icons { position: relative; width: 100%; height: 600px; } .flood-sensor #section5 .icons img { width: 100%; } .flood-sensor #section5 .icons ul { position: relative; width: 100%; max-width: 100%; height: 100%; margin: 0; list-style: none; } .flood-sensor #section5 .icons ul li { position: absolute; width: 100px; margin: 0; float: none; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .flood-sensor #section5 .icons ul li.icon1 { top: 25%; left: 25%; } .flood-sensor #section5 .icons ul li.icon2 { top: 50%; left: 20%; } .flood-sensor #section5 .icons ul li.icon3 { top: 75%; left: 25%; } .flood-sensor #section5 .icons ul li.icon4 { top: 25%; left: 75%; } .flood-sensor #section5 .icons ul li.icon5 { top: 50%; left: 80%; } .flood-sensor #section5 .icons ul li.icon6 { top: 75%; left: 75%; } .flood-sensor #section5 .icons div { margin: 0; position: absolute; top: 10%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 50%; max-width: 100%; } .flood-sensor #section9 .content img { width: 380px; left: 80%; } .flood-sensor #section9 .content .col-phoneS-10 { height: 506px; } .flood-sensor #section9 .bg { width: 100%; background-size: auto 100%; height: 540px; } .flood-sensor #section9 .bg img, .flood-sensor #section9 .bg svg { position: absolute; top: 160px; left: 310px; width: 250px; } .flood-sensor #section9 .bg button { position: absolute; bottom: 20px; left: 430px; } .flood-sensor #section9 video { height: 100%; width: auto; } .flood-sensor #section10 .content .col-phoneS-10 { height: 576px; } .flood-sensor #section10 .content img { width: 380px; } .flood-sensor #section10 .bg { height: 610px; } .flood-sensor #section11 .bg { height: 560px; } .flood-sensor #section12 .content img, .flood-sensor #section12 .content svg { left: 50%; top: 20px; max-width: 310px; } .flood-sensor #section12 .bg { height: 560px; } .flood-sensor #section13 .bg { height: 560px; } .flood-sensor #section15 .bg { height: 560px; } .flood-sensor #section16 .bg { height: 560px; } .flood-sensor.lang-pl #section9 .bg img { width: 290px; } .flood-sensor.lang-pl #section12 .content img { max-width: 330px; } } @media (min-width: 1600px) { .flood-sensor .section-product-sizing .content .col-2 img { max-width: 380px; } .flood-sensor .section-homekit-enabled .bg { height: 680px; } .flood-sensor .section-product-header .bg { padding-bottom: 0; height: 790px; } .flood-sensor #section5 .icons { height: 740px; } .flood-sensor #section9 .content img { width: 460px; left: 80%; } .flood-sensor #section9 .content .col-phoneS-10 { height: 776px; } .flood-sensor #section9 .bg { height: 840px; } .flood-sensor #section9 .bg img, .flood-sensor #section9 .bg svg { top: 240px; left: 500px; width: 360px; } .flood-sensor #section9 .bg button { bottom: 30px; left: 680px; } .flood-sensor #section10 .content .col-phoneS-10 { height: 776px; } .flood-sensor #section10 .content img { width: 460px; } .flood-sensor #section10 .bg { height: 840px; } .flood-sensor #section11 .bg { height: 830px; } .flood-sensor #section12 .content img, .flood-sensor #section12 .content svg { max-width: 500px; top: 60px; } .flood-sensor #section12 .bg { height: 840px; } .flood-sensor #section13 .bg { height: 850px; } .flood-sensor #section15 .bg { height: 930px; } .flood-sensor #section16 .bg { height: 840px; } .flood-sensor.lang-pl #section9 .bg img { width: 380px; } .flood-sensor.lang-pl #section12 .content img { max-width: 520px; } } @media (min-width: 2100px) { .flood-sensor .section-product-header .bg { height: 1040px; } .flood-sensor #section5 .icons { height: 920px; } .flood-sensor #section9 .content img { width: 580px; } .flood-sensor #section9 .bg img, .flood-sensor #section9 .bg svg { top: 230px; left: 450px; width: 460px; } .flood-sensor #section10 .content img { width: 580px; } .flood-sensor.lang-pl #section9 .bg img, .flood-sensor.lang-pl #section9 .bg svg { width: 490px; } } .motion-sensor .section-product-header .bg canvas { display: none; } .motion-sensor .section-product-footer { background-color: #fff; } .motion-sensor .section-product-sizing .content .col-1 img { max-width: 160px; } .motion-sensor .section-product-sizing .content .col-2 img { max-width: 210px; margin-left: 64px; } .motion-sensor .section-product-sizing .content .col-3 img { margin-top: 3rem; max-width: 300px; } .motion-sensor .section-homekit-enabled .content img { position: absolute; top: 540px; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .motion-sensor .section-homekit-enabled .bg { padding-bottom: 0; height: 620px; } .motion-sensor #section4 { height: 180px; } .motion-sensor #section4 .content h2 { text-transform: none; } .motion-sensor #section4 img { height: 100%; width: auto; } .motion-sensor #section5 .bg { padding-bottom: 79%; height: 0; } .motion-sensor #section5 .bg canvas { display: none; } .motion-sensor #section7 .content { position: relative; } .motion-sensor #section7 .content img, .motion-sensor #section7 .content svg { max-width: 160px; margin-top: 1rem; } .motion-sensor #section7 .bg { padding-bottom: 66%; } .motion-sensor #section8 .content .col-1 img { max-width: 300px; } .motion-sensor #section8 .content ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 3rem; } .motion-sensor #section8 .content li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; background-repeat: no-repeat; padding-top: 70px; margin-bottom: 2rem; width: 50%; } .motion-sensor #section8 .content li span { display: inline-block; width: 120px; } .motion-sensor #section8 .content li.motion { background-image: url("../img/common/motion.svg"); background-size: 50px 50px; background-position: 50% 10px; } .motion-sensor #section8 .content li.motion span { width: 65px; } .motion-sensor #section8 .content li.light { background-image: url("../img/common/light-sensor.svg"); background-size: 50px 50px; background-position: 50% 10px; } .motion-sensor #section8 .content li.light span { width: 65px; } .motion-sensor #section8 .content li.temp { background-image: url("../img/common/4func-temp.svg"); background-size: 50px 50px; background-position: 50% 15px; } .motion-sensor #section8 .content li.accel { background-image: url("../img/common/accelerometer.svg"); background-size: 50px 50px; background-position: 50% 10px; } .motion-sensor #section11 .content { position: relative; } .motion-sensor #section11 .bg { height: 250px; padding-bottom: 0; } .motion-sensor #section12 .content { position: relative; } .motion-sensor #section12 .bg { padding-bottom: 107.4%; } .motion-sensor #section14 .content { background-color: #ece4e1; position: relative; } .motion-sensor #section14 .bg { padding-bottom: 144%; } .motion-sensor #section15 .content { background-color: #f4f4f3; position: relative; } .motion-sensor #section15 .bg { padding-bottom: 144%; } .motion-sensor #section16 .content img, .motion-sensor #section16 .content svg { max-width: 180px; margin-top: 1rem; } .motion-sensor #section16 .bg { padding-bottom: 120%; } .motion-sensor #section17 .content { position: relative; } .motion-sensor #section17 .content p { padding-bottom: 0; } .motion-sensor #section17 .bg { height: 0; padding-bottom: 92%; } .motion-sensor #section18 { background: #090c15; background: linear-gradient(120deg, #362a1b 0%, #090c15 25%, #090c15 35%, #12192b 100%); } .motion-sensor #section18 .content { position: relative; } .motion-sensor #section18 .content img, .motion-sensor #section18 .content svg { max-width: 180px; margin-top: 1rem; } .motion-sensor #section18 .bg { height: 0; padding-bottom: 70%; } .motion-sensor #section19 .content { position: absolute; z-index: 100; } .motion-sensor #section19 .bg { height: 0; padding-bottom: 150%; } .motion-sensor #section19 .slider.slider-horizontal { width: 100%; } .motion-sensor #section19 .slider.slider-horizontal .slider-track { height: 4px; margin-top: -2px; } .motion-sensor #section19 .slider-tick { display: none; } .motion-sensor #section19 .sensitivity-icons { margin-bottom: 1rem; } .motion-sensor #section19 .sensitivity-icons img { width: 100px; height: 50px; max-width: 100%; } .motion-sensor #section19 .sensitivity-sensor { position: absolute; display: block; width: 3.5vw; height: 4vw; right: 7vw; top: 91vw; background-repeat: no-repeat; background-size: 100% auto; } .motion-sensor #section20 .content img { max-width: 85px; margin-left: 10px; } .motion-sensor #section20 .bg { height: 0; padding-bottom: 147%; } @media screen and (min-width: 410px) { .motion-sensor #section19 .bg { padding-bottom: 138%; } .motion-sensor #section19 .sensitivity-icons { margin-bottom: 2rem; } .motion-sensor #section19 .sensitivity-icons img { height: 70px; } .motion-sensor #section19 .sensitivity-sensor { top: 80vw; } } @media (min-width: 544px) { .motion-sensor .section-homekit-enabled .content img { top: 460px; } .motion-sensor .section-homekit-enabled .bg { height: 560px; } .motion-sensor #section4 { height: 250px; } .motion-sensor #section11 .bg { height: 330px; } .motion-sensor #section16 .bg { padding-bottom: 95%; } .motion-sensor #section19 .bg { padding-bottom: 108%; } .motion-sensor #section19 .sensitivity-sensor { top: 53vw; } .motion-sensor #section20 .bg { padding-bottom: 110%; } } @media (max-width: 991px) { .motion-sensor .section-packshot-slider .slide2 .col-2 img { margin-top: -90px; } } @media (min-width: 768px) { .motion-sensor .section-product-sizing .content .col-2 img { margin-left: 0; } .motion-sensor .section-product-sizing .content .col-3 img { max-width: 420px; } .motion-sensor .section-homekit-enabled .content { text-align: left; } .motion-sensor .section-homekit-enabled .content img { position: relative; top: 0; -webkit-transform: translateX(0); transform: translateX(0); } .motion-sensor #section4 { height: 330px; } .motion-sensor #section5 .bg { padding-bottom: 59%; } .motion-sensor #section7 .bg { padding-bottom: 40%; } .motion-sensor #section8 .content ul li { width: 25%; } .motion-sensor #section8 .col-1 img { max-width: 420px; } .motion-sensor #section11 .content { position: absolute; } .motion-sensor #section11 .bg { height: 480px; } .motion-sensor #section12 .content { position: absolute; text-align: left; color: #fff; top: 10%; } .motion-sensor #section12 .bg { padding-bottom: 38.9%; } .motion-sensor #section13 .content { text-align: left; } .motion-sensor #section13 .content img { position: absolute; left: -410px; top: -110px; width: 410px; height: auto; max-width: none; } .motion-sensor #section14 { background-color: #ece4e1; } .motion-sensor #section14 .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; } .motion-sensor #section14 .content .col-phoneS-10 { height: 376px; } .motion-sensor #section14 .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; } .motion-sensor #section14 .bg { padding-bottom: 0; height: 400px; width: 50%; left: 50%; } .motion-sensor #section15 { background-color: #f4f4f3; } .motion-sensor #section15 .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; } .motion-sensor #section15 .content .col-phoneS-10 { height: 376px; } .motion-sensor #section15 .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; } .motion-sensor #section15 .bg { padding-bottom: 0; height: 400px; width: 50%; } .motion-sensor #section16 .content { text-align: left; top: 15%; } .motion-sensor #section16 .bg { padding-bottom: 63%; } .motion-sensor #section17 .content { position: absolute; text-align: left; } .motion-sensor #section17 .bg { padding-bottom: 70%; } .motion-sensor #section18 .content { position: absolute; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .motion-sensor #section18 .bg { padding-bottom: 54%; } .motion-sensor #section19 .bg { padding-bottom: 92%; } .motion-sensor #section19 .sensitivity-sensor { top: 37vw; } .motion-sensor #section20 .content { text-align: left; top: 98%; -webkit-transform: translateY(-100%); transform: translateY(-100%); } .motion-sensor #section20 .bg { padding-bottom: 56%; } } @media (min-width: 992px) { .motion-sensor #section4 { height: 430px; } .motion-sensor #section7 .content { position: absolute; color: #fff; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .motion-sensor #section11 .bg { height: 560px; } .motion-sensor #section13 .content img { left: -520px; top: -190px; width: 530px; } .motion-sensor #section14 .content .col-phoneS-10 { height: 456px; } .motion-sensor #section14 .content img { width: 280px; } .motion-sensor #section14 .bg { height: 490px; } .motion-sensor #section15b .content .col-phoneS-10 { height: 456px; } .motion-sensor #section15b .content img { width: 280px; } .motion-sensor #section15b .bg { height: 490px; } .motion-sensor #section16 .bg { padding-bottom: 51%; } .motion-sensor #section17 .bg { padding-bottom: 53%; } .motion-sensor #section18 .bg { padding-bottom: 44%; } .motion-sensor #section19 .bg { padding-bottom: 84%; } .motion-sensor #section19 .sensitivity-sensor { top: 32vw; } .motion-sensor #section20 .content img { max-width: 100px; } .motion-sensor #section20 .bg { padding-bottom: 47%; } } @media (min-width: 1200px) { .motion-sensor .section-product-header .content { pointer-events: none; } .motion-sensor .section-product-header .bg { padding-bottom: 40.55%; width: 100%; height: 0; } .motion-sensor .section-product-header .bg canvas { position: absolute; width: 100%; height: 100%; } .motion-sensor .section-product-sizing .content .col-1 img { max-width: 250px; margin-top: 4rem; } .motion-sensor .section-product-sizing .content .col-2 img { max-width: 330px; margin-top: 4rem; } .motion-sensor .section-product-sizing .content .col-3 img { margin-top: 6rem; max-width: 560px; } .motion-sensor .section-homekit-enabled .content a:hover { border-bottom: 1px solid #0090ff; } .motion-sensor .section-homekit-enabled .bg { height: 640px; } .motion-sensor .section-video-player#section4 video { opacity: 1; } .motion-sensor #section5 .content { position: absolute; z-index: 10; pointer-events: none; } .motion-sensor #section5 .bg { background: none; padding-bottom: 53.789%; } .motion-sensor #section5 .bg canvas { position: absolute; display: none; width: 100%; height: 100%; } .motion-sensor #section7 .content img, .motion-sensor #section7 .content svg { max-width: 210px; } .motion-sensor #section8 .content ul { margin-top: 3rem; } .motion-sensor #section8 .content .col-1 img { max-width: 560px; } .motion-sensor #section11 .bg { height: 680px; } .motion-sensor #section13 .content img { left: -600px; top: -230px; width: 600px; } .motion-sensor #section14 .content .col-phoneS-10 { height: 566px; } .motion-sensor #section14 .content img { width: 380px; } .motion-sensor #section14 .bg { height: 610px; } .motion-sensor #section15 .content .col-phoneS-10 { height: 566px; } .motion-sensor #section15 .content img { width: 380px; } .motion-sensor #section15 .bg { height: 610px; } .motion-sensor #section16 .content img, .motion-sensor #section16 .content svg { max-width: 300px; } .motion-sensor #section18 .content img, .motion-sensor #section18 .content svg { max-width: 300px; } .motion-sensor #section19 .bg { padding-bottom: 52%; background-position: 0 0; background-size: auto 100%; } .motion-sensor #section19 .content p { padding-left: 12rem; padding-right: 12rem; } .motion-sensor #section19 .sensitivity-sensor { width: 2.5vw; height: 3vw; right: 4vw; top: 14vw; } .motion-sensor.lang-pl #section7 .content img, .motion-sensor.lang-pl #section7 .content svg { max-width: 320px; } } @media (min-width: 1600px) { .motion-sensor .section-homekit-enabled .bg { height: 1030px; } .motion-sensor #section11 .bg { height: 840px; } .motion-sensor #section14 .content .col-phoneS-10 { height: 776px; } .motion-sensor #section14 .content img { width: 460px; } .motion-sensor #section14 .bg { height: 840px; } .motion-sensor #section13 .content img { left: -760px; top: -290px; width: 770px; } .motion-sensor #section15 .content .col-phoneS-10 { height: 776px; } .motion-sensor #section15 .content img { width: 460px; } .motion-sensor #section15 .bg { height: 840px; } .motion-sensor #section16 .content img, .motion-sensor #section16 .content svg { max-width: 380px; } .motion-sensor #section16 .bg { padding-bottom: 46%; } .motion-sensor #section17 .bg { padding-bottom: 46%; } .motion-sensor #section18 .content img, .motion-sensor #section18 .content svg { max-width: 380px; } .motion-sensor #section19 .bg { padding-bottom: 41.8%; } .motion-sensor #section19 .sensitivity-sensor { right: 20vw; top: 8vw; } .motion-sensor #section20 .content img { max-width: 130px; } .motion-sensor #section20 .bg { padding-bottom: 40%; } } @media (min-width: 2100px) { .motion-sensor #section11 .bg { height: 930px; } .motion-sensor #section14 .content img { width: 580px; } .motion-sensor #section13 .content img { left: -910px; top: -400px; width: 960px; } .motion-sensor #section15 .content img { width: 580px; } .motion-sensor #section16 .bg { padding-bottom: 0; height: 990px; } .motion-sensor #section17 .bg { padding-bottom: 0; height: 1000px; } .motion-sensor #section18 .bg { height: 930px; padding-bottom: 0; } .motion-sensor #section20 .content { top: 94%; } .motion-sensor #section20 .bg { padding-bottom: 0; height: 960px; } } .wall-plug #video { overflow: hidden; height: 280px; } .wall-plug #video .content { color: #ffffff; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; } .wall-plug #section3 .content img { height: 200px; width: auto; } .wall-plug #section3 .content .col-1 img { margin-bottom: 3rem; } .wall-plug #section4 { background-color: #f6f6f6; } .wall-plug #section5 { background: #eaeaea; background: linear-gradient(to bottom, #ffffff 0%, #ffffff 43%, #eaeaea 82%, #eaeaea 85%, #ffffff 100%); } .wall-plug #section5 .features { margin-top: 2rem; margin-bottom: 5rem; } .wall-plug #section5 .features img { height: 60px; width: auto; margin-bottom: 2rem; } .wall-plug #section5 .types .col-1 > img, .wall-plug #section5 .types .col-2 > img { height: 130px; width: auto; } .wall-plug #section5 .types .col-1 p, .wall-plug #section5 .types .col-2 p { color: #0090FF; } .wall-plug #section5 .types .col-1 p img, .wall-plug #section5 .types .col-2 p img { height: 50px; width: auto; display: inline-block; } .wall-plug #section5 .types .col-1 p { text-align: right; } .wall-plug #section5 .types .col-1 p img { margin-left: 1rem; margin-right: 1.5rem; } .wall-plug #section5 .types .col-2 p { text-align: left; } .wall-plug #section5 .types .col-2 p img { margin-left: 1.5rem; margin-right: 1rem; } .wall-plug #section6 .content { position: absolute; z-index: 10; color: #fff; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .wall-plug #section6 .content h2 { padding-bottom: 0; } .wall-plug #section6 .content h2 b { text-transform: uppercase; letter-spacing: 2px; font-size: 140%; } .wall-plug #section6 .bg { height: 260px; } .wall-plug #section6 .bg .layer { display: none; } .wall-plug #section7 .plug { position: relative; width: 100%; height: 0; padding: 0 0 97.92332268370608% 0; overflow: hidden; } .wall-plug #section7 .plug div { position: absolute; display: block; top: 0; width: 100%; height: 100%; background-size: 200.47923322683707% 300.652528548124%; } .wall-plug #section7 .colors-blue { background-position: 0.1589825119236884% 0.08130081300813008%; } .wall-plug #section7 .colors-green { background-position: 0.1589825119236884% 50%; } .wall-plug #section7 .colors-orange { background-position: 0.1589825119236884% 99.91869918699187%; } .wall-plug #section7 .colors-red { background-position: 99.84101748807632% 0.08130081300813008%; } .wall-plug #section7 .colors-shadow { background-position: 50% 50%; } .wall-plug #section7 .colors-violet { background-position: 99.84101748807632% 50%; } .wall-plug #section7 .colors-yellow { background-position: 99.84101748807632% 99.91869918699187%; } .wall-plug #section7 figure { display: none; } .wall-plug #section7 .slider-wrapper { margin-top: 2.4rem; margin-bottom: 2.4rem; } .wall-plug #section7 .slider-wrapper .slider { width: 84%; } .wall-plug #section10 .content { position: absolute; top: 0; z-index: 10; } .wall-plug #section10 .bg { height: 0; padding-bottom: 142.25%; } .wall-plug #section11 .content { position: relative; } .wall-plug #section11 .bg { height: 0; padding-bottom: 85%; } .wall-plug #section12 .bg { height: 0; padding-bottom: 90.5%; } .wall-plug #section12 .bg img { width: 100%; height: auto; } .wall-plug #section12 .bg small { position: absolute; z-index: 12; bottom: 3px; text-align: center; width: 100%; font-size: 70%; } .wall-plug #section12 .swiper-pagination { position: relative; margin-top: 2.4rem; z-index: 100; } .wall-plug #section12 .swiper-pagination .swiper-pagination-icon { display: inline-block; width: 60px; height: 60px; padding: 0; margin: 0 auto; background-size: 306.6666666666667% 205%; position: relative; cursor: pointer; } .wall-plug #section12 .swiper-pagination .swiper-pagination-icon span { position: absolute; top: 105%; left: -30%; width: 160%; text-align: center; } .wall-plug #section12 .swiper-pagination .swiper-pagination-icon.active span { color: #0090ff; } .wall-plug #section12 .icon-current { background-position: 0.8064516129032258% 1.5873015873015872%; } .wall-plug #section12 .icon-current.active { background-position: 0.8064516129032258% 98.41269841269842%; } .wall-plug #section12 .icon-history { background-position: 50% 1.5873015873015872%; } .wall-plug #section12 .icon-history.active { background-position: 50% 98.41269841269842%; } .wall-plug #section12 .icon-statistics { background-position: 99.19354838709677% 1.5873015873015872%; } .wall-plug #section12 .icon-statistics.active { background-position: 99.19354838709677% 98.41269841269842%; } .wall-plug #section13 .content, .wall-plug #section14 .content { background-color: #eaeaea; position: relative; z-index: 10; } .wall-plug #section13 .bg, .wall-plug #section14 .bg { height: 0; padding-bottom: 144%; } .wall-plug #section15 .bg { height: 0; padding-bottom: 132.25%; } .wall-plug #section16 .bg { height: 0; padding-bottom: 128.4%; } .wall-plug #section17 .content { padding-bottom: 0; position: relative; } .wall-plug #section17 .bg { height: 0; padding-bottom: 84.25%; } .wall-plug #section17 .plug-anim { max-width: 275px; max-height: 198px; width: 275px; height: 198px; position: relative; margin: 0 auto; -webkit-transform: scale(0.7) translateX(20%); transform: scale(0.7) translateX(20%); } .wall-plug #section17 .plug-anim div { background-size: 301.45454545454544% 101.01010101010101%; display: block; width: 275px; height: 198px; position: absolute; top: 0; left: 0; } .wall-plug #section17 .plug-anim div.anim1 { background-position: 0.18050541516245489% 50%; } .wall-plug #section17 .plug-anim div.anim2 { background-position: 50% 50%; } .wall-plug #section17 .plug-anim div.anim3 { background-position: 99.81949458483754% 50%; } .wall-plug #section17 .plug-anim p { color: #0090ff; z-index: 1000; position: absolute; top: 40%; left: -120px; padding: 0; } .wall-plug #section17 .plug-anim p:after { content: ''; width: 120px; position: absolute; top: 50%; left: 110%; border-bottom: 1px solid #0090ff; } .wall-plug #section18 .bg { height: 0; padding-bottom: 130%; } .wall-plug #section19 { background-color: #e8e5e3; } .wall-plug #section19 .content { position: absolute; z-index: 10; } .wall-plug #section19 .tv-anim { position: relative; height: 0; padding-bottom: 130%; } .wall-plug #section19 .tv-anim div { position: absolute; width: 100%; height: 100%; background-size: cover; background-position: 50% 50%; } .wall-plug #section19 .tv-anim div.anim3, .wall-plug #section19 .tv-anim div.anim4 { display: none; } .wall-plug #section20 .content { padding-bottom: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .wall-plug #section20 svg { position: relative; left: 50%; -webkit-transform-origin: 50% 0 0; transform-origin: 50% 0 0; -webkit-transform: translateX(-50%) scale(0.9); transform: translateX(-50%) scale(0.9); } .wall-plug #section20 .anim { height: 0; padding-bottom: 137.25%; } .wall-plug #section20 .anim div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .wall-plug #section20 .anim .anim3 { background-color: rgba(0, 0, 0, 0.5); } .wall-plug #section21 { background-color: #eaeaea; } .wall-plug #section21 .content { position: relative; } .wall-plug #section21 .content img { max-width: 200px; margin-top: 2.4rem; margin-bottom: 1rem; } .wall-plug #section22 .content { position: absolute; z-index: 10; } .wall-plug #section22 .icon-feature { text-align: left; width: 210px; position: relative; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .wall-plug #section22 .icon-feature img { width: 60px; height: auto; float: left; margin-right: 3rem; } .wall-plug #section22 .icon-feature p { padding-bottom: 0; line-height: 1.2; } .wall-plug #section22 .icon-feature p:nth-of-type(1) { padding-top: .5rem; } .wall-plug #section22 .icon-feature p:nth-of-type(2) { font-size: 160%; } .wall-plug #section22 .bg { height: 0; padding-bottom: 155%; position: relative; } .wall-plug #section22 .bg .bg-second { position: absolute; top: 0; } .wall-plug .section-product-footer { background-color: #fff; } .wall-plug #homekit-enabled .edge img { width: auto; height: 40px; } .wall-plug #homekit-enabled .content { position: relative; background-color: #f6f6f6; } .wall-plug #homekit-enabled .bg { background-color: #f6f6f6; height: 230px; background-position: 50% 0; background-size: auto 180px; } .wall-plug #homekit-enabled .bg small { display: inline-block; position: absolute; z-index: 12; bottom: 15px; text-align: center; width: 100%; font-size: 70%; padding: 0 20px; } .wall-plug.us #section3 .content img { height: 180px; width: auto; margin: 0; } .wall-plug.us #section3 .content .col-1 { text-align: center; } .wall-plug.us #section3 .content .col-1 img { margin-bottom: 24px; } .wall-plug.us #section3 .content .col-2 { text-align: right; } .wall-plug.us #section3 .content .col-3 { text-align: left; } .wall-plug.us #section4 video { max-width: 100%; } .wall-plug.us #section5 .features { margin-bottom: 3rem; } .wall-plug.us #section5 .features .col-phoneS-1, .wall-plug.us #section5 .features .col-phoneS-2, .wall-plug.us #section5 .features .col-phoneS-3, .wall-plug.us #section5 .features .col-phoneS-4, .wall-plug.us #section5 .features .col-phoneS-5, .wall-plug.us #section5 .features .col-phoneS-6, .wall-plug.us #section5 .features .col-phoneS-7, .wall-plug.us #section5 .features .col-phoneS-8, .wall-plug.us #section5 .features .col-phoneS-9, .wall-plug.us #section5 .features .col-phoneS-10, .wall-plug.us #section5 .features .col-phoneS-11, .wall-plug.us #section5 .features .col-phoneS-12, .wall-plug.us #section5 .features .col-phoneL-1, .wall-plug.us #section5 .features .col-phoneL-2, .wall-plug.us #section5 .features .col-phoneL-3, .wall-plug.us #section5 .features .col-phoneL-4, .wall-plug.us #section5 .features .col-phoneL-5, .wall-plug.us #section5 .features .col-phoneL-6, .wall-plug.us #section5 .features .col-phoneL-7, .wall-plug.us #section5 .features .col-phoneL-8, .wall-plug.us #section5 .features .col-phoneL-9, .wall-plug.us #section5 .features .col-phoneL-10, .wall-plug.us #section5 .features .col-phoneL-11, .wall-plug.us #section5 .features .col-phoneL-12, .wall-plug.us #section5 .features .col-tabletP-1, .wall-plug.us #section5 .features .col-tabletP-2, .wall-plug.us #section5 .features .col-tabletP-3, .wall-plug.us #section5 .features .col-tabletP-4, .wall-plug.us #section5 .features .col-tabletP-5, .wall-plug.us #section5 .features .col-tabletP-6, .wall-plug.us #section5 .features .col-tabletP-7, .wall-plug.us #section5 .features .col-tabletP-8, .wall-plug.us #section5 .features .col-tabletP-9, .wall-plug.us #section5 .features .col-tabletP-10, .wall-plug.us #section5 .features .col-tabletP-11, .wall-plug.us #section5 .features .col-tabletP-12, .wall-plug.us #section5 .features .col-tabletL-1, .wall-plug.us #section5 .features .col-tabletL-2, .wall-plug.us #section5 .features .col-tabletL-3, .wall-plug.us #section5 .features .col-tabletL-4, .wall-plug.us #section5 .features .col-tabletL-5, .wall-plug.us #section5 .features .col-tabletL-6, .wall-plug.us #section5 .features .col-tabletL-7, .wall-plug.us #section5 .features .col-tabletL-8, .wall-plug.us #section5 .features .col-tabletL-9, .wall-plug.us #section5 .features .col-tabletL-10, .wall-plug.us #section5 .features .col-tabletL-11, .wall-plug.us #section5 .features .col-tabletL-12, .wall-plug.us #section5 .features .col-desktopS-1, .wall-plug.us #section5 .features .col-desktopS-2, .wall-plug.us #section5 .features .col-desktopS-3, .wall-plug.us #section5 .features .col-desktopS-4, .wall-plug.us #section5 .features .col-desktopS-5, .wall-plug.us #section5 .features .col-desktopS-6, .wall-plug.us #section5 .features .col-desktopS-7, .wall-plug.us #section5 .features .col-desktopS-8, .wall-plug.us #section5 .features .col-desktopS-9, .wall-plug.us #section5 .features .col-desktopS-10, .wall-plug.us #section5 .features .col-desktopS-11, .wall-plug.us #section5 .features .col-desktopS-12, .wall-plug.us #section5 .features .col-desktopM-1, .wall-plug.us #section5 .features .col-desktopM-2, .wall-plug.us #section5 .features .col-desktopM-3, .wall-plug.us #section5 .features .col-desktopM-4, .wall-plug.us #section5 .features .col-desktopM-5, .wall-plug.us #section5 .features .col-desktopM-6, .wall-plug.us #section5 .features .col-desktopM-7, .wall-plug.us #section5 .features .col-desktopM-8, .wall-plug.us #section5 .features .col-desktopM-9, .wall-plug.us #section5 .features .col-desktopM-10, .wall-plug.us #section5 .features .col-desktopM-11, .wall-plug.us #section5 .features .col-desktopM-12, .wall-plug.us #section5 .features .col-desktopL-1, .wall-plug.us #section5 .features .col-desktopL-2, .wall-plug.us #section5 .features .col-desktopL-3, .wall-plug.us #section5 .features .col-desktopL-4, .wall-plug.us #section5 .features .col-desktopL-5, .wall-plug.us #section5 .features .col-desktopL-6, .wall-plug.us #section5 .features .col-desktopL-7, .wall-plug.us #section5 .features .col-desktopL-8, .wall-plug.us #section5 .features .col-desktopL-9, .wall-plug.us #section5 .features .col-desktopL-10, .wall-plug.us #section5 .features .col-desktopL-11, .wall-plug.us #section5 .features .col-desktopL-12, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneS-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneS-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-phoneL-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-phoneL-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletP-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletP-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-tabletL-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-tabletL-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopS-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopS-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopM-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopM-10, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-1, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-1, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-2, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-2, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-3, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-3, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-4, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-4, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-5, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-5, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-6, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-6, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-7, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-7, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-8, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-8, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-9, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-9, .wall-plug.us #section5 .features .contact-page #partnership .items .col-desktopL-10, .contact-page #partnership .items .wall-plug.us #section5 .features .col-desktopL-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneS-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneS-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneS-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-phoneL-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-phoneL-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-phoneL-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletP-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletP-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletP-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-tabletL-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-tabletL-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-tabletL-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopS-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopS-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopS-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopM-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopM-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopM-10, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-1, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-1, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-1, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-1, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-2, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-2, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-2, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-2, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-3, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-3, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-3, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-3, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-4, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-4, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-4, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-4, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-5, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-5, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-5, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-5, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-6, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-6, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-6, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-6, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-7, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-7, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-7, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-7, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-8, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-8, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-8, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-8, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-9, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-9, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-9, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-9, .wall-plug.us #section5 .features .values-page #numbers .items .col-desktopL-10, .values-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-10, .wall-plug.us #section5 .features .about-us-page #numbers .items .col-desktopL-10, .about-us-page #numbers .items .wall-plug.us #section5 .features .col-desktopL-10, .wall-plug.us #section5 .features .col-phoneS-1, .wall-plug.us #section5 .features .col-phoneS-2, .wall-plug.us #section5 .features .col-phoneS-3, .wall-plug.us #section5 .features .col-phoneS-4, .wall-plug.us #section5 .features .col-phoneS-5, .wall-plug.us #section5 .features .col-phoneS-6, .wall-plug.us #section5 .features .col-phoneS-7, .wall-plug.us #section5 .features .col-phoneS-8, .wall-plug.us #section5 .features .col-phoneS-9, .wall-plug.us #section5 .features .col-phoneS-10, .wall-plug.us #section5 .features .col-phoneL-1, .wall-plug.us #section5 .features .col-phoneL-2, .wall-plug.us #section5 .features .col-phoneL-3, .wall-plug.us #section5 .features .col-phoneL-4, .wall-plug.us #section5 .features .col-phoneL-5, .wall-plug.us #section5 .features .col-phoneL-6, .wall-plug.us #section5 .features .col-phoneL-7, .wall-plug.us #section5 .features .col-phoneL-8, .wall-plug.us #section5 .features .col-phoneL-9, .wall-plug.us #section5 .features .col-phoneL-10, .wall-plug.us #section5 .features .col-tabletP-1, .wall-plug.us #section5 .features .col-tabletP-2, .wall-plug.us #section5 .features .col-tabletP-3, .wall-plug.us #section5 .features .col-tabletP-4, .wall-plug.us #section5 .features .col-tabletP-5, .wall-plug.us #section5 .features .col-tabletP-6, .wall-plug.us #section5 .features .col-tabletP-7, .wall-plug.us #section5 .features .col-tabletP-8, .wall-plug.us #section5 .features .col-tabletP-9, .wall-plug.us #section5 .features .col-tabletP-10, .wall-plug.us #section5 .features .col-tabletL-1, .wall-plug.us #section5 .features .col-tabletL-2, .wall-plug.us #section5 .features .col-tabletL-3, .wall-plug.us #section5 .features .col-tabletL-4, .wall-plug.us #section5 .features .col-tabletL-5, .wall-plug.us #section5 .features .col-tabletL-6, .wall-plug.us #section5 .features .col-tabletL-7, .wall-plug.us #section5 .features .col-tabletL-8, .wall-plug.us #section5 .features .col-tabletL-9, .wall-plug.us #section5 .features .col-tabletL-10, .wall-plug.us #section5 .features .col-desktopS-1, .wall-plug.us #section5 .features .col-desktopS-2, .wall-plug.us #section5 .features .col-desktopS-3, .wall-plug.us #section5 .features .col-desktopS-4, .wall-plug.us #section5 .features .col-desktopS-5, .wall-plug.us #section5 .features .col-desktopS-6, .wall-plug.us #section5 .features .col-desktopS-7, .wall-plug.us #section5 .features .col-desktopS-8, .wall-plug.us #section5 .features .col-desktopS-9, .wall-plug.us #section5 .features .col-desktopS-10, .wall-plug.us #section5 .features .col-desktopM-1, .wall-plug.us #section5 .features .col-desktopM-2, .wall-plug.us #section5 .features .col-desktopM-3, .wall-plug.us #section5 .features .col-desktopM-4, .wall-plug.us #section5 .features .col-desktopM-5, .wall-plug.us #section5 .features .col-desktopM-6, .wall-plug.us #section5 .features .col-desktopM-7, .wall-plug.us #section5 .features .col-desktopM-8, .wall-plug.us #section5 .features .col-desktopM-9, .wall-plug.us #section5 .features .col-desktopM-10, .wall-plug.us #section5 .features .col-desktopL-1, .wall-plug.us #section5 .features .col-desktopL-2, .wall-plug.us #section5 .features .col-desktopL-3, .wall-plug.us #section5 .features .col-desktopL-4, .wall-plug.us #section5 .features .col-desktopL-5, .wall-plug.us #section5 .features .col-desktopL-6, .wall-plug.us #section5 .features .col-desktopL-7, .wall-plug.us #section5 .features .col-desktopL-8, .wall-plug.us #section5 .features .col-desktopL-9, .wall-plug.us #section5 .features .col-desktopL-10 { position: relative; min-height: 1px; padding-right: 5px; padding-left: 5px; width: 100%; } .wall-plug.us #section5 .features .col-phoneS { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .wall-plug.us #section5 .features .col-phoneS-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .wall-plug.us #section5 .features .col-phoneS-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .wall-plug.us #section5 .features .col-phoneS-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .wall-plug.us #section5 .features .col-phoneS-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .wall-plug.us #section5 .features .col-phoneS-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .wall-plug.us #section5 .features .col-phoneS-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .wall-plug.us #section5 .features .col-phoneS-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .wall-plug.us #section5 .features .col-phoneS-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .wall-plug.us #section5 .features .col-phoneS-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .wall-plug.us #section5 .features .col-phoneS-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .wall-plug.us #section5 .features .pull-phoneS-0 { right: auto; } .wall-plug.us #section5 .features .pull-phoneS-1 { right: 10%; } .wall-plug.us #section5 .features .pull-phoneS-2 { right: 20%; } .wall-plug.us #section5 .features .pull-phoneS-3 { right: 30%; } .wall-plug.us #section5 .features .pull-phoneS-4 { right: 40%; } .wall-plug.us #section5 .features .pull-phoneS-5 { right: 50%; } .wall-plug.us #section5 .features .pull-phoneS-6 { right: 60%; } .wall-plug.us #section5 .features .pull-phoneS-7 { right: 70%; } .wall-plug.us #section5 .features .pull-phoneS-8 { right: 80%; } .wall-plug.us #section5 .features .pull-phoneS-9 { right: 90%; } .wall-plug.us #section5 .features .pull-phoneS-10 { right: 100%; } .wall-plug.us #section5 .features .push-phoneS-0 { left: auto; } .wall-plug.us #section5 .features .push-phoneS-1 { left: 10%; } .wall-plug.us #section5 .features .push-phoneS-2 { left: 20%; } .wall-plug.us #section5 .features .push-phoneS-3 { left: 30%; } .wall-plug.us #section5 .features .push-phoneS-4 { left: 40%; } .wall-plug.us #section5 .features .push-phoneS-5 { left: 50%; } .wall-plug.us #section5 .features .push-phoneS-6 { left: 60%; } .wall-plug.us #section5 .features .push-phoneS-7 { left: 70%; } .wall-plug.us #section5 .features .push-phoneS-8 { left: 80%; } .wall-plug.us #section5 .features .push-phoneS-9 { left: 90%; } .wall-plug.us #section5 .features .push-phoneS-10 { left: 100%; } .wall-plug.us #section5 .features .offset-phoneS-1 { margin-left: 10%; } .wall-plug.us #section5 .features .offset-phoneS-2 { margin-left: 20%; } .wall-plug.us #section5 .features .offset-phoneS-3 { margin-left: 30%; } .wall-plug.us #section5 .features .offset-phoneS-4 { margin-left: 40%; } .wall-plug.us #section5 .features .offset-phoneS-5 { margin-left: 50%; } .wall-plug.us #section5 .features .offset-phoneS-6 { margin-left: 60%; } .wall-plug.us #section5 .features .offset-phoneS-7 { margin-left: 70%; } .wall-plug.us #section5 .features .offset-phoneS-8 { margin-left: 80%; } .wall-plug.us #section5 .features .offset-phoneS-9 { margin-left: 90%; } @media (min-width: 544px) { .wall-plug.us #section5 .features .col-phoneL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .wall-plug.us #section5 .features .col-phoneL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .wall-plug.us #section5 .features .col-phoneL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .wall-plug.us #section5 .features .col-phoneL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .wall-plug.us #section5 .features .col-phoneL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .wall-plug.us #section5 .features .col-phoneL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .wall-plug.us #section5 .features .col-phoneL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .wall-plug.us #section5 .features .col-phoneL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .wall-plug.us #section5 .features .col-phoneL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .wall-plug.us #section5 .features .col-phoneL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .wall-plug.us #section5 .features .col-phoneL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .wall-plug.us #section5 .features .pull-phoneL-0 { right: auto; } .wall-plug.us #section5 .features .pull-phoneL-1 { right: 10%; } .wall-plug.us #section5 .features .pull-phoneL-2 { right: 20%; } .wall-plug.us #section5 .features .pull-phoneL-3 { right: 30%; } .wall-plug.us #section5 .features .pull-phoneL-4 { right: 40%; } .wall-plug.us #section5 .features .pull-phoneL-5 { right: 50%; } .wall-plug.us #section5 .features .pull-phoneL-6 { right: 60%; } .wall-plug.us #section5 .features .pull-phoneL-7 { right: 70%; } .wall-plug.us #section5 .features .pull-phoneL-8 { right: 80%; } .wall-plug.us #section5 .features .pull-phoneL-9 { right: 90%; } .wall-plug.us #section5 .features .pull-phoneL-10 { right: 100%; } .wall-plug.us #section5 .features .push-phoneL-0 { left: auto; } .wall-plug.us #section5 .features .push-phoneL-1 { left: 10%; } .wall-plug.us #section5 .features .push-phoneL-2 { left: 20%; } .wall-plug.us #section5 .features .push-phoneL-3 { left: 30%; } .wall-plug.us #section5 .features .push-phoneL-4 { left: 40%; } .wall-plug.us #section5 .features .push-phoneL-5 { left: 50%; } .wall-plug.us #section5 .features .push-phoneL-6 { left: 60%; } .wall-plug.us #section5 .features .push-phoneL-7 { left: 70%; } .wall-plug.us #section5 .features .push-phoneL-8 { left: 80%; } .wall-plug.us #section5 .features .push-phoneL-9 { left: 90%; } .wall-plug.us #section5 .features .push-phoneL-10 { left: 100%; } .wall-plug.us #section5 .features .offset-phoneL-0 { margin-left: 0%; } .wall-plug.us #section5 .features .offset-phoneL-1 { margin-left: 10%; } .wall-plug.us #section5 .features .offset-phoneL-2 { margin-left: 20%; } .wall-plug.us #section5 .features .offset-phoneL-3 { margin-left: 30%; } .wall-plug.us #section5 .features .offset-phoneL-4 { margin-left: 40%; } .wall-plug.us #section5 .features .offset-phoneL-5 { margin-left: 50%; } .wall-plug.us #section5 .features .offset-phoneL-6 { margin-left: 60%; } .wall-plug.us #section5 .features .offset-phoneL-7 { margin-left: 70%; } .wall-plug.us #section5 .features .offset-phoneL-8 { margin-left: 80%; } .wall-plug.us #section5 .features .offset-phoneL-9 { margin-left: 90%; } } @media (min-width: 768px) { .wall-plug.us #section5 .features .col-tabletP { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .wall-plug.us #section5 .features .col-tabletP-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .wall-plug.us #section5 .features .col-tabletP-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .wall-plug.us #section5 .features .col-tabletP-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .wall-plug.us #section5 .features .col-tabletP-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .wall-plug.us #section5 .features .col-tabletP-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .wall-plug.us #section5 .features .col-tabletP-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .wall-plug.us #section5 .features .col-tabletP-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .wall-plug.us #section5 .features .col-tabletP-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .wall-plug.us #section5 .features .col-tabletP-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .wall-plug.us #section5 .features .col-tabletP-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .wall-plug.us #section5 .features .pull-tabletP-0 { right: auto; } .wall-plug.us #section5 .features .pull-tabletP-1 { right: 10%; } .wall-plug.us #section5 .features .pull-tabletP-2 { right: 20%; } .wall-plug.us #section5 .features .pull-tabletP-3 { right: 30%; } .wall-plug.us #section5 .features .pull-tabletP-4 { right: 40%; } .wall-plug.us #section5 .features .pull-tabletP-5 { right: 50%; } .wall-plug.us #section5 .features .pull-tabletP-6 { right: 60%; } .wall-plug.us #section5 .features .pull-tabletP-7 { right: 70%; } .wall-plug.us #section5 .features .pull-tabletP-8 { right: 80%; } .wall-plug.us #section5 .features .pull-tabletP-9 { right: 90%; } .wall-plug.us #section5 .features .pull-tabletP-10 { right: 100%; } .wall-plug.us #section5 .features .push-tabletP-0 { left: auto; } .wall-plug.us #section5 .features .push-tabletP-1 { left: 10%; } .wall-plug.us #section5 .features .push-tabletP-2 { left: 20%; } .wall-plug.us #section5 .features .push-tabletP-3 { left: 30%; } .wall-plug.us #section5 .features .push-tabletP-4 { left: 40%; } .wall-plug.us #section5 .features .push-tabletP-5 { left: 50%; } .wall-plug.us #section5 .features .push-tabletP-6 { left: 60%; } .wall-plug.us #section5 .features .push-tabletP-7 { left: 70%; } .wall-plug.us #section5 .features .push-tabletP-8 { left: 80%; } .wall-plug.us #section5 .features .push-tabletP-9 { left: 90%; } .wall-plug.us #section5 .features .push-tabletP-10 { left: 100%; } .wall-plug.us #section5 .features .offset-tabletP-0 { margin-left: 0%; } .wall-plug.us #section5 .features .offset-tabletP-1 { margin-left: 10%; } .wall-plug.us #section5 .features .offset-tabletP-2 { margin-left: 20%; } .wall-plug.us #section5 .features .offset-tabletP-3 { margin-left: 30%; } .wall-plug.us #section5 .features .offset-tabletP-4 { margin-left: 40%; } .wall-plug.us #section5 .features .offset-tabletP-5 { margin-left: 50%; } .wall-plug.us #section5 .features .offset-tabletP-6 { margin-left: 60%; } .wall-plug.us #section5 .features .offset-tabletP-7 { margin-left: 70%; } .wall-plug.us #section5 .features .offset-tabletP-8 { margin-left: 80%; } .wall-plug.us #section5 .features .offset-tabletP-9 { margin-left: 90%; } } @media (min-width: 992px) { .wall-plug.us #section5 .features .col-tabletL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .wall-plug.us #section5 .features .col-tabletL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .wall-plug.us #section5 .features .col-tabletL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .wall-plug.us #section5 .features .col-tabletL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .wall-plug.us #section5 .features .col-tabletL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .wall-plug.us #section5 .features .col-tabletL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .wall-plug.us #section5 .features .col-tabletL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .wall-plug.us #section5 .features .col-tabletL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .wall-plug.us #section5 .features .col-tabletL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .wall-plug.us #section5 .features .col-tabletL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .wall-plug.us #section5 .features .col-tabletL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .wall-plug.us #section5 .features .pull-tabletL-0 { right: auto; } .wall-plug.us #section5 .features .pull-tabletL-1 { right: 10%; } .wall-plug.us #section5 .features .pull-tabletL-2 { right: 20%; } .wall-plug.us #section5 .features .pull-tabletL-3 { right: 30%; } .wall-plug.us #section5 .features .pull-tabletL-4 { right: 40%; } .wall-plug.us #section5 .features .pull-tabletL-5 { right: 50%; } .wall-plug.us #section5 .features .pull-tabletL-6 { right: 60%; } .wall-plug.us #section5 .features .pull-tabletL-7 { right: 70%; } .wall-plug.us #section5 .features .pull-tabletL-8 { right: 80%; } .wall-plug.us #section5 .features .pull-tabletL-9 { right: 90%; } .wall-plug.us #section5 .features .pull-tabletL-10 { right: 100%; } .wall-plug.us #section5 .features .push-tabletL-0 { left: auto; } .wall-plug.us #section5 .features .push-tabletL-1 { left: 10%; } .wall-plug.us #section5 .features .push-tabletL-2 { left: 20%; } .wall-plug.us #section5 .features .push-tabletL-3 { left: 30%; } .wall-plug.us #section5 .features .push-tabletL-4 { left: 40%; } .wall-plug.us #section5 .features .push-tabletL-5 { left: 50%; } .wall-plug.us #section5 .features .push-tabletL-6 { left: 60%; } .wall-plug.us #section5 .features .push-tabletL-7 { left: 70%; } .wall-plug.us #section5 .features .push-tabletL-8 { left: 80%; } .wall-plug.us #section5 .features .push-tabletL-9 { left: 90%; } .wall-plug.us #section5 .features .push-tabletL-10 { left: 100%; } .wall-plug.us #section5 .features .offset-tabletL-0 { margin-left: 0%; } .wall-plug.us #section5 .features .offset-tabletL-1 { margin-left: 10%; } .wall-plug.us #section5 .features .offset-tabletL-2 { margin-left: 20%; } .wall-plug.us #section5 .features .offset-tabletL-3 { margin-left: 30%; } .wall-plug.us #section5 .features .offset-tabletL-4 { margin-left: 40%; } .wall-plug.us #section5 .features .offset-tabletL-5 { margin-left: 50%; } .wall-plug.us #section5 .features .offset-tabletL-6 { margin-left: 60%; } .wall-plug.us #section5 .features .offset-tabletL-7 { margin-left: 70%; } .wall-plug.us #section5 .features .offset-tabletL-8 { margin-left: 80%; } .wall-plug.us #section5 .features .offset-tabletL-9 { margin-left: 90%; } } @media (min-width: 1200px) { .wall-plug.us #section5 .features .col-desktopS { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .wall-plug.us #section5 .features .col-desktopS-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .wall-plug.us #section5 .features .col-desktopS-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .wall-plug.us #section5 .features .col-desktopS-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .wall-plug.us #section5 .features .col-desktopS-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .wall-plug.us #section5 .features .col-desktopS-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .wall-plug.us #section5 .features .col-desktopS-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .wall-plug.us #section5 .features .col-desktopS-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .wall-plug.us #section5 .features .col-desktopS-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .wall-plug.us #section5 .features .col-desktopS-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .wall-plug.us #section5 .features .col-desktopS-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .wall-plug.us #section5 .features .pull-desktopS-0 { right: auto; } .wall-plug.us #section5 .features .pull-desktopS-1 { right: 10%; } .wall-plug.us #section5 .features .pull-desktopS-2 { right: 20%; } .wall-plug.us #section5 .features .pull-desktopS-3 { right: 30%; } .wall-plug.us #section5 .features .pull-desktopS-4 { right: 40%; } .wall-plug.us #section5 .features .pull-desktopS-5 { right: 50%; } .wall-plug.us #section5 .features .pull-desktopS-6 { right: 60%; } .wall-plug.us #section5 .features .pull-desktopS-7 { right: 70%; } .wall-plug.us #section5 .features .pull-desktopS-8 { right: 80%; } .wall-plug.us #section5 .features .pull-desktopS-9 { right: 90%; } .wall-plug.us #section5 .features .pull-desktopS-10 { right: 100%; } .wall-plug.us #section5 .features .push-desktopS-0 { left: auto; } .wall-plug.us #section5 .features .push-desktopS-1 { left: 10%; } .wall-plug.us #section5 .features .push-desktopS-2 { left: 20%; } .wall-plug.us #section5 .features .push-desktopS-3 { left: 30%; } .wall-plug.us #section5 .features .push-desktopS-4 { left: 40%; } .wall-plug.us #section5 .features .push-desktopS-5 { left: 50%; } .wall-plug.us #section5 .features .push-desktopS-6 { left: 60%; } .wall-plug.us #section5 .features .push-desktopS-7 { left: 70%; } .wall-plug.us #section5 .features .push-desktopS-8 { left: 80%; } .wall-plug.us #section5 .features .push-desktopS-9 { left: 90%; } .wall-plug.us #section5 .features .push-desktopS-10 { left: 100%; } .wall-plug.us #section5 .features .offset-desktopS-0 { margin-left: 0%; } .wall-plug.us #section5 .features .offset-desktopS-1 { margin-left: 10%; } .wall-plug.us #section5 .features .offset-desktopS-2 { margin-left: 20%; } .wall-plug.us #section5 .features .offset-desktopS-3 { margin-left: 30%; } .wall-plug.us #section5 .features .offset-desktopS-4 { margin-left: 40%; } .wall-plug.us #section5 .features .offset-desktopS-5 { margin-left: 50%; } .wall-plug.us #section5 .features .offset-desktopS-6 { margin-left: 60%; } .wall-plug.us #section5 .features .offset-desktopS-7 { margin-left: 70%; } .wall-plug.us #section5 .features .offset-desktopS-8 { margin-left: 80%; } .wall-plug.us #section5 .features .offset-desktopS-9 { margin-left: 90%; } } @media (min-width: 1600px) { .wall-plug.us #section5 .features .col-desktopM { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .wall-plug.us #section5 .features .col-desktopM-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .wall-plug.us #section5 .features .col-desktopM-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .wall-plug.us #section5 .features .col-desktopM-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .wall-plug.us #section5 .features .col-desktopM-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .wall-plug.us #section5 .features .col-desktopM-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .wall-plug.us #section5 .features .col-desktopM-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .wall-plug.us #section5 .features .col-desktopM-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .wall-plug.us #section5 .features .col-desktopM-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .wall-plug.us #section5 .features .col-desktopM-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .wall-plug.us #section5 .features .col-desktopM-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .wall-plug.us #section5 .features .pull-desktopM-0 { right: auto; } .wall-plug.us #section5 .features .pull-desktopM-1 { right: 10%; } .wall-plug.us #section5 .features .pull-desktopM-2 { right: 20%; } .wall-plug.us #section5 .features .pull-desktopM-3 { right: 30%; } .wall-plug.us #section5 .features .pull-desktopM-4 { right: 40%; } .wall-plug.us #section5 .features .pull-desktopM-5 { right: 50%; } .wall-plug.us #section5 .features .pull-desktopM-6 { right: 60%; } .wall-plug.us #section5 .features .pull-desktopM-7 { right: 70%; } .wall-plug.us #section5 .features .pull-desktopM-8 { right: 80%; } .wall-plug.us #section5 .features .pull-desktopM-9 { right: 90%; } .wall-plug.us #section5 .features .pull-desktopM-10 { right: 100%; } .wall-plug.us #section5 .features .push-desktopM-0 { left: auto; } .wall-plug.us #section5 .features .push-desktopM-1 { left: 10%; } .wall-plug.us #section5 .features .push-desktopM-2 { left: 20%; } .wall-plug.us #section5 .features .push-desktopM-3 { left: 30%; } .wall-plug.us #section5 .features .push-desktopM-4 { left: 40%; } .wall-plug.us #section5 .features .push-desktopM-5 { left: 50%; } .wall-plug.us #section5 .features .push-desktopM-6 { left: 60%; } .wall-plug.us #section5 .features .push-desktopM-7 { left: 70%; } .wall-plug.us #section5 .features .push-desktopM-8 { left: 80%; } .wall-plug.us #section5 .features .push-desktopM-9 { left: 90%; } .wall-plug.us #section5 .features .push-desktopM-10 { left: 100%; } .wall-plug.us #section5 .features .offset-desktopM-0 { margin-left: 0%; } .wall-plug.us #section5 .features .offset-desktopM-1 { margin-left: 10%; } .wall-plug.us #section5 .features .offset-desktopM-2 { margin-left: 20%; } .wall-plug.us #section5 .features .offset-desktopM-3 { margin-left: 30%; } .wall-plug.us #section5 .features .offset-desktopM-4 { margin-left: 40%; } .wall-plug.us #section5 .features .offset-desktopM-5 { margin-left: 50%; } .wall-plug.us #section5 .features .offset-desktopM-6 { margin-left: 60%; } .wall-plug.us #section5 .features .offset-desktopM-7 { margin-left: 70%; } .wall-plug.us #section5 .features .offset-desktopM-8 { margin-left: 80%; } .wall-plug.us #section5 .features .offset-desktopM-9 { margin-left: 90%; } } @media (min-width: 2100px) { .wall-plug.us #section5 .features .col-desktopL { position: relative; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-height: 1px; padding-right: 5px; padding-left: 5px; } .wall-plug.us #section5 .features .col-desktopL-1 { -webkit-box-flex: 0; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; } .wall-plug.us #section5 .features .col-desktopL-2 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .wall-plug.us #section5 .features .col-desktopL-3 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .wall-plug.us #section5 .features .col-desktopL-4 { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .wall-plug.us #section5 .features .col-desktopL-5 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .wall-plug.us #section5 .features .col-desktopL-6 { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .wall-plug.us #section5 .features .col-desktopL-7 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .wall-plug.us #section5 .features .col-desktopL-8 { -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .wall-plug.us #section5 .features .col-desktopL-9 { -webkit-box-flex: 0; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .wall-plug.us #section5 .features .col-desktopL-10 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .wall-plug.us #section5 .features .pull-desktopL-0 { right: auto; } .wall-plug.us #section5 .features .pull-desktopL-1 { right: 10%; } .wall-plug.us #section5 .features .pull-desktopL-2 { right: 20%; } .wall-plug.us #section5 .features .pull-desktopL-3 { right: 30%; } .wall-plug.us #section5 .features .pull-desktopL-4 { right: 40%; } .wall-plug.us #section5 .features .pull-desktopL-5 { right: 50%; } .wall-plug.us #section5 .features .pull-desktopL-6 { right: 60%; } .wall-plug.us #section5 .features .pull-desktopL-7 { right: 70%; } .wall-plug.us #section5 .features .pull-desktopL-8 { right: 80%; } .wall-plug.us #section5 .features .pull-desktopL-9 { right: 90%; } .wall-plug.us #section5 .features .pull-desktopL-10 { right: 100%; } .wall-plug.us #section5 .features .push-desktopL-0 { left: auto; } .wall-plug.us #section5 .features .push-desktopL-1 { left: 10%; } .wall-plug.us #section5 .features .push-desktopL-2 { left: 20%; } .wall-plug.us #section5 .features .push-desktopL-3 { left: 30%; } .wall-plug.us #section5 .features .push-desktopL-4 { left: 40%; } .wall-plug.us #section5 .features .push-desktopL-5 { left: 50%; } .wall-plug.us #section5 .features .push-desktopL-6 { left: 60%; } .wall-plug.us #section5 .features .push-desktopL-7 { left: 70%; } .wall-plug.us #section5 .features .push-desktopL-8 { left: 80%; } .wall-plug.us #section5 .features .push-desktopL-9 { left: 90%; } .wall-plug.us #section5 .features .push-desktopL-10 { left: 100%; } .wall-plug.us #section5 .features .offset-desktopL-0 { margin-left: 0%; } .wall-plug.us #section5 .features .offset-desktopL-1 { margin-left: 10%; } .wall-plug.us #section5 .features .offset-desktopL-2 { margin-left: 20%; } .wall-plug.us #section5 .features .offset-desktopL-3 { margin-left: 30%; } .wall-plug.us #section5 .features .offset-desktopL-4 { margin-left: 40%; } .wall-plug.us #section5 .features .offset-desktopL-5 { margin-left: 50%; } .wall-plug.us #section5 .features .offset-desktopL-6 { margin-left: 60%; } .wall-plug.us #section5 .features .offset-desktopL-7 { margin-left: 70%; } .wall-plug.us #section5 .features .offset-desktopL-8 { margin-left: 80%; } .wall-plug.us #section5 .features .offset-desktopL-9 { margin-left: 90%; } } .wall-plug.us #section5 .types .col-1 > img { height: 160px; } .wall-plug.us #section10 .bg { padding-bottom: 165%; } .wall-plug.us #usb-charger .content { color: #fff; } .wall-plug.us #usb-charger .bg { height: 0; padding-bottom: 140%; } .wall-plug.us .section-packshot-slider .content { padding-bottom: 0; } .wall-plug.us .section-packshot-slider img { margin: 0 auto -20px; } .wall-plug #voice-control .content { position: relative; } .wall-plug #voice-control .content .amazon { width: auto; height: 45px; } .wall-plug #voice-control .content .google { width: auto; height: 45px; } .wall-plug #voice-control .content .apple { width: auto; height: 60px; } .wall-plug #voice-control .bg { height: 0; padding-bottom: 66%; } .wall-plug #voice-control .speech { position: absolute; z-index: 0; background-color: #0090ff; color: #fff; padding: 15px; border-radius: 8px; top: 0; right: 40%; -webkit-transform-origin: left bottom; transform-origin: left bottom; font-style: italic; text-align: center; } .wall-plug #voice-control .speech:after { content: ''; display: block; position: absolute; bottom: 3px; right: 23px; z-index: -1; width: 20px; height: 20px; background-color: #0090ff; -webkit-transform: rotate(215deg) skewX(60deg); transform: rotate(215deg) skewX(60deg); } @media (min-width: 544px) { .wall-plug.us #section5 .types .col-1 > img { height: 220px; } .wall-plug.us #usb-charger .bg { height: 0; padding-bottom: 100%; } } @media (min-width: 768px) { .wall-plug #video .content { top: 50%; } .wall-plug #video .bg { background-position: 29% 50%; } .wall-plug #section3 .content .col-1 { text-align: right; } .wall-plug #section5 .content .types .col-1 > img, .wall-plug #section5 .content .types .col-2 > img { height: 170px; } .wall-plug #section5 .content .types .col-1 { text-align: right; } .wall-plug #section5 .content .types .col-1 p img { margin-right: 2.5rem; } .wall-plug #section5 .content .types .col-2 { text-align: left; } .wall-plug #section5 .content .types .col-2 p img { margin-left: 2.5rem; } .wall-plug #section7 figure { display: block; } .wall-plug #section7 figure img { width: 70%; max-width: 120px; } .wall-plug #section7 .plug { margin-top: 2.4rem; } .wall-plug #section10 .bg { padding-bottom: 47.25%; } .wall-plug #section11 .content { position: absolute; z-index: 10; text-align: left; } .wall-plug #section11 .bg { padding-bottom: 39.75%; } .wall-plug #section12 .content { text-align: left; } .wall-plug #section12 .bg { padding-bottom: 40%; } .wall-plug #section12 .bg small { text-align: right; padding-right: 10px; } .wall-plug #section12 .swiper-pagination { margin-top: 6rem; } .wall-plug #section13 { background-color: #eaeaea; } .wall-plug #section13 .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; } .wall-plug #section13 .content .col-phoneS-10 { height: 376px; } .wall-plug #section13 .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; } .wall-plug #section13 .bg { padding-bottom: 0; height: 400px; width: 50%; } .wall-plug #section14 { background-color: #eaeaea; } .wall-plug #section14 .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; } .wall-plug #section14 .content .col-phoneS-10 { height: 376px; } .wall-plug #section14 .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; } .wall-plug #section14 .bg { padding-bottom: 0; height: 400px; width: 50%; left: 50%; } .wall-plug #section15 .content { text-align: left; } .wall-plug #section15 .bg { padding-bottom: 39%; } .wall-plug #section16 .bg { padding-bottom: 43%; } .wall-plug #section17 .content { position: absolute; z-index: 10; text-align: left; } .wall-plug #section17 .bg { padding-bottom: 48%; } .wall-plug #section18 .content { text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .wall-plug #section18 .content p { padding-bottom: 0; } .wall-plug #section18 .bg { padding-bottom: 39%; } .wall-plug #section19 .tv-anim { padding-bottom: 66%; } .wall-plug #section20 .anim { padding-bottom: 46%; } .wall-plug #section20 svg { position: relative; left: 0; -webkit-transform-origin: 50% 0 0; transform-origin: 50% 0 0; -webkit-transform: translateX(0) scale(1); transform: translateX(0) scale(1); } .wall-plug #section22 .content { text-align: left; } .wall-plug #section22 .content .icon-feature { width: auto; left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .wall-plug #section22 .bg { padding-bottom: 50%; } .wall-plug.us #section3 .content .col-1 img { margin-bottom: 0; } .wall-plug.us #section5 .types .col-1 { text-align: center; } .wall-plug.us #section5 .types .col-1 > img { height: 260px; } .wall-plug.us #section10 .bg { padding-bottom: 47.25%; } .wall-plug.us #section18 .content { top: 33%; } .wall-plug.us #usb-charger .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left; } .wall-plug.us #usb-charger .bg { padding-bottom: 50%; } .wall-plug #voice-control .content { position: relative; } .wall-plug #voice-control .content .logos { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 20px; } .wall-plug #voice-control .content .logos :nth-child(1) { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .wall-plug #voice-control .content .logos :nth-child(2) { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } .wall-plug #voice-control .content .logos :nth-child(3) { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .wall-plug #voice-control .content .amazon { height: 55px; margin: 0 20px; } .wall-plug #voice-control .content .google { height: 55px; margin: 0 0 0 20px; } .wall-plug #voice-control .content .apple { height: 70px; margin: 0 20px; } .wall-plug #voice-control .bg { padding-bottom: 66%; } .wall-plug #voice-control .speech { position: absolute; top: 23%; right: 43%; } .wall-plug #voice-control .speech br { display: none; } } @media (min-width: 992px) { .wall-plug #video h2 { font-size: 3.2rem; } .wall-plug #section13 .content .col-phoneS-10 { height: 466px; } .wall-plug #section13 .content img { width: 280px; } .wall-plug #section13 .bg { height: 490px; } .wall-plug #section14 .content .col-phoneS-10 { height: 466px; } .wall-plug #section14 .content img { width: 280px; } .wall-plug #section14 .bg { height: 490px; } .wall-plug.us .section-packshot-slider img { margin-top: 3rem; } .wall-plug.us .section-product-footer .top .content { padding-top: 2rem; } } @media (min-width: 1200px) { .wall-plug #section1 .bg { padding-bottom: 0; height: 740px; } .wall-plug #video { height: 340px; } .wall-plug #video h2 { font-size: 4rem; } .wall-plug #video .bg { background-position: 50% 50%; } .wall-plug #section3 .content img { height: 280px; width: auto; margin-top: 4.8rem; } .wall-plug #section4 .content { padding-bottom: 2.4rem; } .wall-plug #section5 .content .types .col-1 > img, .wall-plug #section5 .content .types .col-2 > img { height: 260px; } .wall-plug #section5 .features { margin-top: 4.8rem; } .wall-plug #section6 .bg { position: relative; height: 540px; } .wall-plug #section6 .bg .layer { position: absolute; display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: 100%; } .wall-plug #section7 .plug { margin-top: 6rem; } .wall-plug #section12 .content { position: absolute; z-index: 10; text-align: center; } .wall-plug #section12 .swiper-pagination { margin-top: 2rem; } .wall-plug #section12 .bg small { text-align: center; font-size: 60%; padding-right: 0; } .wall-plug #section13 .content .col-phoneS-10 { height: 556px; } .wall-plug #section13 .content img { width: 380px; } .wall-plug #section13 .bg { height: 610px; } .wall-plug #section14 .content .col-phoneS-10 { height: 556px; } .wall-plug #section14 .content img { width: 380px; } .wall-plug #section14 .bg { height: 610px; } .wall-plug #section17 .bg { padding-bottom: 39%; } .wall-plug #section17 .plug-anim { -webkit-transform: scale(0.8) translateX(13%); transform: scale(0.8) translateX(13%); } .wall-plug #section19 .tv-anim { padding-bottom: 60%; } .wall-plug #section19 .tv-anim div.anim3, .wall-plug #section19 .tv-anim div.anim4 { display: block; } .wall-plug #section21 .content img { max-width: 280px; } .wall-plug #section22 .icon-feature img { width: 70px; } .wall-plug #section22 .bg { padding-bottom: 39.6%; } .wall-plug #homekit-enabled .content { position: absolute; background-color: transparent; } .wall-plug #homekit-enabled .bg { padding-bottom: 0; height: 820px; background-size: auto 820px; background-position: 50% 40px; } .wall-plug #homekit-enabled .bg small { font-size: 60%; } .wall-plug #device-versions small { font-size: 60%; line-height: 1.5; display: inline-block; } .wall-plug.us #section3 .content img { height: 280px; width: auto; margin-top: 4.8rem; } .wall-plug.us #section5 .types .col-1 > img { height: 360px; } .wall-plug.us #usb-charger .bg { padding-bottom: 40%; } .wall-plug.us .section-packshot-slider img { margin-top: 4rem; } .wall-plug #voice-control .content { position: absolute; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .wall-plug #voice-control .content .logos { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .wall-plug #voice-control .content .amazon { height: 55px; margin: 0 20px 0 -18px; } .wall-plug #voice-control .content .google { height: 55px; margin: 0 0 0 30px; } .wall-plug #voice-control .content .apple { height: 70px; margin: 0 20px; } .wall-plug #voice-control .bg { padding-bottom: 43%; } .wall-plug #voice-control .speech { position: absolute; top: 17%; right: 26%; } .wall-plug #voice-control .speech br { display: none; } } @media (min-width: 1600px) { .wall-plug #section1 .bg { height: 900px; } .wall-plug #video { height: 400px; } .wall-plug #video h2 { font-size: 4.8rem; } .wall-plug #section10 .bg { padding-bottom: 34.25%; } .wall-plug #section12 .swiper-pagination { margin-top: 6rem; } .wall-plug #section13 .content .col-phoneS-10 { height: 776px; } .wall-plug #section13 .content img { width: 460px; } .wall-plug #section13 .bg { height: 840px; } .wall-plug #section14 .content .col-phoneS-10 { height: 776px; } .wall-plug #section14 .content img { width: 460px; } .wall-plug #section14 .bg { height: 840px; } .wall-plug #section19 .bg { padding-bottom: 50%; } .wall-plug #homekit-enabled .bg { height: 920px; background-size: auto 800px; background-position: 50% 130px; } .wall-plug.us #section3 .content img { height: 320px; } .wall-plug.us #section5 .types .col-1 > img { height: 440px; } .wall-plug.us #section10 .bg { padding-bottom: 34.25%; } .wall-plug.us #usb-charger .bg { padding-bottom: 35%; } .wall-plug.us .section-packshot-slider img { margin-top: 6rem; } .wall-plug #voice-control .content .amazon { height: 65px; margin: 0 20px 0 -24px; } .wall-plug #voice-control .content .google { height: 65px; margin: 0 0 0 40px; } .wall-plug #voice-control .content .apple { height: 80px; margin: 0 20px; } .wall-plug #voice-control .bg { padding-bottom: 39%; } .wall-plug #voice-control .speech { position: absolute; top: 20%; right: 33%; } } @media (min-width: 2100px) { .wall-plug #section1 .bg { height: 1040px; } .wall-plug #video { height: 440px; } .wall-plug #video h2 { font-size: 6rem; } .wall-plug #section10 .bg { padding-bottom: 28.125%; } .wall-plug.us #section3 .content img { height: 360px; } .wall-plug #voice-control .content .amazon { height: 75px; margin: 0 20px 0 -25px; } .wall-plug #voice-control .content .google { height: 75px; margin: 0 0 0 40px; } .wall-plug #voice-control .content .apple { height: 90px; margin: 0 20px; } } .co-sensor .section-siri br { display: block; } .co-sensor .section-siri sub { margin-top: 1.5em; display: block; line-height: 1.4; } .co-sensor .section-homekit-enabled .content img { position: absolute; top: 580px; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .co-sensor .section-homekit-enabled .bg { padding-bottom: 0; height: 700px; } .co-sensor #co-header { height: 490px; } .co-sensor #co-header .content { padding-top: 2.4rem; } .co-sensor #co-header .content h1 { padding-bottom: 0; } .co-sensor #co-header .content p { font-size: 1.8rem; text-transform: uppercase; } .co-sensor #co-header .content hr { color: transparent; border-bottom: 1px solid #444444; display: inline-block; width: 120px; } .co-sensor #co-header .bg { width: 100%; height: 490px; } .co-sensor #one-device-many-functions .content h2 { padding-bottom: 0; } .co-sensor #one-device-many-functions video, .co-sensor #one-device-many-functions .stills { display: none; } .co-sensor #one-device-many-functions .no-padding { padding-left: 0; padding-right: 0; } .co-sensor #one-device-many-functions .sub { padding-top: 0; background-color: #fbfbfb; } .co-sensor #one-device-many-functions .sub .buttons a { color: #7e7e7e; display: inline-block; margin: 0; padding: 2rem 0 0; width: 23%; transition: all 500ms; } .co-sensor #one-device-many-functions .sub .buttons a span { display: block; font-size: 12px; } .co-sensor #one-device-many-functions .sub .buttons a svg { height: 40px; width: 40px; } .co-sensor #one-device-many-functions .sub .buttons a.active { color: #0090ff; } .co-sensor #one-device-many-functions .sub .separator { display: none; } .co-sensor #one-device-many-functions .sub .textcontent { padding-top: 3rem; position: relative; } .co-sensor #one-device-many-functions .sub .textcontent p { position: relative; display: none; padding-bottom: 0; } .co-sensor #one-device-many-functions .sub .textcontent p:first-child { display: block; } .co-sensor #one-device-many-functions .image-wrapper { background: white; background: linear-gradient(to bottom, white 70%, #fbfbfb 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#fbfbfb', GradientType=0); position: relative; height: 260px; } .co-sensor #one-device-many-functions .image-wrapper div { display: none; } .co-sensor #one-device-many-functions .image-wrapper div:first-child { display: block; } .co-sensor #one-device-many-functions .image-wrapper div svg { width: 146px; height: auto; z-index: 2; position: absolute; top: 5px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .co-sensor #one-device-many-functions .image-wrapper img { height: 100%; width: auto; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .co-sensor #bsi-cert .content, .co-sensor #confidence .content { position: relative; } .co-sensor #bsi-cert .bg, .co-sensor #confidence .bg { padding-bottom: 70%; } .co-sensor #confidence .content { margin-bottom: -6em; } .co-sensor #detailed-information #di-swiper { position: absolute; z-index: 12; height: 280px; width: 100%; bottom: 0; } .co-sensor #detailed-information #di-swiper .swiper-slide { height: 280px; background-size: 100% auto; background-position: center bottom; background-repeat: no-repeat; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip { display: inline-block; -ms-touch-action: none; touch-action: none; -webkit-touch-callout: none; opacity: 0; -webkit-transform: translate(-50%, 10px); transform: translate(-50%, 10px); transition: all 500ms; width: auto; max-width: 320px; background-color: #fff; color: #444444; text-align: center; position: absolute; left: 50%; border-radius: 6px; padding: 10px; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip h3 { padding-bottom: 3px; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip p { padding-bottom: 0; font-size: 85%; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip.healthy { bottom: 16%; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip.healthy h3 { color: #3ade84; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip.moderate { bottom: 26%; min-width: 200px; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip.moderate h3 { color: #ffc000; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip.alarm { bottom: 40%; min-width: 200px; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip.alarm h3 { color: #ee2828; } .co-sensor #detailed-information #di-swiper .swiper-slide .tooltip.active { opacity: 1; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); } .co-sensor #detailed-information #di-svg { display: none; } .co-sensor #detailed-information .content { position: absolute; z-index: 10; background-color: transparent; } .co-sensor #detailed-information .bg { height: auto; } .co-sensor #detailed-information .di-swiper-bgs { height: 570px; width: 100%; position: relative; z-index: 3; } .co-sensor #detailed-information .di-swiper-bgs .swiper-bg { height: 100%; width: 100%; position: absolute; background-size: auto 100%; background-repeat: no-repeat; } .co-sensor #simplicity .icons ul { margin-top: 1.2rem; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .co-sensor #simplicity .icons li { -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; display: block; background-repeat: no-repeat; margin-bottom: 4rem; width: 100%; } .co-sensor #simplicity .icons li svg { height: 90px; width: auto; } .co-sensor #simplicity .icons li span { text-align: center; display: inline-block; width: 220px; } .co-sensor #simplicity .icons li h3 { padding: 1.5rem 0 1rem; font-size: 125%; font-weight: 400; } .co-sensor #simplicity .icons li.safe h3 { color: #7ed35f; } .co-sensor #simplicity .icons li.moderate h3 { color: #facb4b; } .co-sensor #simplicity .icons li.alarming h3 { color: #e25741; } .co-sensor #well-being .content { position: absolute; z-index: 10; } .co-sensor #well-being .bg { height: 0; padding-bottom: 165%; background-position: 50% 100%; } .co-sensor #well-being .hint sub { text-align: center; max-width: 260px; } .co-sensor #monitor-appliances .icons ul { margin-top: 1.2rem; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .co-sensor #monitor-appliances .icons li { -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; display: block; background-repeat: no-repeat; margin-bottom: 4rem; width: 50%; } .co-sensor #monitor-appliances .icons li img { height: 90px; width: auto; margin-bottom: 1.6rem; } .co-sensor #monitor-appliances .icons li span { text-align: center; display: block; width: 100%; } .co-sensor #silent-killer { background-color: #e8e8e8; } .co-sensor #silent-killer .bg { height: 300px; } .co-sensor #silent-killer #sk-particles { opacity: 0.01; position: absolute; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(0, 120, 255, 0.4) 0%, rgba(88, 218, 255, 0.4) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bf0078ff', endColorstr='#bf58daff', GradientType=0); } .co-sensor #silent-killer .content a { display: inline-block; padding: 6px 66px 6px 42px; border-radius: 16px / 50%; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5); position: relative; top: 0; background: #fff url("../img/common/eye-icon.svg") no-repeat; background-position: center right 20px; background-size: auto 20px; transition: all 100ms; margin-bottom: 1rem; } .co-sensor #accidents { background-color: #e8e8e8; } .co-sensor #accidents .content { color: #0090ff; } .co-sensor #accidents .content h2 { font-size: 300%; } .co-sensor #accidents sub { margin-top: 1.5em; display: block; } .co-sensor #accidents sub a { text-decoration: underline; } .co-sensor #caring-for-your-home .content { color: #444444; } .co-sensor #caring-for-your-home .swiper-pagination { position: relative; margin-top: 2.4rem; z-index: 100; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon { display: inline-block; width: 100px; height: auto; padding: 0; margin: 0 auto; text-align: center; position: relative; cursor: pointer; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon span { width: 100%; text-align: center; color: #7e7e7e; transition: color 250ms; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon.active span { color: #0090ff; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon svg { height: 50px; width: auto; display: block; margin-left: auto; margin-right: auto; margin-bottom: 1rem; } .co-sensor #caring-for-your-home .bg, .co-sensor #caring-for-your-home .swiper-slide { height: 280px; } .co-sensor #caring-for-your-home .bg img, .co-sensor #caring-for-your-home .swiper-slide img { position: relative; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); height: 100%; width: auto; } .co-sensor #caring-for-your-home sub { margin-bottom: 1.5em; display: block; line-height: 1.4; } .co-sensor #to-know-more .charts-swiper-container { margin-bottom: 2.4rem; } .co-sensor #to-know-more .charts-swiper-container .swiper-slide { height: 0; padding-bottom: 50%; background-size: auto 100%; } .co-sensor #to-know-more .charts-swiper-container .slide1 { background-position: 0 0; } .co-sensor #to-know-more .charts-swiper-container .slide2 { background-position: 50% 0; } .co-sensor #to-know-more .charts-swiper-container .slide3 { background-position: 100% 0; } .co-sensor #to-know-more .charts-swiper-container .swiper-pagination-bullet { opacity: 1; border: 1px solid #0090ff; background-color: transparent; } .co-sensor #to-know-more .charts-swiper-container .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #0090ff; } .co-sensor #protection-system .content { background-color: #f1f0ee; padding-bottom: 0; } .co-sensor #protection-system .bg { height: 470px; } .co-sensor #control-the-threat .content { background-color: #fff; color: #444444; position: relative; } .co-sensor #control-the-threat .bg { height: 230px; } .co-sensor #control-the-threat .swiper-button-prev, .co-sensor #control-the-threat .swiper-button-next { display: none; } .co-sensor #control-the-threat .swiper-pagination-bullet { opacity: 1; background-color: transparent; border: 1px solid #fff; } .co-sensor #control-the-threat .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff; } .co-sensor #instant-notifications .content { background-color: #f4f4f3; position: relative; } .co-sensor #instant-notifications .bg { padding-bottom: 100%; } .co-sensor #your-loved-ones .content { position: relative; color: #444444; } .co-sensor #your-loved-ones .bg { height: 240px; } .co-sensor #stand-alone .content { position: relative; color: #444444; } .co-sensor #stand-alone .bg { height: 310px; } .co-sensor .section-packshot-slider sub { margin-top: 1.5em; margin-bottom: 3rem; display: block; } .safari.ios .co-sensor #one-device-many-functions .image-wrapper > div { height: 100%; } .safari.ios .co-sensor #one-device-many-functions .image-wrapper svg { top: -100px; } @media screen and (max-width: 480px) { .co-sensor .section-homekit-enabled .bg { top: 50px; } .co-sensor .section-homekit-enabled .content img { top: 620px; } } @media screen and (max-width: 360px) { .co-sensor #well-being .content .hint img { width: 60px; height: auto; } .co-sensor #well-being .content .hint figcaption { width: 140px; } .co-sensor #well-being .content .hint figcaption div { font-size: 80%; } .co-sensor #well-being .content .hint figcaption div span { font-size: 150%; } } @media screen and (min-width: 361px) and (max-width: 480px) { .co-sensor #well-being .content .hint img { width: 60px; height: auto; } .co-sensor #well-being .content .hint figcaption { width: 180px; } .co-sensor #well-being .content .hint figcaption div { font-size: 80%; } .co-sensor #well-being .content .hint figcaption div span { font-size: 170%; } } @media screen and (min-width: 360px) { .co-sensor #bsi-cert .bg, .co-sensor #confidence .bg { padding-bottom: 50%; } .co-sensor #well-being .content .hint img { width: 60px; height: auto; } .co-sensor #well-being .content .hint figcaption { width: 180px; } .co-sensor #well-being .content .hint figcaption div { font-size: 80%; } .co-sensor #well-being .content .hint figcaption div span { font-size: 170%; } .co-sensor #control-the-threat .bg { height: 280px; } .co-sensor #detailed-information .di-swiper-bgs { height: 540px; } .co-sensor #one-device-many-functions .sub .buttons a svg { height: 50px; width: 50px; } } @media (min-width: 544px) { .co-sensor .section-homekit-enabled .content img { top: 480px; } .co-sensor .section-homekit-enabled .bg { height: 580px; } .co-sensor #co-header .content p { font-size: inherit; } .co-sensor #bsi-cert .bg, .co-sensor #confidence .bg { padding-bottom: 40%; } .co-sensor #well-being .bg { padding-bottom: 135%; } .co-sensor #monitor-appliances .icons li { width: 33.33%; } .co-sensor #caring-for-your-home .bg, .co-sensor #caring-for-your-home .swiper-slide { height: 330px; } .co-sensor #your-loved-ones .bg { height: 310px; } .co-sensor #detailed-information #di-swiper { height: 340px; } .co-sensor #detailed-information #di-swiper .swiper-slide { height: 340px; } .co-sensor #detailed-information .di-swiper-bgs { height: 550px; } } @media (min-width: 768px) { .co-sensor .section-homekit-enabled .bg { height: 0; padding-bottom: 41.5625%; } .co-sensor .section-homekit-enabled .content { text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .co-sensor .section-homekit-enabled .content img { position: relative; top: 0; -webkit-transform: none; transform: none; } .co-sensor #co-header { height: auto; } .co-sensor #co-header .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); padding: 0; } .co-sensor #co-header .bg { height: 0; padding-bottom: 39.0625%; } .co-sensor #bsi-cert .bg, .co-sensor #confidence .bg { padding-bottom: 30%; } .co-sensor #simplicity .icons li { width: 50%; } .co-sensor #well-being .content { text-align: left; } .co-sensor #well-being .bg { padding-bottom: 50%; } .co-sensor #well-being .hint sub { text-align: left; max-width: 290px; } .co-sensor #monitor-appliances .icons li img { height: 110px; } .co-sensor #silent-killer .bg { height: 0; padding-bottom: 40.3125%; } .co-sensor #accidents { background-color: #fff; } .co-sensor #caring-for-your-home .content { position: absolute; z-index: 10; color: #fff; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .co-sensor #caring-for-your-home .bg, .co-sensor #caring-for-your-home .swiper-slide { height: 560px; } .co-sensor #caring-for-your-home .bg img, .co-sensor #caring-for-your-home .swiper-slide img { position: absolute; left: -240px; -webkit-transform: none; transform: none; } .co-sensor #caring-for-your-home .swiper-pagination { position: relative; margin-top: 2.4rem; z-index: 100; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon { display: inline-block; width: 100px; height: auto; padding: 0; margin: 0 auto; text-align: center; position: relative; cursor: pointer; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon span { width: 100%; text-align: center; color: #7e7e7e; transition: color 250ms; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon.active span { color: #fff; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon svg { width: auto; display: block; margin-left: auto; margin-right: auto; } .co-sensor #to-know-more .charts-swiper-container { margin-bottom: 1rem; } .co-sensor #protection-system .bg { height: 560px; } .co-sensor #control-the-threat .bg { height: 0; padding-bottom: 52%; } .co-sensor #instant-notifications .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; color: #fff; } .co-sensor #instant-notifications .content .col-phoneS-10 { height: 400px; } .co-sensor #instant-notifications .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; } .co-sensor #instant-notifications .bg { padding-bottom: 0; height: 420px; width: 100%; } .co-sensor #your-loved-ones .bg { height: 0; padding-bottom: 37.5%; } .co-sensor #detailed-information #di-swiper { height: 430px; } .co-sensor #detailed-information #di-swiper .swiper-slide { height: 430px; } .co-sensor #detailed-information .di-swiper-bgs { height: 570px; } .co-sensor #stand-alone .bg { background-position: 100% 50%; } .co-sensor #one-device-many-functions .sub .textcontent { min-height: 140px; } .co-sensor #one-device-many-functions .sub .buttons a svg { height: 55px; width: 55px; } .co-sensor #one-device-many-functions .sub .buttons a span { font-size: inherit; } .co-sensor #one-device-many-functions .sub .image-wrapper { height: 330px; } .safari.ios .co-sensor #detailed-information #di-svg { position: relative; } } @media (max-width: 1199px) { .co-sensor #silent-killer .content a:active { top: 1px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); } .co-sensor #to-know-more .content p { padding-bottom: 0; } .co-sensor #protection-system a.int, .co-sensor #protection-system .tooltip { display: none; } } @media (min-width: 992px) { .co-sensor #simplicity .icons li { width: 33.33%; } .co-sensor #well-being .content { position: absolute; z-index: 10; } .co-sensor #well-being .bg { height: 0; padding-bottom: 42.109375%; } .co-sensor #monitor-appliances .icons ul { margin-top: 4.8rem; } .co-sensor #monitor-appliances .icons ul li { padding: 0 4.8rem; } .co-sensor #monitor-appliances .icons ul li span { font-size: 100%; } .co-sensor #caring-for-your-home .bg, .co-sensor #caring-for-your-home .swiper-slide { height: 660px; } .co-sensor #caring-for-your-home .bg img, .co-sensor #caring-for-your-home .swiper-slide img { position: absolute; left: -220px; } .co-sensor #protection-system .bg { height: 670px; } .co-sensor #control-the-threat .content { background-color: transparent; position: absolute; z-index: 10; color: inherit; } .co-sensor #instant-notifications .content .col-phoneS-10 { height: 440px; } .co-sensor #instant-notifications .content img { width: 280px; } .co-sensor #instant-notifications .bg { height: 470px; } .co-sensor #your-loved-ones .content, .co-sensor #stand-alone .content { position: absolute; z-index: 10; color: #fff; } .co-sensor #your-loved-ones .content { color: #444444; } .co-sensor #detailed-information #di-swiper { height: 500px; } .co-sensor #detailed-information #di-swiper .swiper-slide { height: 500px; } .co-sensor #detailed-information .di-swiper-bgs { height: 700px; } } @media (min-width: 1200px) { .co-sensor #bsi-cert .bg, .co-sensor #confidence .bg { height: 0; padding-bottom: 23.828125%; } .co-sensor #simplicity .icons ul { margin-top: 2.4rem; } .co-sensor #simplicity .icons li svg { height: 110px; width: auto; } .co-sensor #simplicity .icons li span { text-align: center; display: inline-block; width: 240px; } .co-sensor #well-being .content { text-align: left; } .co-sensor #well-being .hint sub { max-width: 360px; } .co-sensor #monitor-appliances .icons ul li { width: 16.66%; padding: 0 3.2rem; } .co-sensor #monitor-appliances .icons ul li img { height: 120px; } .co-sensor #monitor-appliances .icons ul li span { font-size: 110%; } .co-sensor #silent-killer .content { position: absolute; z-index: 10; } .co-sensor #silent-killer .content a { position: relative; border-radius: 20px / 50%; } .co-sensor #silent-killer .content a:hover { top: 1px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); } .co-sensor #silent-killer .content h2, .co-sensor #silent-killer .content p { transition: all 1000ms; } .co-sensor #silent-killer.active .content h2, .co-sensor #silent-killer.active .content p { color: #fff; } .co-sensor #accidents .content h2 { font-size: 450%; } .co-sensor #caring-for-your-home .swiper-pagination { margin-top: 3rem; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon { font-size: 90%; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon svg { margin-bottom: 2rem; height: 50px; width: auto; } .co-sensor #caring-for-your-home .content br { display: none; } .co-sensor #caring-for-your-home .bg, .co-sensor #caring-for-your-home .swiper-slide { height: 720px; } .co-sensor #caring-for-your-home .bg img, .co-sensor #caring-for-your-home .swiper-slide img { position: absolute; left: 0; } .co-sensor #to-know-more .content { position: absolute; z-index: 10; } .co-sensor #to-know-more .bg { position: relative; height: 0; padding-bottom: 41.25%; } .co-sensor #to-know-more video { width: 102%; height: auto; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .co-sensor #protection-system .content { position: absolute; z-index: 10; background-color: transparent; } .co-sensor #protection-system .content p { padding: 0 40px; } .co-sensor #protection-system .content h2, .co-sensor #protection-system .content p { left: -30px; } .co-sensor #protection-system .bg { height: 580px; } .co-sensor #protection-system a.int { position: absolute; z-index: 100; width: 70px; height: 70px; border-radius: 50%; cursor: pointer; display: block; } .co-sensor #protection-system #integration1 { top: 68px; left: 360px; } .co-sensor #protection-system #integration2 { top: 164px; left: 512px; } .co-sensor #protection-system #integration3 { top: 113px; left: 677px; } .co-sensor #protection-system #integration4 { top: 33px; left: 885px; } .co-sensor #protection-system #integration5 { top: 250px; left: 925px; } .co-sensor #protection-system #integration6 { top: 404px; left: 677px; } .co-sensor #protection-system .tooltip { background-color: rgba(0, 144, 255, 0.9); color: #fff; width: 200px; box-sizing: border-box; font-size: 12px; text-align: center; padding: 12px; border-radius: 6px; position: absolute; z-index: 100; opacity: 0; -webkit-transform-origin: top center; transform-origin: top center; } .co-sensor #control-the-threat .bg { padding-bottom: 37.5%; } .co-sensor #control-the-threat .swiper-button-prev, .co-sensor #control-the-threat .swiper-button-next { display: block; background: none; border-right: 4px solid rgba(255, 255, 255, 0.5); border-bottom: 4px solid rgba(255, 255, 255, 0.5); width: 72px; height: 72px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; } .co-sensor #control-the-threat .swiper-button-prev { -webkit-transform: rotate(135deg); transform: rotate(135deg); left: 60px; } .co-sensor #control-the-threat .swiper-button-prev:hover { -webkit-transform: rotate(135deg) scale(1.2); transform: rotate(135deg) scale(1.2); } .co-sensor #control-the-threat .swiper-button-next { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); right: 60px; } .co-sensor #control-the-threat .swiper-button-next:hover { -webkit-transform: rotate(-45deg) scale(1.2); transform: rotate(-45deg) scale(1.2); } .co-sensor #instant-notifications .content .col-phoneS-10 { height: 540px; } .co-sensor #instant-notifications .content img { width: 360px; } .co-sensor #instant-notifications .bg { height: 590px; } .co-sensor #control-the-threat .bg, .co-sensor #stand-alone .bg { height: 780px; padding-bottom: 0; } .co-sensor #your-loved-ones .bg { height: 0; padding-bottom: 41%; } .co-sensor #detailed-information .content { position: absolute; z-index: 10; color: #fff; } .co-sensor #detailed-information #di-svg { display: block; position: absolute; bottom: 0; width: 100%; height: auto; } .co-sensor #detailed-information #di-svg circle { cursor: pointer; } .co-sensor #detailed-information #di-svg .title, .co-sensor #detailed-information #di-svg .copy { text-anchor: middle; cursor: default; } .co-sensor #detailed-information #di-svg .title { font-size: 21px; } .co-sensor #detailed-information #di-svg .copy { font-size: 13px; } .co-sensor #detailed-information #di-swiper, .co-sensor #detailed-information .di-swiper-bgs { display: none; } .co-sensor #detailed-information .bg { padding-bottom: 40%; height: 0; overflow: hidden; } .co-sensor #one-device-many-functions > .content { position: absolute; z-index: 10; padding-bottom: 0; } .co-sensor #one-device-many-functions .video-wrapper, .co-sensor #one-device-many-functions .stills { height: 0; padding-bottom: 42.1875%; } .co-sensor #one-device-many-functions .video-wrapper { padding-top: 4rem; background: white; background: linear-gradient(to bottom, white 70%, #fbfbfb 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#fbfbfb', GradientType=0); } .co-sensor #one-device-many-functions video { display: block; width: 100%; height: auto; position: absolute; } .co-sensor #one-device-many-functions .stills, .co-sensor #one-device-many-functions #od-cover-photo { width: 100%; display: block; position: absolute; } .co-sensor #one-device-many-functions .stills > div, .co-sensor #one-device-many-functions #od-cover-photo > div { display: none; } .co-sensor #one-device-many-functions .stills > div svg, .co-sensor #one-device-many-functions #od-cover-photo > div svg { width: 11%; height: auto; z-index: 2; position: absolute; top: 25%; left: 65%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .co-sensor #one-device-many-functions .stills img, .co-sensor #one-device-many-functions #od-cover-photo img { position: absolute; width: 100%; height: auto; } .co-sensor #one-device-many-functions .sub { margin-top: -60px; padding-top: 0; background-color: #fbfbfb; } .co-sensor #one-device-many-functions .sub .buttons a { color: #7e7e7e; display: inline-block; width: auto; margin: 0 2rem; padding: 0 1rem 4rem; border-bottom: 2px solid transparent; transition: all 500ms; } .co-sensor #one-device-many-functions .sub .buttons a span { display: block; font-size: inherit; } .co-sensor #one-device-many-functions .sub .buttons a span br { display: none; } .co-sensor #one-device-many-functions .sub .buttons a.active { color: #0090ff; border-bottom: 2px solid #0090ff; } .co-sensor #one-device-many-functions .sub .buttons a svg { width: 70px; height: 70px; } .co-sensor #one-device-many-functions .sub .separator { display: block; width: 70%; margin: 0 auto; height: 1px; background-color: #d6d6d6; } .co-sensor #one-device-many-functions .sub .textcontent { padding-top: 4rem; position: relative; min-height: 180px; } .co-sensor #one-device-many-functions .sub .textcontent p { position: absolute; display: none; } .co-sensor #one-device-many-functions .sub .textcontent p:first-child { display: none; } .firefox .co-sensor #caring-for-your-home .bg, .firefox .co-sensor #caring-for-your-home .swiper-slide { height: 660px; padding-bottom: 0; } .safari.mac .co-sensor #detailed-information #di-svg { height: 100%; } .safari.mac .co-sensor #one-device-many-functions .stills > div svg { top: 10%; } } @media (min-width: 1600px) { .co-sensor #simplicity .icons ul { margin-top: 4.8rem; } .co-sensor #simplicity .icons li svg { height: 130px; width: auto; } .co-sensor #simplicity .icons li span { text-align: center; display: inline-block; width: 260px; } .co-sensor #monitor-appliances .icons ul { margin-top: 9.6rem; } .co-sensor #monitor-appliances .icons ul li img { height: 140px; } .co-sensor #caring-for-your-home .bg, .co-sensor #caring-for-your-home .swiper-slide { height: 920px; } .co-sensor #caring-for-your-home .swiper-pagination { margin-top: 4rem; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon { font-size: 90%; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon svg { height: 60px; } .co-sensor #protection-system .content h2, .co-sensor #protection-system .content p { left: -50px; } .co-sensor #protection-system .bg { height: 750px; } .co-sensor #protection-system a.int { width: 90px; height: 90px; } .co-sensor #protection-system #integration1 { top: 88px; left: 451px; } .co-sensor #protection-system #integration2 { top: 213px; left: 648px; } .co-sensor #protection-system #integration3 { top: 147px; left: 862px; } .co-sensor #protection-system #integration4 { top: 44px; left: 1131px; } .co-sensor #protection-system #integration5 { top: 325px; left: 1183px; } .co-sensor #protection-system #integration6 { top: 523px; left: 862px; } .co-sensor #protection-system .tooltip { width: 220px; font-size: 14px; } .co-sensor #instant-notifications .content .col-phoneS-10 { height: 720px; } .co-sensor #instant-notifications .content img { width: 460px; } .co-sensor #instant-notifications .bg { height: 780px; } .co-sensor #control-the-threat .bg { height: 920px; padding-bottom: 0; } .co-sensor #your-loved-ones .bg, .co-sensor #stand-alone .bg { height: 0; padding-bottom: 41%; } .co-sensor #one-device-many-functions .sub { margin-top: -110px; } .co-sensor #one-device-many-functions .sub .buttons a { margin: 0 3rem; } .firefox .co-sensor #caring-for-your-home .bg, .firefox .co-sensor #caring-for-your-home .swiper-slide { height: 840px; } } @media (min-width: 2100px) { .co-sensor #simplicity .icons ul { margin-top: 6.4rem; } .co-sensor #simplicity .icons li svg { height: 160px; width: auto; } .co-sensor #simplicity .icons li span { text-align: center; display: inline-block; width: 300px; } .co-sensor #monitor-appliances .icons ul li img { height: 170px; } .co-sensor #accidents .content p { padding: 0 80px; } .co-sensor #caring-for-your-home .bg, .co-sensor #caring-for-your-home .swiper-slide { height: 1060px; } .co-sensor #caring-for-your-home .swiper-pagination { margin-top: 4rem; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon { font-size: 100%; width: 100%; display: inline-block; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon span { width: 100%; } .co-sensor #caring-for-your-home .swiper-pagination .swiper-pagination-icon svg { height: 70px; } .co-sensor #caring-for-your-home sub { padding: 0 6em; } .co-sensor #protection-system .content p { padding: 0 90px; } .co-sensor #protection-system .content h2, .co-sensor #protection-system .content p { left: -60px; } .co-sensor #protection-system .bg { height: 915px; } .co-sensor #protection-system a.int { width: 110px; height: 110px; } .co-sensor #protection-system #integration1 { top: 108px; left: 619px; } .co-sensor #protection-system #integration2 { top: 260px; left: 858px; } .co-sensor #protection-system #integration3 { top: 180px; left: 1118px; } .co-sensor #protection-system #integration4 { top: 54px; left: 1448px; } .co-sensor #protection-system #integration5 { top: 395px; left: 1511px; } .co-sensor #protection-system #integration6 { top: 638px; left: 1119px; } .co-sensor #protection-system .tooltip { width: 260px; font-size: 16px; } .co-sensor #instant-notifications .content .col-phoneS-10 { height: 850px; } .co-sensor #instant-notifications .content img { width: 580px; } .co-sensor #instant-notifications .bg { height: 920px; } .co-sensor #one-device-many-functions .sub { margin-top: -130px; } .co-sensor #one-device-many-functions .sub .buttons a { margin: 0 4rem; } .co-sensor #one-device-many-functions .sub .buttons a svg { width: 90px; height: 90px; } .co-sensor #one-device-many-functions .sub .separator { width: 54%; } .co-sensor #control-the-threat .bg, .co-sensor #your-loved-ones .bg, .co-sensor #stand-alone .bg { height: 0; padding-bottom: 37.5%; } .firefox .co-sensor #caring-for-your-home .bg, .firefox .co-sensor #caring-for-your-home .swiper-slide { height: 1180px; padding-bottom: 0; } } .relay-switches .content p { padding-bottom: 1rem; } .relay-switches .section-product-header { height: auto; } .relay-switches .section-product-header .content h1 { text-transform: uppercase; padding-bottom: 0; } .relay-switches .section-product-header .content p { font-size: 1.8rem; text-transform: uppercase; } .relay-switches .section-product-header .content hr { color: transparent; border: 0; border-bottom: 1px solid #444444; display: inline-block; width: 120px; } .relay-switches .section-product-header .bg { height: 470px; } .relay-switches .section-product-header .animparts { position: absolute; bottom: 30px; left: 50%; -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transform: scale(0.67) translateX(-57%) translateY(15%); transform: scale(0.67) translateX(-57%) translateY(15%); } .relay-switches .section-product-header .base { opacity: 0; } .relay-switches .section-product-header .device { left: 150%; } .relay-switches .section-product-header .wallswitch { opacity: 0; } .relay-switches .section-product-header .shadow { opacity: 0; } .relay-switches .section-product-header .spinner { display: none; } .relay-switches .section-product-header .button-replay { position: absolute; bottom: 20px; left: 50%; -webkit-transform: translateX(-18%); transform: translateX(-18%); display: none; font-weight: 400; font-size: 90%; padding-top: 4px; } .relay-switches .section-product-header .button-replay:after { width: 20px; height: 20px; background-size: 18px; left: -18px; } .relay-switches #many-functions p { padding-bottom: 2.4rem; } .relay-switches #many-functions ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row; flex-flow: row; -ms-flex-wrap: wrap; flex-wrap: wrap; } .relay-switches #many-functions li { width: 50%; -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; margin-bottom: 2.4rem; } .relay-switches #many-functions li span { display: block; } .relay-switches #many-functions .col-1 img { width: 240px; margin-top: 2.4rem; margin-bottom: 2.4rem; } .relay-switches #many-functions .buttons { margin-top: 3rem; margin-bottom: 2rem; } .relay-switches #many-functions .buttons a { display: inline-block; margin: 0 .5rem; padding: .5rem 2rem; min-width: 130px; border: 1px solid #0090FF; border-radius: 16px/50%; transition: all 250ms; } .relay-switches #many-functions .buttons a:hover, .relay-switches #many-functions .buttons a.active { color: #fff; background-color: #0090FF; text-decoration: none; } .relay-switches #many-functions .swiper-slide { background-color: #fff; } .relay-switches #universal-apps .content { position: relative; padding-bottom: 0; background-color: #e4e3e8; } .relay-switches #universal-apps .bg { height: 230px; padding-bottom: 0; } .relay-switches .section-product-sizing .col-1 img, .relay-switches .section-product-sizing .col-2 img { height: 180px; width: auto; } .relay-switches .section-product-sizing .col-1 img { margin-bottom: 0; } .relay-switches .section-product-sizing .col-2 img { margin-top: 0; } .relay-switches #easy-setup .content { position: relative; padding-bottom: 0; background-color: #f7f7f7; } .relay-switches #easy-setup .bg { height: 360px; padding-bottom: 0; } .relay-switches #easy-setup #tutorial-video, .relay-switches #easy-setup #connection-scheme { text-align: left; } .relay-switches #easy-setup #tutorial-video a, .relay-switches #easy-setup #connection-scheme a { display: inline-block; } .relay-switches #easy-setup #tutorial-video { margin-top: 2rem; margin-bottom: 1rem; } .relay-switches #easy-setup #tutorial-video img { width: 30px; } .relay-switches #easy-setup #tutorial-video span { vertical-align: bottom; margin-left: 1.5rem; } .relay-switches #easy-setup #connection-scheme img { width: 25px; } .relay-switches #easy-setup #connection-scheme span { margin-left: 2rem; } .relay-switches #control-what-you-want .content p { padding-bottom: 2.4rem; } .relay-switches #control-what-you-want .icons { padding-right: 0; padding-left: 0; } .relay-switches #control-what-you-want .icons ul { width: 100%; display: block; } .relay-switches #control-what-you-want .icons li { display: inline-block; width: 32%; margin-bottom: 2.4rem; } .relay-switches #control-what-you-want .icons li:last-of-type { display: none; } .relay-switches #power-metering .content { position: relative; background-color: #000e19; } .relay-switches #power-metering .content p { padding-bottom: 2.4rem; } .relay-switches #power-metering .content a { display: inline-block; } .relay-switches #power-metering .content a span { display: block; margin-bottom: 1rem; font-size: 18px; } .relay-switches #power-metering .bg { height: 360px; padding-bottom: 0; } .relay-switches #multifunc-device .content { position: relative; } .relay-switches #multifunc-device .content p { padding-bottom: 2.4rem; } .relay-switches #multifunc-device .bg { height: 0; padding-bottom: 64%; } .relay-switches #multifunc-device .copy-slides .swiper-slide { background-color: #fff; } .relay-switches #multifunc-device .pagination { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 2.4rem; } .relay-switches #multifunc-device .pagination a { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; width: 33.3%; } .relay-switches #multifunc-device .pagination a span { display: block; color: #7e7e7e; } .relay-switches #multifunc-device .pagination a.active span { color: #0090ff; } .relay-switches #multifunc-device .pagination a svg { width: 50px; height: 50px; } .relay-switches #worldwide-access .content { position: relative; } .relay-switches #worldwide-access .bg { height: 0; padding-bottom: 81%; } .relay-switches #standby-savings .content { position: relative; } .relay-switches #standby-savings .bg { height: 300px; padding-bottom: 0; } .relay-switches #never-forget .content { position: relative; } .relay-switches #never-forget .bg { height: 0; padding-bottom: 160%; } .relay-switches #take-your-own { background: #fff; } .relay-switches #take-your-own .item { padding-bottom: 2.4rem; } .relay-switches #take-your-own .item:first-of-type { padding-bottom: 3.6rem; } .relay-switches #take-your-own .copy { text-align: left; padding-top: 1rem; font-weight: 700; } .relay-switches #take-your-own .copy span { display: block; font-size: 120%; color: #0090FF; font-weight: 300; } .relay-switches #take-your-own .image img { width: 100%; height: auto; } .relay-switches #take-your-own .icons ul { margin-top: 1.2rem; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .relay-switches #take-your-own .icons li { -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; display: block; background-repeat: no-repeat; margin-bottom: 2rem; width: 50%; } .relay-switches #take-your-own .icons li img { height: 50px; width: auto; margin-bottom: .6rem; } .relay-switches #take-your-own .icons li span { text-align: center; display: block; width: 100%; font-size: 90%; } .relay-switches .section-homekit-enabled .content img { position: absolute; top: 350px; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .relay-switches .section-homekit-enabled .bg { padding-bottom: 0; height: 510px; } .relay-switches .action-box { display: inline-block; border: 1px solid #0090ff; border-radius: 10px; background-color: rgba(0, 144, 255, 0.025); text-align: left; padding: 1rem 3rem; font-size: 16px; margin-bottom: .5rem; } .relay-switches .action-box .line { margin: .4rem 0; color: #0090ff; } .relay-switches .action-box .line span { color: #7e7e7e; } .relay-switches .section-product-footer .top .content a { padding: 8px 30px; background: #fff; } .relay-switches .ios.safari .section-product-header .button-replay { padding-top: 2px; } .relay-switches .ios.safari .section-product-header .button-replay:after { width: 20px; height: 20px; background-size: contain; left: -12px; } .relay-switches .spinner { width: 70px; position: absolute; z-index: 10; top: calc(50% - 10px); left: calc(50% - 35px); text-align: center; -webkit-transform: scale(1.4); transform: scale(1.4); } .relay-switches .spinner > div { width: 18px; height: 18px; background-color: rgba(0, 144, 255, 0.85); border-radius: 100%; display: inline-block; -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both; animation: sk-bouncedelay 1.4s infinite ease-in-out both; } .relay-switches .spinner .bounce1 { -webkit-animation-delay: -0.32s; animation-delay: -0.32s; } .relay-switches .spinner .bounce2 { -webkit-animation-delay: -0.16s; animation-delay: -0.16s; } @-webkit-keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); } 40% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); } 40% { -webkit-transform: scale(1); transform: scale(1); } } @media (max-width: 543px) { .relay-switches .section-product-header .content { padding-top: 3.6rem; } } @media (min-width: 544px) { .relay-switches #many-functions ul { margin-top: 1.2rem; } .relay-switches #universal-apps .bg { height: 270px; } .relay-switches #easy-setup .bg { height: 450px; } .relay-switches #power-metering .bg { height: 430px; } .relay-switches #standby-savings .bg { height: 390px; } .relay-switches .section-homekit-enabled .content img { top: 310px; } .relay-switches .section-homekit-enabled .bg { height: 450px; } } @media (min-width: 768px) { .relay-switches .section-product-header .content { padding-top: 4.8rem; } .relay-switches #many-functions ul { margin-top: 3.6rem; } .relay-switches #many-functions li { width: 25%; padding: 0 10px; } .relay-switches #many-functions .col-1 img, .relay-switches #many-functions .col-2 img { width: 180px; } .relay-switches #many-functions .col-1 img { margin: 2.4rem; } .relay-switches #universal-apps .content { position: absolute; background-color: transparent; } .relay-switches #universal-apps .bg { height: 0; padding-bottom: 52%; } .relay-switches .section-product-sizing .col-1 img, .relay-switches .section-product-sizing .col-2 img { height: 220px; } .relay-switches .section-product-sizing .col-1 img { margin-right: 4.8rem; margin-bottom: 1rem; } .relay-switches .section-product-sizing .col-2 img { margin-top: 2.4rem; margin-left: 1rem; margin-bottom: 1rem; } .relay-switches #easy-setup .content { position: absolute; background-color: transparent; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); padding-top: 0; } .relay-switches #easy-setup .bg { background-position: 65% 50%; } .relay-switches #control-what-you-want .icons li { width: 19%; margin-bottom: 2.4rem; } .relay-switches #control-what-you-want .icons li:last-of-type { display: inline-block; } .relay-switches #power-metering .content { position: absolute; background-color: transparent; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .relay-switches #power-metering .content a span { display: inline-block; margin-right: .5rem; font-size: 18px; } .relay-switches #power-metering .content a img { width: 30px; height: 30px; vertical-align: top; } .relay-switches #power-metering .bg { height: 0; padding-bottom: 50%; background-position: 70% 50%; } .relay-switches #power-metering video { height: 100%; width: auto; position: absolute; left: -210px; } .relay-switches #worldwide-access .content { position: absolute; color: #fff; text-align: left; top: 30%; -webkit-transform: translateY(-30%); transform: translateY(-30%); } .relay-switches #worldwide-access .bg { padding-bottom: 45%; } .relay-switches #standby-savings .content { position: absolute; color: #fff; } .relay-switches #standby-savings .bg { height: 0; padding-bottom: 45%; } .relay-switches #never-forget .content { position: absolute; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .relay-switches #never-forget .content p { padding-bottom: 3.6rem; } .relay-switches #never-forget .bg { padding-bottom: 50%; background-position: 0 50%; } .relay-switches #multifunc-device .image-slides { position: absolute; top: 0; right: 0; width: 46%; height: 100%; } .relay-switches #multifunc-device .app { padding-top: 0; } .relay-switches #multifunc-device .bg { padding-bottom: 0; height: 100%; } .relay-switches #take-your-own .copy { text-align: center; padding-bottom: 2.4rem; } .relay-switches #take-your-own .icons li { width: 33.33%; padding-left: 20px; padding-right: 20px; } .relay-switches #take-your-own .icons li img { height: 70px; margin-bottom: 1.6rem; } .relay-switches #take-your-own .center-vert { position: relative; top: 40%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .relay-switches .hint { background-color: rgba(255, 255, 255, 0.7); -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; } .relay-switches .hint figcaption { color: #0090ff; } .relay-switches .hint > div { display: inline-block; width: 100%; margin-top: 1rem; } .relay-switches .hint > div span { display: inline-block; background-color: rgba(255, 255, 255, 0.8); border: 1px solid #fff; border-radius: 6px; color: #0090ff; width: 48%; padding: .7rem 0; text-align: center; } .relay-switches .hint > div span:first-of-type { margin-right: 2%; } .relay-switches .section-homekit-enabled .content { text-align: left; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .relay-switches .section-homekit-enabled .content img { position: relative; top: 0; -webkit-transform: translateX(0); transform: translateX(0); margin-top: 2.4rem; } } @media (min-width: 992px) { .relay-switches #easy-setup .bg { background-position: 70% 50%; height: 520px; } .relay-switches #many-functions .buttons a { min-width: 190px; } .relay-switches #take-your-own .icons ul { margin-top: 3.2rem; margin-bottom: 3.2rem; } .relay-switches #take-your-own .icons ul li { width: 20%; } .relay-switches #power-metering video { left: -260px; } .relay-switches .action-box { border-radius: 12px; padding: 1rem 3.5rem; font-size: 18px; margin-bottom: .5rem; } } @media (min-width: 1200px) { .relay-switches .section-product-header .content { top: 40%; -webkit-transform: translateY(-50%); transform: translateY(-50%); display: none; } .relay-switches .section-product-header video, .relay-switches .section-product-header img { width: 100%; height: auto; position: absolute; top: 0; left: 0; } .relay-switches .section-product-header video { opacity: .001; } .relay-switches .section-product-header img { z-index: 10; } .relay-switches .section-product-header .bg { height: 0; padding-bottom: 42.96875%; } .relay-switches .section-product-header .spinner { display: block; z-index: 11; } .relay-switches .section-product-header .button-replay { position: absolute; bottom: 120px; left: 28%; -webkit-transform: translateX(-18%); transform: translateX(-18%); display: none; font-weight: 400; font-size: 100%; padding-top: 4px; } .relay-switches .section-product-header .button-replay:after { width: 28px; height: 28px; background-size: contain; left: -32px; } .relay-switches #universal-apps .bg { padding-bottom: 50%; } .relay-switches .section-product-sizing .col-1 img, .relay-switches .section-product-sizing .col-2 img { height: 260px; margin-top: 4.8rem; } .relay-switches .section-product-sizing .col-1 img { margin-right: 7rem; } .relay-switches .section-product-sizing .col-2 img { margin-left: 1rem; } .relay-switches #easy-setup #tutorial-video { margin-top: 4rem; margin-bottom: 2rem; } .relay-switches #easy-setup #tutorial-video img { width: 45px; } .relay-switches #easy-setup #tutorial-video span { vertical-align: bottom; margin-left: 1.5rem; } .relay-switches #easy-setup #connection-scheme img { width: 40px; } .relay-switches #easy-setup #connection-scheme span { margin-left: 2rem; } .relay-switches #easy-setup .bg { padding-bottom: 31.25%; background-position: 50% 50%; } .relay-switches #many-functions .col-1 img, .relay-switches #many-functions .col-2 img { width: 240px; } .relay-switches #many-functions .col-1 img { margin-left: 0; margin-right: 6rem; } .relay-switches #many-functions .buttons { margin-top: 4.8rem; } .relay-switches #many-functions .buttons a { margin: 0 1.5rem; padding: .5rem 2.4rem; border-radius: 20px/50%; } .relay-switches #control-what-you-want .icons { margin-top: 4.8rem; padding-left: 0; padding-right: 0; } .relay-switches #control-what-you-want .icons ul { display: -webkit-box; display: -ms-flexbox; display: flex; } .relay-switches #control-what-you-want .icons ul li { width: 12.5%; } .relay-switches #power-metering .content a { margin-top: 2rem; } .relay-switches #power-metering .content a span { margin-right: 1rem; font-size: 24px; } .relay-switches #power-metering .content a img { width: 40px; height: 40px; transition: all 250ms; } .relay-switches #power-metering .content a:hover img { -webkit-transform: scale(1.2); transform: scale(1.2); } .relay-switches #power-metering .bg { padding-bottom: 34.25%; background-position: 50% 50%; } .relay-switches #power-metering video { left: 0; } .relay-switches #multifunc-device .content p { padding-bottom: 4rem; } .relay-switches #multifunc-device .pagination { margin-top: 2rem; margin-bottom: 4rem; } .relay-switches #multifunc-device .pagination a svg { width: 70px; height: 70px; } .relay-switches #multifunc-device .image-slides { width: 50%; } .relay-switches #worldwide-access .bg, .relay-switches #standby-savings .bg, .relay-switches #never-forget .bg { padding-bottom: 40%; background-position: 50% 50%; } .relay-switches #take-your-own .copy { font-size: 110%; padding-bottom: 3.6rem; } .relay-switches #take-your-own .copy span { font-size: 130%; } .relay-switches .action-box { border-radius: 12px; padding: 1.5rem 4rem; font-size: 20px; } .relay-switches .hint > div { margin-top: 2rem; } .relay-switches .hint > div span { border-radius: 12px; } .relay-switches .section-homekit-enabled .bg { height: 560px; } .relay-switches .find-a-store-custom-button { margin: 20px 0 70px; } } @media (min-width: 1600px) { .relay-switches .section-product-header .content p { font-size: 2.6rem; } .relay-switches #many-functions .col-1 img, .relay-switches #many-functions .col-2 img { margin-top: 4.8rem; width: 300px; } .relay-switches #many-functions ul { margin-top: 3.6rem; } .relay-switches #many-functions .buttons a { margin: 0 2.5rem; border-radius: 22px/50%; } .relay-switches .section-product-sizing .col-1 img, .relay-switches .section-product-sizing .col-2 img { height: 310px; margin-top: 7.2rem; } .relay-switches .section-product-sizing .col-1 img { margin-right: 8rem; } .relay-switches .section-product-sizing .col-2 img { margin-left: 0; } .relay-switches #universal-apps .bg { padding-bottom: 45%; } .relay-switches #control-what-you-want .icons li { width: 10%; } .relay-switches #control-what-you-want .icons li img { width: 80px; height: 80px; } .relay-switches #power-metering .content a { margin-top: 4rem; } .relay-switches #multifunc-device .content p { padding-bottom: 5rem; } .relay-switches #take-your-own .items { padding-top: 3.6rem; padding-bottom: 3.6rem; } .relay-switches #take-your-own.section-content-image img { max-width: 500px; } .relay-switches #take-your-own .image { text-align: center; } .relay-switches #take-your-own .icons li img { height: 90px; } .relay-switches .action-box { border-radius: 12px; padding: 1.5rem 5rem; font-size: 22px; } .relay-switches .section-homekit-enabled .bg { height: 680px; } } @media (min-width: 2100px) { .relay-switches .section-product-header .content p { font-size: 3.2rem; } .relay-switches #many-functions .col-1 img, .relay-switches #many-functions .col-2 img { width: 340px; } .relay-switches .section-product-sizing .col-1 img, .relay-switches .section-product-sizing .col-2 img { margin-top: 6rem; } .relay-switches .section-product-sizing .col-1 img { margin-right: 11rem; } .relay-switches .section-product-sizing .col-2 img { margin-left: -2rem; } .relay-switches #control-what-you-want .icons li img { width: 90px; height: 90px; } .relay-switches #multifunc-device .content p { padding-bottom: 6rem; } .relay-switches #multifunc-device .pagination { margin-top: 5rem; margin-bottom: 6rem; } .relay-switches #multifunc-device .pagination a svg { width: 90px; height: 90px; } .relay-switches #universal-apps .bg { padding-bottom: 37.5%; } } .dimmer .content p { padding-bottom: 1rem; } .dimmer .section-product-header { height: auto; } .dimmer .section-product-header .content { color: #fff; height: 100%; } .dimmer .section-product-header .content h1 { text-transform: uppercase; padding-bottom: 0; } .dimmer .section-product-header .content p { font-size: 1.8rem; text-transform: uppercase; } .dimmer .section-product-header .content hr { color: transparent; border: 0; border-bottom: 1px solid #fff; display: inline-block; width: 120px; } .dimmer .section-product-header .bg { height: 470px; } .dimmer .section-product-header .bg-second { opacity: 0; } .dimmer .section-product-header .button.hidden-tabletP-up { position: absolute; bottom: 40px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); color: #fff; border-color: #fff; } .dimmer .section-product-header .button { padding: 6px 46px; } .dimmer #many-functions p { padding-bottom: 2.4rem; } .dimmer #many-functions ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row; flex-flow: row; -ms-flex-wrap: wrap; flex-wrap: wrap; } .dimmer #many-functions li { width: 50%; -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; margin-bottom: 2.4rem; } .dimmer #many-functions li span { display: block; } .dimmer #many-functions .col-1 img { width: 240px; margin-top: 2.4rem; margin-bottom: 2.4rem; } .dimmer #match-most-switches .content { position: relative; } .dimmer #match-most-switches .content img { margin-top: 2.4rem; width: 100%; max-width: 280px; } .dimmer #match-most-switches .content p { padding-bottom: 1.2rem; } .dimmer #match-most-switches .bg { height: 0; padding-bottom: 0; } .dimmer .section-product-sizing .col-1 img, .dimmer .section-product-sizing .col-2 img { height: 180px; width: auto; } .dimmer .section-product-sizing .col-1 img { margin-bottom: 0; } .dimmer .section-product-sizing .col-2 img { margin-top: 0; } .dimmer #easy-setup .content { position: relative; background-color: #f7f7f7; } .dimmer #easy-setup .bg { height: 0; padding-bottom: 56%; } .dimmer #easy-setup #tutorial-video, .dimmer #easy-setup #connection-scheme { text-align: left; } .dimmer #easy-setup #tutorial-video a, .dimmer #easy-setup #connection-scheme a { display: inline-block; } .dimmer #easy-setup #tutorial-video { margin-top: 2rem; margin-bottom: 1rem; } .dimmer #easy-setup #tutorial-video img { width: 30px; } .dimmer #easy-setup #tutorial-video span { vertical-align: bottom; margin-left: 1.5rem; } .dimmer #easy-setup #connection-scheme img { width: 25px; } .dimmer #easy-setup #connection-scheme span { margin-left: 2rem; } .dimmer #light-source .content { position: relative; background-color: #040a24; } .dimmer #light-source .content p { padding-bottom: 0; } .dimmer #light-source .content a { display: inline-block; } .dimmer #light-source .content a span { display: block; margin-bottom: 1rem; font-size: 18px; } .dimmer #light-source .bg { height: 310px; padding-bottom: 0; } .dimmer #worldwide-access .content, .dimmer #light-you-need .content { position: relative; } .dimmer #worldwide-access .bg, .dimmer #light-you-need .bg { height: 0; padding-bottom: 81%; } .dimmer #energy-meter .content { position: relative; } .dimmer #energy-meter .bg { height: 310px; padding-bottom: 0; overflow: hidden; } .dimmer #energy-meter .bg .tip { font-size: 140%; text-align: center; color: #0090FF; margin-top: 4rem; position: relative; } .dimmer #energy-meter .bg .tip span { font-size: 140%; vertical-align: middle; padding-right: 4px; } .dimmer #energy-meter .bg .tip:after { content: ''; display: block; width: 60px; height: 84px; background: url("../img/products/dimmer/em-path-mobile.png") no-repeat 50% 50%; background-size: contain; position: absolute; left: 50%; top: 40px; } .dimmer #adjust-light .content { position: relative; } .dimmer #adjust-light .bg { height: 310px; padding-bottom: 0; } .dimmer #adjust-light .bg-second { opacity: 0; } .dimmer #adjust-light input { opacity: 0; } .dimmer #adjust-light .slider#al-mobile-slider { position: absolute; bottom: 40px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 56%; } .dimmer #adjust-light .slider#al-desktop-slider { margin-top: 50px; margin-bottom: 20px; width: 260px; } .dimmer #adjust-light .slider:before { content: ''; display: block; width: 36px; height: 36px; background: url("../img/products/dimmer/decrease.svg") no-repeat 50% 50%; background-size: 36px 36px; position: absolute; left: -50px; top: -8px; cursor: s-resize; } .dimmer #adjust-light .slider:after { content: ''; display: block; width: 36px; height: 36px; background: url("../img/products/dimmer/increase.svg") no-repeat 50% 50%; background-size: 36px 36px; position: absolute; right: -52px; top: -8px; cursor: n-resize; } .dimmer #adjust-light .slider .slider-handle { background: #fff; box-shadow: inset 0 -2px 1px rgba(51, 51, 51, 0.1); cursor: ew-resize; -webkit-touch-callout: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .dimmer #adjust-light .slider .slider-handle:focus { outline: none; } .dimmer #adjust-light .slider .slider-track, .dimmer #adjust-light .slider .slider-track-high, .dimmer #adjust-light .slider .slider-track-low { border-radius: 2px; box-shadow: none; } .dimmer #adjust-light .slider .slider-track { height: 4px; margin-top: -2px; } .dimmer #adjust-light .slider .slider-track-high { background-color: #6d6d6d; } .dimmer #adjust-light .slider .slider-track-low { background-color: #e2e2e2; } .dimmer #adjust-light .slider .slider-selection { box-shadow: none; } .dimmer #voice-control .content { position: relative; background-color: #011f37; color: #fff; padding-bottom: 0; } .dimmer #voice-control .bg { height: 340px; padding-bottom: 0; } .dimmer #voice-control .bg .content { background-color: transparent; } .dimmer #wherever-you-want .content { background-color: #fff; color: #444444; position: relative; } .dimmer #wherever-you-want .bg { height: 0; padding-bottom: 60%; } .dimmer #wherever-you-want .swiper-button-prev, .dimmer #wherever-you-want .swiper-button-next { display: none; } .dimmer #wherever-you-want .swiper-pagination-bullet { opacity: 1; background-color: transparent; border: 1px solid #fff; } .dimmer #wherever-you-want .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff; } .dimmer #take-your-own .items { padding-top: 2.4rem; padding-bottom: 0; } .dimmer #take-your-own .items img { max-width: 280px; width: 100%; } .dimmer #take-your-own .icons ul { margin-top: 1.2rem; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .dimmer #take-your-own .icons li { -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; display: block; background-repeat: no-repeat; margin-bottom: 4rem; width: 50%; } .dimmer #take-your-own .icons li img { height: 50px; width: auto; margin-bottom: .6rem; } .dimmer #take-your-own .icons li span { text-align: center; display: block; width: 100%; font-size: 90%; } .dimmer #take-your-own .content { padding-bottom: 0; } .dimmer .section-product-footer .top { background-image: none; } @media (max-width: 767px) { .dimmer #adjust-light .content .slider { display: none; } } @media (min-width: 544px) { .dimmer .section-product-header .bg { height: 520px; } .dimmer #many-functions ul { margin-top: 1.2rem; } .dimmer #match-most-switches .content img { max-width: 320px; } .dimmer #light-source .bg { height: 360px; } .dimmer #energy-meter .bg, .dimmer #adjust-light .bg { height: 430px; } .dimmer #energy-meter .bg .tip { font-size: 160%; margin-top: 6rem; } .dimmer #energy-meter .bg .tip span { font-size: 140%; } .dimmer #energy-meter .bg .tip:after { width: 80px; height: 112px; top: 50px; } .dimmer #voice-control .hidden-tabletP-up .chat-bubble { margin-left: 2.4rem; margin-right: 2.4rem; } } @media (min-width: 768px) { .dimmer .section-product-header .content { padding-top: 0; padding-bottom: 0; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); height: auto; } .dimmer .section-product-header .bg { height: 0; padding-bottom: 45%; background-position: 100% 50%; } .dimmer .section-product-header .button { padding: 6px 66px; } .dimmer .section-product-header .button.hidden-phoneL-down { margin-top: 1.5em; } .dimmer #many-functions li { width: 25%; } .dimmer #many-functions .col-1 img, .dimmer #many-functions .col-2 img { width: 180px; } .dimmer #many-functions .col-1 img { margin: 2.4rem; } .dimmer #match-most-switches .content { position: absolute; } .dimmer #match-most-switches .bg { height: 0; padding-bottom: 52%; } .dimmer .section-product-sizing .col-1 img, .dimmer .section-product-sizing .col-2 img { height: 220px; } .dimmer .section-product-sizing .col-1 img { margin-right: 4.8rem; margin-bottom: 1rem; } .dimmer .section-product-sizing .col-2 img { margin-top: 2.4rem; margin-left: 1rem; margin-bottom: 1rem; } .dimmer #easy-setup .content { position: absolute; background-color: transparent; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .dimmer #easy-setup .bg { background-position: 65% 50%; padding-bottom: 45%; } .dimmer #light-source .content { position: absolute; background-color: transparent; } .dimmer #light-source .bg { height: 0; padding-bottom: 43%; background-position: 35% 50%; } .dimmer #light-source #ls-anim { position: absolute; left: 17%; top: 50%; opacity: 0; width: 100%; height: auto; } .dimmer #light-source #ls-anim svg { width: 100%; height: auto; } .dimmer #light-source #ls-anim #dot { opacity: 0; r: 18; } .dimmer #worldwide-access .content, .dimmer #light-you-need .content { position: absolute; color: #fff; text-align: left; top: 20%; -webkit-transform: translateY(-20%); transform: translateY(-20%); } .dimmer #worldwide-access .bg, .dimmer #light-you-need .bg { padding-bottom: 45%; } .dimmer #energy-meter .content { position: absolute; z-index: 10; } .dimmer #energy-meter .content .tip { display: inline-block; font-size: 140%; text-align: center; color: #0090FF; margin-top: 4rem; position: relative; } .dimmer #energy-meter .content .tip .copy { opacity: 0; } .dimmer #energy-meter .content .tip span { display: block; font-size: 200%; line-height: 1.1; } .dimmer #energy-meter .content .tip .pointer { position: absolute; width: 200px; height: 2px; left: -220px; top: 24px; } .dimmer #energy-meter .content .tip .pointer .line { width: 0; height: 2px; background-color: #0090FF; } .dimmer #energy-meter .content .tip .pointer .dot { position: absolute; width: 20px; height: 20px; border-radius: 50%; background-color: #0090FF; left: -10px; top: -9px; opacity: 0; } .dimmer #energy-meter .bg { height: 490px; background-position: 65% 50%; } .dimmer #adjust-light .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; color: #fff; } .dimmer #adjust-light .bg { height: 0; padding-bottom: 45%; } .dimmer #adjust-light .bg .slider { display: none; } .dimmer #adjust-light .slider:before { width: 46px; height: 46px; background-size: 46px 46px; left: -60px; top: -13px; } .dimmer #adjust-light .slider:after { width: 46px; height: 46px; background-size: 46px 46px; right: -64px; top: -13px; } .dimmer #wherever-you-want .content { position: absolute; z-index: 10; color: #fff; background-color: transparent; } .dimmer #wherever-you-want .bg { padding-bottom: 45%; } .dimmer #take-your-own .items { padding-top: 4.8rem; } .dimmer #take-your-own .items img { max-width: 420px; } .dimmer #take-your-own .icons li { width: 33.33%; } .dimmer #take-your-own .icons li img { height: 70px; margin-bottom: 1.6rem; } .dimmer #voice-control .content { position: absolute; z-index: 10; background-color: transparent; } .dimmer #voice-control .content p { padding-bottom: 2.4rem; } .dimmer #voice-control .bg { height: 480px; } .dimmer #voice-control .hidden-phoneL-down .chat-bubble { margin-top: 1.2rem; margin-left: 2.4rem; margin-right: 2.4rem; } } @media screen and (min-width: 880px) { .dimmer #energy-meter .content .tip .pointer { width: 180px; left: -200px; } } @media (min-width: 992px) { .dimmer .section-product-header .bg { padding-bottom: 42%; } .dimmer #easy-setup .bg { background-position: 70% 50%; } .dimmer #take-your-own .icons ul { margin-top: 4.8rem; } .dimmer #take-your-own .icons ul li { width: 20%; } .dimmer #light-source .bg { padding-bottom: 40%; background-position: 35% 50%; } .dimmer #energy-meter .content .tip .pointer { top: 26px; width: 230px; left: -250px; } .dimmer #energy-meter .bg { height: 540px; } .dimmer #voice-control .bg { height: 480px; } } @media screen and (min-width: 1130px) { .dimmer #energy-meter .content .tip .pointer { width: 210px; left: -230px; } } @media (min-width: 1200px) { .dimmer .section-product-header .bg { padding-bottom: 38%; } .dimmer #match-most-switches .content p { display: inline-block; width: 80%; } .dimmer #match-most-switches .bg { padding-bottom: 45%; } .dimmer .section-product-sizing .col-1 img, .dimmer .section-product-sizing .col-2 img { height: 260px; margin-top: 4rem; } .dimmer .section-product-sizing .col-1 img { margin-right: 7rem; } .dimmer .section-product-sizing .col-2 img { margin-left: 1rem; } .dimmer #easy-setup #tutorial-video { margin-top: 4rem; margin-bottom: 2rem; } .dimmer #easy-setup #tutorial-video img { width: 45px; } .dimmer #easy-setup #tutorial-video span { vertical-align: bottom; margin-left: 1.5rem; } .dimmer #easy-setup #connection-scheme img { width: 40px; } .dimmer #easy-setup #connection-scheme span { margin-left: 2rem; } .dimmer #easy-setup .bg { background-position: 50% 50%; } .dimmer #many-functions .col-1 img, .dimmer #many-functions .col-2 img { width: 240px; } .dimmer #many-functions .col-1 img { margin-left: 0; margin-right: 6rem; } .dimmer #light-source .bg { padding-bottom: 35%; background-position: 50% 50%; } .dimmer #light-source #ls-anim #dot { r: 12; } .dimmer #energy-meter .content .tip .pointer { top: 28px; width: 270px; left: -305px; } .dimmer #energy-meter .bg { height: 0; padding-bottom: 42.5%; } .dimmer #worldwide-access .bg, .dimmer #light-you-need .bg { padding-bottom: 37.5%; } .dimmer #wherever-you-want .bg { padding-bottom: 42.5%; } .dimmer #wherever-you-want .swiper-button-prev, .dimmer #wherever-you-want .swiper-button-next { display: block; background: none; border-right: 4px solid rgba(255, 255, 255, 0.5); border-bottom: 4px solid rgba(255, 255, 255, 0.5); width: 72px; height: 72px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; } .dimmer #wherever-you-want .swiper-button-prev { -webkit-transform: rotate(135deg); transform: rotate(135deg); left: 60px; } .dimmer #wherever-you-want .swiper-button-prev:hover { -webkit-transform: rotate(135deg) scale(1.2); transform: rotate(135deg) scale(1.2); } .dimmer #wherever-you-want .swiper-button-next { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); right: 60px; } .dimmer #wherever-you-want .swiper-button-next:hover { -webkit-transform: rotate(-45deg) scale(1.2); transform: rotate(-45deg) scale(1.2); } .dimmer #voice-control .bg { height: 670px; } .dimmer #voice-control .hidden-phoneL-down .chat-bubble { margin-top: 6.2rem; } .dimmer #take-your-own .items { padding-top: 4.8rem; } .dimmer #take-your-own .items img { max-width: 100%; width: auto; } .dimmer #take-your-own .copy { font-size: 110%; padding-bottom: 3.6rem; } .dimmer #take-your-own .copy span { font-size: 130%; } } @media (min-width: 1600px) { .dimmer .section-product-header .content p { font-size: 2.6rem; } .dimmer #many-functions .col-1 img, .dimmer #many-functions .col-2 img { margin-top: 4.8rem; width: 300px; } .dimmer #many-functions ul { margin-top: 3.6rem; } .dimmer #many-functions li img { width: 90px; } .dimmer .section-product-sizing .col-1 img, .dimmer .section-product-sizing .col-2 img { height: 310px; margin-top: 4rem; } .dimmer .section-product-sizing .col-1 img { margin-right: 8rem; } .dimmer .section-product-sizing .col-2 img { margin-left: 0; } .dimmer #match-most-switches .content p { width: 70%; } .dimmer #match-most-switches .bg { padding-bottom: 37.5%; } .dimmer #light-source .bg { padding-bottom: 31.25%; } .dimmer #light-source #ls-anim { top: 48%; left: 21%; width: 88%; } .dimmer #light-source #ls-anim #dot { r: 10; } .dimmer #energy-meter .content { top: 10%; -webkit-transform: translateY(-10%); transform: translateY(-10%); } .dimmer #energy-meter .content .tip { margin-top: 6rem; } .dimmer #energy-meter .content .tip .pointer { top: 32px; width: 320px; left: -355px; } .dimmer #energy-meter .bg { height: 0; padding-bottom: 37.5%; } .dimmer #wherever-you-want .bg { padding-bottom: 34.5%; } .dimmer #adjust-light .bg { padding-bottom: 30%; } .dimmer #adjust-light .slider#al-desktop-slider { width: 320px; margin-top: 80px; } .dimmer #take-your-own .icons li img { height: 90px; } .dimmer #take-your-own .items { padding-top: 7.2rem; } .dimmer #voice-control .bg { height: 730px; } } @media (min-width: 2100px) { .dimmer .section-product-header .content p { font-size: 3.2rem; } .dimmer #easy-setup .bg { padding-bottom: 31.25%; } .dimmer #many-functions .col-1 img, .dimmer #many-functions .col-2 img { width: 340px; } .dimmer #match-most-switches .content p { width: 60%; } .dimmer .section-product-sizing .col-1 img, .dimmer .section-product-sizing .col-2 img { margin-top: 6rem; } .dimmer .section-product-sizing .col-1 img { margin-right: 11rem; } .dimmer .section-product-sizing .col-2 img { margin-left: -2rem; } .dimmer #take-your-own .items { padding-top: 9.6rem; } .dimmer #voice-control .bg { height: 800px; } .dimmer #energy-meter .content { top: 15%; } .dimmer #energy-meter .content .tip { margin-top: 7rem; } .dimmer #energy-meter .content .tip .pointer { top: 30px; width: 360px; left: -410px; } .dimmer #light-source #ls-anim #dot { r: 8; } } .smoke-sensor .content p { padding-bottom: 1rem; } .smoke-sensor .section-product-header { height: auto; } .smoke-sensor .section-product-header .content { height: 100%; } .smoke-sensor .section-product-header .content h1 { text-transform: uppercase; padding-bottom: 0; } .smoke-sensor .section-product-header .content p { font-size: 1.8rem; text-transform: uppercase; } .smoke-sensor .section-product-header .content hr { color: transparent; border: 0; border-bottom: 1px solid #444; display: inline-block; width: 120px; } .smoke-sensor .section-product-header .content .button { margin-top: 1.5em; } .smoke-sensor .section-product-header .bg { height: 470px; } .smoke-sensor .section-video-player video { width: 102%; } .smoke-sensor .section-product-sizing .col-1 img, .smoke-sensor .section-product-sizing .col-2 img { height: auto; } .smoke-sensor .section-product-sizing .col-1 img { width: 190px; } .smoke-sensor .section-product-sizing .col-2 img { width: 260px; } .smoke-sensor #supported-systems img { vertical-align: bottom; margin-top: 1.2rem; margin-bottom: 1.2rem; } .smoke-sensor #supported-systems #zwave { width: 80px; height: auto; margin-right: 1em; } .smoke-sensor #supported-systems #alexa { width: 140px; height: auto; margin-left: 1em; } .smoke-sensor #protects-against-smoke .content h2 { text-transform: uppercase; font-size: 1.35em; margin-top: 3.5rem; } .smoke-sensor #protects-against-smoke .content h2 span { visibility: hidden; position: absolute; } .smoke-sensor #protects-against-smoke .bg { height: 220px; padding-bottom: 0; overflow: hidden; } .smoke-sensor #protects-against-smoke svg { width: auto; height: 100%; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .smoke-sensor #protects-against-smoke #mask text { font-size: 240px; font-family: 'Open Sans', sans-serif; font-weight: 800; fill-opacity: .5; text-anchor: middle; alignment-baseline: middle; dominant-baseline: middle; letter-spacing: -5px; } .smoke-sensor #many-functions .content { padding-bottom: 0; } .smoke-sensor #many-functions p { padding-bottom: 2.4rem; } .smoke-sensor #many-functions ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row; flex-flow: row; -ms-flex-wrap: wrap; flex-wrap: wrap; } .smoke-sensor #many-functions li { width: 50%; -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; margin-bottom: 2.4rem; } .smoke-sensor #many-functions li span { display: block; } .smoke-sensor #many-functions .col-1 img { width: 240px; margin-top: 2.4rem; margin-bottom: 2.4rem; } .smoke-sensor #protects-family .content { background-color: #fbfaf8; position: relative; padding-bottom: 0; margin-bottom: -1.5rem; } .smoke-sensor #protects-family .bg { height: 0; padding-bottom: 81%; } .smoke-sensor #mobile-notifications .content { background-color: #eee; position: relative; } .smoke-sensor #mobile-notifications .bg { padding-bottom: 0; height: 680px; } .smoke-sensor #voice-control .content { position: relative; background-color: #011f37; color: #fff; padding-bottom: 0; } .smoke-sensor #voice-control .bg { height: 370px; padding-bottom: 0; background-color: #011f37; background-position: center bottom; background-size: auto 340px; } .smoke-sensor #voice-control .bg .content { background-color: transparent; } .smoke-sensor #voice-control .chat-bubble { text-align: left; float: left; clear: both; } .smoke-sensor #voice-control .chat-bubble > div { max-width: 200px; } .smoke-sensor #voice-control .chat-bubble.chat-bubble-response { text-align: right; float: right; } .smoke-sensor #system-integration .content { padding-bottom: 0; } .smoke-sensor #system-integration .bg { height: 470px; } .smoke-sensor #history .content { position: relative; padding-bottom: 0; margin-bottom: -5rem; } .smoke-sensor #history .bg { height: 0; padding-bottom: 85%; } .smoke-sensor #monitor-areas .content { background-color: #fff; color: #444444; position: relative; } .smoke-sensor #monitor-areas .bg { height: 0; padding-bottom: 60%; } .smoke-sensor #monitor-areas .swiper-button-prev, .smoke-sensor #monitor-areas .swiper-button-next { display: none; } .smoke-sensor #monitor-areas .swiper-pagination-bullet { opacity: 1; background-color: transparent; border: 1px solid #fff; } .smoke-sensor #monitor-areas .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff; } .smoke-sensor #sensitivity .content { position: relative; } .smoke-sensor #sensitivity .content svg { width: 100%; height: auto; max-width: 330px; margin-top: 2.4rem; } .smoke-sensor #sensitivity .bg { height: 0; padding-bottom: 68%; } .smoke-sensor #hotel-solution .content { position: relative; } .smoke-sensor #hotel-solution .bg { height: 0; padding-bottom: 81%; } .smoke-sensor #take-your-own .items { padding-top: 2.4rem; margin-bottom: -2.4rem; } .smoke-sensor #take-your-own .items img { max-width: 280px; width: 100%; } .smoke-sensor #take-your-own .icons { padding-top: 3%; } .smoke-sensor #take-your-own .icons ul { margin-top: 1.2rem; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .smoke-sensor #take-your-own .icons li { -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; display: block; background-repeat: no-repeat; margin-bottom: 4rem; width: 50%; } .smoke-sensor #take-your-own .icons li img { height: 50px; width: auto; margin-bottom: .6rem; } .smoke-sensor #take-your-own .icons li span { text-align: center; display: block; width: 100%; font-size: 90%; } @media (min-width: 544px) { .smoke-sensor .section-product-header .bg { height: 520px; } .smoke-sensor #many-functions ul { margin-top: 1.2rem; } .smoke-sensor #supported-systems #zwave { width: 110px; } .smoke-sensor #supported-systems #alexa { width: 180px; } .smoke-sensor #protects-against-smoke .content h2 { font-size: 2em; margin-top: 4rem; } .smoke-sensor #protects-against-smoke .bg { height: 280px; } .smoke-sensor #protects-against-smoke #mask text { font-size: 290px; } .smoke-sensor #voice-control .hidden-tabletP-up .chat-bubble > div { max-width: 240px; } .smoke-sensor #mobile-notifications .bg { height: 840px; } } @media (min-width: 768px) { .smoke-sensor .section-product-header .content { padding-top: 0; padding-bottom: 0; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); height: auto; } .smoke-sensor .section-product-header .bg { height: 0; padding-bottom: 45%; } .smoke-sensor .section-product-sizing .col-2 img { margin-top: 120px; } .smoke-sensor .section-product-sizing .col-3 img { margin-top: 6rem; margin-bottom: 2.4rem; width: 340px; } .smoke-sensor #supported-systems #zwave { width: 140px; margin-right: 2em; } .smoke-sensor #supported-systems #alexa { width: 220px; margin-left: 2em; } .smoke-sensor #protects-against-smoke .content h2 { font-size: 2.4em; margin-top: 4.5rem; } .smoke-sensor #protects-against-smoke .bg { height: 340px; } .smoke-sensor #protects-against-smoke #mask text { font-size: 350px; } .smoke-sensor #many-functions li { width: 25%; } .smoke-sensor #many-functions .col-1 img { margin: 2.4rem; width: 340px; } .smoke-sensor #protects-family .content { background-color: transparent; position: absolute; text-align: left; } .smoke-sensor #protects-family .bg { padding-bottom: 72%; } .smoke-sensor #mobile-notifications .content { background-color: transparent; position: absolute; } .smoke-sensor #mobile-notifications .bg { height: 0; padding-bottom: 62%; } .smoke-sensor #monitor-areas .content { position: absolute; z-index: 10; color: #444444; background-color: transparent; } .smoke-sensor #monitor-areas .bg { padding-bottom: 60%; } .smoke-sensor #system-integration .bg { height: 620px; } .smoke-sensor #history .content { background-color: transparent; position: absolute; text-align: left; } .smoke-sensor #history .bg { padding-bottom: 60%; } .smoke-sensor #sensitivity .content { background-color: transparent; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .smoke-sensor #sensitivity .content svg { max-width: 360px; } .smoke-sensor #sensitivity .bg { padding-bottom: 60%; background-position: 75% 50%; } .smoke-sensor #hotel-solution .content { position: absolute; } .smoke-sensor #hotel-solution .bg { padding-bottom: 60%; } .smoke-sensor #voice-control .content { position: absolute; z-index: 10; background-color: transparent; } .smoke-sensor #voice-control .content p { padding-bottom: 2.4rem; } .smoke-sensor #voice-control .bg { height: 480px; } .smoke-sensor #voice-control .hidden-phoneL-down .chat-bubble:first-of-type { margin-top: 1.2rem; } .smoke-sensor #voice-control .chat-bubble > div { max-width: 300px; } .smoke-sensor #take-your-own .items { padding-top: 4.8rem; margin-bottom: -3.4rem; } .smoke-sensor #take-your-own .items img { max-width: 420px; } .smoke-sensor #take-your-own .icons li { width: 33.33%; } .smoke-sensor #take-your-own .icons li img { height: 70px; margin-bottom: 1.6rem; } } @media (max-width: 1199px) { .smoke-sensor #system-integration a.int, .smoke-sensor #system-integration .tooltip { display: none; } } @media (min-width: 992px) { .smoke-sensor .section-product-header .bg { padding-bottom: 42%; } .smoke-sensor #protects-against-smoke .bg { height: 390px; } .smoke-sensor #voice-control .bg { height: 570px; background-size: auto 420px; } .smoke-sensor #system-integration .bg { height: 740px; } } @media (min-width: 1200px) { .smoke-sensor .section-product-header .bg { padding-bottom: 38%; } .smoke-sensor .section-product-sizing .col-1 { padding-top: 3.6rem; } .smoke-sensor .section-product-sizing .col-1 img { width: 300px; } .smoke-sensor .section-product-sizing .col-2 { padding-top: 3.6rem; } .smoke-sensor .section-product-sizing .col-2 img { width: 440px; } .smoke-sensor .section-product-sizing .col-2 img { margin-top: 180px; } .smoke-sensor .section-product-sizing .col-3 img { margin-top: 9rem; width: 440px; } .smoke-sensor #supported-systems img { margin-top: 2rem; } .smoke-sensor #supported-systems #zwave { width: 150px; margin-right: 4em; } .smoke-sensor #supported-systems #alexa { width: 300px; margin-left: 4em; } .smoke-sensor #protects-against-smoke .bg { height: 510px; } .smoke-sensor #protects-against-smoke .bg video { width: 100%; height: auto; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .smoke-sensor #protects-against-smoke #mask text { fill-opacity: .3; } .smoke-sensor #many-functions .col-1 img { margin-top: 3.6rem; width: 400px; } .smoke-sensor #protects-family .bg { padding-bottom: 41%; } .smoke-sensor #mobile-notifications .bg { padding-bottom: 40%; } .smoke-sensor #voice-control .bg { height: 670px; background-size: cover; } .smoke-sensor #voice-control .chat-bubble > div { max-width: none; } .smoke-sensor #monitor-areas .bg { padding-bottom: 42.5%; } .smoke-sensor #monitor-areas .swiper-button-prev, .smoke-sensor #monitor-areas .swiper-button-next { display: block; background: none; border-right: 4px solid rgba(255, 255, 255, 0.5); border-bottom: 4px solid rgba(255, 255, 255, 0.5); width: 72px; height: 72px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; } .smoke-sensor #monitor-areas .swiper-button-prev { -webkit-transform: rotate(135deg); transform: rotate(135deg); left: 60px; } .smoke-sensor #monitor-areas .swiper-button-prev:hover { -webkit-transform: rotate(135deg) scale(1.2); transform: rotate(135deg) scale(1.2); } .smoke-sensor #monitor-areas .swiper-button-next { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); right: 60px; } .smoke-sensor #monitor-areas .swiper-button-next:hover { -webkit-transform: rotate(-45deg) scale(1.2); transform: rotate(-45deg) scale(1.2); } .smoke-sensor #system-integration .bg { height: 520px; } .smoke-sensor #system-integration a.int { position: absolute; z-index: 100; width: 60px; height: 60px; border-radius: 50%; cursor: pointer; display: block; } .smoke-sensor #system-integration #integration1 { top: 300px; left: 60px; } .smoke-sensor #system-integration #integration2 { top: 110px; left: 158px; } .smoke-sensor #system-integration #integration3 { top: 237px; left: 356px; } .smoke-sensor #system-integration #integration4 { top: 287px; left: 531px; } .smoke-sensor #system-integration #integration5 { top: 402px; left: 599px; } .smoke-sensor #system-integration #integration6 { top: 223px; left: 699px; } .smoke-sensor #system-integration #integration7 { top: 116px; left: 903px; } .smoke-sensor #system-integration .tooltip { background-color: rgba(0, 144, 255, 0.9); color: #fff; width: 200px; box-sizing: border-box; font-size: 12px; text-align: center; padding: 12px; border-radius: 6px; position: absolute; z-index: 100; opacity: 0; -webkit-transform-origin: top center; transform-origin: top center; } .smoke-sensor #history .bg { padding-bottom: 38%; } .smoke-sensor #sensitivity .bg { padding-bottom: 38%; background-position: 50% 50%; } .smoke-sensor #sensitivity .content svg { margin-top: 4.8rem; max-width: 460px; } .smoke-sensor #hotel-solution .bg { padding-bottom: 43%; } .smoke-sensor #take-your-own .items { padding-top: 4.8rem; margin-bottom: -5.4rem; } .smoke-sensor #take-your-own .items img { max-width: 100%; width: auto; } .smoke-sensor #take-your-own .icons li { width: 16.65%; } .smoke-sensor #take-your-own .copy { font-size: 110%; padding-bottom: 3.6rem; } .smoke-sensor #take-your-own .copy span { font-size: 130%; } } @media (min-width: 1600px) { .smoke-sensor .section-product-header .content p { font-size: 2.6rem; } .smoke-sensor .section-product-sizing .col-3 img { margin-top: 15rem; width: 540px; } .smoke-sensor #supported-systems img { margin-top: 3rem; } .smoke-sensor #protects-against-smoke .bg { height: 590px; } .smoke-sensor #voice-control .bg { height: 750px; } .smoke-sensor #voice-control .hidden-phoneL-down .chat-bubble:first-of-type { margin-top: 2.4rem; } .smoke-sensor #many-functions li img { width: 90px; } .smoke-sensor #many-functions .col-1 img { width: 490px; } .smoke-sensor #monitor-areas .bg { padding-bottom: 37.5%; } .smoke-sensor #system-integration .bg { height: 700px; } .smoke-sensor #system-integration a.int { width: 80px; height: 80px; } .smoke-sensor #system-integration #integration1 { top: 404px; left: 42px; } .smoke-sensor #system-integration #integration2 { top: 148px; left: 173px; } .smoke-sensor #system-integration #integration3 { top: 319px; left: 441px; } .smoke-sensor #system-integration #integration4 { top: 386px; left: 676px; } .smoke-sensor #system-integration #integration5 { top: 541px; left: 768px; } .smoke-sensor #system-integration #integration6 { top: 301px; left: 902px; } .smoke-sensor #system-integration #integration7 { top: 156px; left: 1178px; } .smoke-sensor #system-integration .tooltip { width: 220px; font-size: 14px; } .smoke-sensor #take-your-own .icons li img { height: 90px; } .smoke-sensor #take-your-own .items { padding-top: 4.2rem; margin-bottom: -7.4rem; } } @media (min-width: 2100px) { .smoke-sensor .section-product-header .content p { font-size: 3.2rem; } .smoke-sensor #voice-control .bg { height: 800px; } .smoke-sensor #voice-control .hidden-phoneL-down .chat-bubble:first-of-type { margin-top: 3.6rem; } .smoke-sensor #sensitivity .content svg { max-width: 560px; } .smoke-sensor #protects-against-smoke .content h2 { font-size: 6rem; } .smoke-sensor #protects-against-smoke .bg { height: 670px; } .smoke-sensor #system-integration .bg { height: 970px; } .smoke-sensor #system-integration a.int { width: 100px; height: 100px; } .smoke-sensor #system-integration #integration1 { top: 567px; left: 32px; } .smoke-sensor #system-integration #integration2 { top: 211px; left: 214px; } .smoke-sensor #system-integration #integration3 { top: 449px; left: 584px; } .smoke-sensor #system-integration #integration4 { top: 540px; left: 911px; } .smoke-sensor #system-integration #integration5 { top: 756px; left: 1038px; } .smoke-sensor #system-integration #integration6 { top: 423px; left: 1224px; } .smoke-sensor #system-integration #integration7 { top: 222px; left: 1606px; } .smoke-sensor #system-integration .tooltip { width: 260px; font-size: 16px; } } .thermostat #hk-video { height: 270px; } .thermostat #hk-video video { width: 101%; } .thermostat #living-room video { width: 100%; height: auto; margin: 0; padding: 0; display: block; } .thermostat #learns img, .thermostat #energy-class img { width: 100%; height: auto; display: block; } .thermostat .section-product-header { height: auto; } .thermostat .section-product-header .content { color: #fff; } .thermostat .section-product-header .content h1 { font-size: 2.4rem; } .thermostat .section-product-header .content hr { color: transparent; border: 0; border-bottom: 1px solid #0090ff; display: inline-block; width: 280px; } .thermostat .section-product-header .content p { padding-bottom: 0; } .thermostat .section-product-header .content p.small { margin-top: 1rem; font-size: 80%; opacity: 0; } .thermostat .section-product-header .bg { height: 490px; } .thermostat .section-video-reveal video { width: 100%; height: auto; display: block; background-color: #fff; border: 0; } .thermostat .section-video-reveal .infobox-button { display: none; } .thermostat .hint { margin-top: 1.6rem; padding: 1.6rem; } .thermostat .hint img { margin-right: 1.2rem; height: 50px !important; max-width: 50px !important; width: auto !important; } .thermostat .hint figcaption div span { padding-top: .7rem; text-transform: none; font-size: 150%; line-height: 1.3; } .thermostat .section-product-sizing .desc { margin-top: 2.4rem; color: #7e7e7e; } .thermostat .section-product-sizing img { margin-bottom: 2.4rem; width: 100%; max-width: 480px; } .thermostat #many-functions p { padding-bottom: 2.4rem; } .thermostat #many-functions ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row; flex-flow: row; -ms-flex-wrap: wrap; flex-wrap: wrap; } .thermostat #many-functions li { width: 50%; -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; margin-bottom: 2.4rem; padding: 0 5px; } .thermostat #many-functions li span { display: block; } .thermostat #many-functions .col-1 img { width: 240px; } .thermostat #many-functions .infobox-wrapper { width: 240px; margin: 4.8rem auto; } .thermostat #many-functions .infobox-button[data-infobox-name="head"] { left: -5px; top: -25px; } .thermostat #many-functions .infobox-button[data-infobox-name="sensor"] { right: -5px; top: 75px; } .thermostat #day-routine .content { background-size: auto 740px; background-position: 50% 100%; background-repeat: no-repeat; padding-bottom: 14rem; } .thermostat #day-routine .th-head-wrapper { width: 300px; height: 100px; position: absolute; left: 50%; bottom: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .thermostat #day-routine .th-head { position: absolute; top: 0; left: 156px; width: 76px; height: 75px; -webkit-transform: scale(0.35); transform: scale(0.35); } .thermostat #day-routine .head-colors { background-repeat: no-repeat; background-position: 0 0; width: 76px; height: 75px; position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 350ms; } .thermostat #day-routine .head-colors.active { opacity: 1; } .thermostat #day-routine .head-colors.h1 { background-position: 0 0; } .thermostat #day-routine .head-colors.h2 { background-position: 0 -85px; } .thermostat #day-routine .head-colors.h3 { background-position: 0 -170px; } .thermostat #day-routine .head-colors.h4 { background-position: 0 -255px; } .thermostat #day-routine #dr-small-widget .temp { font-size: 4.2rem; margin-bottom: 2rem; color: #0090ff; } .thermostat #day-routine #dr-small-widget .swiper-slide .head { font-size: 1.5em; margin-bottom: .5rem; } .thermostat #day-routine #dr-small-widget .bullets { opacity: 0; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 3rem auto .5rem; max-width: 360px; } .thermostat #day-routine #dr-small-widget .bullets > div { width: 60px; height: auto; overflow: hidden; } .thermostat #day-routine #dr-small-widget .bullets > div svg { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 60px; height: 60px; opacity: 0; transition: all 250ms; } .thermostat #day-routine #dr-small-widget .bullets > div .icon { width: 60px; height: 60px; margin-bottom: 1rem; background-color: #f0f0f0; border: 2px solid #0090ff; border-radius: 50%; -webkit-transform: scale(0.4); transform: scale(0.4); position: relative; z-index: 5; transition: all 250ms; } .thermostat #day-routine #dr-small-widget .bullets > div .time { color: #999; font-size: 1.1em; position: relative; transition: all 250ms; } .thermostat #day-routine #dr-small-widget .bullets > div .bg { fill-opacity: 0; stroke: #0090ff; stroke-width: 4px; width: 58px; height: 58px; stroke-dasharray: 332; stroke-dashoffset: 332; -webkit-transform: rotate(87.5deg); transform: rotate(87.5deg); -webkit-transform-origin: 50%; transform-origin: 50%; opacity: 0; } .thermostat #day-routine #dr-small-widget .bullets:before { content: ''; width: 80%; height: 1px; background-color: #0090ff; position: absolute; left: 50%; top: 30px; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .thermostat #colorful-ring { background: #0F202E; background: radial-gradient(ellipse at center, #2F4858 0%, #0F202E 100%); } .thermostat #colorful-ring #cr-svg { width: 320px; height: 320px; margin-top: -2em; } .thermostat #colorful-ring #device-color { transition: all 750ms; } .thermostat #colorful-ring .r1 { fill: #04f; } .thermostat #colorful-ring .r2 { fill: #08f; } .thermostat #colorful-ring .r3 { fill: #0ff; } .thermostat #colorful-ring .r4 { fill: #0fb; } .thermostat #colorful-ring .r5 { fill: #0f0; } .thermostat #colorful-ring .r6 { fill: #cf0; } .thermostat #colorful-ring .r7 { fill: #fc0; } .thermostat #colorful-ring .r8 { fill: #f80; } .thermostat #colorful-ring .r9 { fill: #f00; } .thermostat #colorful-ring text { text-anchor: middle; font-size: 60px; fill: #fff; } .thermostat #colorful-ring text::selection { color: inherit; background-color: transparent; } .thermostat #colorful-ring input { opacity: 0; } .thermostat #colorful-ring .slider { margin-top: 1.4em; margin-bottom: 1.4em; width: 80%; max-width: 290px; } .thermostat #colorful-ring .slider .slider-handle { background: #fff; box-shadow: inset 0 -2px 1px rgba(51, 51, 51, 0.1); -webkit-touch-callout: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .thermostat #colorful-ring .slider .slider-handle:after { content: ''; display: block; width: 40px; height: 40px; border-radius: 50%; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .thermostat #colorful-ring .slider .slider-handle:focus { outline: none; } .thermostat #colorful-ring .slider .slider-track, .thermostat #colorful-ring .slider .slider-track-high, .thermostat #colorful-ring .slider .slider-track-low { border-radius: 2px; box-shadow: none; } .thermostat #colorful-ring .slider .slider-track { height: 4px; margin-top: -2px; } .thermostat #colorful-ring .slider .slider-track-high { background-color: #6d6d6d; } .thermostat #colorful-ring .slider .slider-track-low { background-color: #e2e2e2; } .thermostat #colorful-ring .slider .slider-selection { box-shadow: none; } .thermostat #colorful-ring .th-front { opacity: 0; width: 0; height: 0; position: absolute; } .thermostat #colorful-ring .patent { padding-top: .6rem; font-size: 120%; } .thermostat #colorful-ring .patent img { height: 40px; width: auto; margin-right: 6px; } .thermostat #energy-savings .content { position: relative; background-color: #f4f4f4; padding-bottom: 0; } .thermostat #energy-savings .content .costs { padding-bottom: 0; color: #7eae4a; font-size: 1.2em; } .thermostat #energy-savings .content .costs span { display: block; font-size: 4em; font-weight: 400; line-height: 1; } .thermostat #energy-savings .bg { padding-bottom: 0; height: 270px; position: relative; } .thermostat #energy-savings .bg p { width: 100%; text-align: center; font-size: .75em; padding-bottom: 0; } .thermostat #energy-savings .bg .container { width: 100%; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); bottom: .6rem; } .thermostat #precision .content { position: relative; background: #8c8c8a; background: radial-gradient(ellipse at top, #8c8c8a 0%, #4b4b4b 100%); color: #fff; } .thermostat #precision .bg { position: relative; height: 0; padding-bottom: 74%; } .thermostat #precision .bg p { width: 100%; text-align: center; font-size: .75em; padding-bottom: 0; } .thermostat #precision .bg .container { width: 100%; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); bottom: .6rem; } .thermostat #precision .tooltip { background: rgba(255, 255, 255, 0.8); display: inline-block; text-align: center; padding: 1em 2em; border-radius: 6px; min-width: 210px; position: absolute; left: 50%; top: 34%; -webkit-transform: translate(-50%, -44%); transform: translate(-50%, -44%); } .thermostat #precision .tooltip span { display: block; font-size: 2em; line-height: 1; padding-top: .25em; } .thermostat #open-window .content { position: relative; background-color: #d8d8d8; } .thermostat #open-window .bg { height: 0; padding-bottom: 108%; background-color: #d8d8d8; } .thermostat #open-window .info { background-size: auto 55%; background-position: 22px 50%; background-color: rgba(255, 255, 255, 0.8); background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NyIgaGVpZ2h0PSI2MSIgdmlld0JveD0iMCAwIDY3IDYxIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6bm9uZTtzdHJva2U6IzAwOTBmZjtzdHJva2UtbWl0ZXJsaW1pdDoxMDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPm9wZW5fd2luZG93X2ljb248L3RpdGxlPjxwb2x5Z29uIGNsYXNzPSJjbHMtMSIgcG9pbnRzPSIxMyA0LjUgNDQgOS41IDQ0IDUwLjUgMTMgNTUuNSAxMyA0LjUiLz48cmVjdCBjbGFzcz0iY2xzLTEiIHg9IjEyLjUiIHk9IjQuMDkiIHdpZHRoPSI0MiIgaGVpZ2h0PSI1MS44MyIvPjxyZWN0IGNsYXNzPSJjbHMtMSIgeD0iMC41IiB5PSI1NS45MSIgd2lkdGg9IjY2IiBoZWlnaHQ9IjQuNTkiIHJ4PSIyLjI5IiByeT0iMi4yOSIvPjxsaW5lIGNsYXNzPSJjbHMtMSIgeDE9IjEyLjUiIHkxPSIyOS41IiB4Mj0iNDQiIHkyPSIyOS41Ii8+PGxpbmUgY2xhc3M9ImNscy0xIiB4MT0iMjkuNSIgeTE9IjciIHgyPSIyOS41IiB5Mj0iNTIuOTIiLz48cmVjdCBjbGFzcz0iY2xzLTEiIHg9IjguNSIgeT0iMC41IiB3aWR0aD0iNTAiIGhlaWdodD0iNTUuNDEiLz48L3N2Zz4="); border-radius: 12px; text-align: left; width: 300px; color: #0090ff; padding: 20px 20px 20px 96px; position: relative; left: 50%; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: translateX(-50%) scale(0.8); transform: translateX(-50%) scale(0.8); margin-top: 10px; } .thermostat #open-window .info .top { font-size: 14px; } .thermostat #open-window .info .bot { font-size: 18px; } .thermostat #instant-reaction .content { position: relative; background-color: #f7f7f7; } .thermostat #instant-reaction .bg { height: 0; padding-bottom: 54%; background-color: #f7f7f7; } .thermostat #coop .content { position: relative; } .thermostat #coop .bg { height: 0; padding-bottom: 34%; } .thermostat #cold .content { position: relative; background-color: #f7f7f7; } .thermostat #cold .bg { height: 0; padding-bottom: 72%; background-color: #f7f7f7; } .thermostat #room-characteristics .content { position: relative; } .thermostat #room-characteristics .bg { height: 0; padding-bottom: 58%; } .thermostat #room-characteristics .info { background-size: auto 55%; background-position: 25px 50%; background-color: rgba(0, 144, 255, 0.8); background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5Ny45MyIgaGVpZ2h0PSIxNzMiIHZpZXdCb3g9IjAgMCA5Ny45MyAxNzMiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDojZmZmO308L3N0eWxlPjwvZGVmcz48dGl0bGU+dGgtdGVtcC1jaGFuZ2UtaWNvbjwvdGl0bGU+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMzIuNjUsMTE3LjU4YTIxLjIyLDIxLjIyLDAsMSwwLDMuMjYsMFY2MC4zOWExLjYzLDEuNjMsMCwwLDAtMy4yNiwwWm0xLjYzLDMuMmExOCwxOCwwLDEsMS0xOCwxOEExOCwxOCwwLDAsMSwzNC4yOCwxMjAuNzhaIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMy4zMiwxMjRBMzQuMjcsMzQuMjcsMCwxLDAsNDksMTA3Ljc1VjE0LjY5YTE0LjY5LDE0LjY5LDAsMCwwLTI5LjM4LDB2OTMuMDZBMzQuMjcsMzQuMjcsMCwwLDAsMy4zMiwxMjRabTAsMTQuN0EzMSwzMSwwLDAsMSwyMS44OCwxMTAuM2ExLjYzLDEuNjMsMCwwLDAsMS0xLjVWMTQuNjlhMTEuNDIsMTEuNDIsMCwxLDEsMjIuODUsMHY5NC4yNGExLjYzLDEuNjMsMCwwLDAsMSwxLjVBMzEsMzEsMCwxLDEsMy4yNywxMzguN1oiLz48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik05LjgsMjcuNzVhMS42MywxLjYzLDAsMCwwLTEuNjMtMS42M0gxLjY0YTEuNjMsMS42MywwLDAsMCwwLDMuMjZIOC4xN0ExLjYzLDEuNjMsMCwwLDAsOS44LDI3Ljc1WiIvPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTAsNDAuOGExLjYzLDEuNjMsMCwwLDAsMS42MywxLjYzSDguMTdhMS42MywxLjYzLDAsMCwwLDAtMy4yNkgxLjY0QTEuNjMsMS42MywwLDAsMCwwLDQwLjhaIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMCw1My44NmExLjYzLDEuNjMsMCwwLDAsMS42MywxLjYzSDguMTdhMS42MywxLjYzLDAsMSwwLDAtMy4yNkgxLjY0QTEuNjMsMS42MywwLDAsMCwwLDUzLjg2WiIvPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTAsNjYuOTJhMS42MywxLjYzLDAsMCwwLDEuNjMsMS42M0g4LjE3YTEuNjMsMS42MywwLDAsMCwwLTMuMjZIMS42NEExLjYzLDEuNjMsMCwwLDAsMCw2Ni45MloiLz48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0wLDgwQTEuNjMsMS42MywwLDAsMCwxLjY0LDgxLjZIOC4xN2ExLjYzLDEuNjMsMCwwLDAsMC0zLjI2SDEuNjRBMS42MywxLjYzLDAsMCwwLDAsODBaIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMCw5M2ExLjYzLDEuNjMsMCwwLDAsMS42MywxLjYzSDguMTdhMS42MywxLjYzLDAsMSwwLDAtMy4yNkgxLjY0QTEuNjMsMS42MywwLDAsMCwwLDkzWiIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMSIgcG9pbnRzPSI5Ny40MyA0NC41NyA3OS45NSAyNy4wOSA3OS45MiAyNy4xMSA3OS45IDI3LjA5IDYyLjQxIDQ0LjU3IDYzLjcyIDQ1Ljg4IDc5LjkyIDI5LjY4IDk2LjEzIDQ1Ljg4IDk3LjQzIDQ0LjU3Ii8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNOTYuMTIsNDYuMzhhLjUuNSwwLDAsMS0uMzUtLjE1TDc5LjkyLDMwLjM5LDY0LjA4LDQ2LjI0YS41LjUsMCwwLDEtLjcxLDBsLTEuMzEtMS4zMWEuNS41LDAsMCwxLDAtLjcxTDc5LjU1LDI2LjczYS41LjUsMCwwLDEsLjM1LS4xNS4yOC4yOCwwLDAsMSwuMTUsMCwuNDcuNDcsMCwwLDEsLjI2LjEzTDk3Ljc5LDQ0LjIyYS41LjUsMCwwLDEsMCwuNzFsLTEuMzEsMS4zMUEuNS41LDAsMCwxLDk2LjEyLDQ2LjM4Wm0tMTYuMi0xNy4yYS41LjUsMCwwLDEsLjM1LjE1TDk2LjEyLDQ1LjE3bC42LS42LTE2LjgtMTYuOC0xNi44LDE2LjguNi42TDc5LjU3LDI5LjMzQS41LjUsMCwwLDEsNzkuOTIsMjkuMThaIi8+PHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjYyLjQxIDYzLjk2IDc5LjkgODEuNDQgNzkuOTIgODEuNDIgNzkuOTUgODEuNDQgOTcuNDMgNjMuOTYgOTYuMTMgNjIuNjUgNzkuOTIgNzguODUgNjMuNzIgNjIuNjUgNjIuNDEgNjMuOTYiLz48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik03OS45NSw4MS45NGwtLjEyLDBhLjQ2LjQ2LDAsMCwxLS4yOC0uMTNMNjIuMDYsNjQuMzFhLjUuNSwwLDAsMSwwLS43MWwxLjMxLTEuMzFhLjUuNSwwLDAsMSwuNzEsMEw3OS45Miw3OC4xNCw5NS43Nyw2Mi4yOWEuNS41LDAsMCwxLC43MSwwbDEuMzEsMS4zMWEuNS41LDAsMCwxLDAsLjcxTDgwLjMsODEuOEEuNS41LDAsMCwxLDc5Ljk1LDgxLjk0Wk02My4xMiw2NGwxNi44LDE2LjhMOTYuNzMsNjRsLS42LS42TDgwLjI4LDc5LjJhLjUuNSwwLDAsMS0uNzEsMEw2My43Miw2My4zNloiLz48L3N2Zz4="); border-radius: 12px; width: 340px; position: absolute; color: #fff; padding: 20px 20px 20px 72px; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scale(0.5); transform: scale(0.5); top: 74%; left: 52%; } .thermostat #room-characteristics .info .top { font-size: 14px; } .thermostat #room-characteristics .info .bot { font-size: 18px; } .thermostat #wherever .content { position: relative; } .thermostat #wherever .bg { height: 0; padding-bottom: 61%; } .thermostat #holiday-mode .content { position: relative; background-color: #f8fcff; padding-bottom: 1rem; } .thermostat #holiday-mode .content p span { font-weight: 600; } .thermostat #holiday-mode .bg { height: 0; padding-bottom: 150%; } .thermostat #child-safety .content { position: relative; background: #7ec397; background: radial-gradient(ellipse at top right, #7ec397 0%, #3da864 100%); color: #fff; } .thermostat #child-safety .content p span { font-weight: 600; } .thermostat #child-safety .bg { height: 0; padding-bottom: 73%; } .thermostat #calibration .content { position: relative; background-color: #f4f4f4; padding-bottom: 0; } .thermostat #calibration .bg { height: 0; padding-bottom: 40%; } .thermostat #calibration .hint { max-width: 480px; } .thermostat #operation-control .content { position: relative; background-color: #e6e6e8; } .thermostat #operation-control .bg { height: 0; padding-bottom: 60%; } .thermostat #operation-control .hint { max-width: 450px; margin-bottom: 2.4rem; } .thermostat #minute-install .content { position: relative; background-color: #d1cac4; } .thermostat #minute-install .content a { display: inline-block; color: #fff; font-size: 120%; margin-bottom: 1rem; } .thermostat #minute-install .content a img { width: 170px; height: auto; margin-top: 1rem; margin-bottom: 1rem; } .thermostat #minute-install .content a span { display: inline-block; width: 100%; } .thermostat #minute-install .bg { height: 0; padding-bottom: 72%; } .thermostat #voice-control .content { position: relative; background-color: #f4f4f4; } .thermostat #voice-control .content img { width: 100%; max-width: 400px; height: auto; margin-top: 2rem; } .thermostat #voice-control .bg { padding-bottom: 80%; } .thermostat #voice-control .bg .container { position: absolute; top: 7%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 90%; max-width: 460px; text-align: center; } .thermostat #voice-control .chat-bubble { background-color: #ebf9ff; border-color: #3ac5fe; color: #3ac5fe; } .thermostat #voice-control .chat-bubble:after { background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzOC40IDIxIiB3aWR0aD0iMzguNCIgaGVpZ2h0PSIyMSI+PHN0eWxlPi5zdDAsLnN0MXtmaWxsOiNlYmY5ZmZ9LnN0MXtzdHJva2U6IzNhYzVmZX08L3N0eWxlPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0zLjQgMGgzNXY0LjJoLTM1eiIvPjxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0zLjQgMy43YzMuOCAwIDYuNyAzLjQgNi4xIDcuMi0uNSAzLjItMi4yIDYuOC05LjQgOS43IDEwLjQtLjEgMjUuNC01LjMgMzEuNy0xNC41IDEuNS0yIDQuMi0yLjQgNi42LTIuNCIvPjwvc3ZnPg==") no-repeat; } .thermostat #mounts .content { position: relative; } .thermostat #mounts .content .hidden-desktopS-up { max-width: 320px; } .thermostat #mounts .content span { font-size: 115%; } .thermostat #mounts .bg { height: 225px; padding-bottom: 0; background-size: auto 100%; } .thermostat #mounts .bg .wrapper { width: 320px; height: 225px; margin: 0 auto; position: relative; } .thermostat #mounts .bg img { width: 160px; height: auto; position: absolute; } .thermostat #mounts #fibaro-head, .thermostat #mounts #fibaro-head-blue { top: 24px; left: 35px; opacity: 0; visibility: visible; } .thermostat #mounts #common-head { width: 185px; top: 22px; left: 28px; } .thermostat #individual-schedules #is-slider { padding-left: 0; padding-right: 0; } .thermostat #individual-schedules .swiper-slide > div { z-index: 10; position: absolute; bottom: 0; width: 100%; color: #fff; padding: .8rem 0; } .thermostat #individual-schedules .swiper-slide.slide1 > div { background-color: rgba(255, 140, 0, 0.8); } .thermostat #individual-schedules .swiper-slide.slide2 > div { background-color: rgba(47, 201, 0, 0.8); } .thermostat #individual-schedules .swiper-slide.slide3 > div { background-color: rgba(0, 170, 230, 0.8); } .thermostat #individual-schedules .swiper-slide img { width: 100%; height: auto; } .thermostat #individual-schedules .swiper-slide .title { display: none; } .thermostat #individual-schedules .swiper-slide .temp { font-size: 12px; line-height: 16px; display: none; } .thermostat #individual-schedules .swiper-slide .temp.hilite.top { display: block; } .thermostat #individual-schedules .swiper-slide .temp.hilite.bot { font-weight: 600; } .thermostat #individual-schedules .swiper-slide .temp span { font-weight: 600; font-size: 16px; line-height: 16px; vertical-align: text-top; padding-left: 10px; } .thermostat #individual-schedules .swiper-pagination { bottom: 0; top: 0; position: relative; margin-bottom: .5rem; } .thermostat #individual-schedules .swiper-pagination-bullet { background-color: #fff; border: 1px solid #0090ff; } .thermostat #individual-schedules .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #0090ff; } .thermostat #usb .content { position: relative; } .thermostat #usb .bg { overflow: hidden; } .thermostat #usb .bg, .thermostat #usb .bg video { height: 250px; } .thermostat #usb .bg video { width: auto; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .thermostat #usb .content video, .thermostat #usb .content .charging { display: none; } .thermostat #descaling .content { position: relative; } .thermostat #descaling .bg, .thermostat #descaling video, .thermostat #descaling img { height: 230px; } .thermostat #descaling .bg > div { position: absolute; z-index: 11; font-size: 13px; text-align: center; left: 53%; top: 76%; opacity: 0; transition: all 500ms; } .thermostat #descaling .bg > div.active { opacity: 1; -webkit-transform: translateY(3px); transform: translateY(3px); } .thermostat #descaling img, .thermostat #descaling video { width: auto; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .thermostat #mobile-intuitive .content { color: #444444; } .thermostat #mobile-intuitive .swiper-pagination { position: relative; margin-top: 2.4rem; z-index: 100; } .thermostat #mobile-intuitive .swiper-pagination .swiper-pagination-icon { display: inline-block; width: 100px; height: auto; padding: 0; margin: 0 auto; text-align: center; position: relative; cursor: pointer; } .thermostat #mobile-intuitive .swiper-pagination .swiper-pagination-icon span { width: 100%; text-align: center; color: #7e7e7e; transition: color 250ms; } .thermostat #mobile-intuitive .swiper-pagination .swiper-pagination-icon.active span { color: #0090ff; } .thermostat #mobile-intuitive .swiper-pagination .swiper-pagination-icon svg { height: 40px; width: auto; display: block; margin-left: auto; margin-right: auto; margin-bottom: 1rem; } .thermostat #mobile-intuitive .bg { background-size: auto 100%; } .thermostat #mobile-intuitive .bg, .thermostat #mobile-intuitive .swiper-slide { height: 220px; margin-bottom: 10px; } .thermostat #mobile-intuitive .note { z-index: 10; position: absolute; bottom: 0; left: 10px; color: #444; font-size: 80%; } .thermostat #various-radiators .content { background-color: #fff; color: #444444; position: relative; } .thermostat #various-radiators .bg { height: 200px; } .thermostat #various-radiators .swiper-button-prev, .thermostat #various-radiators .swiper-button-next { display: none; } .thermostat #various-radiators .swiper-pagination-bullet { opacity: 1; background-color: transparent; border: 1px solid #fff; } .thermostat #various-radiators .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff; } .thermostat .section-packshot-slider { background: #fff; } .thermostat .section-packshot-slider img { max-width: none; } .thermostat .section-packshot-slider .packshots > div { text-align: center; } .thermostat .section-packshot-slider .packshots img { width: 100%; } .thermostat .section-packshot-slider .packshots.hidden-phoneL-down.hk-big img { max-width: 1420px; } .thermostat .section-packshot-slider .packshots.hidden-phoneL-down.zw-big img { max-width: 1640px; } .thermostat .section-packshot-slider .packshots.hidden-tabletP-up img { margin-bottom: 1rem; } .thermostat .section-packshot-slider .packshots.hidden-tabletP-up .swiper-slide { background-color: #fff; } .thermostat .section-packshot-slider .packshots.hidden-tabletP-up .swiper-pagination { bottom: 0; } .thermostat .section-packshot-slider .packshots .swiper-container { padding-bottom: 10px; } .thermostat #temp-change .content { background: #919699; background: radial-gradient(ellipse at top right, #919699 0%, #5d666b 100%); color: #fff; } .thermostat #temp-change .bg { height: auto; padding-bottom: 0; } .thermostat #temp-change .bg img { width: 100%; height: auto; } .thermostat #temp-change .swiper-pagination { position: relative; margin-top: 2.4rem; } .thermostat #temp-change .swiper-pagination p { font-size: 80%; padding-bottom: 0; display: block; width: 100%; text-align: center; } .thermostat #temp-change .swiper-pagination p:hover { cursor: pointer; } .thermostat #temp-change .swiper-pagination p img { display: block; margin: 0 auto; margin-bottom: .6rem; height: 50px; } .thermostat #temp-change .swiper-pagination-icon { opacity: .3; transition: opacity 250ms; } .thermostat #temp-change .swiper-pagination-icon.active { opacity: 1; } .thermostat .section-scroll-slide .content { color: #444444; } .thermostat #coming-home .content { position: relative; background-color: #080f17; color: #fff; } .thermostat #coming-home .content .info { background: rgba(0, 144, 255, 0.8) url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMjcuNDYiIGhlaWdodD0iMzIwLjA5IiB2aWV3Qm94PSIwIDAgMjI3LjQ2IDMyMC4wOSI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOm5vbmU7c3Ryb2tlOiNmZmY7c3Ryb2tlLW1pdGVybGltaXQ6MTA7c3Ryb2tlLXdpZHRoOjEwcHg7fTwvc3R5bGU+PC9kZWZzPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTE3NSwxNjAuNzFhMzguMzcsMzguMzcsMCwxLDAtMzguMzctMzguMzhBMzguNDIsMzguNDIsMCwwLDAsMTc1LDE2MC43MVptLTEwOC43My0zMmExMDguNzMsMTA4LjczLDAsMCwxLDIxNy40NiwwQzI4My43MywxODguNzcsMTc1LDMyNywxNzUsMzI3UzY2LjI3LDE4OC43Nyw2Ni4yNywxMjguNzNaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNjEuMjcgLTE1KSIvPjwvc3ZnPg==") no-repeat; background-size: auto 55%; background-position: 20px 50%; border-radius: 12px; display: inline-block; text-align: left; width: 100%; max-width: 280px; color: #fff; padding: 20px 20px 20px 72px; margin-top: 10px; } .thermostat #coming-home .bg { height: 0; padding-bottom: 62%; } .thermostat #coming-home .bg .bg1, .thermostat #coming-home .bg .bg2 { position: absolute; top: 0; } .thermostat #coming-home .bg .bg2 { opacity: 0; } .thermostat #coming-home .widget { display: none; } .thermostat #external .content { position: relative; padding-bottom: 1rem; color: #444444; } .thermostat #external .bg { padding-bottom: 0; height: 500px; background-size: auto 100%; } .thermostat #against-cold .content { position: relative; padding-bottom: 1rem; } .thermostat #against-cold .bg { height: 0; padding-bottom: 160%; } .thermostat #against-cold #ac-particles { display: none; } .thermostat #versus .content { position: relative; } .thermostat #versus .bg { height: 0; padding-bottom: 75%; } .thermostat #versus .bg .bg1, .thermostat #versus .bg .bg2 { position: absolute; top: 0; } .thermostat #versus .bg .bg2 { display: none; } .thermostat #versus .switch { position: relative; display: block; width: 60px; height: 30px; margin-top: 2rem; margin-left: auto; margin-right: auto; } .thermostat #versus .switch .track { display: inline-block; width: 60px; height: 30px; border-radius: 15px/50%; background-color: #dfe3e9; cursor: pointer; transition: all 200ms; } .thermostat #versus .switch .handle { position: absolute; top: 1px; left: 1px; height: 28px; width: 28px; background-color: #fff; border-radius: 50%; box-shadow: 0 1px 2px #6e6e6e; cursor: pointer; transition: all 200ms; } .thermostat #versus .switch:before, .thermostat #versus .switch:after { display: block; height: 30px; transition: color 200ms; font-size: 15px; line-height: 30px; position: absolute; top: 0; } .thermostat #versus .switch:before { left: -90%; color: #444444; } .thermostat #versus .switch:after { right: -90%; content: 'Fibaro'; color: #aaaaaa; } .thermostat #versus .switch.active .track { background-color: #0090FF; } .thermostat #versus .switch.active .handle { box-shadow: 0 1px 2px #0075d0; -webkit-transform: translateX(30px); transform: translateX(30px); } .thermostat #versus .switch.active:before { color: #aaaaaa; } .thermostat #versus .switch.active:after { color: #444444; } .thermostat #energy-class .content { position: relative; } .thermostat #energy-class .content p { padding-bottom: 2.4rem; } .thermostat #energy-class .wrapper { background-color: #dfdde8; } .thermostat #energy-class video { width: 280px; height: auto; } .thermostat #home-office .content { position: relative; background-color: #50585a; color: #fff; } .thermostat #home-office .bg { height: 0; padding-bottom: 73%; } .thermostat #home-office .note { z-index: 10; position: absolute; bottom: 10px; left: 10px; font-size: 80%; } .thermostat #home-office .info { background-size: auto 55%; background-position: 25px 50%; background-color: rgba(0, 144, 255, 0.8); background-repeat: no-repeat; border-radius: 12px; width: 120px; position: absolute; color: #fff; padding: 20px 20px 20px 72px; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scale(0.5); transform: scale(0.5); } .thermostat #home-office .info.info1 { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5Ny45MyIgaGVpZ2h0PSIxNzMiIHZpZXdCb3g9IjAgMCA5Ny45MyAxNzMiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDojZmZmO308L3N0eWxlPjwvZGVmcz48dGl0bGU+dGgtdGVtcC1jaGFuZ2UtaWNvbjwvdGl0bGU+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMzIuNjUsMTE3LjU4YTIxLjIyLDIxLjIyLDAsMSwwLDMuMjYsMFY2MC4zOWExLjYzLDEuNjMsMCwwLDAtMy4yNiwwWm0xLjYzLDMuMmExOCwxOCwwLDEsMS0xOCwxOEExOCwxOCwwLDAsMSwzNC4yOCwxMjAuNzhaIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMy4zMiwxMjRBMzQuMjcsMzQuMjcsMCwxLDAsNDksMTA3Ljc1VjE0LjY5YTE0LjY5LDE0LjY5LDAsMCwwLTI5LjM4LDB2OTMuMDZBMzQuMjcsMzQuMjcsMCwwLDAsMy4zMiwxMjRabTAsMTQuN0EzMSwzMSwwLDAsMSwyMS44OCwxMTAuM2ExLjYzLDEuNjMsMCwwLDAsMS0xLjVWMTQuNjlhMTEuNDIsMTEuNDIsMCwxLDEsMjIuODUsMHY5NC4yNGExLjYzLDEuNjMsMCwwLDAsMSwxLjVBMzEsMzEsMCwxLDEsMy4yNywxMzguN1oiLz48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik05LjgsMjcuNzVhMS42MywxLjYzLDAsMCwwLTEuNjMtMS42M0gxLjY0YTEuNjMsMS42MywwLDAsMCwwLDMuMjZIOC4xN0ExLjYzLDEuNjMsMCwwLDAsOS44LDI3Ljc1WiIvPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTAsNDAuOGExLjYzLDEuNjMsMCwwLDAsMS42MywxLjYzSDguMTdhMS42MywxLjYzLDAsMCwwLDAtMy4yNkgxLjY0QTEuNjMsMS42MywwLDAsMCwwLDQwLjhaIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMCw1My44NmExLjYzLDEuNjMsMCwwLDAsMS42MywxLjYzSDguMTdhMS42MywxLjYzLDAsMSwwLDAtMy4yNkgxLjY0QTEuNjMsMS42MywwLDAsMCwwLDUzLjg2WiIvPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTAsNjYuOTJhMS42MywxLjYzLDAsMCwwLDEuNjMsMS42M0g4LjE3YTEuNjMsMS42MywwLDAsMCwwLTMuMjZIMS42NEExLjYzLDEuNjMsMCwwLDAsMCw2Ni45MloiLz48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0wLDgwQTEuNjMsMS42MywwLDAsMCwxLjY0LDgxLjZIOC4xN2ExLjYzLDEuNjMsMCwwLDAsMC0zLjI2SDEuNjRBMS42MywxLjYzLDAsMCwwLDAsODBaIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMCw5M2ExLjYzLDEuNjMsMCwwLDAsMS42MywxLjYzSDguMTdhMS42MywxLjYzLDAsMSwwLDAtMy4yNkgxLjY0QTEuNjMsMS42MywwLDAsMCwwLDkzWiIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMSIgcG9pbnRzPSI5Ny40MyA0NC41NyA3OS45NSAyNy4wOSA3OS45MiAyNy4xMSA3OS45IDI3LjA5IDYyLjQxIDQ0LjU3IDYzLjcyIDQ1Ljg4IDc5LjkyIDI5LjY4IDk2LjEzIDQ1Ljg4IDk3LjQzIDQ0LjU3Ii8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNOTYuMTIsNDYuMzhhLjUuNSwwLDAsMS0uMzUtLjE1TDc5LjkyLDMwLjM5LDY0LjA4LDQ2LjI0YS41LjUsMCwwLDEtLjcxLDBsLTEuMzEtMS4zMWEuNS41LDAsMCwxLDAtLjcxTDc5LjU1LDI2LjczYS41LjUsMCwwLDEsLjM1LS4xNS4yOC4yOCwwLDAsMSwuMTUsMCwuNDcuNDcsMCwwLDEsLjI2LjEzTDk3Ljc5LDQ0LjIyYS41LjUsMCwwLDEsMCwuNzFsLTEuMzEsMS4zMUEuNS41LDAsMCwxLDk2LjEyLDQ2LjM4Wm0tMTYuMi0xNy4yYS41LjUsMCwwLDEsLjM1LjE1TDk2LjEyLDQ1LjE3bC42LS42LTE2LjgtMTYuOC0xNi44LDE2LjguNi42TDc5LjU3LDI5LjMzQS41LjUsMCwwLDEsNzkuOTIsMjkuMThaIi8+PHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjYyLjQxIDYzLjk2IDc5LjkgODEuNDQgNzkuOTIgODEuNDIgNzkuOTUgODEuNDQgOTcuNDMgNjMuOTYgOTYuMTMgNjIuNjUgNzkuOTIgNzguODUgNjMuNzIgNjIuNjUgNjIuNDEgNjMuOTYiLz48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik03OS45NSw4MS45NGwtLjEyLDBhLjQ2LjQ2LDAsMCwxLS4yOC0uMTNMNjIuMDYsNjQuMzFhLjUuNSwwLDAsMSwwLS43MWwxLjMxLTEuMzFhLjUuNSwwLDAsMSwuNzEsMEw3OS45Miw3OC4xNCw5NS43Nyw2Mi4yOWEuNS41LDAsMCwxLC43MSwwbDEuMzEsMS4zMWEuNS41LDAsMCwxLDAsLjcxTDgwLjMsODEuOEEuNS41LDAsMCwxLDc5Ljk1LDgxLjk0Wk02My4xMiw2NGwxNi44LDE2LjhMOTYuNzMsNjRsLS42LS42TDgwLjI4LDc5LjJhLjUuNSwwLDAsMS0uNzEsMEw2My43Miw2My4zNloiLz48L3N2Zz4="); top: 59%; left: 4%; } .thermostat #home-office .info.info2 { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIg0KCSB2aWV3Qm94PSIwIDAgMzQgNTUuMSIgIHdpZHRoPSIzNCIgaGVpZ2h0PSI1NS4xIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtjbGlwLXBhdGg6dXJsKCNTVkdJRF8yXyk7fQ0KCS5zdDF7ZmlsbDojRkZGRkZGO30NCgkuc3Qye2NsaXAtcGF0aDp1cmwoI1NWR0lEXzRfKTt9DQo8L3N0eWxlPg0KPGc+DQoJPGc+DQoJCTxkZWZzPg0KCQkJPHJlY3QgaWQ9IlNWR0lEXzFfIiB3aWR0aD0iMzQiIGhlaWdodD0iNTUuMSIvPg0KCQk8L2RlZnM+DQoJCTxjbGlwUGF0aCBpZD0iU1ZHSURfMl8iPg0KCQkJPHVzZSB4bGluazpocmVmPSIjU1ZHSURfMV8iICBzdHlsZT0ib3ZlcmZsb3c6dmlzaWJsZTsiLz4NCgkJPC9jbGlwUGF0aD4NCgkJPGcgY2xhc3M9InN0MCI+DQoJCQk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNMjAuMSwxMC4xQzE3LjMsMTAuMSwxNSw3LjgsMTUsNWMwLTIuOCwyLjMtNS4xLDUuMi01LjFjMi44LDAsNS4xLDIuMyw1LDUuMkMyNS4xLDcuOSwyMi45LDEwLjEsMjAuMSwxMC4xeg0KCQkJCSBNMjAuMSwxQzE3LjksMSwxNiwyLjgsMTYsNWMwLDAsMCwwLjEsMCwwLjFjMCwyLjMsMS44LDQuMSw0LjEsNC4xYzIuMiwwLDQuMS0xLjgsNC4xLTRjMCwwLDAtMC4xLDAtMC4xQzI0LjIsMi45LDIyLjMsMSwyMC4xLDENCgkJCQl6Ii8+DQoJCTwvZz4NCgk8L2c+DQoJPGc+DQoJCTxkZWZzPg0KCQkJPHJlY3QgaWQ9IlNWR0lEXzNfIiB3aWR0aD0iMzQiIGhlaWdodD0iNTUuMSIvPg0KCQk8L2RlZnM+DQoJCTxjbGlwUGF0aCBpZD0iU1ZHSURfNF8iPg0KCQkJPHVzZSB4bGluazpocmVmPSIjU1ZHSURfM18iICBzdHlsZT0ib3ZlcmZsb3c6dmlzaWJsZTsiLz4NCgkJPC9jbGlwUGF0aD4NCgkJPGcgY2xhc3M9InN0MiI+DQoJCQk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNMi41LDU1LjFjLTAuNSwwLTAuOS0wLjEtMS4zLTAuNGMtMC43LTAuNC0xLjEtMS4yLTEuMS0yQzAsNTEuOSwwLjIsNTEsMC43LDUwLjNsNi45LTEwLjcNCgkJCQljMC0wLjEsMC0wLjEsMC4xLTAuMWwxLjctMTAuOWMwLTAuMywwLTAuNiwwLjEtMC45bDIuMS05LjVsLTQuMSwyLjJsLTEuNCw3LjRjLTAuMSwwLjYtMC41LDEuMi0xLDEuNWMtMC41LDAuNC0xLjIsMC41LTEuOCwwLjQNCgkJCQljLTAuNi0wLjEtMS4yLTAuNS0xLjUtMWMtMC40LTAuNS0wLjUtMS4yLTAuNC0xLjhsMS41LTguMWMwLjEtMC43LDAuNi0xLjMsMS4yLTEuNmMwLjItMC4xLDAuMy0wLjIsMC41LTAuM2w5LjgtNS4yDQoJCQkJYzAuNS0wLjQsMS4xLTAuNywxLjctMC44YzAuNC0wLjEsMC44LTAuMiwxLjItMC4yYzAuNCwwLDAuOCwwLDEuMiwwLjFjMC43LDAuMiwxLjMsMC41LDEuOSwwLjljMC41LDAuMywxLDAuNywxLjIsMS4zbDAuMSwwLjINCgkJCQljMC4yLDAuMywwLjMsMC42LDAuNCwwLjlsNC4xLDguNGw2LjQsMi44YzEuMSwwLjYsMS42LDEuOSwxLjEsMy4xYy0wLjMsMC42LTAuNywxLTEuMywxLjNjLTAuNSwwLjItMS4xLDAuMi0xLjYsMGwtNy0zLjENCgkJCQljLTAuNi0wLjMtMS0wLjgtMS4yLTEuNGMtMC4xLTAuMS0wLjEtMC4yLTAuMi0wLjNsLTEuMi0yLjRsLTEuNyw3LjdsNy40LDguOGMwLjEsMC4yLDAuMiwwLjMsMC4zLDAuNWMwLjMsMC40LDAuNSwwLjgsMC42LDEuMw0KCQkJCWwyLjMsMTAuOGMwLjQsMS41LTAuNiwzLjEtMi4xLDMuNWMtMS42LDAuMi0zLjEtMC44LTMuNC0yLjRsLTIuMi0xMC41bC03LjEtOC40Yy0wLjQtMC4yLTAuOC0wLjMtMS4yLTAuNEwxMyw0MC45DQoJCQkJYzAsMC4yLTAuMSwwLjUtMC4yLDAuN2MtMC4xLDAuNC0wLjMsMC43LTAuNSwxLjFMNS40LDUzLjRDNC44LDU0LjQsMy43LDU1LjEsMi41LDU1LjF6IE0xMywxNi40TDEwLjUsMjgNCgkJCQljLTAuMSwwLjMtMC4xLDAuNS0wLjEsMC44TDguNiw0MGwtMC4xLDAuMmwtNywxMC43QzEuMSw1MS40LDEsNTIuMSwxLDUyLjdjMCwwLjUsMC4zLDAuOSwwLjcsMS4yYzEuMSwwLjUsMi4zLDAsMi44LTFsNi45LTEwLjcNCgkJCQljMC4yLTAuMywwLjMtMC42LDAuNC0wLjljMC4xLTAuMywwLjItMC40LDAuMi0wLjZsMS40LTguN2wwLjUsMC4yYzAuMSwwLDAuMywwLjEsMC40LDAuMWMwLjUsMC4xLDEuMSwwLjMsMS42LDAuNWwwLjIsMC4xDQoJCQkJbDcuMyw4LjdsMi4zLDEwLjhjMC4yLDEsMS4xLDEuOCwyLjIsMS42YzAsMCwwLDAsMCwwYzEtMC4zLDEuNi0xLjMsMS40LTIuM0wyNyw0MC45Yy0wLjEtMC4zLTAuMi0wLjYtMC40LTAuOQ0KCQkJCWMtMC4xLTAuMi0wLjItMC4zLTAuMy0wLjRsLTcuNy05LjJsMi40LTExbDIuNCw1YzAsMC4xLDAuMSwwLjIsMC4xLDAuM2wwLjEsMC4yYzAsMC40LDAuMywwLjcsMC42LDAuOGw3LDMuMQ0KCQkJCWMwLjMsMC4xLDAuNiwwLjEsMC45LDBjMC40LTAuMiwwLjYtMC40LDAuOC0wLjhjMC4zLTAuNiwwLjEtMS40LTAuNi0xLjhjMCwwLDAsMCwwLDBsLTYuNy0zbC00LjMtOC44Yy0wLjEtMC4zLTAuMi0wLjYtMC40LTAuOA0KCQkJCWwtMC4xLTAuMmMtMC4yLTAuNC0wLjUtMC43LTAuOC0wLjljLTAuNS0wLjMtMS0wLjYtMS42LTAuOGMtMC4zLTAuMS0wLjctMC4xLTEtMC4xYy0wLjMsMC0wLjYsMC0wLjksMC4xYy0wLjUsMC4yLTEsMC40LTEuNSwwLjcNCgkJCQlsLTkuOSw1LjJjLTAuMSwwLjEtMC4zLDAuMi0wLjQsMC4zYy0wLjQsMC4yLTAuNywwLjYtMC44LDFMMi40LDI3Yy0wLjEsMC4zLDAsMC43LDAuMiwxYzAuMiwwLjMsMC41LDAuNSwwLjksMC42DQoJCQkJYzAuMywwLjEsMC43LDAsMS0wLjJjMC4zLTAuMiwwLjUtMC41LDAuNi0wLjlsMS41LTcuOUwxMywxNi40eiIvPg0KCQk8L2c+DQoJPC9nPg0KPC9nPg0KPC9zdmc+DQo="); top: 17%; left: 73%; width: 70px; } .thermostat #home-office .info .top { font-size: 14px; } .thermostat #home-office .info .bot { font-size: 18px; } .thermostat #home-office .swiper-bullets { width: 100%; text-align: center; } .thermostat #home-office .swiper-bullets .bullet { display: inline-block; border: 2px solid #9e9e9e; color: #9e9e9e; border-radius: 6px; padding: 4px 8px; cursor: pointer; font-size: 14px; margin-top: 1rem; transition: all 500ms; } .thermostat #home-office .swiper-bullets .bullet.active { border: 2px solid #0090ff; color: #0090ff; } .thermostat #home-office .swiper-bullets .bullet.bullet2 { margin-left: 6px; margin-right: 6px; } .thermostat #room-scan { background-color: #131929; color: #fff; } .thermostat #room-scan .swiper-container { overflow: visible; margin-top: 30px; } .thermostat #room-scan .swiper-slide { background-color: #131929; } .thermostat #room-scan .swiper-slide img { width: 100%; height: auto; } .thermostat #room-scan .swiper-slide .item { position: absolute; top: 0; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 150px; height: 72px; background-color: #eeeeee; border-radius: 8px; text-align: center; z-index: 10; } .thermostat #room-scan .swiper-slide .item .top, .thermostat #room-scan .swiper-slide .item .mid, .thermostat #room-scan .swiper-slide .item .bot { height: calc(100% / 3); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .thermostat #room-scan .swiper-slide .item .top, .thermostat #room-scan .swiper-slide .item .bot { color: #0090ff; font-size: 18px; } .thermostat #room-scan .swiper-slide .item .top { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; height: 44%; } .thermostat #room-scan .swiper-slide .item .mid { -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 13%; font-size: 11px; color: #5b5b5b; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; } .thermostat #room-scan .swiper-slide .item .bot { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; height: 43%; } .thermostat #room-scan .swiper-slide .sub { text-align: center; padding: 10px 0; } .thermostat #room-scan .swiper-slide .sub span { font-weight: 600; } .thermostat #room-scan .swiper-pagination { position: relative; top: 0; bottom: 0; } .thermostat #room-scan .swiper-pagination .swiper-pagination-bullet { margin: 5px 5px 8px; background-color: transparent; border: 1px solid #fff; } .thermostat #room-scan .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff; } .thermostat .find-a-store-custom-button { margin: 40px 0 30px; } html[lang="pl-PL"] .thermostat #home-office .info1, html[lang="pl"] .thermostat #home-office .info1 { width: 125px; } html[lang="pl-PL"] .thermostat #versus .switch:before, html[lang="pl"] .thermostat #versus .switch:before { left: -100%; } @media screen and (min-width: 370px) { .thermostat #colorful-ring #cr-svg { width: 370px; height: 370px; } } @media (max-width: 767px) { .thermostat .spinner { display: none; } .thermostat #individual-schedules .content { padding-bottom: 0; } } @media (min-width: 544px) { .thermostat .section-product-header .bg { height: 520px; } .thermostat #many-functions ul { margin-top: 1.2rem; } .thermostat #colorful-ring #cr-svg { margin-top: -4em; width: 440px; height: 440px; } .thermostat #energy-savings .bg { height: 380px; } .thermostat #precision .tooltip { top: 40%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .thermostat #cold .bg { padding-bottom: 55%; } .thermostat #room-characteristics .bg { padding-bottom: 54%; } .thermostat #room-characteristics .info { -webkit-transform: scale(0.7); transform: scale(0.7); } .thermostat #holiday-mode .bg { padding-bottom: 100%; } .thermostat #calibration .bg { padding-bottom: 30%; } .thermostat #voice-control .content { padding-bottom: 0; } .thermostat #voice-control .content img { max-width: 450px; } .thermostat #voice-control .bg .container { top: 20%; } .thermostat #mounts .bg { height: 295px; } .thermostat #mounts .bg .wrapper { -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: scale(1.31); transform: scale(1.31); } .thermostat #usb .bg, .thermostat #usb .bg video { height: 340px; } .thermostat #descaling .bg, .thermostat #descaling video, .thermostat #descaling img { height: 290px; } .thermostat #descaling .bg > div { font-size: 14px; left: 54%; } .thermostat #mobile-intuitive .bg, .thermostat #mobile-intuitive .swiper-slide { height: 280px; } .thermostat #various-radiators .bg { height: 340px; } .thermostat #external .bg { height: 700px; } .thermostat #against-cold .bg { padding-bottom: 110%; } .thermostat #home-office .info { -webkit-transform: scale(0.7); transform: scale(0.7); } .thermostat #open-window .info { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } } @media (min-width: 768px) { .thermostat .section-product-header .content { padding: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .thermostat .section-product-header .content h1 { font-size: 2.8rem; opacity: 0; -webkit-transform: translateY(25px); transform: translateY(25px); } .thermostat .section-product-header .content hr { width: 0; } .thermostat .section-product-header .content p { width: auto; opacity: 0; } .thermostat .section-product-header .content p:first-of-type { -webkit-transform: translateY(-25px); transform: translateY(-25px); } .thermostat .section-product-header .content p.small { margin-top: 2.4rem; -webkit-transform: translateY(-4px); transform: translateY(-4px); } .thermostat .section-product-header .bg { height: 0; padding-bottom: 37%; background: #000; } .thermostat .section-product-header .bg video, .thermostat .section-product-header .bg img { width: 100%; height: auto; position: absolute; top: 0; left: 0; } .thermostat .hint { border: 1px solid #fff; background-color: rgba(255, 255, 255, 0.7); } .thermostat #room-scan .swiper-container { margin-top: 40px; } .thermostat #room-scan .swiper-slide .item { -webkit-transform: translate(-50%, -50%) scale(1.25); transform: translate(-50%, -50%) scale(1.25); } .thermostat #many-functions li { width: 33%; } .thermostat #many-functions .infobox-wrapper, .thermostat #many-functions .col-1 img { width: 340px; } .thermostat #many-functions .infobox-wrapper { margin-bottom: 7.2rem; } .thermostat .section-video-reveal .infobox { width: 480px; margin-top: 2.4rem; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="battery"] { top: 75px; left: 300px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="chips"] { top: 188px; left: 345px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="mechanism"] { top: 65px; left: 135px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="ring"] { top: 130px; left: 550px; } .thermostat #day-routine .th-head-wrapper { width: 730px; height: 150px; } .thermostat #day-routine .th-head { top: -13px; left: 676px; -webkit-transform: scale(0.3); transform: scale(0.3); } .thermostat #day-routine #dr-large-widget { -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: scale(0.48); transform: scale(0.48); position: relative; margin: 1.2rem auto 0; opacity: 0; } .thermostat #day-routine #dr-large-widget * ::selection { color: inherit; background-color: transparent; } .thermostat #day-routine #dr-large-widget > div { width: 470px; position: absolute; top: 220px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .thermostat #day-routine #dr-large-widget > div .time, .thermostat #day-routine #dr-large-widget > div .temp { color: #0090ff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .thermostat #day-routine #dr-large-widget > div .head, .thermostat #day-routine #dr-large-widget > div .body { color: #444; } .thermostat #day-routine #dr-large-widget > div .head, .thermostat #day-routine #dr-large-widget > div .body, .thermostat #day-routine #dr-large-widget > div .temp, .thermostat #day-routine #dr-large-widget > div .time { line-height: 1; } .thermostat #day-routine #dr-large-widget > div .temp { font-size: 60px; } .thermostat #day-routine #dr-large-widget > div .time { font-size: 30px; margin-top: 12px; } .thermostat #day-routine #dr-large-widget > div .head { font-size: 36px; margin-top: 45px; } .thermostat #day-routine #dr-large-widget > div .body { font-size: 24px; margin-top: 18px; line-height: 32px; } .thermostat #day-routine #dr-large-widget svg { position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .thermostat #day-routine #dr-large-widget svg .icon-part { fill: none; stroke: #b7b7b7; } .thermostat #day-routine #dr-large-widget svg .arc { fill: none; stroke: #b7b7b7; } .thermostat #day-routine #dr-large-widget svg .spot { fill: #e7e7eb; fill-opacity: .5; stroke: #b7b7b7; } .thermostat #day-routine #dr-large-widget svg .arc-anim, .thermostat #day-routine #dr-large-widget svg .spot-anim { fill: none; stroke: #0090ff; stroke-width: 2px; } .thermostat #day-routine #dr-large-widget svg .spot-anim { fill: #fff; fill-opacity: .001; cursor: pointer; } .thermostat #day-routine .content { background: none; padding-bottom: 0; position: absolute; z-index: 10; } .thermostat #day-routine .bg { height: 510px; } .thermostat #colorful-ring #cr-svg { width: 480px; height: 480px; } .thermostat #energy-savings .content { position: absolute; background-color: transparent; } .thermostat #energy-savings .bg { height: 420px; } .thermostat #precision .bg { padding-bottom: 35%; color: #fff; } .thermostat #precision .tooltip { border: 1px solid rgba(255, 255, 255, 0.75); background: rgba(255, 255, 255, 0.15); left: 23%; top: 41%; } .thermostat #open-window .content { position: absolute; background-color: transparent; } .thermostat #open-window .bg { position: relative; padding-bottom: 55%; } .thermostat #open-window .info { position: absolute; top: 46%; left: 58%; margin-top: 0; } .thermostat #instant-reaction .bg { background-position: 0 50%; padding-bottom: 48%; } .thermostat #instant-reaction .content { position: absolute; background-color: transparent; text-align: left; } .thermostat #cold .content { position: absolute; background-color: transparent; } .thermostat #cold .bg { padding-bottom: 53%; } .thermostat #room-characteristics .bg { padding-bottom: 36%; } .thermostat #room-characteristics .info { top: 32%; left: 65%; } .thermostat #wherever .bg { padding-bottom: 37%; } .thermostat #holiday-mode .content { position: absolute; background-color: transparent; } .thermostat #holiday-mode .bg { padding-bottom: 51%; } .thermostat #child-safety .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); background: none; color: inherit; text-align: left; } .thermostat #child-safety .bg { padding-bottom: 41%; } .thermostat #calibration .bg { padding-bottom: 24%; } .thermostat #operation-control .bg { padding-bottom: 40%; background-position: 0 50%; } .thermostat #minute-install .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); background-color: transparent; } .thermostat #minute-install .bg { background-position: 80% 50%; padding-bottom: 50%; } .thermostat #mounts .bg { height: 395px; } .thermostat #mounts .bg .wrapper { -webkit-transform: scale(1.76); transform: scale(1.76); } .thermostat #individual-schedules .container-fluid { max-width: 720px; margin-top: 1.2rem; margin-bottom: 2.4rem; } .thermostat #individual-schedules .swiper-slide { border-radius: 12px; overflow: hidden; } .thermostat #voice-control .content { position: absolute; background-color: transparent; } .thermostat #voice-control .bg { padding-bottom: 0; height: 690px; } .thermostat #voice-control .bg .container { top: 42%; max-width: 560px; } .thermostat #voice-control .bg .chat-bubble:after { background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzOC41IDIxLjEiIHdpZHRoPSIzOC41IiBoZWlnaHQ9IjIxLjEiPjxzdHlsZT4uc3QwLC5zdDF7ZmlsbDojZWJmOWZmfS5zdDF7c3Ryb2tlOiMzYWM1ZmV9PC9zdHlsZT48cGF0aCBjbGFzcz0ic3QwIiBkPSJNMCAwaDM1djQuMkgweiIvPjxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0wIDMuN2MyLjQgMCA1LjEuNCA2LjYgMi40IDYuMyA5LjIgMjEuMyAxNC40IDMxLjcgMTQuNS03LjItMi45LTguOS02LjUtOS40LTkuNy0uNi0zLjggMi4zLTcuMiA2LjEtNy4yIi8+PC9zdmc+") no-repeat; right: 24px; } .thermostat #usb .bg, .thermostat #usb .bg video { height: 435px; } .thermostat #descaling .content { position: absolute; z-index: 10; } .thermostat #descaling .bg, .thermostat #descaling video, .thermostat #descaling img { height: 445px; } .thermostat #descaling .bg > div { font-size: 16px; left: 61%; top: 75%; } .thermostat #mobile-intuitive .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .thermostat #mobile-intuitive .bg, .thermostat #mobile-intuitive .swiper-slide { height: 410px; } .thermostat #mobile-intuitive .bg { background-position: 98% 50%; background-size: 40% auto; } .thermostat #various-radiators .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); background-color: transparent; text-align: left; } .thermostat #various-radiators .slide1 .content, .thermostat #various-radiators .slide4 .content { color: #fff; } .thermostat .section-packshot-slider ul { margin-bottom: 0; } .thermostat .spinner { width: 70px; position: absolute; z-index: 10; top: calc(50% - 10px); left: calc(50% - 35px); text-align: center; -webkit-transform: scale(1.2); transform: scale(1.2); } .thermostat .spinner > div { width: 18px; height: 18px; background-color: rgba(255, 255, 255, 0.6); border-radius: 100%; display: inline-block; -webkit-animation: sk-bouncedelay 1.2s infinite ease-in-out both; animation: sk-bouncedelay 1.2s infinite ease-in-out both; } .thermostat .spinner .bounce1 { -webkit-animation-delay: -0.4s; animation-delay: -0.4s; } .thermostat .spinner .bounce2 { -webkit-animation-delay: -0.2s; animation-delay: -0.2s; } .thermostat #against-cold .content { position: relative; background-color: #e8e5e0; } .thermostat #against-cold .bg { height: 0; padding-bottom: 39%; } .thermostat #coming-home .bg { padding-bottom: 42%; } .thermostat #external .bg { height: 904px; } .thermostat #temp-change .swiper-pagination p img { height: 60px; } .thermostat #versus .content { position: absolute; z-index: 10; top: 40%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left; } .thermostat #versus .bg { padding-bottom: 52%; } .thermostat #versus .switch { margin-left: 70px; margin-right: 0; } .thermostat #home-office .bg { padding-bottom: 53%; background-position: 100% 50%; } .thermostat #home-office .swiper-bullets .bullet { min-width: 100px; font-size: 15px; } .thermostat #home-office .info.info1 { top: 58%; left: 21%; } .thermostat #home-office .info.info2 { top: 20%; left: 69%; } .thermostat .section-scroll-slide .content { top: 50%; } .thermostat .section-scroll-slide .bg { background-position: 29% 50%; } .firefox .thermostat #home-office .bg { padding-bottom: 0; height: calc(100vw * .73); } } @media (max-width: 1199px) { .thermostat #colorful-ring #dial, .thermostat #colorful-ring #dashed-path { visibility: hidden; pointer-events: none; } .thermostat #coming-home .bg { background-position: 50% 100%; } } @media (min-width: 992px) { .thermostat .section-video-reveal .infobox { margin-top: 1.2rem; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="battery"] { top: 102px; left: 395px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="chips"] { top: 245px; left: 450px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="mechanism"] { top: 86px; left: 183px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="ring"] { top: 180px; left: 710px; } .thermostat #energy-savings .bg { height: 460px; } .thermostat #precision .tooltip { top: 43%; } .thermostat #open-window .tooltip { left: 53.5%; top: 55.9%; } .thermostat #open-window .bg { padding-bottom: 48%; } .thermostat #calibration .bg { padding-bottom: 20%; } .thermostat #mounts .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .thermostat #mounts .content p:nth-of-type(2) { margin-top: 2rem; margin-bottom: 2rem; } .thermostat #mounts .bg { height: 485px; background-size: auto 100%; } .thermostat #mounts .bg .wrapper { width: 860px; height: 485px; -webkit-transform: scale(1); transform: scale(1); } .thermostat #mounts .bg img { width: 230px; } .thermostat #mounts #fibaro-head, .thermostat #mounts #fibaro-head-blue { top: 96px; left: 97px; } .thermostat #mounts #common-head { width: 275px; top: 91px; left: 79px; } .thermostat #individual-schedules .container-fluid { margin-top: 3.6rem; max-width: 820px; } .thermostat #voice-control .bg { height: 730px; } .thermostat #voice-control .bg .container { top: 42%; } .thermostat #minute-install .bg { padding-bottom: 46%; } .thermostat #holiday-mode .bg { padding-bottom: 46%; } .thermostat #usb .bg { padding-bottom: 0; } .thermostat #usb .bg, .thermostat #usb .bg video { height: 525px; } .thermostat #mobile-intuitive .bg, .thermostat #mobile-intuitive .swiper-slide { height: 440px; } .thermostat #descaling .bg, .thermostat #descaling video, .thermostat #descaling img { height: 510px; } .thermostat #various-radiators .bg { height: 460px; } .thermostat .section-packshot-slider ul li { width: 16.6%; } .thermostat #external .content { position: absolute; z-index: 10; background-color: transparent; text-align: center; } .thermostat #external .bg { height: 0; background-color: #e2e2ec; background-size: cover; padding-bottom: 45%; background-position: 0 50%; } .thermostat #coop .content { position: absolute; background: transparent; } .thermostat #coop .bg { padding-bottom: 46%; } .thermostat #energy-class .bg { padding-bottom: 45%; background-position: 70% 50%; } .thermostat #energy-class .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .thermostat #energy-class .content video { height: 180px; } .thermostat #energy-class .content p { padding-bottom: 13px; } .thermostat #room-characteristics .info { top: 37%; left: 65%; } .thermostat #day-routine .bg { height: 560px; } .thermostat #day-routine .th-head-wrapper { height: 163px; width: 900px; } .thermostat #day-routine .th-head { left: 793px; } .thermostat #home-office .info.info1 { top: 49%; left: 23%; } .thermostat #home-office .info.info2 { top: 24%; left: 71%; } .thermostat .find-a-store-custom-button { margin: 40px 0 20px; font-size: 18px; } } @media (min-width: 1200px) { .thermostat .section-product-header .content h1 { font-size: 3.6rem; } .thermostat .section-product-header .content p.small { margin-top: 4.8rem; } .thermostat .section-product-header .bg { padding-bottom: 37.5%; } .thermostat .section-product-sizing .desc { margin-top: 4.8rem; margin-bottom: 1rem; } .thermostat .section-product-sizing img { margin-bottom: 4.8rem; max-width: none; } .thermostat .section-packshot-slider .buttons { margin-top: 2.4rem; margin-bottom: 0; } .thermostat .section-packshot-slider .buttons a { border-radius: 15px/50%; } .thermostat .section-packshot-slider ul { margin-top: 3rem; } .thermostat #many-functions ul { margin-top: 1.2rem; } .thermostat #many-functions li { width: 16.5%; padding: 0 15px; } .thermostat #many-functions .col-1 img { width: 480px; } .thermostat #many-functions .infobox-wrapper { width: 420px; margin: 3.2rem auto 0; } .thermostat #many-functions .infobox-button[data-infobox-name="head"] { left: -35px; top: 30px; } .thermostat #many-functions .infobox-button[data-infobox-name="sensor"] { right: -25px; top: 145px; } .thermostat #many-functions .infobox { width: 65%; } .thermostat #day-routine #dr-large-widget { -webkit-transform: scale(0.48); transform: scale(0.48); } .thermostat #day-routine .bg { height: 520px; } .thermostat #day-routine .th-head { top: -3px; left: 772px; } .thermostat #colorful-ring #cr-svg { margin-top: 0; width: 320px; height: 320px; } .thermostat #colorful-ring .dialknob { cursor: -webkit-grab; cursor: grab; } .thermostat #colorful-ring.dragging { cursor: -webkit-grabbing; cursor: grabbing; } .thermostat #colorful-ring.dragging .dialknob { cursor: -webkit-grabbing; cursor: grabbing; } .thermostat #colorful-ring #cr-slider, .thermostat #colorful-ring .slider { display: none; } .thermostat #energy-savings .bg { height: 0; padding-bottom: 37.5%; background-position: 50% 50%; } .thermostat #precision .content { position: absolute; background: none; } .thermostat #precision .bg { padding-bottom: 42%; background-position: 0 50%; } .thermostat #precision .tooltip { border-radius: 12px; top: 50%; left: 27.5%; } .thermostat #open-window .bg { padding-bottom: 43%; } .thermostat #open-window .info { top: 46%; left: 58.5%; } .thermostat #coop .bg { padding-bottom: 40%; } .thermostat #cold .bg { padding-bottom: 45%; } .thermostat #room-characteristics .content { position: absolute; } .thermostat #room-characteristics .bg { padding-bottom: 36%; background-position: 50% 50%; } .thermostat #room-characteristics .info { top: 53%; left: 43%; } .thermostat #wherever .content { position: absolute; } .thermostat #wherever .bg { padding-bottom: 37%; } .thermostat #holiday-mode .bg { padding-bottom: 37.5%; } .thermostat #child-safety .bg { padding-bottom: 38%; } .thermostat #calibration .content { position: absolute; background-color: transparent; } .thermostat #calibration .bg { padding-bottom: 37.5%; background-position: 50% 50%; } .thermostat #operation-control .content { position: absolute; background-color: transparent; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .thermostat #operation-control .content .small { font-size: 80%; margin-top: 2.4rem; } .thermostat #operation-control .bg { padding-bottom: 37.5%; background-position: 50% 50%; } .thermostat #minute-install .content a img { width: 220px; } .thermostat #minute-install .bg { padding-bottom: 37.5%; background-position: 50% 50%; } .thermostat #mounts .content img { max-width: 420px; } .thermostat #mounts .bg { height: 485px; } .thermostat #mounts .bg .wrapper { -webkit-transform: scale(1); transform: scale(1); } .thermostat #individual-schedules .container-fluid { margin-bottom: 2.4rem; max-width: 1060px; } .thermostat #individual-schedules .swiper-slide { z-index: 10; } .thermostat #individual-schedules .swiper-slide .temp { font-size: 14px; line-height: 20px; display: block; opacity: 0; transition: opacity 250ms; } .thermostat #individual-schedules .swiper-slide .temp.top { opacity: 1; } .thermostat #individual-schedules .swiper-slide .temp.bot { padding: 10px 0 0; } .thermostat #individual-schedules .swiper-slide .temp span { font-weight: 600; font-size: 20px; line-height: 20px; vertical-align: text-top; padding-left: 10px; } .thermostat #individual-schedules .swiper-slide .title { display: block; opacity: 0; font-size: 24px; padding-bottom: 10px; padding-top: 20px; } .thermostat #individual-schedules .swiper-slide > div { height: 20px; transition: all 250ms; } .thermostat #individual-schedules .swiper-slide > div + img { opacity: 1; transition: all 250ms; } .thermostat #individual-schedules .swiper-slide > div.active { height: 100%; } .thermostat #individual-schedules .swiper-slide > div.active .top { opacity: 0; } .thermostat #individual-schedules .swiper-slide > div.active .title, .thermostat #individual-schedules .swiper-slide > div.active .bot { opacity: 1; } .thermostat #individual-schedules .swiper-slide > div.active .bot.semi { opacity: .7; } .thermostat #individual-schedules .swiper-slide > div.active + img { opacity: .5; } .thermostat #voice-control .bg { height: 600px; } .thermostat #voice-control .bg .container { max-width: 660px; top: 46.5%; } .thermostat #usb .content { position: absolute; z-index: 10; } .thermostat #usb .content video { margin-top: 1.2rem; width: 260px; } .thermostat #usb .content .charging { color: #0090ff; } .thermostat #usb .bg, .thermostat #usb .bg video { height: 420px; } .thermostat #usb .bg video { max-width: none; width: auto; position: absolute; left: -190px; -webkit-transform: none; transform: none; } .thermostat #descaling video, .thermostat #descaling img { max-width: none; width: auto; height: 100%; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .thermostat #descaling .bg { overflow: hidden; height: 460px; } .thermostat #descaling .bg > div { left: 58%; top: 75%; } .thermostat #mobile-intuitive .bg { background-size: cover; background-position: 0 50%; } .thermostat #mobile-intuitive .bg, .thermostat #mobile-intuitive .swiper-slide { height: 500px; margin-bottom: 0; } .thermostat #mobile-intuitive .note { bottom: 10px; } .thermostat #mobile-intuitive .swiper-pagination { margin-top: 2.4rem; } .thermostat #mobile-intuitive .swiper-pagination .swiper-pagination-icon svg { height: 50px; } .thermostat #various-radiators .bg { height: 420px; } .thermostat #various-radiators .swiper-button-prev, .thermostat #various-radiators .swiper-button-next { display: block; background: none; border-right: 4px solid rgba(255, 255, 255, 0.5); border-bottom: 4px solid rgba(255, 255, 255, 0.5); width: 72px; height: 72px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; } .thermostat #various-radiators .swiper-button-prev { -webkit-transform: rotate(135deg); transform: rotate(135deg); left: 60px; } .thermostat #various-radiators .swiper-button-prev:hover { -webkit-transform: rotate(135deg) scale(1.2); transform: rotate(135deg) scale(1.2); } .thermostat #various-radiators .swiper-button-next { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); right: 60px; } .thermostat #various-radiators .swiper-button-next:hover { -webkit-transform: rotate(-45deg) scale(1.2); transform: rotate(-45deg) scale(1.2); } .thermostat #temp-change .bg { position: absolute; height: 100%; width: 60%; padding-bottom: 0; } .thermostat #temp-change .bg img { position: absolute; width: auto; height: 100%; } .thermostat #temp-change .content { float: right; z-index: 10; width: 40%; height: 420px; } .thermostat #temp-change .swiper-container.bg { margin: 0; } .thermostat #temp-change .swiper-pagination { position: relative; } .thermostat #temp-change .swiper-pagination p { font-size: 80%; padding-bottom: 0; display: block; width: 100%; text-align: center; } .thermostat #temp-change .swiper-pagination p:hover { cursor: pointer; } .thermostat #temp-change .swiper-pagination p img { display: block; margin: 0 auto; margin-bottom: .6rem; } .thermostat .section-video-reveal .infobox { margin-top: 0; width: 360px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="battery"] { top: 96px; left: 365px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="chips"] { top: 226px; left: 417px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="mechanism"] { top: 93px; left: 155px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="ring"] { top: 160px; left: 670px; } .thermostat #room-scan { background-color: transparent; color: #444444; } .thermostat #room-scan .bg > video, .thermostat #room-scan .bg > img { width: 100%; height: auto; margin: 0; padding: 0; display: block; } .thermostat #room-scan .content { position: absolute; z-index: 10; padding-bottom: 0; background-color: transparent; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; opacity: 0; } .thermostat #room-scan .content p { padding-bottom: 0; } .thermostat #room-scan .bg > .overlays { position: absolute; display: block; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; } .thermostat #room-scan .bg > .overlays .item { position: absolute; top: 40%; width: 19.1%; height: 20%; background-color: #eeeeee; border-radius: 8px; text-align: center; opacity: 0; } .thermostat #room-scan .bg > .overlays .item.item-1 { left: 10.8%; } .thermostat #room-scan .bg > .overlays .item.item-2 { left: 40.4%; } .thermostat #room-scan .bg > .overlays .item.item-3 { left: 70.2%; } .thermostat #room-scan .bg > .overlays .item .top, .thermostat #room-scan .bg > .overlays .item .mid, .thermostat #room-scan .bg > .overlays .item .bot { height: calc(100% / 3); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .thermostat #room-scan .bg > .overlays .item .top, .thermostat #room-scan .bg > .overlays .item .bot { color: #0090ff; font-size: 24px; height: 44%; } .thermostat #room-scan .bg > .overlays .item .top { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; height: 44%; } .thermostat #room-scan .bg > .overlays .item .mid { -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 13%; font-size: 11px; color: #5b5b5b; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; } .thermostat #room-scan .bg > .overlays .item .bot { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; height: 43%; } .thermostat #room-scan .bg > .overlays .sub { position: absolute; top: 88%; width: 19.1%; font-size: 12px; text-align: center; color: #5b5b5b; -webkit-user-select: none; -ms-user-select: none; user-select: none; opacity: 0; } .thermostat #room-scan .bg > .overlays .sub span { font-weight: 600; } .thermostat #room-scan .bg > .overlays .sub.sub-1 { left: 10.8%; } .thermostat #room-scan .bg > .overlays .sub.sub-2 { left: 40.4%; } .thermostat #room-scan .bg > .overlays .sub.sub-3 { left: 70.2%; } .thermostat .section-scroll-slide { height: 280px; } .thermostat .section-scroll-slide .bg { background-position: 50% 50%; } .thermostat #energy-class .bg { padding-bottom: 45%; background-position: 50% 50%; } .thermostat #energy-class .content video { height: 220px; } .thermostat #against-cold .content { position: absolute; background-color: transparent; } .thermostat #against-cold .bg { padding-bottom: 44%; background-position: 50% 50%; } .thermostat #coming-home .content { position: absolute; background-color: transparent; color: #fff; } .thermostat #coming-home .bg { padding-bottom: 45%; } .thermostat #coming-home .widget { display: block; position: absolute; top: 255px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 602px; height: 130px; } .thermostat #coming-home .widget .info { background: rgba(0, 144, 255, 0.8) url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMjcuNDYiIGhlaWdodD0iMzIwLjA5IiB2aWV3Qm94PSIwIDAgMjI3LjQ2IDMyMC4wOSI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOm5vbmU7c3Ryb2tlOiNmZmY7c3Ryb2tlLW1pdGVybGltaXQ6MTA7c3Ryb2tlLXdpZHRoOjEwcHg7fTwvc3R5bGU+PC9kZWZzPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTE3NSwxNjAuNzFhMzguMzcsMzguMzcsMCwxLDAtMzguMzctMzguMzhBMzguNDIsMzguNDIsMCwwLDAsMTc1LDE2MC43MVptLTEwOC43My0zMmExMDguNzMsMTA4LjczLDAsMCwxLDIxNy40NiwwQzI4My43MywxODguNzcsMTc1LDMyNywxNzUsMzI3UzY2LjI3LDE4OC43Nyw2Ni4yNywxMjguNzNaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNjEuMjcgLTE1KSIvPjwvc3ZnPg==") no-repeat; background-size: auto 55%; background-position: 20px 50%; border-radius: 12px; width: 55%; position: absolute; top: 0; right: 0; color: #fff; padding: 20px 20px 20px 72px; } .thermostat #coming-home .widget .top { font-size: 14px; } .thermostat #coming-home .widget .bot { font-size: 18px; } .thermostat #coming-home .widget .leftbar, .thermostat #coming-home .widget .topbar { background-color: #0090ff; position: absolute; } .thermostat #coming-home .widget .leftbar { height: 86px; width: 2px; bottom: 0; } .thermostat #coming-home .widget .leftbar:after { content: ''; display: block; width: 8px; height: 8px; border-radius: 50%; background-color: #0090ff; position: absolute; bottom: -2px; left: -3px; opacity: 0; -webkit-transform: scale(0.5); transform: scale(0.5); transition: opacity 200ms, -webkit-transform 200ms; transition: opacity 200ms, transform 200ms; transition: opacity 200ms, transform 200ms, -webkit-transform 200ms; } .thermostat #coming-home .widget .leftbar.after:after { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } .thermostat #coming-home .widget .topbar { width: 268px; height: 2px; top: 43px; } .thermostat #home-office .content { position: absolute; z-index: 10; background-color: transparent; } .thermostat #home-office .content p { padding-left: 40px; padding-right: 40px; } .thermostat #home-office .bg { height: 0; padding-bottom: 46.1%; background-position: 50% 50%; } .thermostat #home-office .info.info1 { top: 52%; left: 41%; } .thermostat #home-office .info.info2 { top: 25%; left: 83%; } .thermostat #external .content { position: absolute; z-index: 10; background-color: transparent; color: #444444; } .thermostat #external .bg { height: 0; padding-bottom: 45%; background-position: -33% 50%; } .thermostat #instant-reaction .bg { background-position: 50% 50%; padding-bottom: 41%; } .thermostat #versus .switch { margin-top: 4.8rem; margin-left: auto; margin-right: auto; } .thermostat #versus .bg { padding-bottom: 39%; } .thermostat .button-replay { position: absolute; bottom: 6px; right: 6px; font-weight: 400; font-size: 90%; padding-top: 4px; display: block; opacity: 0; } .thermostat .button-replay:after { width: 20px; height: 20px; background-size: 18px; left: -18px; } .firefox .thermostat #external .bg { padding-bottom: 0; height: calc(1200px * .45); } .firefox .thermostat #home-office .bg { padding-bottom: 0; height: calc(100vw * .36); } html[lang="pl-PL"] .thermostat #coming-home .widget .bot, html[lang="pl"] .thermostat #coming-home .widget .bot { font-size: 16px; } } @media (min-width: 1600px) { .thermostat #hk-video { height: 310px; } .thermostat .hint img { height: 60px !important; } .thermostat .section-product-header .content h1 { font-size: 4.6rem; } .thermostat .section-product-header .content p { font-size: 110%; } .thermostat #many-functions .col-1 .infobox-wrapper, .thermostat #many-functions .col-1 img { width: 520px; } .thermostat #many-functions .infobox-button[data-infobox-name="sensor"] { top: 195px; } .thermostat #many-functions .infobox { width: 65%; } .thermostat .section-video-reveal .infobox { width: 480px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="battery"] { top: 129px; left: 460px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="chips"] { top: 295px; left: 530px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="mechanism"] { top: 115px; left: 203px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="ring"] { top: 210px; left: 850px; } .thermostat #day-routine #dr-large-widget { -webkit-transform: scale(0.66); transform: scale(0.66); margin-top: 2.4rem; } .thermostat #day-routine .bg { height: 720px; } .thermostat #day-routine .th-head-wrapper { height: 200px; width: 1060px; } .thermostat #day-routine .th-head { top: -15px; left: 985px; -webkit-transform: scale(0.4); transform: scale(0.4); } .thermostat #colorful-ring #cr-svg { width: 440px; height: 440px; } .thermostat #colorful-ring .patent img { height: 50px; } .thermostat #energy-savings .content .costs { font-size: 1.5em; } .thermostat #energy-savings .bg { padding-bottom: 40%; } .thermostat #precision .bg { padding-bottom: 37%; } .thermostat #precision .tooltip { left: 25%; top: 50.1%; } .thermostat #open-window .bg { padding-bottom: 41%; background-position: 100% 50%; } .thermostat #open-window .info { top: 46%; left: 50%; } .thermostat #instant-reaction .bg { background-position: 50% 50%; padding-bottom: 41%; } .thermostat #room-characteristics .bg { padding-bottom: 40%; } .thermostat #room-characteristics .info { -webkit-transform: scale(0.85); transform: scale(0.85); top: 51%; left: 45%; } .thermostat #minute-install .content a img { width: 340px; } .thermostat #minute-install .bg { padding-bottom: 37.5%; } .thermostat #individual-schedules .container-fluid { margin-top: 5.4rem; max-width: 1360px; } .thermostat #individual-schedules .swiper-slide .temp { font-size: 18px; line-height: 24px; } .thermostat #individual-schedules .swiper-slide .temp.bot { padding: 16px 0 0; } .thermostat #individual-schedules .swiper-slide .temp span { font-size: 24px; line-height: 24px; padding-left: 13px; } .thermostat #individual-schedules .swiper-slide .temp.top { padding-top: 4px; } .thermostat #individual-schedules .swiper-slide .title { font-size: 28px; padding-bottom: 10px; padding-top: 24px; } .thermostat #individual-schedules .swiper-slide > div { height: 32px; } .thermostat #voice-control .content img { max-width: 540px; } .thermostat #voice-control .bg { height: 730px; } .thermostat #mounts .content img { max-width: 520px; } .thermostat #mounts .content p:nth-of-type(2) { margin-top: 4rem; } .thermostat #mounts .bg { height: 605px; } .thermostat #mounts .bg .wrapper { -webkit-transform: scale(1.25); transform: scale(1.25); } .thermostat #usb .bg { height: 0; padding-bottom: 32%; } .thermostat #usb .bg video { width: auto; height: 101%; left: 50%; -webkit-transform: translateX(-54%); transform: translateX(-54%); } .thermostat #mobile-intuitive .bg, .thermostat #mobile-intuitive .swiper-slide { height: 560px; } .thermostat #mobile-intuitive .swiper-pagination { margin-top: 4.8rem; } .thermostat #cold .bg { padding-bottom: 41%; } .thermostat #descaling .bg { height: 620px; } .thermostat #descaling .bg > div { font-size: 20px; left: 60%; top: 74%; } .thermostat #various-radiators .bg { height: 520px; } .thermostat #temp-change .content { height: 530px; } .thermostat .section-product-sizing img { max-width: 920px; } .thermostat #room-scan .bg > .overlays .item .top, .thermostat #room-scan .bg > .overlays .item .bot { font-size: 31px; } .thermostat #room-scan .bg > .overlays .item .mid { font-size: 13px; } .thermostat #room-scan .bg > .overlays .sub { font-size: 14px; } .thermostat #energy-class .content video { height: 250px; } .thermostat #energy-class .bg { padding-bottom: 40%; } .thermostat #home-office .bg { padding-bottom: 40%; } .thermostat #home-office .swiper-bullets .bullet { min-width: 120px; font-size: 17px; } .thermostat #home-office .swiper-bullets .bullet.bullet2 { margin-left: 20px; margin-right: 20px; } .thermostat #home-office .info { -webkit-transform: scale(0.85); transform: scale(0.85); } .thermostat #home-office .info.info1 { top: 54%; left: 41%; } .thermostat #home-office .info.info2 { top: 24%; left: 78%; } .thermostat #external .bg { padding-bottom: 48%; background-position: 22% 50%; } .thermostat .section-scroll-slide { height: 320px; } .thermostat #versus .switch { -webkit-transform: scale(1.1); transform: scale(1.1); } .thermostat #coming-home .widget { top: 337px; -webkit-transform: translateX(-50%) scale(1.265); transform: translateX(-50%) scale(1.265); } .firefox .thermostat #external .bg { padding-bottom: 0; height: calc(1440px * .48); } .firefox .thermostat #home-office .bg { padding-bottom: 0; height: calc(100vw * .4); } } @media (min-width: 2100px) { .thermostat #hk-video { height: 430px; } .thermostat .section-product-header .content h1 { font-size: 5.8rem; } .thermostat .section-product-header .content p { font-size: 140%; } .thermostat .section-product-sizing img .head { width: 970px; } .thermostat .section-product-sizing img .sensor { width: 845px; } .thermostat #many-functions .col-1 .infobox-wrapper, .thermostat #many-functions .col-1 img { width: 560px; } .thermostat #many-functions ul { margin-top: 2.4rem; } .thermostat #many-functions li { padding: 0 25px; } .thermostat #many-functions .infobox-wrapper { margin: 4.8rem auto 0; } .thermostat #many-functions .infobox { width: 90%; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="battery"] { top: 165px; left: 630px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="chips"] { top: 392px; left: 716px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="mechanism"] { top: 145px; left: 290px; } .thermostat .section-video-reveal .infobox-button[data-infobox-name="ring"] { top: 295px; left: 1125px; } .thermostat #day-routine #dr-large-widget { -webkit-transform: scale(0.8); transform: scale(0.8); margin-top: 3.6rem; } .thermostat #day-routine #dr-large-widget > div .body { font-size: 21px; line-height: 30px; } .thermostat #day-routine .bg { height: 880px; } .thermostat #day-routine .th-head-wrapper { height: 250px; width: 1270px; } .thermostat #day-routine .th-head { top: -4px; left: 1202px; -webkit-transform: scale(0.5); transform: scale(0.5); } .thermostat #colorful-ring #cr-svg { width: 500px; height: 500px; } .thermostat #colorful-ring .patent img { height: 60px; } .thermostat #colorful-ring .widget { margin-top: 12px; margin-bottom: 12px; } .thermostat #energy-savings .content .costs { padding-top: 1.2rem; } .thermostat #energy-savings .bg { padding-bottom: 37.5%; } .thermostat #precision .bg { padding-bottom: 35%; } .thermostat #precision .tooltip { left: 23.4%; top: 50.5%; } .thermostat #open-window .content h2, .thermostat #open-window .content p { margin-left: 80px; } .thermostat #open-window .bg { padding-bottom: 38%; } .thermostat #open-window .info { -webkit-transform: translateX(-50%) scale(1.2); transform: translateX(-50%) scale(1.2); left: 52.3%; } .thermostat #coop .bg { padding-bottom: 34%; } .thermostat #room-characteristics .bg { padding-bottom: 36%; } .thermostat #room-characteristics .info { -webkit-transform: scale(1); transform: scale(1); top: 51%; left: 46%; } .thermostat #holiday-mode .bg { padding-bottom: 37%; } .thermostat #individual-schedules .container-fluid { margin-top: 3.6rem; margin-bottom: 3.6rem; max-width: 1760px; } .thermostat #individual-schedules .swiper-slide .temp { font-size: 22px; line-height: 30px; } .thermostat #individual-schedules .swiper-slide .temp.bot { padding: 16px 0 0; } .thermostat #individual-schedules .swiper-slide .temp span { font-size: 30px; line-height: 30px; padding-left: 16px; } .thermostat #individual-schedules .swiper-slide .temp.top { padding-top: 4px; } .thermostat #individual-schedules .swiper-slide .title { font-size: 34px; padding-bottom: 12px; padding-top: 24px; } .thermostat #individual-schedules .swiper-slide > div { height: 36px; } .thermostat #voice-control .content img { margin-top: 30px; } .thermostat #voice-control .bg { height: 820px; } .thermostat #mounts .content p:nth-of-type(2) { margin-top: 4.8rem; } .thermostat #mounts .bg { height: 725px; } .thermostat #mounts .bg .wrapper { -webkit-transform: scale(1.5); transform: scale(1.5); } .thermostat #usb .bg { height: 0; padding-bottom: 29%; } .thermostat #usb .bg video { width: auto; height: 101%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .thermostat #mobile-intuitive .bg, .thermostat #mobile-intuitive .swiper-slide { height: 735px; } .thermostat #mobile-intuitive .swiper-pagination { margin-top: 7.2rem; } .thermostat #descaling .bg { height: 720px; } .thermostat #descaling .bg > div { font-size: 24px; left: 58%; top: 75%; } .thermostat #various-radiators .bg { height: 640px; } .thermostat #temp-change .content { padding-top: 9rem; height: 700px; } .thermostat #temp-change .swiper-pagination { margin-top: 7.2rem; } .thermostat #temp-change .swiper-pagination p img { height: 70px; } .thermostat #energy-class .bg { padding-bottom: 35%; } .thermostat #coming-home .bg { padding-bottom: 38%; } .thermostat #coming-home .widget { top: 400px; -webkit-transform: translateX(-50%) scale(1.6); transform: translateX(-50%) scale(1.6); } .thermostat #external .bg { padding-bottom: 40%; background-position: 50% 50%; } .thermostat .section-scroll-slide { height: 380px; } .thermostat .section-packshot-slider .buttons { margin-top: 3.6rem; margin-bottom: 0; } .thermostat .section-packshot-slider .buttons a { border-radius: 18px/50%; } .thermostat .section-packshot-slider ul { margin-top: 4.2rem; } .thermostat #room-scan .bg > .overlays .item .top, .thermostat #room-scan .bg > .overlays .item .bot { font-size: 40px; } .thermostat #room-scan .bg > .overlays .item .mid { font-size: 15px; } .thermostat #room-scan .bg > .overlays .sub { font-size: 16px; } .thermostat #versus .switch { -webkit-transform: scale(1.2); transform: scale(1.2); } .thermostat #home-office .swiper-bullets .bullet { min-width: 150px; font-size: 20px; } .thermostat #home-office .info { -webkit-transform: scale(1); transform: scale(1); } .thermostat #home-office .info.info1 { top: 53%; left: 42%; } .firefox .thermostat #external .bg { padding-bottom: 0; height: calc(1920px * .40); } } .safari.mac .thermostat #individual-schedules .title, .safari.mac .thermostat #individual-schedules .desc { -webkit-text-stroke: 1px #fff; } @keyframes sk-bouncedelay { 0%, 100% { -webkit-transform: scale(0); transform: scale(0); } 50% { -webkit-transform: scale(1); transform: scale(1); } } @-webkit-keyframes th-spinner-before { 0% { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); opacity: 0; } 20% { -webkit-transform: translate(-50%, -50%) scale(1.4); transform: translate(-50%, -50%) scale(1.4); opacity: 1; } 75% { -webkit-transform: translate(-50%, -50%) scale(1.7); transform: translate(-50%, -50%) scale(1.7); opacity: 0; } 100% { -webkit-transform: translate(-50%, -50%) scale(1.7); transform: translate(-50%, -50%) scale(1.7); opacity: 0; } } @keyframes th-spinner-before { 0% { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); opacity: 0; } 20% { -webkit-transform: translate(-50%, -50%) scale(1.4); transform: translate(-50%, -50%) scale(1.4); opacity: 1; } 75% { -webkit-transform: translate(-50%, -50%) scale(1.7); transform: translate(-50%, -50%) scale(1.7); opacity: 0; } 100% { -webkit-transform: translate(-50%, -50%) scale(1.7); transform: translate(-50%, -50%) scale(1.7); opacity: 0; } } @-webkit-keyframes th-info-button { 0%, 15%, 30%, 100% { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } 7.5%, 22.5% { -webkit-transform: translate(-50%, -50%) scale(1.3); transform: translate(-50%, -50%) scale(1.3); } } @keyframes th-info-button { 0%, 15%, 30%, 100% { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } 7.5%, 22.5% { -webkit-transform: translate(-50%, -50%) scale(1.3); transform: translate(-50%, -50%) scale(1.3); } } .intercom-preview #header { width: 100%; padding-bottom: 40%; background-position: 50% 50%; background-size: auto 100%; } .intercom-preview #sound { width: 100%; padding-bottom: 47%; background-position: 50% 50%; background-size: auto 100%; } .intercom-preview #functions img { width: 125%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); position: relative; } .intercom-preview #functions .swiper-button-next { top: 0; opacity: 0; width: 100%; height: 100%; } .intercom-preview #voice-movie .button.button-replay, .intercom-preview #night-view .button.button-replay, .intercom-preview #voice-biometrics-movie .button.button-replay { position: absolute; display: block; font-size: 100%; top: 90%; right: 20px; color: #fff; opacity: 0; } .intercom-preview #voice-biometrics-movie .button.button-replay { color: #0090FF; } .intercom-preview #clean-sound { width: 100%; padding-bottom: 400%; background-position: 50% 50%; background-size: auto 100%; } .intercom-preview #enter-home { width: 100%; padding-bottom: 476%; background-position: 50% 50%; background-size: auto 100%; } .intercom-preview #break-in { width: 100%; padding-bottom: 230%; background-position: 50% 50%; background-size: auto 100%; position: relative; } .intercom-preview #break-in a { display: block; width: 100%; height: 0; padding-bottom: 16.3%; position: absolute; bottom: 4.5%; } .intercom-preview #fit-for-home img { width: 100%; } .intercom-preview #fit-for-home .swiper-button-next { top: 30%; opacity: 0; width: 100%; height: 70%; } .intercom-preview #specs { width: 100%; padding-bottom: 205%; background-position: 50% 50%; background-size: auto 100%; } .intercom section hr { display: inline-block; width: 60px; border: 0; height: 1px; background-color: #0090ff; margin-left: 0; margin-right: 0; margin-bottom: 20px; } .intercom #header .content { position: absolute; color: #ffffff; } .intercom #header .content .header-title h1, .intercom #header .content .header-title h2 { padding-top: 2%; padding-bottom: 5px; font-size: 3em; } .intercom #header .content hr { width: 230px; background-image: linear-gradient(to right, #00FCFB, #0090ff); margin-bottom: 10px; } .intercom #header .bg { padding-bottom: 142%; } .intercom #sound-quality { color: #fff; background-color: #040c19; } .intercom #sound-quality .text-box { z-index: 10; } .intercom #sound-quality .bg { z-index: 0; background-size: 500px auto; background-position: 50% 0; position: relative; padding-bottom: 0; height: 410px; } .intercom #sound-quality .icons { width: 200px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: left; -ms-flex-align: left; align-items: left; margin: 180px auto 0; } .intercom #sound-quality .icons li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 3px 0; } .intercom #sound-quality .icons li div img { width: 40px; margin: 10px 30px 10px 0; } .intercom #recordings-play .content { position: relative; } .intercom #recordings-play .bg { padding-bottom: 45%; } .intercom #worldwide-access .content { position: relative; background-color: #e2f2ff; } .intercom #worldwide-access .bg { height: 0; padding-bottom: 70%; } .intercom #intercom-app .content { position: relative; } .intercom #intercom-app .bg { height: 0; padding-bottom: 76%; } .intercom #image-technology { color: #fff; background-color: #040c19; } .intercom #image-technology .text-box { z-index: 10; } .intercom #image-technology .bg { z-index: 0; background-size: 550px auto; background-position: 50% 0; position: relative; padding-bottom: 0; height: 410px; } .intercom #image-technology .icons { width: 200px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: left; -ms-flex-align: left; align-items: left; margin: 240px auto 0; } .intercom #image-technology .icons li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 3px 0; } .intercom #image-technology .icons li div img { width: 40px; margin: 10px 30px 10px 0; } .intercom #live-preview .content { position: relative; z-index: 10; } .intercom #live-preview .bg, .intercom #live-preview .bg video { height: 160px; } .intercom #live-preview .bg video { width: auto; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .intercom #night-view .content { color: #ffffff; background-color: #040c19; position: relative; } .intercom #night-view .content hr { background-color: #0090ff; } .intercom #night-view .bg { padding-bottom: 138%; } .intercom #back-home .content { position: relative; background-color: #eaeaea; } .intercom #back-home .content ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #0090ff; margin: 20px 0 -15px; } .intercom #back-home .content ul > li { margin: 0 5px; background: white; border-radius: 7px; box-shadow: 0 9px 11px -6px #ccc; width: 90px; height: 90px; font-size: 11px; } .intercom #back-home .content ul > li span { display: block; padding: 0 5px 10px 5px; } .intercom #back-home .content ul img { height: 50px; padding: 10px; } .intercom #back-home .bg { padding-bottom: 82%; } .intercom #pincode .codeok { color: #0090FF; font-size: 120%; margin-top: 20px; } .intercom #pincode .codeok > span:nth-of-type(2) { opacity: 0; display: block; transition: 1s opacity 1250ms; } .intercom #pincode .codeok > span:nth-of-type(1) { border-radius: 5px; border: 1px solid #0090FF; padding: 0 10px; font-size: 110%; } .intercom #pincode .codeok > span:nth-of-type(1) > span { padding: 0 3px; display: inline-block; margin-top: 2px; vertical-align: middle; opacity: 0; } .intercom #pincode .codeok > span:nth-of-type(1) > span:nth-of-type(1) { transition: 1s opacity 750ms; } .intercom #pincode .codeok > span:nth-of-type(1) > span:nth-of-type(2) { transition: 1s opacity 1500ms; } .intercom #pincode .codeok > span:nth-of-type(1) > span:nth-of-type(3) { transition: 1s opacity 2250ms; } .intercom #pincode .codeok > span:nth-of-type(1) > span:nth-of-type(4) { transition: 1s opacity 3000ms; } .intercom #pincode .codeok.active > span:nth-of-type(2) { opacity: 1; display: block; margin: 10px 0; } .intercom #pincode .codeok.active > span:nth-of-type(1) > span:nth-of-type(1), .intercom #pincode .codeok.active > span:nth-of-type(1) > span:nth-of-type(2), .intercom #pincode .codeok.active > span:nth-of-type(1) > span:nth-of-type(3), .intercom #pincode .codeok.active > span:nth-of-type(1) > span:nth-of-type(4) { opacity: 1; } .intercom #pincode .content { position: relative; background-color: #e9e9e9; } .intercom #pincode .bg { padding-bottom: 90%; } .intercom #pincode .bg .codeok { display: none; } .intercom #notifications .content { color: #ffffff; background-color: #d2c5b4; position: relative; } .intercom #notifications .content hr { background-color: #ffffff; } .intercom #notifications .bg { padding-bottom: 133%; } .intercom #for-relatives .row:nth-of-type(1) p + img { max-width: 100px; margin-top: 30px; } .intercom #for-relatives .swiper-container { margin-top: 20px; } .intercom #for-relatives .swiper-container .swiper-slide > div { position: relative; max-width: 320px; margin: 0 auto; } .intercom #for-relatives .swiper-container .swiper-slide > div img { width: 100%; height: auto; } .intercom #for-relatives .swiper-container .swiper-slide > div img:nth-of-type(1) { position: relative; display: none; } .intercom #for-relatives .swiper-container .swiper-button-prev, .intercom #for-relatives .swiper-container .swiper-button-next { display: none; } .intercom #for-relatives .swiper-container .swiper-pagination { position: relative; top: 0; bottom: 0; margin-top: 15px; } .intercom #doorbell_hand .content { position: relative; background-color: #e9e9e9; } .intercom #doorbell_hand .bg { height: 0; padding-bottom: 116%; margin-top: -10%; } .intercom #gates .content { position: relative; } .intercom #gates .content ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #gates .content ul img { width: 70px; margin: 20px 20px -20px; } .intercom #gates .bg { height: 0; padding-bottom: 62%; } .intercom #gates .bg-second { opacity: 0; transition: 1s opacity; } .intercom #gates .bg-second.active { opacity: 1; } .intercom #fit-for-home .content { padding-bottom: 0; } .intercom #fit-for-home .content .swiper-container img { width: 100%; height: auto; } .intercom #fit-for-home .content .swiper-container .swiper-button-prev { display: block; background: none; border-right: 4px solid rgba(255, 255, 255, 0.5); border-bottom: 4px solid rgba(255, 255, 255, 0.5); width: 32px; height: 32px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; -webkit-transform: rotate(135deg); transform: rotate(135deg); left: 5%; } .intercom #fit-for-home .content .swiper-container .swiper-button-next { display: block; background: none; border-right: 4px solid rgba(255, 255, 255, 0.5); border-bottom: 4px solid rgba(255, 255, 255, 0.5); width: 32px; height: 32px; transition: -webkit-transform 250ms; transition: transform 250ms; transition: transform 250ms, -webkit-transform 250ms; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); right: 5%; } .intercom #tamper_security .content { color: #ffffff; background-color: #c6c2b8; position: relative; } .intercom #tamper_security .content hr { background-color: #ffffff; } .intercom #tamper_security .bg { padding-bottom: 140%; } .intercom #security_iPad .content { color: #ffffff; background-color: #c8baba; position: relative; } .intercom #security_iPad .content hr { background-color: #ffffff; } .intercom #security_iPad .bg { padding-bottom: 128%; } .intercom #monitoring .content { position: relative; background-color: #e2e3e6; } .intercom #monitoring .content ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .intercom #monitoring .content ul > li { margin-left: 10px; } .intercom #monitoring .content ul > li span { display: block; } .intercom #monitoring .content ul img { width: 70px; padding: 15px; margin-top: 10px; } .intercom #monitoring .bg { height: 0; padding-bottom: 63%; } .intercom #installation .content { position: relative; } .intercom #installation .bg { padding-bottom: 78%; } .intercom #packshot .content img { width: 250px; margin: 30px 0; } .intercom #packshot .content a { display: inline-block; color: #fff; padding: 8px 60px 8px 60px; border-radius: 15px; background-color: #0090ff; text-transform: uppercase; font-size: 18px; letter-spacing: 2px; font-weight: 400; transition: all 250ms; } .intercom #packshot .content .notice { font-size: 1.1rem; margin-top: 20px; } .intercom #specification-link .content { color: #ffffff; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .intercom #specification-link .content a:after { content: ""; display: inline-block; width: 8px; height: 8px; border-top: 1px solid #0090FF; border-right: 1px solid #0090FF; background-color: transparent; -webkit-transform: rotate(45deg) translate(1px, -2px); transform: rotate(45deg) translate(1px, -2px); margin-left: 4px; } .intercom #specification-link .bg { padding-bottom: 66%; } .intercom .section-video-reveal .video-box { position: relative; padding-top: 50px; } .intercom .section-video-reveal .video-box .video-text { position: absolute; top: 0; width: 100%; height: 100%; font-size: 80%; display: none; } .intercom .section-video-reveal .video-box .video-text #ring { width: 70%; margin-left: 20%; margin-top: 15%; } .intercom .section-video-reveal video { width: 100%; height: auto; display: block; background-color: #fff; border: 0; } .intercom #parameters .specs-section { border-top: 1px solid #e1e1e1; padding-top: 3rem; margin-top: 3rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-wrap: wrap; flex-wrap: wrap; } .intercom #parameters .specs-section .specs-row-wrapper { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; } .intercom #parameters .specs-section h3 { text-transform: uppercase; padding-bottom: 3rem; margin-top: 2rem; font-size: 150%; } .intercom #parameters .clear-divider { border-top: 0; padding-top: 0; margin-top: 0; } .intercom #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 16px; } .intercom #parameters .specs-row .description { width: 35%; text-align: left; } .intercom #parameters .specs-row .value { width: 65%; text-align: left; padding-left: 20px; } .intercom #parameters .specs-row .drawing { width: 100%; height: auto; padding-left: 0; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .intercom #parameters .specs-row .drawing img { width: auto; height: 180px; margin-bottom: 40px; } .intercom #parameters .specs-row .contents { text-align: center; margin-bottom: 40px; } .intercom #parameters .specs-row .contents img { margin-bottom: 20px; } .intercom #parameters .specs-row #ring { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; -ms-flex-item-align: end; align-self: flex-end; } .intercom #parameters .specs-row #ring img { height: 180px; } .intercom #parameters .specs-row #in-wall { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; -ms-flex-item-align: end; align-self: flex-end; } .intercom #parameters .specs-row #in-wall img { height: 180px; } .intercom #parameters .specs-row #box { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; -ms-flex-item-align: end; align-self: flex-end; } .intercom #parameters .specs-row #box img { height: 180px; } .intercom #parameters .specs-row #sd { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; -ms-flex-item-align: end; align-self: flex-end; } .intercom #parameters .specs-row #sd img { height: 60px; } .intercom #parameters .specs-row #screws-big { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; -ms-flex-item-align: end; align-self: flex-end; } .intercom #parameters .specs-row #screws-big img { height: 70px; } .intercom #parameters .specs-row #screws-small { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; -ms-flex-item-align: end; align-self: flex-end; } .intercom #parameters .specs-row #screws-small img { height: 35px; } .intercom #parameters .specs-row #screws { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; -ms-flex-item-align: end; align-self: flex-end; } .intercom #parameters .specs-row #screws img { height: 50px; } .intercom #parameters .specs-row #allen-key { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; -ms-flex-item-align: end; align-self: flex-end; } .intercom #parameters .specs-row #allen-key img { height: 45px; } .intercom #parameters .specs-row #key { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; -ms-flex-item-align: end; align-self: flex-end; } .intercom #parameters .specs-row #key img { height: 100px; } .intercom .specs-footer { background-color: #F6F6F6; } @media (max-width: 767px) { .intercom #fit-for-home .content .col-phoneS-12 { padding: 0; } } @media (min-width: 544px) { .intercom #header .content .header-title h1, .intercom #header .content .header-title h2 { padding-top: 10%; padding-bottom: 5px; font-size: 3em; } .intercom #header .content hr { margin-bottom: 10px; } .intercom #sound-quality .bg { background-size: 760px auto; height: 500px; } .intercom #sound-quality .icons { margin: 260px auto 0; } .intercom #image-technology .bg { background-size: 760px auto; height: 500px; } .intercom #image-technology .icons { margin: 330px auto 0; } .intercom #live-preview .bg, .intercom #live-preview .bg video { height: 250px; } .intercom #back-home .content ul > li { margin: 0 5px; width: 110px; } .intercom #gates .content ul img { margin: 20px 50px -40px; } .intercom #packshot .content img { width: 300px; margin: 30px 0; } .intercom #specification-link .bg { padding-bottom: 46%; } } @media (min-width: 768px) { .intercom #header .content .header-title h1, .intercom #header .content .header-title h2 { padding-top: 22%; padding-bottom: 5px; font-size: 3em; } .intercom #header .content hr { width: 210px; margin-bottom: 10px; } .intercom #header .content p { font-size: larger; } .intercom #header .bg { padding-bottom: 40%; } .intercom #sound-quality .content { position: absolute; top: 230px; } .intercom #sound-quality .bg { background-size: 1300px auto; height: 690px; background-color: #000; } .intercom #sound-quality .icons { width: 100%; max-width: 860px; margin: 455px auto 0; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #sound-quality .icons li { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 0; -ms-flex: 0 0 15%; flex: 0 0 15%; text-align: center; } .intercom #sound-quality .icons li .dot { width: 25px; height: 25px; margin-top: 50px; } .intercom #sound-quality .icons li div { width: 130px; height: 130px; background-color: rgba(11, 34, 63, 0.5); border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 20px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #sound-quality .icons li div img { margin: 0; width: 50px; } .intercom #recordings-play .bg { padding-bottom: 22%; } .intercom #worldwide-access .content { position: absolute; text-align: left; background-color: rgba(226, 242, 255, 0); } .intercom #worldwide-access .bg { height: 0; padding-bottom: 42%; } .intercom #intercom-app .bg { padding-bottom: 38%; } .intercom #image-technology .content { position: absolute; top: 230px; } .intercom #image-technology .bg { background-size: 1300px auto; height: 690px; background-color: #0a111b; } .intercom #image-technology .icons { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: 440px; margin: 455px auto 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #image-technology .icons li { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 0; -ms-flex: 0 0 33%; flex: 0 0 33%; text-align: center; } .intercom #image-technology .icons li .dot { width: 25px; height: 25px; margin-top: 50px; } .intercom #image-technology .icons li div { width: 130px; height: 130px; background-color: rgba(11, 34, 63, 0.5); border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 20px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #image-technology .icons li div img { margin: 0; width: 50px; } .intercom #live-preview .bg, .intercom #live-preview .bg video { height: 350px; } .intercom #night-view .content { color: #ffffff; background-color: #040c19; position: relative; } .intercom #night-view .content hr { background-color: #0090ff; } .intercom #night-view .bg { padding-bottom: 38%; } .intercom #night-view .bg img { position: absolute; top: 150%; -webkit-transform: translateY(-50%); transform: translateY(-50%); transition: 750ms top 1250ms ease-in-out; } .intercom #night-view .bg img.active { top: 50%; } .intercom #night-view .bg-second { padding-bottom: 38%; opacity: 0; height: 0; transition: 1s opacity; } .intercom #night-view .bg-second img { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .intercom #night-view .bg-second.active { opacity: 1; } .intercom #back-home .content { background-color: #EEEDEB; } .intercom #back-home .bg { padding-bottom: 40%; } .intercom #back-home .bg ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 300px; height: auto; color: #0090ff; position: absolute; margin: 3rem auto 0; } .intercom #back-home .bg ul > li { margin: 0 5px 20px; background: white; border-radius: 7px; box-shadow: 0 9px 11px -6px #ccc; width: auto; height: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; opacity: 0; } .intercom #back-home .bg ul > li:nth-of-type(1) { transition: opacity 1s 500ms; } .intercom #back-home .bg ul > li:nth-of-type(2) { transition: opacity 1s 1500ms; } .intercom #back-home .bg ul > li:nth-of-type(3) { transition: opacity 1s 2500ms; } .intercom #back-home .bg ul > li div:nth-of-type(1) { width: 50px; } .intercom #back-home .bg ul > li div { padding: 15px; text-align: left; position: relative; } .intercom #back-home .bg ul > li span { padding: 0; display: block; } .intercom #back-home .bg ul > li span:nth-of-type(1) { text-transform: uppercase; } .intercom #back-home .bg ul > li span:nth-of-type(2) { font-weight: 600; } .intercom #back-home .bg ul img { height: 30px; margin-left: 8px; padding: 0; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .intercom #back-home .bg.active ul > li:nth-of-type(1), .intercom #back-home .bg.active ul > li:nth-of-type(2), .intercom #back-home .bg.active ul > li:nth-of-type(3) { opacity: 1; } .intercom #pincode .codeok { color: #0090FF; font-size: 120%; position: absolute; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); left: 35%; margin-top: 0; } .intercom #pincode .codeok > span:nth-of-type(1) { border-radius: 5px; border: 1px solid #0090FF; padding: 0 10px; font-size: 110%; } .intercom #pincode .codeok > span:nth-of-type(1) > span { padding: 0 3px; display: inline-block; margin-top: 2px; vertical-align: middle; opacity: 0; } .intercom #pincode .codeok > span:nth-of-type(1) > span:nth-of-type(1) { transition: 1s opacity 250ms; } .intercom #pincode .codeok > span:nth-of-type(1) > span:nth-of-type(2) { transition: 1s opacity 500ms; } .intercom #pincode .codeok > span:nth-of-type(1) > span:nth-of-type(3) { transition: 1s opacity 750ms; } .intercom #pincode .codeok > span:nth-of-type(1) > span:nth-of-type(4) { transition: 1s opacity 1000ms; } .intercom #pincode .codeok.active > span:nth-of-type(2) { opacity: 1; display: block; } .intercom #pincode .codeok.active > span:nth-of-type(1) > span:nth-of-type(1), .intercom #pincode .codeok.active > span:nth-of-type(1) > span:nth-of-type(2), .intercom #pincode .codeok.active > span:nth-of-type(1) > span:nth-of-type(3), .intercom #pincode .codeok.active > span:nth-of-type(1) > span:nth-of-type(4) { opacity: 1; } .intercom #pincode .content { position: relative; } .intercom #pincode .content .codeok { display: none; } .intercom #pincode .bg { padding-bottom: 39%; text-align: right; } .intercom #pincode .bg .codeok { display: block; } .intercom #notifications { overflow: hidden; } .intercom #notifications .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; color: #fff; } .intercom #notifications .content .col-phoneS-10 { height: 400px; } .intercom #notifications .content img { width: 220px; height: auto; position: absolute; bottom: 0; left: 50%; } .intercom #notifications .bg { padding-bottom: 0; height: 420px; width: 100%; } .intercom #doorbell_hand .content { position: relative; background-color: #fff; z-index: 20; } .intercom #doorbell_hand .bg { padding-bottom: 43%; margin-top: -5%; z-index: 10; } .intercom #gates .content ul img { margin: 20px 50px -40px; } .intercom #gates .bg { padding-bottom: 39%; } .intercom #gates .bg-second { padding-bottom: 39%; } .intercom #fit-for-home .content { padding-top: 2.4rem; padding-bottom: 2.4rem; } .intercom #fit-for-home .content .swiper-container img { width: 80%; height: auto; margin: 25px 0 50px; } .intercom #fit-for-home .content .swiper-container .swiper-button-prev { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMoAAADKCAYAAADkZd+oAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggTWFjaW50b3NoIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdBNjhFM0Y5QzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdBNjhFM0ZBQzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6N0E2OEUzRjdDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6N0E2OEUzRjhDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4qpWmPAAAfAElEQVR42uxd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"); right: auto; left: 20px; width: 40px; height: 40px; background-size: 40px; -webkit-transform: rotate(0); transform: rotate(0); border-right: 0; border-bottom: 0; } .intercom #fit-for-home .content .swiper-container .swiper-button-next { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMoAAADKCAYAAADkZd+oAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggTWFjaW50b3NoIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdBNjhFM0ZEQzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdBNjhFM0ZFQzA4NDExRTc5MUEyRTg2RDc4OTNCOTE1Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6N0E2OEUzRkJDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6N0E2OEUzRkNDMDg0MTFFNzkxQTJFODZENzg5M0I5MTUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7eJnu3AAAfeUlEQVR42uxd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"); right: 20px; left: auto; width: 40px; height: 40px; background-size: 40px; -webkit-transform: rotate(0); transform: rotate(0); border-right: 0; border-bottom: 0; } .intercom #tamper_security .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; color: #fff; } .intercom #tamper_security .content .col-phoneS-10 { height: 400px; } .intercom #tamper_security .content hr { display: inline-block; width: 60px; border: 0; height: 1px; background-color: #0090ff; margin-left: 0; margin-right: 0; margin-bottom: 20px; } .intercom #tamper_security .content img { width: 150px; height: auto; position: absolute; bottom: 0; left: 45%; } .intercom #tamper_security .bg { padding-bottom: 0; height: 420px; width: 100%; } .intercom #security_iPad .content { background-color: transparent; position: absolute; height: 100%; overflow: hidden; padding-bottom: 0; color: #444444; } .intercom #security_iPad .content .col-phoneS-10 { height: 400px; } .intercom #security_iPad .content hr { display: inline-block; width: 60px; border: 0; height: 1px; background-color: #0090ff; margin-left: 0; margin-right: 0; margin-bottom: 20px; } .intercom #security_iPad .content img { width: 320px; height: auto; position: absolute; bottom: 20px; left: 40%; } .intercom #security_iPad .bg { padding-bottom: 0; height: 410px; width: 100%; } .intercom #monitoring .content { background-color: transparent; position: absolute; } .intercom #monitoring .content ul img { width: 70px; padding: 15px; margin: 0 30px; } .intercom #monitoring .bg { padding-bottom: 68%; } .intercom #installation .content { position: absolute; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .intercom #installation .bg { padding-bottom: 50%; } .intercom #packshot .content img { width: 350px; margin: 30px 0; } .intercom #specification-link .bg { padding-bottom: 26%; } .intercom #parameters .specs-row .drawing { width: 36%; margin-left: 0; -webkit-transform: translateX(0); transform: translateX(0); } } @media (min-width: 768px) and (max-width: 991px) { .intercom #doorbell_hand .content { background-color: #f0f0f0; } } @media (min-width: 992px) { .intercom #live-preview .bg, .intercom #live-preview .bg video { height: 370px; padding-bottom: 0; } .intercom #back-home .bg ul { margin: 20% 0 0 20%; } .intercom #doorbell_hand .content { position: absolute; background-color: transparent; z-index: 20; } .intercom #doorbell_hand .bg { padding-bottom: 50%; margin-top: 0; z-index: 10; } .intercom #tamper_security .content img { width: 170px; } .intercom #security_iPad .content img { bottom: 40px; } .intercom #monitoring .content ul img { margin: 10px 30px 0; } .intercom #monitoring .bg { padding-bottom: 54%; } .intercom .section-video-reveal .video-box .video-text { display: block; opacity: 0; transition: opacity 1s; } .intercom .section-video-reveal .video-box .video-text.active { opacity: 1; } .intercom .section-video-reveal .video-box .video-text #ring { width: 14%; left: -11%; bottom: 88%; position: absolute; } .intercom .section-video-reveal .video-box .video-text #transmitter { width: 23%; left: 4%; top: 58%; position: absolute; } .intercom .section-video-reveal .video-box .video-text #matrix { width: 12%; left: 25%; bottom: 79%; position: absolute; } .intercom .section-video-reveal .video-box .video-text #IR { width: 15%; left: 38%; bottom: 75%; position: absolute; } .intercom .section-video-reveal .video-box .video-text #microphone { width: 16%; left: 34%; top: 75%; position: absolute; } .intercom .section-video-reveal .video-box .video-text #speaker { width: 15%; left: 53%; bottom: 68%; position: absolute; } .intercom .section-video-reveal .video-box .video-text #cover { width: 20%; left: 67%; bottom: 60%; position: absolute; } .intercom .section-video-reveal .video-box .video-text #lens { width: 20%; left: 82%; bottom: 38%; position: absolute; } .intercom .section-video-reveal .video-box .video-text #sensor { width: 20%; left: 74%; top: 98%; position: absolute; } .intercom #packshot .content img { width: 400px; } } @media (min-width: 1200px) { .intercom #header .content .header-title h1, .intercom #header .content .header-title h2 { padding-top: 22%; padding-bottom: 15px; font-size: 4em; } .intercom #header .content hr { width: 360px; margin-bottom: 15px; } .intercom #header .content p { font-size: 2em; } .intercom #live-preview .content { text-align: right; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .intercom #live-preview .bg { height: 600px; } .intercom #live-preview .bg video { height: 280px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin-top: 20px; } .intercom #night-view .content { color: #ffffff; position: absolute; background-color: transparent; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); opacity: 0; transition: 1s opacity 3250ms ease-in-out; } .intercom #night-view .content ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #night-view .content ul > li span { display: block; } .intercom #night-view .content.active { opacity: 1; } .intercom #back-home .content { position: absolute; background-color: transparent; } .intercom #back-home .content p { padding-left: 35px; padding-right: 35px; } .intercom #back-home .content ul { display: -webkit-box; display: -ms-flexbox; display: flex; color: #0090ff; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 300px; margin: 1rem auto 0; } .intercom #back-home .content ul li { margin: 0 5px 20px; background: white; border-radius: 7px; box-shadow: 0 9px 11px -6px #ccc; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; width: auto; height: auto; opacity: 0; } .intercom #back-home .content ul li:nth-of-type(1) { transition: opacity 1s; } .intercom #back-home .content ul li:nth-of-type(2) { transition: opacity 1s 500ms; } .intercom #back-home .content ul li:nth-of-type(3) { transition: opacity 1s 1000ms; } .intercom #back-home .content ul li div:nth-of-type(1) { width: 50px; } .intercom #back-home .content ul li div { padding: 15px; text-align: left; position: relative; } .intercom #back-home .content ul li span { padding: 0; } .intercom #back-home .content ul li span:nth-of-type(1) { text-transform: uppercase; } .intercom #back-home .content ul li span:nth-of-type(2) { font-weight: 600; } .intercom #back-home .content ul img { height: 30px; margin-left: 8px; padding: 0; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .intercom #back-home .content.active ul > li:nth-of-type(1), .intercom #back-home .content.active ul > li:nth-of-type(2), .intercom #back-home .content.active ul > li:nth-of-type(3) { opacity: 1; } .intercom #back-home .bg { padding-bottom: 42%; } .intercom #pincode .content { position: absolute; background-color: transparent; text-align: right; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .intercom #pincode .content .codeok { display: block; position: relative; width: auto; padding-top: 0; margin-top: 40px; top: 15%; left: 50%; } .intercom #pincode .bg { padding-bottom: 39%; } .intercom #pincode .bg .codeok { display: none; } .intercom #notifications .content .col-phoneS-10 { height: 540px; } .intercom #notifications .content img { width: 230px; bottom: 130px; } .intercom #notifications .bg { height: 440px; } .intercom #doorbell_hand .content { position: absolute; background-color: transparent; z-index: 20; } .intercom #doorbell_hand .bg { padding-bottom: 43%; margin-top: 0; z-index: 10; } .intercom #gates .content ul img { margin: 20px 40px -80px; } .intercom #fit-for-home .content { padding-top: 10rem; padding-bottom: 10rem; } .intercom #fit-for-home .content .swiper-container img { width: 60%; } .intercom #fit-for-home .content .swiper-container .swiper-button-prev { left: 140px; } .intercom #fit-for-home .content .swiper-container .swiper-button-next { right: 140px; } .intercom #tamper_security .content .col-phoneS-10 { height: 540px; } .intercom #tamper_security .content img { width: 150px; bottom: 170px; left: 46%; } .intercom #tamper_security .bg { height: 400px; } .intercom #security_iPad .content .col-phoneS-10 { height: 540px; } .intercom #security_iPad .content img { width: 400px; bottom: 140px; left: 40%; } .intercom #security_iPad .bg { height: 450px; } .intercom #monitoring .content ul img { margin: 0 30px; } .intercom #monitoring .bg { padding-bottom: 50%; } .intercom #installation .bg { padding-bottom: 39%; } .intercom #packshot .content img { width: 493px; margin: 40px 0 30px 0; } .intercom #packshot .content a { transition: all 250ms; } .intercom #packshot .content a:hover { color: #fff; background-color: #007ae4; } .intercom #packshot .content .notice { margin-bottom: -10px; } .intercom #specification-link .bg { padding-bottom: 19%; } .intercom #parameters .specs-section { padding-top: 5rem; margin-top: 5rem; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .intercom #parameters .specs-section h3 { padding-bottom: 3rem; font-size: 145%; width: 25%; text-align: right; padding-right: 90px; margin-top: 0; } .intercom #parameters .specs-row-wrapper { width: 75%; } .intercom #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 10px; width: 100%; } .intercom #parameters .specs-row .description { width: 30%; font-size: 110%; } .intercom #parameters .specs-row .value { width: 70%; padding-left: 40px; font-size: 110%; } .intercom #parameters .specs-row .drawing { width: 33%; } .intercom #for-relatives .swiper-container { margin-top: 30px; margin-bottom: 10px; } .intercom #for-relatives .swiper-container .swiper-slide > div { position: relative; margin: 0; max-width: initial; } .intercom #for-relatives .swiper-container .swiper-slide > div img { width: 100%; height: auto; } .intercom #for-relatives .swiper-container .swiper-slide > div img:nth-of-type(1) { position: relative; display: block; } .intercom #for-relatives .swiper-container .swiper-slide > div img:nth-of-type(2) { position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 500ms; } .intercom #for-relatives .swiper-container .swiper-slide.item-active img:nth-of-type(2) { opacity: 1; } } @media (min-width: 1600px) { .intercom #worldwide-access .bg { height: 0; padding-bottom: 40%; } .intercom #image-technology .icons { width: 470px; } .intercom #back-home .bg { padding-bottom: 40%; } .intercom #back-home .content ul { -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: scale(1.2); transform: scale(1.2); } .intercom #notifications .content .col-phoneS-10 { height: 755px; } .intercom #notifications .content img { width: 280px; bottom: 280px; } .intercom #notifications .bg { height: 520px; } .intercom #gates .content ul img { margin-bottom: -130px; } .intercom #fit-for-home .content { padding-top: 10rem; padding-bottom: 10rem; } .intercom #fit-for-home .content .swiper-container img { width: 60%; } .intercom #fit-for-home .content .swiper-container .swiper-button-prev { left: 210px; } .intercom #fit-for-home .content .swiper-container .swiper-button-next { right: 210px; } .intercom #tamper_security .content .col-phoneS-10 { height: 720px; } .intercom #tamper_security .content img { width: 250px; bottom: 190px; left: 45%; } .intercom #tamper_security .bg { height: 570px; } .intercom #security_iPad .content .col-phoneS-10 { height: 720px; } .intercom #security_iPad .content img { width: 520px; bottom: 210px; left: 39%; } .intercom #security_iPad .bg { height: 570px; } .intercom #packshot .content .notice { margin-bottom: -30px; } .intercom #specification-link .bg { padding-bottom: 16%; } .intercom #sound-quality .bg { height: 710px; } .intercom .section-video-reveal .video-box .video-text #transmitter { top: 55%; } .intercom .section-video-reveal .video-box .video-text #lens { left: 82%; bottom: 38%; } .intercom #parameters .drawing { width: 25%; } } @media (min-width: 2100px) { .intercom #header .content .header-title h1, .intercom #header .content .header-title h2 { padding-top: 25%; } .intercom #header .content hr { width: 440px; } .intercom #sound-quality .bg { height: 750px; } .intercom #sound-quality .icons { width: 760px; margin-top: 490px; } .intercom #worldwide-access .content h2 { padding-top: 70px; } .intercom #image-technology .bg { height: 730px; } .intercom #image-technology .icons { width: 520px; margin-top: 505px; } .intercom #notifications .content .col-phoneS-10 { height: 850px; } .intercom #notifications .content img { width: 400px; bottom: 250px; } .intercom #notifications .bg { height: 640px; } .intercom #gates .content ul img { margin-bottom: -170px; width: 100px; } .intercom #fit-for-home .content { padding-top: 10rem; padding-bottom: 10rem; } .intercom #fit-for-home .content .swiper-container img { width: 60%; } .intercom #fit-for-home .content .swiper-container .swiper-button-prev { left: 290px; } .intercom #fit-for-home .content .swiper-container .swiper-button-next { right: 290px; } .intercom #tamper_security .content .col-phoneS-10 { height: 850px; } .intercom #tamper_security .content img { width: 390px; bottom: 120px; } .intercom #tamper_security .bg { height: 760px; } .intercom #security_iPad .content .col-phoneS-10 { height: 850px; } .intercom #security_iPad .content img { width: 640px; } .intercom #security_iPad .bg { height: 760px; } .intercom #monitoring .content ul img { margin: 20px 30px 0 30px; } .intercom #back-home .content ul { -webkit-transform: scale(1.5) translateY(20px); transform: scale(1.5) translateY(20px); } .intercom .section-video-reveal .video-box .video-text #ring { bottom: 91%; } .intercom .section-video-reveal .video-box .video-text #matrix { bottom: 81%; } .intercom .section-video-reveal .video-box .video-text #IR { bottom: 77%; } .intercom .section-video-reveal .video-box .video-text #speaker { bottom: 70%; } .intercom .section-video-reveal .video-box .video-text #cover { bottom: 62%; } .intercom .section-video-reveal .video-box .video-text #lens { bottom: 40%; } .intercom .section-video-reveal .video-box .video-text #sensor { width: 15%; left: 77%; } } .intercom #intro-overlay { display: none; } .intercom #introduction .content { position: absolute; z-index: 10; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .intercom #introduction .content p { padding-left: 10px; padding-right: 10px; } .intercom #introduction .content br { display: none; } .intercom #introduction .bg { height: 370px; background-size: auto 100%; } .intercom #open-possibilities ul { width: 100%; max-width: 220px; height: 160px; display: block; position: relative; margin: 4.8rem auto 9.6rem; } .intercom #open-possibilities li { width: 100px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; -webkit-transform: translate(-50%, -42px); transform: translate(-50%, -42px); transition: all 500ms 500ms; top: 50%; left: 50%; } .intercom #open-possibilities li > div { background-color: #0090ff; border-radius: 50%; width: 80px; height: 80px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; transition: -webkit-transform 500ms; transition: transform 500ms; transition: transform 500ms, -webkit-transform 500ms; -webkit-transform: scale(0); transform: scale(0); } .intercom #open-possibilities li img { width: 50px; height: auto; opacity: 0; transition: all 500ms 750ms; } .intercom #open-possibilities li p { transition: all 500ms 1250ms; opacity: 0; margin-top: 10px; } .intercom #open-possibilities ul.active li:nth-of-type(1) { left: 10%; top: 5%; } .intercom #open-possibilities ul.active li:nth-of-type(2) { left: 90%; top: 5%; } .intercom #open-possibilities ul.active li:nth-of-type(3) { left: 10%; top: 97%; } .intercom #open-possibilities ul.active li:nth-of-type(4) { left: 90%; top: 97%; } .intercom #open-possibilities ul.active li > div { -webkit-transform: scale(1); transform: scale(1); } .intercom #open-possibilities ul.active img { opacity: 1; } .intercom #open-possibilities ul.active p { opacity: 1; } .intercom #vv-widget { margin-top: 2.4rem; } .intercom #vv-widget svg { width: 100%; height: auto; } .intercom #vv-widget #vv-info-box { position: relative; display: inline-block; margin-top: 2.4rem; padding: 20px 20px 20px 80px; font-size: 110%; color: #fff; background: #60d545 url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2MyIgaGVpZ2h0PSI2MyIgdmlld0JveD0iMCAwIDYzIDYzIj4NCiAgICAgIDxwYXRoIGQ9Ik0zMS41LDYzQTMxLjUsMzEuNSwwLDEsMSw2MywzMS41LDMxLjUzLDMxLjUzLDAsMCwxLDMxLjUsNjNabTAtNjJBMzAuNSwzMC41LDAsMSwwLDYyLDMxLjUsMzAuNTMsMzAuNTMsMCwwLDAsMzEuNSwxWiIgZmlsbD0iI2ZmZiIvPg0KICAgICAgPHBhdGggZD0iTTI2LjI2LDQ0aDBhMSwxLDAsMCwxLS42OS0uMjhoMEwxMywzMS4xNmExLDEsMCwwLDEsMS40Mi0xLjQyTDI2LjI2LDQxLjYyLDQ4LjYyLDE5LjI1QTEsMSwwLDAsMSw1MCwyMC42N0wyNyw0My43NUExLDEsMCwwLDEsMjYuMjYsNDRaIiBmaWxsPSIjZmZmIi8+DQo8L3N2Zz4=") no-repeat 20px 50%; background-size: 36px; border-radius: 8px; opacity: 0; } .intercom #vv-widget #vv-bg-gradient { opacity: 0; } .intercom #mf-widget #marker { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } .intercom #hdr .container-fluid { padding-left: 0; padding-right: 0; } .intercom #hdr .desc { font-size: 1.4em; } .intercom #hdr .photos { position: relative; width: 100%; height: 0; padding-bottom: 66.5%; margin: 10px 0 20px; } .intercom #hdr .photos img { width: 100%; height: auto; position: absolute; top: 0; left: 0; } .intercom #hdr .photos img.on { opacity: 0; transition: opacity 500ms; } .intercom #hdr .photos img.on.active { opacity: 1; } .intercom #hdr .bg { display: none; } .intercom #hdr .switch { position: relative; display: block; width: 60px; height: 30px; margin-top: 2rem; margin-left: auto; margin-right: auto; } .intercom #hdr .switch .track { display: inline-block; width: 60px; height: 30px; border-radius: 15px/50%; background-color: #dfe3e9; cursor: pointer; transition: all 200ms; } .intercom #hdr .switch .handle { position: absolute; top: 1px; left: 1px; height: 28px; width: 28px; background: #fff; border-radius: 50%; box-shadow: 0 1px 2px #6e6e6e; cursor: pointer; transition: all 200ms; } .intercom #hdr .switch:before, .intercom #hdr .switch:after { display: block; height: 30px; transition: color 200ms; font-size: 18px; line-height: 30px; font-weight: 400; position: absolute; top: 0; } .intercom #hdr .switch:before { left: -90%; color: #aaaaaa; } .intercom #hdr .switch:after { right: -90%; color: #aaaaaa; } .intercom #hdr .switch.active .track { background-color: #0090FF; } .intercom #hdr .switch.active .handle { box-shadow: 0 1px 2px #0075d0; -webkit-transform: translateX(30px); transform: translateX(30px); } .intercom #hdr .switch.active:after { color: #0090ff; } .intercom #weather-conditions .widget { height: 0; padding-bottom: 66.6666666%; position: relative; overflow: hidden; } .intercom #weather-conditions .rain, .intercom #weather-conditions .frost { position: absolute; height: 100%; width: 100%; top: 0; left: 0; background-size: auto 100%; background-repeat: no-repeat; } .intercom #weather-conditions .rain { width: 15%; } .intercom #weather-conditions .handle { content: ''; width: 50px; height: 50px; border-radius: 50%; background: #fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA3MC4zOSA0MyIgd2lkdGg9IjcwLjM5IiBoZWlnaHQ9IjQzIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6IzAwOTBmZjt9PC9zdHlsZT48L2RlZnM+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNNDguODksNDNhMS41LDEuNSwwLDAsMS0xLjA2LTIuNTZMNjYuNzcsMjEuNSw0Ny44MywyLjU2QTEuNSwxLjUsMCwwLDEsNTAsLjQ0bDIwLDIwYTEuNTEsMS41MSwwLDAsMSwwLDIuMTNsLTIwLDIwQTEuNSwxLjUsMCwwLDEsNDguODksNDNaTTIxLjUsNDNhMS41LDEuNSwwLDAsMS0xLjA2LS40NGwtMjAtMjBhMS41MSwxLjUxLDAsMCwxLDAtMi4xM2wyMC0yMGExLjUsMS41LDAsMCwxLDIuMTIsMi4xMkwzLjYyLDIxLjUsMjIuNTYsNDAuNDRBMS41LDEuNSwwLDAsMSwyMS41LDQzWiIvPjwvc3ZnPg==") no-repeat 50% 50%; background-size: 60%; position: absolute; cursor: -webkit-grab; cursor: grab; left: 15%; top: 50%; margin-top: -25px; margin-left: -25px; } .intercom #weather-conditions .handle:before, .intercom #weather-conditions .handle:after { content: ''; display: block; position: absolute; width: 0; height: 2000px; left: 23px; border-left: 2px solid white; border-right: 2px solid white; } .intercom #weather-conditions .handle:before { top: -2000px; } .intercom #open-voice .speech { position: absolute; z-index: 0; background-color: #0090ff; color: #fff; padding: 15px; border-radius: 8px; top: 10px; right: -30px; box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.15); -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: scale(0); transform: scale(0); opacity: 0; transition: all 500ms ease-in-out; } .intercom #open-voice .speech:after { content: ''; display: block; position: absolute; bottom: -2px; left: 23px; z-index: -1; width: 20px; height: 20px; background-color: #0090ff; -webkit-transform: rotate(115deg) skewX(60deg); transform: rotate(115deg) skewX(60deg); } .intercom #open-voice.active .speech { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } .intercom #open-nfc .bubble, .intercom #open-remote .bubble { position: absolute; width: 90px; height: 90px; border-radius: 50%; background-color: #0090ff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .intercom #open-nfc .bubble img, .intercom #open-remote .bubble img { width: 70%; height: auto; } .intercom #open-nfc .bubble { bottom: 30px; left: -20px; box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.15); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scale(0); transform: scale(0); opacity: 0; transition: all 500ms ease-in-out; } .intercom #open-nfc .bubble img { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } .intercom #open-nfc.active .bubble { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } .intercom #denoise .content { padding-bottom: 0; } .intercom #dn-video { padding-left: 0; padding-right: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: -20px; } .intercom #dn-video video, .intercom #dn-video img { height: 220px; width: auto; } .intercom .roundit { display: inline-block; position: relative; border-radius: 50%; width: 240px; height: 0; padding-bottom: 240px; margin: 1.2rem 0 2.4rem; box-shadow: 20px 20px 50px rgba(0, 0, 0, 0.15); } .intercom .roundit img { width: 100%; height: auto; border-radius: 50%; } .intercom .appstore-link { width: 100%; height: 70px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 0; position: relative; } .intercom #voice-message .roundit img { height: 100%; } @media (max-width: 767px) { .intercom #introduction .content p { padding-left: 0; padding-right: 0; } .intercom #many-features .content { padding-bottom: 0; } .intercom #mf-widget { height: 380px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #mf-widget svg { width: auto; height: 100%; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; } .intercom #wv-ring-widget { position: relative; overflow: hidden; height: 380px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #wv-ring-widget svg { width: auto; height: 100%; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; } .intercom #open-voice .supinfo, .intercom #open-nfc .supinfo, .intercom #open-remote .supinfo { display: none; } } @media (min-width: 768px) { .intercom #intro-overlay { display: block; width: 100vw; height: 100vh; position: fixed; z-index: 10000; top: 0; left: 0; background-color: #fff; } .intercom #intro-overlay * ::selection { background-color: transparent; } .intercom #intro-overlay > a { display: inline-block; position: absolute; color: #fff; bottom: 7%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); font-size: 12px; opacity: 0; text-transform: uppercase; pointer-events: none; } .intercom #intro-overlay > a:after { content: ''; display: inline-block; width: 8px; height: 8px; border-top: 1px solid #fff; border-right: 1px solid #fff; -webkit-transform: rotate(45deg) translateX(-1px); transform: rotate(45deg) translateX(-1px); vertical-align: baseline; } .intercom #intro-overlay .preloader, .intercom #intro-overlay .video, .intercom #intro-overlay .final { background-color: #000; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #intro-overlay .preloader svg { width: 100%; height: auto; } .intercom #intro-overlay .video { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .intercom #intro-overlay .video video { width: 100%; height: 100%; object-fit: cover; } .intercom #intro-overlay .cover { background-color: #fff; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; } .intercom #intro-overlay .final { -ms-flex-line-pack: center; align-content: center; } .intercom #intro-overlay .final span { color: #fff; font-size: 50px; text-align: center; opacity: 0; } .intercom #introduction .content p { padding-left: 30px; padding-right: 30px; } .intercom #open-possibilities .content { padding-bottom: 4.8rem; } .intercom #open-possibilities ul { max-width: 800px; margin: 4.8rem auto 0; } .intercom #open-possibilities li { width: 100px; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); transition: left 500ms 500ms; } .intercom #open-possibilities li > div { width: 100px; height: 100px; } .intercom #open-possibilities li img { width: 60px; } .intercom #open-possibilities li p { font-size: 110%; } .intercom #open-possibilities ul.active li:nth-of-type(1) { left: 0; top: 0; } .intercom #open-possibilities ul.active li:nth-of-type(2) { left: 33%; top: 0; } .intercom #open-possibilities ul.active li:nth-of-type(3) { left: 66%; top: 0; } .intercom #open-possibilities ul.active li:nth-of-type(4) { left: 100%; top: 0; } .intercom #open-possibilities ul.active li > div { -webkit-transform: scale(1); transform: scale(1); } .intercom #open-possibilities ul.active img { opacity: 1; } .intercom #open-possibilities ul.active p { opacity: 1; } .intercom #mf-widget svg { width: 100%; height: auto; } .intercom #mf-widget #marker { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } .intercom #wv-ring-widget { position: relative; overflow: hidden; } .intercom #wv-ring-widget .content { padding-top: 0; } .intercom #wv-ring-widget svg { width: 100%; height: auto; display: block; } .intercom #hdr .content { position: absolute; z-index: 10; } .intercom #hdr .content p { opacity: 0; transition: opacity 1s; } .intercom #hdr .bg { display: block; background-color: #f7f7f7; padding-top: 40px; } .intercom #hdr .bg .descriptions { opacity: 0; transition: opacity 1s; } .intercom #hdr .video > div { position: absolute; bottom: 25%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 79%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .intercom #hdr .video > div > div { width: 47.5%; text-align: center; } .intercom #hdr .button-replay { display: block; opacity: 0; pointer-events: none; transition: opacity 500ms; position: absolute; right: 20px; bottom: 20px; } .intercom #hdr.done .content p { opacity: 1; } .intercom #hdr.done .bg .descriptions { opacity: 1; } .intercom #hdr.done .button-replay { opacity: 1; pointer-events: auto; } .intercom #weather-conditions .widget { padding-bottom: 41.1%; } .intercom #weather-conditions .widget.dragging { cursor: -webkit-grabbing; cursor: grabbing; } .intercom #weather-conditions .widget.dragging .handle { cursor: -webkit-grabbing; cursor: grabbing; } .intercom #open-voice .content, .intercom #open-nfc .content, .intercom #open-remote .content, .intercom #voice-message .content { padding-top: 4.8rem; padding-bottom: 4.8rem; } .intercom #open-voice .text, .intercom #open-nfc .text, .intercom #open-remote .text, .intercom #voice-message .text { text-align: left; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .intercom #open-nfc .text, .intercom #voice-message .text { text-align: right; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } .intercom #open-nfc hr, .intercom #voice-message hr { margin-left: auto; } .intercom #denoise .content { position: absolute; } .intercom #dn-video { padding-top: 150px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 0; } .intercom #dn-video video, .intercom #dn-video img { height: 380px; width: auto; } .intercom #wide-view .content { padding-top: 0; } .intercom .roundit { width: 100%; padding-bottom: 100%; margin: 0; } .intercom .appstore-link { height: 100px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: -40px; } } @media (min-width: 992px) { .intercom #introduction .content p { padding-left: 100px; padding-right: 100px; } .intercom #open-possibilities ul li { width: 140px; } .intercom #hdr .content .bg { padding-top: 20px; } .intercom #open-voice .speech { -webkit-transform: translate(-20px, 20px) scale(0); transform: translate(-20px, 20px) scale(0); } .intercom #open-voice.active .speech { -webkit-transform: translate(-20px, 20px) scale(1.2); transform: translate(-20px, 20px) scale(1.2); } .intercom #open-nfc .bubble { -webkit-transform: translate(20px, -20px) scale(0); transform: translate(20px, -20px) scale(0); } .intercom #open-nfc.active .bubble { -webkit-transform: translate(20px, -20px) scale(1.2); transform: translate(20px, -20px) scale(1.2); } } @media (min-width: 1200px) { .intercom #introduction .content br { display: block; } .intercom #introduction .content p { padding-left: 150px; padding-right: 150px; } .intercom #introduction .bg { height: 280px; } .intercom #open-possibilities ul { margin-top: 4.8rem; height: 240px; } .intercom #vv-widget { margin-top: 3.2rem; } .intercom #vv-widget #vv-info-box { margin-top: 3.2rem; } .intercom #dn-widget { height: 392px; } .intercom #open-voice .content, .intercom #open-nfc .content, .intercom #open-remote .content, .intercom #voice-message .content { padding-top: 6rem; padding-bottom: 6rem; } .intercom #open-voice .text > div, .intercom #open-nfc .text > div, .intercom #open-remote .text > div, .intercom #voice-message .text > div { max-width: 400px; } .intercom #open-voice .speech { -webkit-transform: translate(-30px, 30px) scale(0); transform: translate(-30px, 30px) scale(0); } .intercom #open-voice.active .speech { -webkit-transform: translate(-30px, 30px) scale(1.4); transform: translate(-30px, 30px) scale(1.4); } .intercom #open-nfc .bubble { -webkit-transform: translate(30px, -10px) scale(0); transform: translate(30px, -10px) scale(0); } .intercom #open-nfc.active .bubble { -webkit-transform: translate(30px, -10px) scale(1.4); transform: translate(30px, -10px) scale(1.4); } .intercom #dn-video { padding-top: 120px; } .intercom #dn-video video, .intercom #dn-video img { height: 460px; } .intercom .appstore-link { margin-top: -60px; } .ie11 .intercom #mf-widget { height: 560px; } .ie11 .intercom #vv-widget { padding-bottom: 100px; } .ie11 .intercom #wv-ring-widget svg { height: 460px; } .ie11 .intercom #dn-video { padding-top: 180px; } .ie11 .intercom #dn-video video, .ie11 .intercom #dn-video img { width: 100%; height: auto; } } @media (min-width: 1600px) { .intercom #introduction .bg { height: 330px; } .intercom #introduction .content p { padding-left: 100px; padding-right: 100px; } .intercom #open-possibilities .content { padding-bottom: 7.2rem; } .intercom #open-possibilities li { width: 160px; } .intercom #open-possibilities li > div { width: 140px; height: 140px; } .intercom #open-possibilities li img { width: 80px; height: auto; } .intercom #open-possibilities li p { margin-top: 15px; } .intercom #vv-widget { margin-top: 4.8rem; } .intercom #vv-widget #vv-info-box { margin-top: 4.8rem; } .intercom #dn-widget { height: 310px; } .intercom #open-voice .content, .intercom #open-nfc .content, .intercom #open-remote .content, .intercom #voice-message .content { padding-top: 8.4rem; padding-bottom: 8.4rem; } .intercom #open-voice .text > div, .intercom #open-nfc .text > div, .intercom #open-remote .text > div, .intercom #voice-message .text > div { max-width: 480px; } .intercom #open-voice .speech { -webkit-transform: translate(-50px, 30px) scale(0); transform: translate(-50px, 30px) scale(0); } .intercom #open-voice.active .speech { -webkit-transform: translate(-50px, 30px) scale(1.5); transform: translate(-50px, 30px) scale(1.5); } .intercom #open-nfc .bubble { -webkit-transform: translate(30px, -20px) scale(0); transform: translate(30px, -20px) scale(0); } .intercom #open-nfc.active .bubble { -webkit-transform: translate(30px, -20px) scale(1.8); transform: translate(30px, -20px) scale(1.8); } .intercom #dn-video { padding-top: 140px; } .intercom #dn-video video, .intercom #dn-video img { height: 540px; } .intercom .appstore-link { margin-top: -80px; } } @media (min-width: 2100px) { .intercom #introduction .bg { height: 370px; } .intercom #introduction .content p { padding-left: 130px; padding-right: 130px; } .intercom #open-possibilities .content { padding-bottom: 9.6rem; } .intercom #open-possibilities ul { margin-top: 7.2rem; height: 280px; } .intercom #open-possibilities li { width: 180px; } .intercom #open-possibilities li > div { width: 170px; height: 170px; } .intercom #open-possibilities li img { width: 100px; height: auto; } .intercom #open-possibilities li p { margin-top: 15px; } .intercom #open-voice .content, .intercom #open-nfc .content, .intercom #open-remote .content, .intercom #voice-message .content { padding-top: 9.6rem; padding-bottom: 9.6rem; } .intercom #open-voice .text > div, .intercom #open-nfc .text > div, .intercom #open-remote .text > div, .intercom #voice-message .text > div { max-width: 520px; } .intercom #open-voice .speech { -webkit-transform: translate(-110px, 60px) scale(0); transform: translate(-110px, 60px) scale(0); } .intercom #open-voice.active .speech { -webkit-transform: translate(-110px, 60px) scale(1.6); transform: translate(-110px, 60px) scale(1.6); } .intercom #open-nfc .bubble { -webkit-transform: translate(120px, -30px) scale(0); transform: translate(120px, -30px) scale(0); } .intercom #open-nfc.active .bubble { -webkit-transform: translate(120px, -30px) scale(2.5); transform: translate(120px, -30px) scale(2.5); } .intercom #dn-video { padding-top: 220px; } .intercom #dn-video video, .intercom #dn-video img { height: auto; width: 100%; } .intercom .appstore-link { margin-top: -70px; height: 110px; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .intercom .appstore-link img { width: 170px; } } .rgbw-controller { background-color: black !important; } .rgbw-controller .sub-footer { background: #fff; } .rgbw-controller .black-bg { color: #ffffff; background-color: #000000; } .rgbw-controller footer { background-color: #ffffff; } .rgbw-controller footer .social { background-color: #ffffff; } .rgbw-controller hr { background-image: linear-gradient(to right, #01cae8, #a124f9, #01cae8, #a124f9); display: inline-block; width: 120px; border: 0; height: 2px; margin-bottom: 15px; background-size: 400% 400%; -webkit-animation: Gradient 4s ease infinite; animation: Gradient 4s ease infinite; } @-webkit-keyframes Gradient { 0% { background-position: 0 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0 50%; } } @keyframes Gradient { 0% { background-position: 0 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0 50%; } } .rgbw-controller #header .content { height: 400px; padding-top: 7rem; z-index: 1; } .rgbw-controller #header .content hr { background-image: linear-gradient(to right, #ee202e, #088ce8, #f9e600, #ee202e, #088ce8, #f9e600); -webkit-animation: Gradient 8s ease infinite; animation: Gradient 8s ease infinite; } .rgbw-controller #header .content h1 { font-size: 24px; } .rgbw-controller #header .content h1 span { font-weight: 700; } .rgbw-controller #header .content .claim { font-size: 120%; } .rgbw-controller #magic-of-colors .content { position: relative; } .rgbw-controller #magic-of-colors .bg { padding-bottom: 47%; } .rgbw-controller #magic-of-colors .bg-second { opacity: 0; transition: opacity 500ms; } .rgbw-controller #magic-of-colors .bg-second.active { opacity: 1; } .rgbw-controller #magic-of-colors input { opacity: 0; } .rgbw-controller #magic-of-colors .magic-slider-wrapper { width: 100%; background-color: #181818; height: 60px; border-radius: 10px; margin-bottom: 40px; } .rgbw-controller #magic-of-colors .slider#magic-mobile-slider { width: 90%; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .rgbw-controller #magic-of-colors .slider#magic-desktop-slider { margin-top: 50px; margin-bottom: 20px; width: 260px; } .rgbw-controller #magic-of-colors .slider .slider-handle { background: #fff; box-shadow: inset 0 -2px 1px rgba(51, 51, 51, 0.1); cursor: ew-resize; -webkit-touch-callout: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .rgbw-controller #magic-of-colors .slider .slider-handle:focus { outline: none; } .rgbw-controller #magic-of-colors .slider .slider-track, .rgbw-controller #magic-of-colors .slider .slider-track-high, .rgbw-controller #magic-of-colors .slider .slider-track-low { border-radius: 2px; box-shadow: none; } .rgbw-controller #magic-of-colors .slider .slider-track { height: 4px; margin-top: -2px; background-image: linear-gradient(to right, #00ff0c, #fde92d, #dc0304, #fd0089, #2039d1, #00e0c8); } .rgbw-controller #magic-of-colors .slider .slider-selection { box-shadow: none; display: none; } .rgbw-controller #functions .content { z-index: 1; } .rgbw-controller #functions .content ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 3rem 0 -3rem 0; } .rgbw-controller #functions .content li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; background-repeat: no-repeat; width: 50%; margin-bottom: 5rem; padding: 0 5px; } .rgbw-controller #functions .content li img { height: 50px; width: auto; margin-bottom: 1.6rem; } .rgbw-controller #functions .content li span { text-align: center; display: block; width: 100%; } .rgbw-controller #functions .device { height: 100px; -webkit-transform: scale(2, 2); transform: scale(2, 2); margin: 7rem 0; } .rgbw-controller #universal .content ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 3rem 0 -3rem 0; } .rgbw-controller #universal .content li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; background-repeat: no-repeat; width: 50%; } .rgbw-controller #universal .content li img { height: 50px; width: auto; margin-bottom: 5.6rem; } .rgbw-controller #universal .content li .smaller { padding: 6px 0; } .rgbw-controller #voice-control .content { position: relative; } .rgbw-controller #voice-control span { font-weight: 700; } .rgbw-controller #voice-control .content.fix { padding-top: 0; padding-bottom: 4rem; } .rgbw-controller #voice-control .speech { position: relative; display: inline-block; z-index: 0; color: #000; border-radius: 8px; max-width: 270px; text-align: center; font-size: 1.2em; padding: 10px 25px; background: linear-gradient(270deg, #32ffdc 13%, #dcff32 75%) no-repeat; -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: scale(0); transform: scale(0); opacity: 0; transition: all 500ms ease-in-out; } .rgbw-controller #voice-control .speech:after { content: ''; display: block; position: absolute; bottom: -1px; right: 23px; z-index: -1; width: 20px; height: 20px; background-color: #0090ff; -webkit-transform: rotate(115deg) skewX(60deg); transform: rotate(35deg) skewX(50deg); background: #32ffdc; } .rgbw-controller #voice-control .speech.active { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } .rgbw-controller #voice-control .bg { padding-bottom: 86%; } .rgbw-controller #interior .content { position: relative; } .rgbw-controller #interior .bg { padding-bottom: 126%; } .rgbw-controller #slider .content { padding-top: 0; } .rgbw-controller #slider .interior span { display: block; margin-top: 30px; margin-bottom: 30px; } .rgbw-controller #slider .interior img { width: 80%; height: auto; border-radius: 20px; } .rgbw-controller #slider .swiper-container { margin-bottom: 20px; } .rgbw-controller #slider .swiper-pagination { position: relative; top: 0; bottom: 0; margin-top: 25px; } .rgbw-controller #slider .swiper-pagination-bullet { background-color: transparent; border: 1px solid #0090ff; opacity: 1; } .rgbw-controller #slider .swiper-pagination-bullet-active { background-color: #0090ff; } .rgbw-controller #light-temperature hr { background-image: linear-gradient(to right, #1666df, #ff7c00, #1666df, #ff7c00); display: inline-block; width: 120px; border: 0; height: 2px; margin-bottom: 15px; background-size: 400% 400%; -webkit-animation: Gradient 6s ease infinite; animation: Gradient 6s ease infinite; } .rgbw-controller #light-temperature .content { position: relative; } .rgbw-controller #light-temperature .bg { padding-bottom: 70%; } .rgbw-controller #light-temperature .bg-second { opacity: 0; } .rgbw-controller #light-temperature input { opacity: 0; } .rgbw-controller #light-temperature .slider-wrapper { width: 100%; background-color: #181818; height: 60px; border-radius: 10px; margin-bottom: 40px; } .rgbw-controller #light-temperature .slider#al-mobile-slider { width: 75%; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .rgbw-controller #light-temperature .slider#al-desktop-slider { margin-top: 50px; margin-bottom: 20px; width: 260px; } .rgbw-controller #light-temperature .slider .slider-handle { background: #fff; box-shadow: inset 0 -2px 1px rgba(51, 51, 51, 0.1); cursor: ew-resize; -webkit-touch-callout: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .rgbw-controller #light-temperature .slider .slider-handle:focus { outline: none; } .rgbw-controller #light-temperature .slider .slider-track, .rgbw-controller #light-temperature .slider .slider-track-high, .rgbw-controller #light-temperature .slider .slider-track-low { border-radius: 2px; box-shadow: none; } .rgbw-controller #light-temperature .slider .slider-track { height: 4px; margin-top: -2px; background-image: linear-gradient(to right, #51c0ff, #ffb955); } .rgbw-controller #light-temperature .slider .slider-selection { box-shadow: none; display: none; } .rgbw-controller #app .content { position: relative; } .rgbw-controller #app .bg { padding-bottom: 124%; } .rgbw-controller #favorite_colors .content { position: relative; } .rgbw-controller #favorite_colors .bg { padding-bottom: 12%; margin-bottom: 40px; } .rgbw-controller #scenes .content .video-wrapper { position: relative; width: 100%; padding-bottom: 45%; margin-top: 3rem; } .rgbw-controller #scenes .content video { width: 100%; height: auto; display: -webkit-box; display: -ms-flexbox; display: flex; position: absolute; top: 0; opacity: 0; } .rgbw-controller #scenes .content video.active { opacity: 1; } .rgbw-controller #scenes .content .scene-names { background-color: #151515; border-radius: 15px; margin-top: 25px; padding: 20px 0; font-size: 120%; margin-bottom: 40px; } .rgbw-controller #scenes .content .swiper-button-prev, .rgbw-controller #scenes .content .swiper-button-next { width: 35px; height: 20px; margin-top: -10px; background-size: 27px 24px; } .rgbw-controller #color-world .content { position: relative; width: 100%; height: 100%; } .rgbw-controller #color-world .content .program-items { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; } .rgbw-controller #color-world .content .program-items div { opacity: 0; } .rgbw-controller #color-world .content .program-items div:nth-of-type(1) { transition: opacity 1s; } .rgbw-controller #color-world .content .program-items div:nth-of-type(2) { transition: opacity 1s 500ms; } .rgbw-controller #color-world .content .program-items div:nth-of-type(3) { transition: opacity 1s 1000ms; } .rgbw-controller #color-world .content .program-items div:nth-of-type(4) { transition: opacity 1s 1500ms; } .rgbw-controller #color-world .content .program-items img { width: 96%; height: auto; } .rgbw-controller #color-world .content .program-items.active div { opacity: 1; } .rgbw-controller #color-world .bg { padding-bottom: 64%; } .rgbw-controller #color-world #program-box { position: relative; display: inline-block; margin: 2.4rem 0; padding: 15px 30px 25px; font-size: 110%; color: #676767; background: #000000; border-radius: 6px; width: 100%; } .rgbw-controller #color-world #program-box span { color: #ffffff; } .rgbw-controller #child-room .content { position: relative; } .rgbw-controller #child-room .bg { padding-bottom: 66%; } .rgbw-controller #child-room #info-box { position: relative; display: inline-block; margin: 2.4rem; padding: 10px 30px; font-size: 110%; color: #fff; background: #078b10; border-radius: 6px; box-shadow: 0 0 12px 2px #0fb51a; -webkit-transform-origin: center; transform-origin: center; -webkit-transform: scale(0.75); transform: scale(0.75); opacity: 0; transition: all 250ms ease-in-out; } .rgbw-controller #child-room #info-box span { font-size: 120%; font-weight: 500; } .rgbw-controller #child-room #info-box.active { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } .rgbw-controller #child-room #info-box-second { position: relative; display: inline-block; margin: 1.4rem 0; padding: 10px 30px; font-size: 110%; color: #fff; background: #078b10; border-radius: 6px; box-shadow: 0 0 12px 2px #0fb51a; -webkit-transform-origin: center; transform-origin: center; -webkit-transform: scale(0.75); transform: scale(0.75); opacity: 0; transition: all 250ms ease-in-out 500ms; } .rgbw-controller #child-room #info-box-second span { font-size: 120%; font-weight: 500; } .rgbw-controller #child-room #info-box-second.active { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } .rgbw-controller #danger-alarm .content { position: relative; } .rgbw-controller #danger-alarm .bg { padding-bottom: 76%; } .rgbw-controller #danger-alarm #info-box { position: relative; display: inline-block; margin: 2.4rem; padding: 10px 30px; font-size: 110%; color: #fff; background: #b90909; border-radius: 6px; box-shadow: 0 0 12px 2px #c00000; -webkit-transform-origin: center; transform-origin: center; -webkit-transform: scale(0.75); transform: scale(0.75); opacity: 0; transition: all 250ms ease-in-out; } .rgbw-controller #danger-alarm #info-box.active { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } .rgbw-controller #expose-trumps .content { position: relative; } .rgbw-controller #expose-trumps .bg { padding-bottom: 78%; } .rgbw-controller #light-sources .content { position: relative; } .rgbw-controller #light-sources .content.wrapper .input-wrapper { display: inline-block; width: 49%; padding: 0 3%; } .rgbw-controller #light-sources .bg { padding-bottom: 48%; height: 0; } .rgbw-controller #light-sources .bg.main { opacity: 0; position: absolute; } .rgbw-controller #light-sources .bg.recess { opacity: 0; position: absolute; } .rgbw-controller #light-sources .bg.cupboard { opacity: 0; position: absolute; } .rgbw-controller #light-sources .bg.table { opacity: 0; position: absolute; } .rgbw-controller #light-sources input { opacity: 0; } .rgbw-controller #light-sources .slider-wrapper-4-lights { width: 100%; background-color: #181818; height: 40px; border-radius: 10px; margin-bottom: 40px; } .rgbw-controller #light-sources .slider#main-slider, .rgbw-controller #light-sources .slider#recess-slider, .rgbw-controller #light-sources .slider#cupboard-slider, .rgbw-controller #light-sources .slider#table-slider { width: 75%; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .rgbw-controller #light-sources .slider#ml-desktop-slider { margin-top: 50px; margin-bottom: 20px; width: 260px; } .rgbw-controller #light-sources .slider .slider-handle { background: #fff; box-shadow: inset 0 -2px 1px rgba(51, 51, 51, 0.1); cursor: ew-resize; position: relative; -webkit-touch-callout: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .rgbw-controller #light-sources .slider .slider-handle:focus { outline: none; } .rgbw-controller #light-sources .slider .slider-handle:after { content: ""; display: block; position: absolute; background-color: rgba(255, 255, 255, 0.001); width: 40px; height: 40px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1; } .rgbw-controller #light-sources .slider .slider-track, .rgbw-controller #light-sources .slider .slider-track-high, .rgbw-controller #light-sources .slider .slider-track-low { border-radius: 2px; box-shadow: none; } .rgbw-controller #light-sources .slider .slider-track { height: 4px; margin-top: -2px; background-image: linear-gradient(to right, #000000, #ffffff); } .rgbw-controller #light-sources .slider#recess-slider .slider-track { background-image: linear-gradient(to right, #000000, #ffffff); } .rgbw-controller #light-sources .slider#cupboard-slider .slider-track { background-image: linear-gradient(to right, #000000, #ffcc00); } .rgbw-controller #light-sources .slider#table-slider .slider-track { background-image: linear-gradient(to right, #000000, #00a2ff); } .rgbw-controller #light-sources .slider .slider-selection { box-shadow: none; display: none; } .rgbw-controller #power-metering .content { position: relative; } .rgbw-controller #power-metering .bg { padding-bottom: 78%; } .rgbw-controller #packshot .container { position: absolute; bottom: 8%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .rgbw-controller #packshot .container img { max-width: 400px; margin: 40px 0 0 0; width: 75vw; } .rgbw-controller #packshot .container h2 { margin-bottom: 15px; } .rgbw-controller #packshot .container .find-a-store-custom-button { margin: 0; } .rgbw-controller #packshot .bg { padding-bottom: 95%; margin-bottom: -10px; height: 400px; position: relative; } .rgbw-controller #parameters .specs-section { border-top: 1px solid #e1e1e1; padding-top: 3rem; margin-top: 3rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-wrap: wrap; flex-wrap: wrap; } .rgbw-controller #parameters .specs-section .specs-row-wrapper { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; } .rgbw-controller #parameters .specs-section h3 { text-transform: uppercase; padding-bottom: 3rem; margin-top: 2rem; font-size: 150%; } .rgbw-controller #parameters .clear-divider { border-top: 0; padding-top: 0; margin-top: 0; } .rgbw-controller #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 16px; } .rgbw-controller #parameters .specs-row .description { width: 35%; text-align: left; } .rgbw-controller #parameters .specs-row .value { width: 65%; text-align: left; padding-left: 20px; } .rgbw-controller #parameters .specs-row .drawing { width: 100%; height: auto; padding-left: 0; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .rgbw-controller #parameters .specs-row .drawing img { width: auto; height: 180px; margin-bottom: 40px; } .rgbw-controller #parameters .specs-row .contents { text-align: center; margin-bottom: 40px; } .rgbw-controller #parameters .specs-row .contents img { margin-bottom: 20px; } .rgbw-controller #parameters .specs-row #ring { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; -ms-flex-item-align: end; align-self: flex-end; } .rgbw-controller #parameters .specs-row #ring img { height: 180px; } .rgbw-controller #parameters .specs-row #in-wall { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; -ms-flex-item-align: end; align-self: flex-end; } .rgbw-controller #parameters .specs-row #in-wall img { height: 180px; } .rgbw-controller #parameters .specs-row #box { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; -ms-flex-item-align: end; align-self: flex-end; } .rgbw-controller #parameters .specs-row #box img { height: 180px; } .rgbw-controller #parameters .specs-row #sd { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; -ms-flex-item-align: end; align-self: flex-end; } .rgbw-controller #parameters .specs-row #sd img { height: 60px; } .rgbw-controller #parameters .specs-row #screws-big { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; -ms-flex-item-align: end; align-self: flex-end; } .rgbw-controller #parameters .specs-row #screws-big img { height: 70px; } .rgbw-controller #parameters .specs-row #screws-small { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; -ms-flex-item-align: end; align-self: flex-end; } .rgbw-controller #parameters .specs-row #screws-small img { height: 35px; } .rgbw-controller #parameters .specs-row #screws { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; -ms-flex-item-align: end; align-self: flex-end; } .rgbw-controller #parameters .specs-row #screws img { height: 50px; } .rgbw-controller #parameters .specs-row #allen-key { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; -ms-flex-item-align: end; align-self: flex-end; } .rgbw-controller #parameters .specs-row #allen-key img { height: 45px; } .rgbw-controller #parameters .specs-row #key { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; -ms-flex-item-align: end; align-self: flex-end; } .rgbw-controller #parameters .specs-row #key img { height: 100px; } .rgbw-controller .section-product-footer { width: 100%; max-width: 2560px; } .rgbw-controller .section-product-footer .top { display: none; } .rgbw-controller .section-product-footer .sub { background-color: #181818; } @media (max-width: 767px) { .rgbw-controller #slider .swiper-button-next, .rgbw-controller #slider .swiper-button-prev { top: 60%; } } @media (min-width: 544px) { .rgbw-controller #header .content { height: 660px; padding-top: 15rem; } .rgbw-controller #header .content h1 { font-size: 32px; } .rgbw-controller #header .content .claim { font-size: 150%; } } @media (min-width: 768px) { .rgbw-controller #header { width: auto; max-width: 2560px; } .rgbw-controller #header .content { position: absolute; height: auto; padding-top: 16vh; transition: all 1s ease-out 2s; -webkit-transform: translateY(20px); transform: translateY(20px); opacity: 0; } .rgbw-controller #header .content h1 { font-size: 3.4rem; } .rgbw-controller #header .content.bg { background-image: none; } .rgbw-controller #header .bg-first { height: 115vh; width: 100%; -webkit-transform: scale(1.5); transform: scale(1.5); -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; transition: -webkit-transform 2s ease-out; transition: transform 2s ease-out; transition: transform 2s ease-out, -webkit-transform 2s ease-out; top: -30vh; margin-bottom: -20vh; } .rgbw-controller #header .bg-second { height: 115vh; width: 100%; transition: all 2s ease-out; } .rgbw-controller #header.active .bg-first, .rgbw-controller #header.active .bg-second { -webkit-transform: scale(1); transform: scale(1); } .rgbw-controller #header.active .bg-second { opacity: 0; } .rgbw-controller #header.active .content { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .rgbw-controller #magic-of-colors .content { position: absolute; } .rgbw-controller #magic-of-colors .content.wrapper { position: relative !important; } .rgbw-controller #magic-of-colors .magic-slider-wrapper { height: 80px; } .rgbw-controller #universal .content ul { margin: 3rem 0 1rem 0; } .rgbw-controller #universal .content li { width: 33%; } .rgbw-controller #voice-control .content { position: absolute; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .rgbw-controller #voice-control .speech { padding: 10px 35px; max-width: 500px; } .rgbw-controller #voice-control .content.fix { top: 17%; right: 19%; text-align: right; } .rgbw-controller #voice-control .bg { padding-bottom: 50%; } .rgbw-controller #slider .interior img { width: 90%; } .rgbw-controller #light-temperature .content { position: absolute; color: #444; } .rgbw-controller #light-temperature .content.wrapper { position: relative !important; } .rgbw-controller #light-temperature .slider-wrapper { height: 80px; } .rgbw-controller #app .content { position: absolute; text-align: left; top: 45%; -webkit-transform: translateY(-55%); transform: translateY(-55%); } .rgbw-controller #app .bg { padding-bottom: 70%; } .rgbw-controller #favorite_colors .bg { padding-bottom: 4.5%; margin-bottom: 40px; } .rgbw-controller #scenes .content video { border-radius: 20px; } .rgbw-controller #scenes .content .miniatures ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 40px; } .rgbw-controller #scenes .content .miniatures ul li { list-style: none; display: inline-block; width: 32%; margin-top: 15px; height: auto; position: relative; } .rgbw-controller #scenes .content .miniatures ul li a:link, .rgbw-controller #scenes .content .miniatures ul li a:visited { color: #ffffff; } .rgbw-controller #scenes .content .miniatures ul li span { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .rgbw-controller #scenes .content .miniatures ul li img { opacity: 0.4; width: 100%; height: auto; border-radius: 10px; transition: opacity 500ms; } .rgbw-controller #scenes .content .miniatures ul li a.active span { display: none; } .rgbw-controller #scenes .content .miniatures ul li a.active img { opacity: 1; } .rgbw-controller #color-world .bg { padding-bottom: 39%; } .rgbw-controller #child-room .content { position: relative; } .rgbw-controller #child-room .bg { padding-bottom: 53%; } .rgbw-controller #danger-alarm .content { position: relative; } .rgbw-controller #danger-alarm .bg { padding-bottom: 46%; } .rgbw-controller #expose-trumps .content { position: absolute; } .rgbw-controller #expose-trumps .content hr { display: none; } .rgbw-controller #expose-trumps .bg { padding-bottom: 55%; } .rgbw-controller #light-sources .bg { padding-bottom: 33%; height: 0; } .rgbw-controller #power-metering .content { position: absolute; text-align: left; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .rgbw-controller #power-metering .bg { padding-bottom: 44%; } .rgbw-controller #packshot .container { bottom: 45px; } .rgbw-controller #packshot .bg { padding-bottom: 65%; } .rgbw-controller #parameters .specs-row .drawing { width: 36%; margin-left: 0; -webkit-transform: translateX(0); transform: translateX(0); } } @media (min-width: 992px) { .rgbw-controller #voice-control .content.fix { right: 0; left: -26%; } .rgbw-controller #voice-control .bg { padding-bottom: 40%; } .rgbw-controller #interior .content { position: absolute; text-align: center; color: #444; } .rgbw-controller #interior .content hr { display: none; } .rgbw-controller #interior .content img { width: 400px; left: 40%; -webkit-transform: translateX(-40%) translateY(0); transform: translateX(-40%) translateY(0); height: auto; position: absolute; bottom: -340px; } .rgbw-controller #interior .bg { padding-bottom: 62%; } .rgbw-controller #favorite_colors .bg { margin-bottom: 50px; } .rgbw-controller #expose-trumps .bg { padding-bottom: 45%; } .rgbw-controller #packshot .container h2 { margin-bottom: 25px; } .rgbw-controller #packshot .bg { padding-bottom: 55%; } } @media (min-width: 1200px) { .rgbw-controller footer { background-color: #eeeeee; } .rgbw-controller footer .social { background-color: #eeeeee; } .rgbw-controller #magic-of-colors .content.wrapper { background-color: #1b1b1b; border-radius: 0 0 20px 20px; margin-bottom: 130px; } .rgbw-controller #magic-of-colors .content.wrapper p { color: #ffffff; } .rgbw-controller #magic-of-colors .content.wrapper .col-desktopS-12 { padding-left: 0; padding-right: 0; } .rgbw-controller #magic-of-colors .content .magic-slider-wrapper { border-radius: 10px; height: 50px; background-color: #151515; margin-bottom: 0; } .rgbw-controller #magic-of-colors .slider#al-mobile-slider { width: 85%; } .rgbw-controller #magic-of-colors .bg { padding-bottom: 38%; border-radius: 20px 20px 0 0; } .rgbw-controller #functions .content li { width: 25%; } .rgbw-controller #functions .content li span { padding: 0 15%; } .rgbw-controller #functions .bg { border-radius: 20px; margin-bottom: 50px; } .rgbw-controller #universal .content li { width: 16%; } .rgbw-controller #voice-control .bg { border-radius: 20px; margin-bottom: 70px; } .rgbw-controller #interior .bg { padding-bottom: 52%; border-radius: 20px; margin-bottom: 70px; } .rgbw-controller #slider { padding-bottom: 5.2rem; } .rgbw-controller #light-temperature .content.wrapper { background-color: #1b1b1b; border-radius: 0 0 20px 20px; margin-bottom: 130px; } .rgbw-controller #light-temperature .content.wrapper p { color: #ffffff; } .rgbw-controller #light-temperature .content.wrapper .col-desktopS-12 { padding-left: 0; padding-right: 0; } .rgbw-controller #light-temperature .content .slider-wrapper { border-radius: 10px; height: 50px; background-color: #151515; margin-bottom: 0; } .rgbw-controller #light-temperature .slider#al-mobile-slider { width: 85%; } .rgbw-controller #light-temperature .bg { padding-bottom: 45%; border-radius: 20px 20px 0 0; } .rgbw-controller #app .bg { padding-bottom: 48%; border-radius: 20px; margin-bottom: 130px; } .rgbw-controller #favorite_colors .bg { margin-bottom: 150px; } .rgbw-controller #scenes .content .movie { border-radius: 20px; } .rgbw-controller #scenes .content .miniatures ul { margin-bottom: 100px; } .rgbw-controller #scenes .content .miniatures ul li { width: 16%; } .rgbw-controller #scenes .content .miniatures ul li:hover span { color: transparent; background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048.38%2048.38%22%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill%3Anone%3Bstroke%3A%23ffffff%3Bstroke-miterlimit%3A10%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplay%3C%2Ftitle%3E%3Cpath%20class%3D%22a%22%20d%3D%22M39.45%2C18.75A23.69%2C23.69%2C0%2C1%2C0%2C63.14%2C42.44%2C23.69%2C23.69%2C0%2C0%2C0%2C39.45%2C18.75Zm11.3%2C24.82L34%2C53.24a1.31%2C1.31%2C0%2C0%2C1-2-1.13V32.77a1.31%2C1.31%2C0%2C0%2C1%2C2-1.13L50.75%2C41.3A1.31%2C1.31%2C0%2C0%2C1%2C50.75%2C43.57Z%22%20transform%3D%22translate%28-15.26%20-18.25%29%22%2F%3E%3C%2Fsvg%3E"); width: 40px; height: 40px; } .rgbw-controller #color-world .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100%; background: none; } .rgbw-controller #color-world .content hr { display: none; } .rgbw-controller #color-world .bg { padding-bottom: 33%; border-radius: 20px; margin-bottom: 130px; } .rgbw-controller #color-world #program-box { background-color: #151515; } .rgbw-controller #child-room .content { position: absolute; text-align: center; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); background-color: #0d0d0d; border-radius: 20px; z-index: 0; } .rgbw-controller #child-room .content hr { display: none; } .rgbw-controller #child-room .bg { padding-bottom: 33%; border-radius: 20px; margin-bottom: 150px; } .rgbw-controller #danger-alarm .content { position: absolute; text-align: center; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); background-color: #0d0d0d; border-radius: 20px; z-index: 0; } .rgbw-controller #danger-alarm .content hr { display: none; } .rgbw-controller #danger-alarm .bg { padding-bottom: 33%; border-radius: 20px; margin-bottom: 120px; } .rgbw-controller #expose-trumps .bg { border-radius: 20px; padding-bottom: 46%; margin-bottom: 100px; } .rgbw-controller #light-sources .content { position: relative; } .rgbw-controller #light-sources .content.wrapper { background-color: #1b1b1b; border-radius: 0 0 20px 20px; margin-bottom: 130px; } .rgbw-controller #light-sources .content.wrapper .input-wrapper { display: inline-block; width: 24%; padding: 0 1.5%; } .rgbw-controller #light-sources .content .slider-wrapper-4-lights { margin-bottom: 0; background-color: #151515; } .rgbw-controller #light-sources .bg { border-radius: 20px 20px 0 0; } .rgbw-controller #power-metering .bg { border-radius: 20px; padding-bottom: 34%; } .rgbw-controller #packshot .content { margin-bottom: 50px; } .rgbw-controller #packshot .container { bottom: 25px; } .rgbw-controller #packshot .container h2 { margin-bottom: 35px; } .rgbw-controller #packshot .container img { margin: 40px 0 20px 0; max-width: 450px; } .rgbw-controller #packshot .bg { padding-bottom: 53%; } .rgbw-controller #where-to-buy { width: 100%; max-width: 2560px; } .rgbw-controller #where-to-buy .container-fluid { border-radius: 20px; } .rgbw-controller #where-to-buy .container-fluid h2 { font-size: 2.6rem; } .rgbw-controller #where-to-buy .container-fluid a { padding: 7px 26px 7px 26px; border-radius: 16px / 50%; font-size: 16px; background: #fff; top: -2px; } .rgbw-controller #parameters .specs-section { padding-top: 5rem; margin-top: 5rem; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .rgbw-controller #parameters .specs-section h3 { padding-bottom: 3rem; font-size: 145%; width: 25%; text-align: right; padding-right: 90px; margin-top: 0; } .rgbw-controller #parameters .specs-row-wrapper { width: 75%; } .rgbw-controller #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 10px; width: 100%; } .rgbw-controller #parameters .specs-row .description { width: 30%; font-size: 110%; } .rgbw-controller #parameters .specs-row .value { width: 70%; padding-left: 40px; font-size: 110%; } .rgbw-controller #parameters .specs-row .drawing { width: 33%; } .rgbw-controller #parameters .specs-row .drawing.module { padding-left: 0; } } @media (min-width: 1600px) { .rgbw-controller #header .content { -webkit-transform: scale(1.4) translateY(20px); transform: scale(1.4) translateY(20px); } .rgbw-controller #header.active .content { -webkit-transform: scale(1.6) translateY(0); transform: scale(1.6) translateY(0); } .rgbw-controller #magic-of-colors .slider#magic-mobile-slider { -webkit-transform: translateY(-65%); transform: translateY(-65%); } .rgbw-controller #interior .content img { width: 350px; bottom: -300px; } .rgbw-controller #interior .bg { padding-bottom: 42%; } .rgbw-controller #power-metering .bg { padding-bottom: 34%; } .rgbw-controller #packshot .content { margin-bottom: 100px; } .rgbw-controller #packshot .container { bottom: -20px; } .rgbw-controller #packshot .container h2 { margin-bottom: 45px; } .rgbw-controller #packshot .container img { max-width: 500px; } .rgbw-controller #packshot .bg { padding-bottom: 45%; } .rgbw-controller #parameters .drawing { width: 25%; } } @media (min-width: 2100px) { .rgbw-controller #header .content { -webkit-transform: scale(1.6) translateY(20px); transform: scale(1.6) translateY(20px); } .rgbw-controller #header.active .content { -webkit-transform: scale(1.6) translateY(0); transform: scale(1.6) translateY(0); } .rgbw-controller #magic-of-colors .slider#magic-mobile-slider { -webkit-transform: translateY(-75%); transform: translateY(-75%); } .rgbw-controller #interior .content img { width: 500px; bottom: -420px; } .rgbw-controller #interior .bg { padding-bottom: 42%; } .rgbw-controller #packshot .content { margin-bottom: 150px; } .rgbw-controller #packshot .container { bottom: -20px; } .rgbw-controller #packshot .container h2 { margin-bottom: 65px; } .rgbw-controller #packshot .container img { max-width: 700px; } } .rainbow-controller #rainbow-header .content { position: absolute; padding-top: 4rem; z-index: 1; } .rainbow-controller #rainbow-header .content h1 { font-size: 28px; font-weight: 700; } .rainbow-controller #rainbow-header .content .claim { font-size: 120%; } .rainbow-controller #rainbow-header .homekit { width: 150px; margin-top: 30px; bottom: 20px; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .rainbow-controller #rainbow-header .bg { height: 440px; width: 100%; } .rainbow-controller #device .content { z-index: 1; } .rainbow-controller #device .content h2 br { display: none; } .rainbow-controller #device .content .button { position: relative; display: inline-block; margin: 2.4rem auto 0; padding: 8px 50px; font-size: 110%; color: #fff; background-color: #0090FF; background-image: linear-gradient(to left, rgba(186, 0, 255, 0.7), rgba(0, 144, 255, 0.7)); border-radius: 6px; border: 0; } .rainbow-controller #device .content .button:hover { background: linear-gradient(to right, #0077e6 0%, #a200e6 130%); } .rainbow-controller #device .content .button:focus { outline: 0; } .rainbow-controller #device .bg { padding-bottom: 90%; margin: -2.4rem auto -2.4rem; } .rainbow-controller #homekit-compatible { background-color: #121212; } .rainbow-controller #homekit-compatible .homekit { max-width: 150px; padding-top: 2rem; } .rainbow-controller #millions-of-colors .content { position: relative; z-index: 1; } .rainbow-controller #millions-of-colors .content ul { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 3rem 0 -3rem 0; } .rainbow-controller #millions-of-colors .content li { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; background-repeat: no-repeat; width: 50%; margin-bottom: 5rem; padding: 0 5px; } .rainbow-controller #millions-of-colors .content li img { height: 60px; width: auto; margin-bottom: 1rem; } .rainbow-controller #millions-of-colors .content li span { text-align: center; display: block; width: 100%; } .rainbow-controller #millions-of-colors .bg { padding-bottom: 90%; margin-top: -12rem; } .rainbow-controller #app .appstore { padding-top: 2em; } .rainbow-controller #rainbow-siri .content { position: relative; } .rainbow-controller #rainbow-siri .content .voice-command { color: #5867D4; } .rainbow-controller #rainbow-siri .content .voice-command p { font-size: 26px; font-weight: 700; background: linear-gradient(to right, #00c3e0 0%, #bc00c8 100%); background-clip: border-box; -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-top: 1.4em; padding-bottom: 0; } .rainbow-controller #rainbow-siri .bg { padding-bottom: 50%; } .rainbow-controller #mirror .content { position: relative; background-color: #2b2b2b; } .rainbow-controller #mirror .content img { height: 60px; width: auto; margin-bottom: 15px; margin-top: 13px; } .rainbow-controller #mirror .handle-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .rainbow-controller #mirror .handle-wrapper .switch { position: relative; width: 100%; height: 40px; border-radius: 8px; border: 1px solid #0090ff; cursor: pointer; transition: all 200ms; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; margin: 15px 0 15px 0; max-width: 320px; } .rainbow-controller #mirror .handle-wrapper .switch span:nth-of-type(1) { z-index: 10; color: #ffffff; width: 50%; cursor: pointer; } .rainbow-controller #mirror .handle-wrapper .switch span:nth-of-type(2) { z-index: 10; color: #0090ff; width: 50%; cursor: pointer; } .rainbow-controller #mirror .handle-wrapper .switch .handle { position: absolute; top: 0; height: 100%; width: 50%; z-index: 1; background-color: #0090FF; border-radius: 7px; box-shadow: none; cursor: pointer; transition: all 200ms; -webkit-transform: translateX(0); transform: translateX(0); } .rainbow-controller #mirror .handle-wrapper .switch.active span:nth-of-type(1) { color: #0090ff; } .rainbow-controller #mirror .handle-wrapper .switch.active span:nth-of-type(2) { color: #ffffff; } .rainbow-controller #mirror .handle-wrapper .switch.active .handle { -webkit-transform: translateX(100%); transform: translateX(100%); } .rainbow-controller #mirror .bg { padding-bottom: 66%; } .rainbow-controller #mirror .bg2 { position: absolute; transition: opacity 500ms; margin-left: -5px; opacity: 0; } .rainbow-controller #mirror .bg2.active { opacity: 1; } .rainbow-controller #automatic-scenes .content, .rainbow-controller #danger .content { position: relative; } .rainbow-controller #automatic-scenes .content img, .rainbow-controller #danger .content img { height: 60px; width: auto; margin-bottom: 15px; margin-top: 13px; } .rainbow-controller #automatic-scenes .bg, .rainbow-controller #danger .bg { padding-bottom: 66%; } .rainbow-controller #timer .content { position: relative; background-color: #2b2b2b; } .rainbow-controller #timer .content img { height: 60px; width: auto; margin-bottom: 15px; margin-top: 13px; } .rainbow-controller #timer .bg { padding-bottom: 66%; } .rainbow-controller #timer .bg2 { position: absolute; transition: opacity 500ms; margin-left: -5px; opacity: 0; } .rainbow-controller #timer .bg2.active { opacity: 1; } .rainbow-controller #rainbow-packshot .content { position: relative; } .rainbow-controller #rainbow-packshot .content p { margin-bottom: 20px; } .rainbow-controller #rainbow-packshot .content .find-a-store-custom-button { margin: 0; background: linear-gradient(to right, #0090ff 0%, #ba00ff 130%); } .rainbow-controller #rainbow-packshot .content .find-a-store-custom-button:hover { background: linear-gradient(to right, #0077e6 0%, #a200e6 130%); } .rainbow-controller #rainbow-packshot .bg { padding-bottom: 73%; } @media (min-width: 544px) { .rainbow-controller #rainbow-header .content { padding-top: 5rem; } .rainbow-controller #rainbow-header .content h1 { font-size: 42px; } .rainbow-controller #rainbow-header .content .claim { font-size: 150%; } .rainbow-controller #rainbow-header .bg { height: 600px; } } @media (min-width: 768px) { .rainbow-controller #rainbow-header .content { padding-top: 8rem; } .rainbow-controller #rainbow-header .homekit { width: 200px; bottom: 50px; } .rainbow-controller #rainbow-header .bg { height: 0; padding-bottom: 85%; } .rainbow-controller #device .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 1; text-align: left; } .rainbow-controller #device .content h2 br { display: block; } .rainbow-controller #device .bg { padding-bottom: 45%; margin: 0; } .rainbow-controller #homekit-compatible { height: 240px; } .rainbow-controller #homekit-compatible .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .rainbow-controller #millions-of-colors .content li { width: 25%; } .rainbow-controller #millions-of-colors .bg { padding-bottom: 50%; margin-top: -20rem; } .rainbow-controller #app .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .rainbow-controller #app .bg { padding-bottom: 60%; } .rainbow-controller #rainbow-siri .content { position: absolute; z-index: 1; } .rainbow-controller #rainbow-siri .content .voice-command p { font-size: 30px; } .rainbow-controller #rainbow-siri .bg { padding-bottom: 67%; } } @media (min-width: 992px) { .rainbow-controller #rainbow-header { width: auto; max-width: 2560px; } .rainbow-controller #rainbow-header .content { text-align: left; padding-top: 5rem; } .rainbow-controller #rainbow-header .content h1 { font-size: 32px; } .rainbow-controller #rainbow-header .homekit { position: relative; width: 150px; bottom: unset; margin-top: 20px; left: auto; -webkit-transform: translateX(0); transform: translateX(0); } .rainbow-controller #rainbow-header .bg { padding-bottom: 40%; } .rainbow-controller #device .bg { padding-bottom: 35%; } .rainbow-controller #rainbow-siri .content .voice-command p { font-size: 34px; } .rainbow-controller #rainbow-siri .bg { padding-bottom: 58%; } .rainbow-controller #mirror .bg { padding-bottom: 50%; } .rainbow-controller #automatic-scenes .bg, .rainbow-controller #danger .bg { padding-bottom: 50%; } .rainbow-controller #timer .bg { padding-bottom: 50%; } .rainbow-controller #rainbow-packshot .content .find-a-store-custom-button { margin: 0 0 10px; } .rainbow-controller #rainbow-packshot .bg { padding-bottom: 35%; } } @media (min-width: 1200px) { .rainbow-controller #rainbow-header .content h1 { font-size: 42px; } .rainbow-controller #rainbow-header .content .claim { font-size: 130%; } .rainbow-controller #rainbow-header .bg { padding-bottom: 35%; } .rainbow-controller #homekit-compatible { height: 300px; width: 100%; max-width: 2560px; } .rainbow-controller #homekit-compatible .content { padding-top: 6.2rem; padding-bottom: 6.2rem; } .rainbow-controller #millions-of-colors { width: 100%; max-width: 2560px; padding-bottom: 2em; } .rainbow-controller #millions-of-colors .content { position: absolute; z-index: 1; padding-top: 5.2rem; } .rainbow-controller #millions-of-colors .bg { margin-top: 0; padding-bottom: 54%; } .rainbow-controller #magic-of-colors .content.wrapper { margin-bottom: 100px; } .rainbow-controller #app .bg { padding-bottom: 48%; margin-bottom: 70px; } .rainbow-controller #rainbow-siri .bg { padding-bottom: 50%; border-radius: 20px; margin-bottom: 70px; } .rainbow-controller #scenes .content .miniatures ul { margin-bottom: 90px; } .rainbow-controller #mirror .content { background-color: transparent; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); border-radius: 20px; z-index: 0; text-align: left; padding-left: 4%; } .rainbow-controller #mirror .handle-wrapper { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; text-align: center; } .rainbow-controller #mirror .handle-wrapper .switch { margin: 15px 0 0 0; height: 50px; max-width: 350px; } .rainbow-controller #mirror .handle-wrapper .switch span { font-size: 16px; } .rainbow-controller #mirror .bg { padding-bottom: 36%; border-radius: 20px; margin-bottom: 120px; } .rainbow-controller #mirror .bg2 { width: 100%; height: 100%; } .rainbow-controller #automatic-scenes .content, .rainbow-controller #danger .content { background-color: transparent; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); border-radius: 20px; z-index: 0; text-align: left; } .rainbow-controller #automatic-scenes .bg, .rainbow-controller #danger .bg { padding-bottom: 36%; border-radius: 20px; margin-bottom: 120px; } .rainbow-controller #timer .content { background-color: transparent; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); border-radius: 20px; z-index: 0; text-align: left; padding-left: 4%; } .rainbow-controller #timer .bg { padding-bottom: 36%; border-radius: 20px; margin-bottom: 120px; } .rainbow-controller #timer .bg2 { width: 100%; height: 100%; } .rainbow-controller #danger .bg { margin-bottom: 100px; } .rainbow-controller #light-temperature .content.wrapper { margin-bottom: 70px; } } @media (min-width: 1600px) { .rainbow-controller #rainbow-header .content { padding-top: 9rem; } .rainbow-controller #rainbow-header .content h1 { font-size: 48px; } .rainbow-controller #rainbow-header .content .claim { font-size: 135%; } .rainbow-controller #rainbow-header .homekit { width: 170px; margin-top: 30px; } .rainbow-controller #homekit-compatible { height: 340px; } .rainbow-controller #millions-of-colors .content ul { margin: 3em 0 0 0; } .rainbow-controller #millions-of-colors .content li img { height: 70px; } .rainbow-controller #millions-of-colors .bg { padding-bottom: 47%; } .rainbow-controller #rainbow-siri .content .voice-command p { font-size: 44px; } .rainbow-controller #mirror .content img { height: 70px; margin-bottom: 20px; } .rainbow-controller #mirror .handle-wrapper .switch { margin: 20px 0 0 0; max-width: 420px; } .rainbow-controller #mirror .handle-wrapper .switch span { font-size: 20px; } .rainbow-controller #automatic-scenes .content img, .rainbow-controller #danger .content img { height: 70px; margin-bottom: 18px; } .rainbow-controller #timer .content img { height: 70px; margin-bottom: 20px; } } @media (min-width: 2100px) { .rainbow-controller #rainbow-header .content { padding-top: 12rem; } .rainbow-controller #rainbow-header .content h1 { font-size: 60px; } .rainbow-controller #rainbow-header .content .claim { font-size: 150%; } .rainbow-controller #rainbow-header .homekit { width: 230px; margin-top: 40px; } .rainbow-controller #homekit-compatible { height: 380px; } .rainbow-controller #millions-of-colors .content ul { margin: 5em 0 0 0; } .rainbow-controller #millions-of-colors .content li img { height: 80px; } .rainbow-controller #rainbow-siri .content .voice-command p { font-size: 54px; } .rainbow-controller #rainbow-siri .bg { padding-bottom: 45%; } .rainbow-controller #mirror .content img { height: 90px; margin-bottom: 25px; } .rainbow-controller #mirror .handle-wrapper .switch { margin: 25px 0 0 0; max-width: 480px; height: 55px; } .rainbow-controller #mirror .handle-wrapper .switch span { font-size: 21px; } .rainbow-controller #automatic-scenes .content img, .rainbow-controller #danger .content img { height: 90px; margin-bottom: 25px; } .rainbow-controller #timer .content img { height: 90px; margin-bottom: 25px; } } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE10+ CSS styles go here */ #rainbow-header .homekit { margin-top: 60px !important; } #rainbow-siri .content .voice-command { color: #00c3e0; } #rainbow-siri .content .voice-command p { background: none !important; } } .smart-implant main { margin-top: 0; } .smart-implant section { color: #ffffff; } .smart-implant header.position { position: absolute; z-index: 3; top: 0; } .smart-implant header .brand:after { width: 100vw; } .smart-implant #secondary-nav { color: #444444; top: 52px; z-index: 10; position: absolute; } .smart-implant #header { z-index: 1; height: calc(100vh - 106px); margin-top: 106px; } .smart-implant #header .content { padding-top: 5rem; text-transform: uppercase; } .smart-implant #header .content h1 { padding-bottom: 0; letter-spacing: 5px; margin-right: -10px; } .smart-implant #header .content p { font-size: 1.8rem; } .smart-implant #header .content hr { display: inline-block; width: 120px; } .smart-implant #header .bg { width: 100%; height: 100vh; background-size: cover; } .smart-implant #header .layer { display: none; } .smart-implant #header a { display: block; width: 36px; height: 32px; background-size: contain; position: absolute; z-index: 100; bottom: 30px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-implant #header a span { font-size: 0; color: transparent; text-indent: 20000em; } .smart-implant #systems { z-index: 1; background-color: #ffffff; } .smart-implant #systems .content img { margin-bottom: 2.4rem; } .smart-implant #systems .content .homekit { padding-top: 2.4rem; padding-bottom: 4.8rem; } .smart-implant #systems .content .homekit img { width: 140px; height: auto; } .smart-implant #systems .content .amazon img { margin-top: 2.4rem; margin-bottom: 1rem; } .smart-implant #systems .content .siri { padding-top: 2.4rem; padding-bottom: 4.8rem; } .smart-implant #systems .content .siri img { width: auto; height: 50px; } .smart-implant #systems .content .ifttt { padding-top: 2.4rem; } .smart-implant #systems .content .ifttt img { margin-bottom: 1rem; } .smart-implant #systems .content .zwave img, .smart-implant #systems .content .google img, .smart-implant #systems .content .amazon img, .smart-implant #systems .content .ifttt img { width: auto; height: 50px; } .smart-implant #features { z-index: 1; background-color: #0e193f; margin-bottom: -1px; } .smart-implant #features .content { position: absolute; z-index: 1; } .smart-implant #features .content ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .smart-implant #features .content ul > li { margin: 10px; background-color: rgba(0, 144, 255, 0.1); border-radius: 20px; width: 120px; height: 120px; font-size: 11px; padding: 5px; position: relative; } .smart-implant #features .content ul > li div { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); padding: 0 10px; } .smart-implant #features .content ul > li span { display: block; padding-bottom: 10px; color: #00E7B9; } .smart-implant #features .content ul img { width: 60px; height: 60px; } .smart-implant #features .content .top-light { margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); position: absolute; top: 0; } .smart-implant #features .bg { background-size: cover; height: 680px; } .smart-implant #circuit { z-index: 1; background-color: #1c1f59; margin-bottom: -1px; } .smart-implant #circuit .content h3 { font-size: 1.7em; padding-bottom: 1rem; } .smart-implant #circuit .content p { color: #02c8a5; } .smart-implant #circuit .content img { width: 90%; max-width: 230px; padding-bottom: 2.4rem; } .smart-implant #circuit .content .circuit { margin: 0 auto; } .smart-implant #circuit .content .right-side br { display: none; } .smart-implant #smart-sections-mobile { color: #fff; text-align: center; z-index: 10; } .smart-implant #smart-sections-mobile .content { position: absolute; z-index: 1; top: 0; } .smart-implant #smart-sections-mobile .content .info { background-color: rgba(255, 255, 255, 0.25); border-radius: 15px; text-align: center; color: #ffffff; padding: 20px 25px 20px 70px; position: absolute; left: 50%; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: -webkit-fit-content; width: fit-content; width: -moz-max-content; transition: all 0.3s; } .smart-implant #smart-sections-mobile .content .info span::before { display: inline-block; content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IldhcnN0d2FfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCA3MCA3MCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNzAgNzA7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7ZmlsbDojRkZGRkZGO308L3N0eWxlPjxnIGlkPSJXYXJzdHdhXzFfMV8iPjwvZz48ZyBpZD0iV2Fyc3R3YV8yXzFfIj48L2c+PGcgaWQ9IldhcnN0d2FfNCI+PC9nPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0zNSw1Ni42Yy0xMS45LDAtMjEuNi05LjctMjEuNi0yMS42UzIzLjEsMTMuNCwzNSwxMy40YzExLjksMCwyMS42LDkuNywyMS42LDIxLjZTNDYuOSw1Ni42LDM1LDU2LjZ6IE0zNSwxNC40Yy0xMS40LDAtMjAuNiw5LjMtMjAuNiwyMC42YzAsMTEuNCw5LjMsMjAuNiwyMC42LDIwLjZjMTEuNCwwLDIwLjYtOS4zLDIwLjYtMjAuNkM1NS42LDIzLjYsNDYuNCwxNC40LDM1LDE0LjR6Ii8+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTTMyLjUsMjNjMC0wLjgsMC4yLTEuNCwwLjctMS44YzAuNC0wLjQsMS4xLTAuNiwxLjktMC42YzAuOCwwLDEuNCwwLjIsMS44LDAuNmMwLjQsMC40LDAuNywxLDAuNywxLjhjMCwwLjgtMC4yLDEuNC0wLjcsMS44Yy0wLjQsMC40LTEsMC43LTEuOCwwLjdjLTAuOCwwLTEuNC0wLjItMS45LTAuN0MzMi43LDI0LjMsMzIuNSwyMy43LDMyLjUsMjN6IE0zNy4yLDQ5LjVoLTQuNXYtMjFoNC41VjQ5LjV6Ii8+PC9nPjwvc3ZnPg=="); width: 60px; height: 60px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; left: 10px; } .smart-implant #smart-sections-mobile .content .info:hover { background-color: rgba(255, 255, 255, 0.5); } .smart-implant #smart-sections-mobile .content .col-phoneS-10 { left: -5px; } .smart-implant #smart-sections-mobile .bg img { width: auto; height: 100vh; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-implant #smart-sections-mobile .swiper-pagination-fraction, .smart-implant #smart-sections-mobile .swiper-pagination-custom, .smart-implant #smart-sections-mobile .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 40px; } .smart-implant #smart-sections-mobile .swiper-pagination-bullet { width: 12px; height: 12px; display: inline-block; border-radius: 100%; border: 2px solid #fff; background: transparent; } .smart-implant #smart-sections-mobile .swiper-pagination-bullet-active { opacity: 1; background: #fff; } .smart-implant #smart-sections-mobile .swiper-container { max-height: 100vh; overflow: hidden; width: 100%; margin-left: auto; margin-right: auto; background-color: #ffffff; height: 100vh; } .smart-implant #smart-sections-mobile .swiper-slide { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .smart-implant #smart-sections-mobile .swiper-slide .gate { background-color: #223d6c; } .smart-implant #smart-sections-mobile .swiper-slide .alarm { background-color: #0e7266; } .smart-implant #smart-sections-mobile .swiper-slide .termostat { background-color: #d68a28; } .smart-implant #smart-sections-mobile .swiper-slide .sensors { background-color: #62ad5b; } .smart-implant #smart-sections-mobile .swiper-slide .audio { background-color: #0e3e80; } .smart-implant #smart-sections-mobile .swiper-slide .switch { background-color: #443063; } .smart-implant #smart-sections-mobile .bottom-icons { position: absolute; z-index: 1; top: 62vh; font-weight: 600; } .smart-implant #smart-sections-mobile .bottom-icons span { font-size: 80%; font-weight: 300; } .smart-implant #smart-sections-mobile .bottom-icons ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .smart-implant #smart-sections-mobile .bottom-icons ul > li { margin: 1px 5px; border-radius: 7px; width: 90px; height: 90px; font-size: 11px; position: relative; } .smart-implant #smart-sections-mobile .bottom-icons ul > li div { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .smart-implant #smart-sections-mobile .bottom-icons ul > li div div { display: block; font-weight: 300; position: relative; top: 0; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); left: 50%; width: 100px; } .smart-implant #smart-sections-mobile .bottom-icons ul > li span { font-weight: 600; font-size: 100%; } .smart-implant #smart-sections-mobile .bottom-icons ul img { width: 60px; } .smart-implant #smart-door-txt, .smart-implant #smart-alarm-txt, .smart-implant #smart-heating-txt, .smart-implant #smart-sensors-txt, .smart-implant #smart-audio-txt, .smart-implant #smart-switch-txt { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; opacity: 0; transition: all 0.3s; } .smart-implant #smart-door-txt.active, .smart-implant #smart-alarm-txt.active, .smart-implant #smart-heating-txt.active, .smart-implant #smart-sensors-txt.active, .smart-implant #smart-audio-txt.active, .smart-implant #smart-switch-txt.active { z-index: 99; opacity: 1; } .smart-implant #smart-door-txt .content, .smart-implant #smart-alarm-txt .content, .smart-implant #smart-heating-txt .content, .smart-implant #smart-sensors-txt .content, .smart-implant #smart-audio-txt .content, .smart-implant #smart-switch-txt .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; } .smart-implant #smart-door-txt .close, .smart-implant #smart-alarm-txt .close, .smart-implant #smart-heating-txt .close, .smart-implant #smart-sensors-txt .close, .smart-implant #smart-audio-txt .close, .smart-implant #smart-switch-txt .close { display: block; width: 60px; height: 60px; -webkit-transform: translateX(-50%); transform: translateX(-50%); position: absolute; left: 50%; cursor: pointer; } .smart-implant #smart-door-txt { background-image: linear-gradient(210deg, #3a6594, #223d6c); } .smart-implant #smart-alarm-txt { background-image: linear-gradient(210deg, #139e80, #0a5f54); } .smart-implant #smart-heating-txt { background-image: linear-gradient(210deg, #faae4b, #d58a28); } .smart-implant #smart-sensors-txt { background-image: linear-gradient(210deg, #6abc63, #58A13F); } .smart-implant #smart-audio-txt { background-image: linear-gradient(210deg, #1861c7, #0c356d); } .smart-implant #smart-switch-txt { background-image: linear-gradient(210deg, #693d92, #2f1e4a); } .smart-implant #special-tasks { z-index: 1; background-color: #5796a6; margin-bottom: -1px; } .smart-implant #special-tasks .content h3 { font-size: 1.7em; padding-bottom: 1rem; font-weight: 600; } .smart-implant #special-tasks .content img { width: 100%; max-width: 360px; padding-top: 2.4rem; padding-bottom: 2.4rem; } .smart-implant #special-tasks .content ul { text-align: left; } .smart-implant #special-tasks .content li { padding-bottom: 1.2rem; padding-left: 2rem; text-indent: -1em; } .smart-implant #special-tasks .content li:last-of-type { padding-bottom: 0; } .smart-implant #special-tasks .content li::before { display: inline-block; content: ''; border-radius: 0.5rem; height: 0.5rem; width: 0.5rem; margin-right: 1rem; background-color: #ffffff; } .smart-implant #special-tasks .content .left-side, .smart-implant #special-tasks .content .right-side { background-color: rgba(255, 255, 255, 0.1); border-radius: 10px; padding: 20px; height: -webkit-max-content; height: max-content; margin-bottom: 2rem; } .smart-implant #special-tasks .content .special-task-img { margin: 0 auto; } .smart-implant .section-product-footer { padding-bottom: 0; } .smart-implant .section-product-footer .top .content a { display: block; padding: 8px 22px; border-radius: 0; box-shadow: none; background: none; font-size: initial; font-weight: 400; } .smart-implant .section-product-footer .top .content a:after { content: ""; display: inline-block; width: 6px; height: 6px; border-top: 1px solid #0090FF; border-right: 1px solid #0090FF; background-color: transparent; -webkit-transform: rotate(45deg) translate(-1px, -2px); transform: rotate(45deg) translate(-1px, -2px); } .smart-implant #packshot .content { color: #444444; } .smart-implant #packshot .content img { width: 230vw; margin-left: 52%; -webkit-transform: translateX(-50%); transform: translateX(-50%); margin-top: 20px; } .smart-implant #parameters { color: #444444; margin-top: 104px; } .smart-implant #parameters hr { background-image: linear-gradient(to right, #0090ff, #0090ff); display: inline-block; width: 120px; border: 0; height: 2px; margin-bottom: 15px; } .smart-implant #parameters .specs-section { border-top: 1px solid #e1e1e1; padding-top: 3rem; margin-top: 3rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-wrap: wrap; flex-wrap: wrap; } .smart-implant #parameters .specs-section .specs-row-wrapper { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; } .smart-implant #parameters .specs-section h3 { text-transform: uppercase; padding-bottom: 3rem; margin-top: 2rem; font-size: 150%; } .smart-implant #parameters .clear-divider { border-top: 0; padding-top: 0; margin-top: 0; } .smart-implant #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 16px; } .smart-implant #parameters .specs-row .description { width: 35%; text-align: left; } .smart-implant #parameters .specs-row .value { width: 65%; text-align: left; padding-left: 20px; } .smart-implant #parameters .specs-row .drawing { width: 100%; height: auto; padding-left: 0; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-implant #parameters .specs-row .drawing img { width: auto; height: 220px; margin-bottom: 40px; } .smart-implant #parameters .specs-row .contents { text-align: center; margin-bottom: 40px; } .smart-implant #parameters .specs-row .contents img { margin-bottom: 20px; } @media (min-width: 544px) { .smart-implant #systems .content .google, .smart-implant #systems .content .amazon { padding-top: 2.4rem; } .smart-implant #systems .content .amazon img { margin-top: 0; } .smart-implant #systems .content .ifttt { padding-top: 0; } .smart-implant #smart-sections-mobile .bg-size-cover { background-size: 100vh; } .smart-implant #packshot .content img { width: 170vw; max-width: 880px; } } @media (min-width: 768px) { .smart-implant #header .content { padding-top: 10rem; } .smart-implant #systems .content .homekit { padding-bottom: 2.4rem; } .smart-implant #systems .content .homekit img { margin-top: .5rem; margin-bottom: 2.9rem; width: auto; height: 40px; } .smart-implant #systems .content .alexa { padding-bottom: 2.4rem; } .smart-implant #systems .content .alexa img { margin-top: .5rem; margin-bottom: 2.9rem; width: auto; height: 50px; } .smart-implant #systems .content .siri { padding-bottom: 2.4rem; } .smart-implant #systems .content .siri img { margin-top: 1rem; margin-bottom: 3.4rem; width: auto; height: 40px; } .smart-implant #systems .content .zwave, .smart-implant #systems .content .google, .smart-implant #systems .content .amazon, .smart-implant #systems .content .ifttt { padding-top: 2.4rem; padding-bottom: 2.4rem; } .smart-implant #systems .content .zwave img, .smart-implant #systems .content .google img, .smart-implant #systems .content .amazon img, .smart-implant #systems .content .ifttt img { width: auto; } .smart-implant #features .content ul > li { margin: 15px; } .smart-implant #features .bg { height: 530px; } .smart-implant #smart-sections-mobile .content { margin-top: 52px; } .smart-implant #smart-sections-mobile .bottom-icons { top: 60vh; } .smart-implant #smart-sections-mobile .bottom-icons ul { margin-top: 20px; } .smart-implant .section-product-footer { padding-bottom: 0; } .smart-implant .section-product-footer .top .content h2 { padding-bottom: 2.4rem; } .smart-implant #parameters .specs-row .drawing { width: 36%; margin-left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .smart-implant #parameters .specs-row .drawing img { height: 350px; } } @media (min-width: 992px) { .smart-implant #header a { bottom: 100px; } } @media (min-width: 1200px) { .smart-implant #secondary-nav { top: 64px; } .smart-implant #preheader { height: 129px; background-color: #ffffff; z-index: 2; } .smart-implant #header { height: auto; margin-top: -25px; } .smart-implant #header .bg { background-size: 100%; position: relative; height: 100vh; padding-bottom: 0; background-color: #05071a; } .smart-implant #header .tablet-bg { display: none; } .smart-implant #header .layer { position: absolute; display: block; width: 100%; height: 100%; background: no-repeat center center; background-size: 100%; } .smart-implant #header .content { padding-top: 15rem; } .smart-implant #header .content p { font-size: 2.4rem; letter-spacing: 1px; } .smart-implant #header a { bottom: 130px; } .smart-implant #systems .content { padding: 2.4rem 0; } .smart-implant #systems .content .homekit img { margin-top: .5rem; margin-bottom: 2.9rem; width: auto; height: 60px; } .smart-implant #systems .content .alexa img { margin-top: .5rem; margin-bottom: 2.9rem; width: auto; height: 74px; } .smart-implant #systems .content .siri img { margin-top: .5rem; margin-bottom: 3.9rem; width: auto; height: 64px; } .smart-implant #systems .content .zwave { padding-top: 2.4rem; padding-bottom: 0; } .smart-implant #systems .content .zwave img { width: auto; height: 70px; } .smart-implant #systems .content .google, .smart-implant #systems .content .amazon, .smart-implant #systems .content .ifttt { padding-top: 3rem; padding-bottom: 0; } .smart-implant #systems .content .google img, .smart-implant #systems .content .amazon img, .smart-implant #systems .content .ifttt img { width: auto; height: 70px; } .smart-implant #features .content ul li { margin: 20px; width: 150px; height: 150px; font-size: 1.5rem; } .smart-implant #features .content ul li span { font-size: 80%; } .smart-implant #features .content ul img { width: 50px; height: 50px; } .smart-implant #features .content .top-light { margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-implant #features .bg { height: 680px; } .smart-implant #circuit .content { position: absolute; z-index: 2; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .smart-implant #circuit .content .left-side { text-align: right; padding-right: 2vw; } .smart-implant #circuit .content .right-side { text-align: left; padding-left: 2vw; } .smart-implant #circuit .content .right-side br { display: block; } .smart-implant #circuit .bg img { height: 100vh; padding: 10vh 0; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-implant #special-tasks .content ul { font-size: 1.6rem; } .smart-implant #special-tasks .content h3 { font-size: 2.4rem; padding-bottom: 2.5rem; } .smart-implant #special-tasks .content .left-side, .smart-implant #special-tasks .content .right-side { text-align: left; padding: 30px; } .smart-implant #special-tasks .content .special-task-img { position: absolute; left: 50%; bottom: 60px; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: -1; } .smart-implant #special-tasks .content .special-task-bg { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: -1; } .smart-implant #special-tasks .content .special-task-bg img { width: 1920px; max-width: 1920px; padding: 0; } .smart-implant #special-tasks .content .special-task-top { position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: -1; } .smart-implant #special-tasks .content .special-task-top img { width: 1816px; height: 600px; max-width: 1816px; padding: 0; } .smart-implant #special-tasks .content .feature-box { margin-top: 20px; margin-bottom: 60px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .smart-implant .section-product-footer .top .content { padding-top: 5.6rem; padding-bottom: 5.6rem; } .smart-implant .section-product-footer .top .content span { font-size: 1.8rem; } .smart-implant .section-product-footer .top .content a { top: 0; transition: none; } .smart-implant .section-product-footer .top .content a:hover span { border-bottom: 1px solid #0090FF; } .smart-implant .section-product-footer .top .content a:hover { -webkit-transform: translateY(0); transform: translateY(0); } .smart-implant #packshot .content img { margin-top: 40px; } .smart-implant #smart-door .bg, .smart-implant #smart-alarm .bg, .smart-implant #smart-heating .bg, .smart-implant #smart-sensors .bg, .smart-implant #smart-audio .bg, .smart-implant #smart-switch .bg { background-size: cover; position: absolute; top: 0; z-index: 0; } .smart-implant #smart-door .background, .smart-implant #smart-alarm .background, .smart-implant #smart-heating .background, .smart-implant #smart-sensors .background, .smart-implant #smart-audio .background, .smart-implant #smart-switch .background { position: absolute; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .smart-implant #smart-door .background-image, .smart-implant #smart-alarm .background-image, .smart-implant #smart-heating .background-image, .smart-implant #smart-sensors .background-image, .smart-implant #smart-audio .background-image, .smart-implant #smart-switch .background-image { width: auto; height: 100vh; z-index: 0; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-implant #smart-door .background-image.top, .smart-implant #smart-alarm .background-image.top, .smart-implant #smart-heating .background-image.top, .smart-implant #smart-sensors .background-image.top, .smart-implant #smart-audio .background-image.top, .smart-implant #smart-switch .background-image.top { z-index: 1; } .smart-implant #smart-door .background-image-mask, .smart-implant #smart-alarm .background-image-mask, .smart-implant #smart-heating .background-image-mask, .smart-implant #smart-sensors .background-image-mask, .smart-implant #smart-audio .background-image-mask, .smart-implant #smart-switch .background-image-mask { width: auto; height: 100vh; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-implant #smart-door .smart-implant-animation, .smart-implant #smart-alarm .smart-implant-animation, .smart-implant #smart-heating .smart-implant-animation, .smart-implant #smart-sensors .smart-implant-animation, .smart-implant #smart-audio .smart-implant-animation, .smart-implant #smart-switch .smart-implant-animation { width: 2vh; height: 2.9vh; position: absolute; top: 0; opacity: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-implant #smart-door .content, .smart-implant #smart-alarm .content, .smart-implant #smart-heating .content, .smart-implant #smart-sensors .content, .smart-implant #smart-audio .content, .smart-implant #smart-switch .content { position: absolute; top: 10vh; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 1; opacity: 0; } .smart-implant #smart-door .notification-box, .smart-implant #smart-alarm .notification-box, .smart-implant #smart-heating .notification-box, .smart-implant #smart-sensors .notification-box, .smart-implant #smart-audio .notification-box, .smart-implant #smart-switch .notification-box { position: absolute; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100%; left: 50%; z-index: 1; top: 45%; opacity: 0; } .smart-implant #smart-door .notification, .smart-implant #smart-alarm .notification, .smart-implant #smart-heating .notification, .smart-implant #smart-sensors .notification, .smart-implant #smart-audio .notification, .smart-implant #smart-switch .notification { background-color: rgba(255, 255, 255, 0); border: 1px solid #ffffff; border-radius: 15px; width: 200px; padding: 20px; z-index: 1; text-align: center; position: absolute; left: 12vw; font-size: 80%; } .smart-implant #smart-door #door-svg, .smart-implant #smart-door #alarm-svg, .smart-implant #smart-door #heating-svg, .smart-implant #smart-door #sensors-svg, .smart-implant #smart-door #audio-svg, .smart-implant #smart-door #switch-svg, .smart-implant #smart-alarm #door-svg, .smart-implant #smart-alarm #alarm-svg, .smart-implant #smart-alarm #heating-svg, .smart-implant #smart-alarm #sensors-svg, .smart-implant #smart-alarm #audio-svg, .smart-implant #smart-alarm #switch-svg, .smart-implant #smart-heating #door-svg, .smart-implant #smart-heating #alarm-svg, .smart-implant #smart-heating #heating-svg, .smart-implant #smart-heating #sensors-svg, .smart-implant #smart-heating #audio-svg, .smart-implant #smart-heating #switch-svg, .smart-implant #smart-sensors #door-svg, .smart-implant #smart-sensors #alarm-svg, .smart-implant #smart-sensors #heating-svg, .smart-implant #smart-sensors #sensors-svg, .smart-implant #smart-sensors #audio-svg, .smart-implant #smart-sensors #switch-svg, .smart-implant #smart-audio #door-svg, .smart-implant #smart-audio #alarm-svg, .smart-implant #smart-audio #heating-svg, .smart-implant #smart-audio #sensors-svg, .smart-implant #smart-audio #audio-svg, .smart-implant #smart-audio #switch-svg, .smart-implant #smart-switch #door-svg, .smart-implant #smart-switch #alarm-svg, .smart-implant #smart-switch #heating-svg, .smart-implant #smart-switch #sensors-svg, .smart-implant #smart-switch #audio-svg, .smart-implant #smart-switch #switch-svg { overflow: hidden; position: absolute; margin: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; z-index: 1; top: 0; left: 0; width: 100%; } .smart-implant #smart-door #door-svg svg, .smart-implant #smart-door #alarm-svg svg, .smart-implant #smart-door #heating-svg svg, .smart-implant #smart-door #sensors-svg svg, .smart-implant #smart-door #audio-svg svg, .smart-implant #smart-door #switch-svg svg, .smart-implant #smart-alarm #door-svg svg, .smart-implant #smart-alarm #alarm-svg svg, .smart-implant #smart-alarm #heating-svg svg, .smart-implant #smart-alarm #sensors-svg svg, .smart-implant #smart-alarm #audio-svg svg, .smart-implant #smart-alarm #switch-svg svg, .smart-implant #smart-heating #door-svg svg, .smart-implant #smart-heating #alarm-svg svg, .smart-implant #smart-heating #heating-svg svg, .smart-implant #smart-heating #sensors-svg svg, .smart-implant #smart-heating #audio-svg svg, .smart-implant #smart-heating #switch-svg svg, .smart-implant #smart-sensors #door-svg svg, .smart-implant #smart-sensors #alarm-svg svg, .smart-implant #smart-sensors #heating-svg svg, .smart-implant #smart-sensors #sensors-svg svg, .smart-implant #smart-sensors #audio-svg svg, .smart-implant #smart-sensors #switch-svg svg, .smart-implant #smart-audio #door-svg svg, .smart-implant #smart-audio #alarm-svg svg, .smart-implant #smart-audio #heating-svg svg, .smart-implant #smart-audio #sensors-svg svg, .smart-implant #smart-audio #audio-svg svg, .smart-implant #smart-audio #switch-svg svg, .smart-implant #smart-switch #door-svg svg, .smart-implant #smart-switch #alarm-svg svg, .smart-implant #smart-switch #heating-svg svg, .smart-implant #smart-switch #sensors-svg svg, .smart-implant #smart-switch #audio-svg svg, .smart-implant #smart-switch #switch-svg svg { width: auto !important; height: 100vh !important; } .smart-implant #smart-door .info, .smart-implant #smart-alarm .info, .smart-implant #smart-heating .info, .smart-implant #smart-sensors .info, .smart-implant #smart-audio .info, .smart-implant #smart-switch .info { background-color: rgba(255, 255, 255, 0.25); border-radius: 15px; text-align: center; width: auto; color: #ffffff; padding: 20px 25px 20px 70px; position: absolute; left: 50%; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: translateX(-50%) scale(0.8); transform: translateX(-50%) scale(0.8); margin-top: 10px; transition: all 0.3s; } .smart-implant #smart-door .info span::before, .smart-implant #smart-alarm .info span::before, .smart-implant #smart-heating .info span::before, .smart-implant #smart-sensors .info span::before, .smart-implant #smart-audio .info span::before, .smart-implant #smart-switch .info span::before { display: inline-block; content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IldhcnN0d2FfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHZpZXdCb3g9IjAgMCA3MCA3MCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNzAgNzA7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7ZmlsbDojRkZGRkZGO308L3N0eWxlPjxnIGlkPSJXYXJzdHdhXzFfMV8iPjwvZz48ZyBpZD0iV2Fyc3R3YV8yXzFfIj48L2c+PGcgaWQ9IldhcnN0d2FfNCI+PC9nPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0zNSw1Ni42Yy0xMS45LDAtMjEuNi05LjctMjEuNi0yMS42UzIzLjEsMTMuNCwzNSwxMy40YzExLjksMCwyMS42LDkuNywyMS42LDIxLjZTNDYuOSw1Ni42LDM1LDU2LjZ6IE0zNSwxNC40Yy0xMS40LDAtMjAuNiw5LjMtMjAuNiwyMC42YzAsMTEuNCw5LjMsMjAuNiwyMC42LDIwLjZjMTEuNCwwLDIwLjYtOS4zLDIwLjYtMjAuNkM1NS42LDIzLjYsNDYuNCwxNC40LDM1LDE0LjR6Ii8+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTTMyLjUsMjNjMC0wLjgsMC4yLTEuNCwwLjctMS44YzAuNC0wLjQsMS4xLTAuNiwxLjktMC42YzAuOCwwLDEuNCwwLjIsMS44LDAuNmMwLjQsMC40LDAuNywxLDAuNywxLjhjMCwwLjgtMC4yLDEuNC0wLjcsMS44Yy0wLjQsMC40LTEsMC43LTEuOCwwLjdjLTAuOCwwLTEuNC0wLjItMS45LTAuN0MzMi43LDI0LjMsMzIuNSwyMy43LDMyLjUsMjN6IE0zNy4yLDQ5LjVoLTQuNXYtMjFoNC41VjQ5LjV6Ii8+PC9nPjwvc3ZnPg=="); width: 60px; height: 60px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; left: 10px; } .smart-implant #smart-door .info:hover, .smart-implant #smart-alarm .info:hover, .smart-implant #smart-heating .info:hover, .smart-implant #smart-sensors .info:hover, .smart-implant #smart-audio .info:hover, .smart-implant #smart-switch .info:hover { background-color: rgba(255, 255, 255, 0.5); } .smart-implant #smart-door .iefix, .smart-implant #smart-alarm .iefix, .smart-implant #smart-heating .iefix, .smart-implant #smart-sensors .iefix, .smart-implant #smart-audio .iefix, .smart-implant #smart-switch .iefix { opacity: 0; } .smart-implant #smart-door .reveal-circle, .smart-implant #smart-alarm .reveal-circle, .smart-implant #smart-heating .reveal-circle, .smart-implant #smart-sensors .reveal-circle, .smart-implant #smart-audio .reveal-circle, .smart-implant #smart-switch .reveal-circle { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; height: 100vh; opacity: 0; } .smart-implant #smart-door .reveal-content, .smart-implant #smart-alarm .reveal-content, .smart-implant #smart-heating .reveal-content, .smart-implant #smart-sensors .reveal-content, .smart-implant #smart-audio .reveal-content, .smart-implant #smart-switch .reveal-content { animation: reveal-circle 1000ms 0ms normal ease-out; -webkit-animation: reveal-circle-others 1000ms 0ms normal ease-out; -moz-animation: reveal-circle-others 1000ms 0ms normal ease-out; -o-animation: reveal-circle-others 1000ms 0ms normal ease-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; z-index: 1; opacity: 1; } .smart-implant #smart-door .button-replay, .smart-implant #smart-alarm .button-replay, .smart-implant #smart-heating .button-replay, .smart-implant #smart-sensors .button-replay, .smart-implant #smart-audio .button-replay, .smart-implant #smart-switch .button-replay { position: absolute; display: none; bottom: 35px; left: calc(50% + 14px); -webkit-transform: translateX(-50%); transform: translateX(-50%); opacity: 0; z-index: 90; } .smart-implant #smart-door .button-replay:hover, .smart-implant #smart-alarm .button-replay:hover, .smart-implant #smart-heating .button-replay:hover, .smart-implant #smart-sensors .button-replay:hover, .smart-implant #smart-audio .button-replay:hover, .smart-implant #smart-switch .button-replay:hover { opacity: 1 !important; transition: 0.5s all; } .smart-implant #smart-door .reveal-content.reveal-circle, .smart-implant #smart-alarm .reveal-content.reveal-circle, .smart-implant #smart-heating .reveal-content.reveal-circle, .smart-implant #smart-sensors .reveal-content.reveal-circle, .smart-implant #smart-audio .reveal-content.reveal-circle, .smart-implant #smart-switch .reveal-content.reveal-circle { animation-name: reveal-circle; -webkit-animation-name: reveal-circle-others; -moz-animation-name: reveal-circle-others; -o-animation-name: reveal-circle-others; } @-webkit-keyframes reveal-circle-others { from { -webkit-clip-path: circle(0vmax); clip-path: circle(0vmax); } to { -webkit-clip-path: circle(100vmax); clip-path: circle(100vmax); } } @keyframes reveal-circle-others { from { -webkit-clip-path: circle(0vmax); clip-path: circle(0vmax); } to { -webkit-clip-path: circle(100vmax); clip-path: circle(100vmax); } } .smart-implant #smart-door { background-color: #345990; } .smart-implant #smart-door .before { width: 50%; height: 100vh; background-color: #305286; position: absolute; top: 0; left: 0; z-index: 0; } .smart-implant #smart-door .after { width: 50%; height: 100vh; background-color: #305286; position: absolute; top: 0; right: 0; z-index: 0; } .smart-implant #smart-alarm { background-color: #26867A; } .smart-implant #smart-alarm .before { width: 50%; height: 100vh; background-color: #0E7265; position: absolute; top: 0; left: 0; z-index: 0; } .smart-implant #smart-alarm .after { width: 50%; height: 100vh; background-color: #0E7265; position: absolute; top: 0; right: 0; z-index: 0; } .smart-implant #smart-alarm .alarm { opacity: 0; } .smart-implant #smart-heating { background-color: #F5A743; } .smart-implant #smart-heating .reveal-content { background-color: #100F0F; } .smart-implant #smart-heating .before { width: 50%; height: 79.37vh; background-color: #D58927; position: absolute; top: 0; left: 0; z-index: 0; } .smart-implant #smart-heating .after { width: 50%; height: 79.37vh; background-color: #D58927; position: absolute; top: 0; right: 0; z-index: 0; } .smart-implant #smart-heating .clock-text-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: absolute; width: 100%; height: 100vh; } .smart-implant #smart-heating .clock-text-wrapper .clock-text { text-align: center; position: absolute; z-index: 1; bottom: calc(35vh - 52px); -webkit-transform: translateX(-50%); transform: translateX(-50%); left: 81.7%; opacity: 0; } .smart-implant #smart-heating .clock-text-wrapper .clock-text span { font-size: 120%; } .smart-implant #smart-sensors { background-color: #6B9C5B; } .smart-implant #smart-sensors .before { width: 50%; height: 100vh; background-color: #61AD5A; position: absolute; top: 0; left: 0; z-index: 0; } .smart-implant #smart-sensors .after { width: 50%; height: 100vh; background-color: #61AD5A; position: absolute; top: 0; right: 0; z-index: 0; } .smart-implant #smart-audio { background-color: #256AC9; } .smart-implant #smart-audio .before { width: 50%; height: 100vh; background-color: #0E3D7E; position: absolute; top: 0; left: 0; z-index: 0; } .smart-implant #smart-audio .after { width: 50%; height: 100vh; background-color: #0E3D7E; position: absolute; top: 0; right: 0; z-index: 0; } .smart-implant #smart-switch { background-color: #443063; } .smart-implant #smart-switch .before { width: 50%; height: 100vh; background-color: #433062; position: absolute; top: 0; left: 0; z-index: 0; } .smart-implant #smart-switch .after { width: 50%; height: 100vh; background-color: #433062; position: absolute; top: 0; right: 0; z-index: 0; } .smart-implant #smart-switch .smart-implant-animation { width: 4vh; height: 5.8vh; } .smart-implant #smart-switch .bottom-icons { position: absolute; z-index: 1; top: 55vh; font-weight: 600; text-align: center; opacity: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .smart-implant #smart-switch .bottom-icons span { font-size: 80%; font-weight: 300; } .smart-implant #smart-switch .bottom-icons ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 7vh; } .smart-implant #smart-switch .bottom-icons ul > li { margin: 1px 20px; border-radius: 7px; width: 90px; height: 90px; font-size: 90%; position: relative; opacity: 0; } .smart-implant #smart-switch .bottom-icons ul > li:nth-of-type(1) { transition: 1s opacity 250ms; } .smart-implant #smart-switch .bottom-icons ul > li:nth-of-type(2) { transition: 1s opacity 500ms; } .smart-implant #smart-switch .bottom-icons ul > li:nth-of-type(3) { transition: 1s opacity 750ms; } .smart-implant #smart-switch .bottom-icons ul > li:nth-of-type(4) { transition: 1s opacity 1000ms; } .smart-implant #smart-switch .bottom-icons ul > li div { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .smart-implant #smart-switch .bottom-icons ul > li div div { display: block; font-weight: 300; position: relative; top: 10px; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); left: 50%; width: 130px; } .smart-implant #smart-switch .bottom-icons ul > li span { font-weight: 600; font-size: 100%; } .smart-implant #smart-switch .bottom-icons ul img { width: 80px; height: 80px; } .smart-implant #parameters { margin-top: 128px; } .smart-implant #parameters .specs-section { padding-top: 5rem; margin-top: 5rem; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .smart-implant #parameters .specs-section h3 { padding-bottom: 3rem; font-size: 145%; width: 25%; text-align: right; padding-right: 90px; margin-top: 0; } .smart-implant #parameters .specs-row-wrapper { width: 75%; } .smart-implant #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 10px; width: 100%; } .smart-implant #parameters .specs-row .description { width: 30%; font-size: 110%; } .smart-implant #parameters .specs-row .value { width: 70%; padding-left: 40px; font-size: 110%; } .smart-implant #parameters .specs-row .drawing { width: 33%; } .smart-implant #parameters .specs-row .drawing.module { padding-left: 0; } } @media (min-width: 1600px) { .smart-implant #secondary-nav { top: 80px; } .smart-implant #preheader { height: 160px; } .smart-implant #header .content { padding-top: 13rem; } .smart-implant #features .content ul li { margin: 20px; width: 180px; height: 180px; font-size: 1.5rem; } .smart-implant #features .content ul li span { font-size: 100%; } .smart-implant #features .content ul img { width: 80px; height: 80px; } .smart-implant #features .bg { height: 780px; } .smart-implant #circuit .bg img { height: 100vh; } .smart-implant #smart-door .button-replay, .smart-implant #smart-alarm .button-replay, .smart-implant #smart-heating .button-replay, .smart-implant #smart-sensors .button-replay, .smart-implant #smart-audio .button-replay, .smart-implant #smart-switch .button-replay { bottom: 50px; } .smart-implant #smart-door .notification-box { position: absolute; -webkit-transform: translateX(-45%); transform: translateX(-45%); width: 100%; left: 50%; z-index: 1; top: 45%; } .smart-implant #smart-switch .bottom-icons ul { margin-top: 8vh; } .smart-implant #smart-switch .bottom-icons ul > li { width: 140px; height: 140px; } .smart-implant #smart-switch .bottom-icons ul > li div div { width: 160px; } .smart-implant #smart-switch .bottom-icons ul img { width: 100px; height: 100px; } .smart-implant #special-tasks .content img { max-width: 440px; } .smart-implant #special-tasks .content .feature-box { margin-top: 40px; margin-bottom: 90px; } .smart-implant .section-product-footer .top .content { padding-top: 9.6rem; padding-bottom: 9.6rem; } .smart-implant .section-product-footer .top .content span { font-size: 2rem; } .smart-implant #packshot .content img { max-width: 1200px; } .smart-implant #parameters { margin-top: 160px; } .smart-implant #parameters .drawing { width: 25%; } } @media (min-width: 2100px) { .smart-implant #header .content { padding-top: 15rem; } .smart-implant #header .content p { font-size: 3rem; letter-spacing: 1.5px; } .smart-implant #features .content ul li { margin: 25px; width: 240px; height: 240px; font-size: 2rem; } .smart-implant #features .content ul img { width: 100px; } .smart-implant #features .bg { height: 900px; } .smart-implant #circuit .content .left-side, .smart-implant #circuit .content .right-side { padding-right: 0; padding-left: 0; } .smart-implant #circuit .container .row { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .smart-implant #circuit .bg img { height: 100vh; } .smart-implant #smart-door .button-replay, .smart-implant #smart-alarm .button-replay, .smart-implant #smart-heating .button-replay, .smart-implant #smart-sensors .button-replay, .smart-implant #smart-audio .button-replay, .smart-implant #smart-switch .button-replay { bottom: 70px; } .smart-implant #smart-switch .bottom-icons ul > li { width: 160px; height: 160px; } .smart-implant #smart-switch .bottom-icons ul > li div div { width: 180px; } .smart-implant #smart-switch .bottom-icons ul img { width: 120px; height: 120px; } .smart-implant #special-tasks .content img { max-width: 560px; } .smart-implant #special-tasks .content .special-task-img { bottom: 10px; } .smart-implant #special-tasks .content .feature-box { margin-top: 50px; margin-bottom: 160px; } .smart-implant .section-product-footer .top .content { padding-top: 11.6rem; padding-bottom: 11.6rem; } .smart-implant #packshot .content img { margin-top: 60px; max-width: 1600px; } } .home-center-2 #placeholder { height: 1px; position: absolute; width: 100%; } .home-center-2 #header-01-mobile .content { z-index: 1; position: absolute; } .home-center-2 #header-01-mobile .content .txt1 { padding-top: 8.4rem; } .home-center-2 #header-01-mobile .content .txt1 p { font-size: 2rem; color: rgba(0, 144, 255, 0.5); } .home-center-2 #header-01-mobile .bg { height: 450px; } .home-center-2 #header-02-mobile { background-color: #f6f6f6; } .home-center-2 #header-02-mobile .content { z-index: 1; } .home-center-2 #header-02-mobile .content .hc2-icons { z-index: 1; } .home-center-2 #header-02-mobile .content .hc2-icons ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .home-center-2 #header-02-mobile .content .hc2-icons ul > li { margin: 1px 25px; border-radius: 7px; width: 80px; height: 130px; position: relative; color: #0090ff; } .home-center-2 #header-02-mobile .content .hc2-icons ul > li div { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .home-center-2 #header-02-mobile .content .hc2-icons ul > li div div { position: absolute; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); left: 50%; width: 140px; } .home-center-2 #header-02-mobile .content .hc2-icons ul img { width: 60px; height: 60px; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .home-center-2 #header-02-mobile .bg { padding-bottom: 50%; } .home-center-2 #header-03-mobile { background-color: #f6f6f6; } .home-center-2 #header-03-mobile .content { z-index: 1; } .home-center-2 #header-03-mobile .bg { padding-bottom: 46%; } .home-center-2 #header-04-mobile { background-color: #f6f6f6; } .home-center-2 #header-04-mobile .content { z-index: 1; } .home-center-2 #header-04-mobile .bg { padding-bottom: 56%; } .home-center-2 #header-05-mobile { background-color: #f6f6f6; } .home-center-2 #header-05-mobile .content { z-index: 1; } .home-center-2 #header-05-mobile .content a { position: relative; } .home-center-2 #header-05-mobile .content a:after { content: ''; display: block; position: absolute; top: 50%; right: -20px; z-index: 2; width: 10px; height: 10px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .home-center-2 #header-05-mobile .bg { padding-bottom: 33%; } .home-center-2 #header-06-mobile { background-color: #f6f6f6; } .home-center-2 #header-06-mobile .content { z-index: 1; } .home-center-2 #header-06-mobile .bg { padding-bottom: 56%; } .home-center-2 #header-06-mobile .bg .hc2-logos { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; padding-top: 6.4rem; } .home-center-2 #header-06-mobile .bg .hc2-logos .z-wave { width: 80px; height: auto; } .home-center-2 #header-06-mobile .bg .hc2-logos .google { width: 110px; height: auto; } .home-center-2 #header-06-mobile .bg .hc2-logos .amazon { width: 130px; height: auto; } .home-center-2 #header-06-mobile .bg .hc2-logos .ifttt { width: 60px; height: auto; margin-bottom: 3rem; } .home-center-2 #secondary-nav .title { font-size: 14px; } .home-center-2 #parameters { color: #444444; margin-top: 104px; } .home-center-2 #parameters hr { background-image: linear-gradient(to right, #0090ff, #0090ff); display: inline-block; width: 120px; border: 0; height: 2px; margin-bottom: 15px; } .home-center-2 #parameters .specs-section { border-top: 1px solid #e1e1e1; padding-top: 3rem; margin-top: 3rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-wrap: wrap; flex-wrap: wrap; } .home-center-2 #parameters .specs-section .specs-row-wrapper { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; } .home-center-2 #parameters .specs-section h3 { text-transform: uppercase; padding-bottom: 3rem; margin-top: 2rem; font-size: 150%; } .home-center-2 #parameters .clear-divider { border-top: 0; padding-top: 0; margin-top: 0; } .home-center-2 #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 16px; } .home-center-2 #parameters .specs-row .description { width: 35%; text-align: left; } .home-center-2 #parameters .specs-row .value { width: 65%; text-align: left; padding-left: 20px; } .home-center-2 #parameters .specs-row .drawing { width: 100%; height: auto; padding-left: 0; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .home-center-2 #parameters .specs-row .drawing img { width: 240px; height: auto; margin-bottom: 40px; } .home-center-2 #parameters .specs-row .contents { text-align: center; margin-bottom: 40px; } .home-center-2 #parameters .specs-row .contents img { margin-bottom: 20px; } .home-center-2 #applications img { margin: 5px 7px; width: 105px; height: 40px; } .home-center-2 #applications .applications { width: 140%; max-width: 1800px; height: auto; margin-left: 50%; -webkit-transform: translateX(-45%); transform: translateX(-45%); margin-bottom: 40px; margin-top: 20px; } .home-center-2 #panels-mobile { background-color: #081834; color: #ffffff; } .home-center-2 #panels-mobile .swiper-container { padding: 3.2rem 0; height: 550px; } .home-center-2 #panels-mobile .bg { border-radius: 10px; width: 84%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); padding-bottom: 56%; box-shadow: 0 22px 15px -18px rgba(0, 0, 0, 0.4); } .home-center-2 #panels-mobile .swiper-pagination-bullets { bottom: 2.2rem; } .home-center-2 #panels-mobile .swiper-pagination-bullet { background: transparent; border: 1px solid #0090ff; opacity: 1; } .home-center-2 #panels-mobile .swiper-pagination-bullet-active { background: #0090ff; border: 1px solid #0090ff; opacity: 1; } .home-center-2 #usecases-mobile .swiper-container { padding: 3.2rem 0; height: 550px; } .home-center-2 #usecases-mobile .bg { border-radius: 10px; width: 84%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); padding-bottom: 56%; box-shadow: 0 22px 15px -18px rgba(0, 0, 0, 0.4); } .home-center-2 #usecases-mobile .swiper-pagination-bullets { bottom: 2.2rem; } .home-center-2 #usecases-mobile .swiper-pagination-bullet { background: transparent; border: 1px solid #0090ff; opacity: 1; } .home-center-2 #usecases-mobile .swiper-pagination-bullet-active { background: #0090ff; border: 1px solid #0090ff; opacity: 1; } .home-center-2 #data-safety { background-color: #03081e; color: #ffffff; } .home-center-2 #data-safety .bg-first { height: 0; width: 100%; padding-bottom: 76%; } .home-center-2 #data-safety .safety-icons { z-index: 1; margin-top: 35px; } .home-center-2 #data-safety .safety-icons ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .home-center-2 #data-safety .safety-icons ul > li { margin: 1px 5px 25px; border-radius: 7px; width: 100px; height: 90px; position: relative; color: #0090ff; } .home-center-2 #data-safety .safety-icons ul > li div { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .home-center-2 #data-safety .safety-icons ul > li div div { position: absolute; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); left: 50%; width: 100px; } .home-center-2 #data-safety .safety-icons ul img { width: 60px; height: 60px; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .home-center-2 #performance { background-color: #03081e; color: #ffffff; } .home-center-2 #performance .bg-first { height: 0; width: 100%; padding-bottom: 58%; } .home-center-2 #performance .safety-icons { z-index: 1; margin-top: 35px; } .home-center-2 #performance .safety-icons ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .home-center-2 #performance .safety-icons ul > li { margin: 1px 5px 45px; border-radius: 7px; width: 110px; height: 90px; position: relative; color: #0090ff; } .home-center-2 #performance .safety-icons ul > li div { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .home-center-2 #performance .safety-icons ul > li div div { position: absolute; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); left: 50%; width: 100px; } .home-center-2 #performance .safety-icons ul img { width: 60px; height: 60px; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .home-center-2 #network .range-icon { width: 50px; height: 50px; } .home-center-2 #network .range-description-mobile { color: #0090FF; } .home-center-2 #network .bg { padding-bottom: 40%; } .home-center-2 #range { background-color: #e7e7e7; } .home-center-2 #range .content { position: relative; } .home-center-2 #range .col-phoneS-12 { z-index: 1; } .home-center-2 #range .bg { height: 0; padding-bottom: 100%; margin: -15px 0 -40px; z-index: -1; } .home-center-2 #range .bg .bg1, .home-center-2 #range .bg .bg2 { position: absolute; top: 0; } .home-center-2 #range .bg .bg2 { display: none; } .home-center-2 #range .switch-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-transform: uppercase; font-size: 120%; margin: 10px 0 0; z-index: 1; } .home-center-2 #range .switch-wrapper span { text-transform: initial; display: block; font-size: smaller; } .home-center-2 #range .double-switch-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .home-center-2 #range .double-switch-wrapper .switch { width: 230px; height: 40px; border-radius: 20px/50%; background-color: #ffffff; cursor: pointer; transition: all 200ms; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; } .home-center-2 #range .double-switch-wrapper .switch span:nth-of-type(1) { z-index: 10; color: #0090ff; margin-left: 36px; } .home-center-2 #range .double-switch-wrapper .switch span:nth-of-type(2) { z-index: 10; color: #ffffff; margin-left: 92px; } .home-center-2 #range .double-switch-wrapper .switch .handle { position: absolute; top: 4px; left: 4px; height: 32px; width: 100px; z-index: 1; background-color: #0090FF; border-radius: 25px; box-shadow: none; cursor: pointer; transition: all 200ms; -webkit-transform: translateX(122px); transform: translateX(122px); } .home-center-2 #range .double-switch-wrapper .switch.active span:nth-of-type(1) { color: #ffffff; } .home-center-2 #range .double-switch-wrapper .switch.active span:nth-of-type(2) { color: #0090ff; } .home-center-2 #range .double-switch-wrapper .switch.active .handle { -webkit-transform: translateX(0); transform: translateX(0); } .home-center-2 #range .switch { position: relative; display: block; width: 60px; height: 30px; margin-left: 25px; margin-right: 25px; } .home-center-2 #range .switch .track { display: inline-block; width: 60px; height: 30px; border-radius: 15px/50%; background-color: #0090FF; cursor: pointer; transition: all 200ms; } .home-center-2 #range .switch .handle { position: absolute; top: 2px; left: 2px; height: 26px; width: 26px; background-color: #fff; border-radius: 50%; box-shadow: 0 1px 2px #6e6e6e; cursor: pointer; transition: all 200ms; -webkit-transform: translateX(30px); transform: translateX(30px); } .home-center-2 #range .switch.active .handle { box-shadow: 0 1px 2px #0075d0; -webkit-transform: translateX(0); transform: translateX(0); } .home-center-2 #range .switch.active:before { color: #aaaaaa; } .home-center-2 #range .switch.active:after { color: #444444; } .home-center-2 #installer-app .bg { padding-bottom: 38%; } .home-center-2 #specification.section-product-footer { padding-bottom: 0; } .home-center-2 #specification.section-product-footer .top { background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; } .home-center-2 #specification.section-product-footer .top .content h2 { display: block; } .home-center-2 #specification.section-product-footer .top .content a { color: #0090ff; letter-spacing: 0; text-transform: none; font-size: 16px; display: block; padding: 8px 22px; border-radius: 0; box-shadow: none; background: none; font-weight: 400; } .home-center-2 #specification.section-product-footer .top .content a:after { content: ""; display: inline-block; width: 6px; height: 6px; border-top: 1px solid #0090FF; border-right: 1px solid #0090FF; background-color: transparent; -webkit-transform: rotate(45deg) translate(-1px, -2px); transform: rotate(45deg) translate(-1px, -2px); } .home-center-2 #packshot img { width: 100%; height: auto; max-width: 400px; } .home-center-2 #packshot .swiper-container { padding-bottom: 60px; } .home-center-2 #packshot .swiper-pagination-bullets { bottom: 40px; } .home-center-2 #packshot .swiper-pagination-bullet { background: transparent; border: 1px solid #0090ff; opacity: 1; } .home-center-2 #packshot .swiper-pagination-bullet-active { background: #0090ff; border: 1px solid #0090ff; opacity: 1; } .home-center-2 #manuals { background-color: #f6f6f6; } html { overflow-y: scroll; } @media (min-width: 544px) { .home-center-2 #secondary-nav .title { font-size: 16px; } .home-center-2 #parameters .specs-row .drawing img { width: 440px; height: auto; } .home-center-2 #applications img { margin: 15px; width: 135px; height: 40px; } .home-center-2 #applications .badges { margin-bottom: 30px; } .home-center-2 #panels-mobile .swiper-container, .home-center-2 #usecases-mobile .swiper-container { padding: 4.2rem 0; height: 680px; } .home-center-2 #data-safety .bg-first { padding-bottom: 56%; margin-top: -30px; } .home-center-2 #data-safety .safety-icons { z-index: 1; margin-top: 35px; } .home-center-2 #data-safety .safety-icons ul { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .home-center-2 #data-safety .safety-icons ul > li { margin: 1px 5px; width: 130px; height: 130px; } .home-center-2 #data-safety .safety-icons ul > li div div { width: 130px; } .home-center-2 #data-safety .safety-icons ul img { width: 90px; height: 90px; } .home-center-2 #performance .bg-first { padding-bottom: 44%; margin-top: -30px; } .home-center-2 #performance .safety-icons { z-index: 1; margin-top: 35px; } .home-center-2 #performance .safety-icons ul { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .home-center-2 #performance .safety-icons ul > li { margin: 1px 5px; width: 130px; height: 130px; } .home-center-2 #performance .safety-icons ul > li div div { width: 100px; } .home-center-2 #performance .safety-icons ul img { width: 90px; height: 90px; } .home-center-2 #network .bg { padding-bottom: 32.75%; } } @media (min-width: 768px) { .home-center-2 #header-02-mobile .content .hc2-icons ul > li { margin: 1px 20px; } .home-center-2 #header-06-mobile .bg { padding-bottom: 30%; } .home-center-2 #header-06-mobile .bg .hc2-logos .ifttt { width: 65px; height: auto; margin-bottom: 0; } .home-center-2 #parameters .specs-row .drawing img { width: 600px; height: auto; } .home-center-2 #applications .applications { width: 100%; } .home-center-2 #panels-mobile .swiper-container, .home-center-2 #usecases-mobile .swiper-container { padding: 7.2rem 0; height: 660px; } .home-center-2 #panels-mobile .bg, .home-center-2 #usecases-mobile .bg { width: 70%; padding-bottom: 47%; } .home-center-2 #data-safety .bg-first { padding-bottom: 56%; } .home-center-2 #data-safety .safety-icons { margin-top: 65px; } .home-center-2 #data-safety .safety-icons ul > li { width: 160px; } .home-center-2 #data-safety .safety-icons ul > li div div { width: 160px; } .home-center-2 #performance .bg-first { padding-bottom: 44%; } .home-center-2 #performance .safety-icons { margin-top: 65px; } .home-center-2 #performance .safety-icons ul > li { width: 160px; } .home-center-2 #performance .safety-icons ul > li div div { width: 160px; } .home-center-2 #network .bg { padding-bottom: 38.75%; } .home-center-2 #range .bg { height: 500px; width: 500px; padding-bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .home-center-2 #specification.section-product-footer { padding-bottom: 0; } .home-center-2 #specification.section-product-footer .top .content h2 { padding-bottom: 2.4rem; } } @media (min-width: 992px) { .home-center-2 .anim-textcontent h2, .home-center-2 .anim-textcontent h2 + p, .home-center-2 .anim-textcontent .switch-wrapper, .home-center-2 .anim-textcontent .safety-icons, .home-center-2 .anim-textcontent .hc2-icons { position: relative; -webkit-transform: translateY(40px); transform: translateY(40px); } .home-center-2 .anim-textcontent h2 ~ div, .home-center-2 .anim-textcontent .anim { position: relative; opacity: 0; top: 40px; transition: all 750ms 25ms; } .home-center-2 .anim-textcontent h2 { transition: all 750ms; } .home-center-2 .anim-textcontent p, .home-center-2 .anim-textcontent .switch-wrapper, .home-center-2 .anim-textcontent .safety-icons, .home-center-2 .anim-textcontent .hc2-icons { transition: all 750ms 25ms; } .home-center-2 .anim-textcontent.active h2, .home-center-2 .anim-textcontent.active h2 + p, .home-center-2 .anim-textcontent.active .switch-wrapper, .home-center-2 .anim-textcontent.active .safety-icons, .home-center-2 .anim-textcontent.active .hc2-icons { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } .home-center-2 .anim-textcontent.active h2 { transition: all 750ms 50ms; } .home-center-2 .anim-textcontent.active p, .home-center-2 .anim-textcontent.active .switch-wrapper, .home-center-2 .anim-textcontent.active .safety-icons, .home-center-2 .anim-textcontent.active .hc2-icons { transition: all 750ms 25ms; } .home-center-2 .anim-textcontent.active h2 ~ div, .home-center-2 .anim-textcontent.active .anim { opacity: 1; top: 0; transition: all 750ms; } .home-center-2 .anim-textcontent.active .anim-delay-1 { transition: all 1000ms 1000ms; } .home-center-2 #header-01-mobile .content .txt1 { padding-top: 18.4rem; } .home-center-2 #header-01-mobile .bg { height: 670px; } .home-center-2 #header-02-mobile .bg { padding-bottom: 30%; } .home-center-2 #header-03-mobile .bg { padding-bottom: 35%; } .home-center-2 #header-04-mobile .bg { padding-bottom: 40%; } .home-center-2 #applications .applications { width: 90%; height: auto; margin-left: 50%; -webkit-transform: translateX(-45%); transform: translateX(-45%); margin-bottom: 20px; margin-top: 20px; } .home-center-2 #applications .badges { margin: 15px 0 0; } .home-center-2 #panels-desktop .left-side { width: 50%; height: 600px; position: absolute; overflow: hidden; } .home-center-2 #panels-desktop .left-side .image { position: absolute; width: 200%; height: 100%; background-position: center left; background-repeat: no-repeat; background-size: contain; } .home-center-2 #panels-desktop .left-side .slide1, .home-center-2 #panels-desktop .left-side .slide2, .home-center-2 #panels-desktop .left-side .slide3, .home-center-2 #panels-desktop .left-side .slide4 { opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2); -webkit-transform-origin: top center; transform-origin: top center; } .home-center-2 #panels-desktop .left-side .slide1.active, .home-center-2 #panels-desktop .left-side .slide2.active, .home-center-2 #panels-desktop .left-side .slide3.active, .home-center-2 #panels-desktop .left-side .slide4.active { opacity: 1; -webkit-transform: scale(1); transform: scale(1); transition: opacity 0ms, -webkit-transform 800ms ease-out; transition: transform 800ms ease-out, opacity 0ms; transition: transform 800ms ease-out, opacity 0ms, -webkit-transform 800ms ease-out; } .home-center-2 #panels-desktop .right-side { width: 50%; height: 600px; margin-left: 50%; background-color: #f6f6f6; } .home-center-2 #panels-desktop .bg { position: absolute; } .home-center-2 #panels-desktop .content { padding-top: 4rem; } .home-center-2 #panels-desktop .tab { position: relative; width: 100%; } .home-center-2 #panels-desktop .tab input { left: 0; position: absolute; top: 0; z-index: -999; opacity: 0; } .home-center-2 #panels-desktop .tab label { color: #a6a6a6; cursor: pointer; display: block; line-height: 1.2; margin: 0.7em 0; text-align: left; font-size: 2.5rem; transition: 0.3s; } .home-center-2 #panels-desktop .tab input:focus + label, .home-center-2 #panels-desktop .tab label:hover { color: #444444; } .home-center-2 #panels-desktop .tab label.active { color: #444444; font-size: 3rem; } .home-center-2 #panels-desktop .tab-content { color: #7e7e7e; max-height: 0; overflow: hidden; transition: all 0.3s ease-out; text-align: left; opacity: 0; } .home-center-2 #panels-desktop .tab input:checked ~ .tab-content { max-height: 300px; opacity: 1; transition: all 0.7s ease-out; } .home-center-2 #panels-desktop .blue-line { content: ""; top: 18px; right: calc(100% + 15px); position: absolute; background-color: #0090ff; width: 0; height: 3px; border-radius: 3px; } .home-center-2 #panels-desktop .blue-line.active { width: 25px; transition: width 0.3s 0.2s; } .home-center-2 #usecases-desktop { overflow: hidden; } .home-center-2 #usecases-desktop .right-side { width: 50%; height: 600px; margin-left: 50%; overflow: hidden; } .home-center-2 #usecases-desktop .right-side .image { position: absolute; width: 100%; height: 100%; background-position: center right; background-repeat: no-repeat; background-size: contain; right: 0; } .home-center-2 #usecases-desktop .right-side .slide1, .home-center-2 #usecases-desktop .right-side .slide2, .home-center-2 #usecases-desktop .right-side .slide3, .home-center-2 #usecases-desktop .right-side .slide4 { opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2); -webkit-transform-origin: top center; transform-origin: top center; } .home-center-2 #usecases-desktop .right-side .slide1.active, .home-center-2 #usecases-desktop .right-side .slide2.active, .home-center-2 #usecases-desktop .right-side .slide3.active, .home-center-2 #usecases-desktop .right-side .slide4.active { opacity: 1; -webkit-transform: scale(1); transform: scale(1); transition: opacity 0ms, -webkit-transform 800ms ease-out; transition: transform 800ms ease-out, opacity 0ms; transition: transform 800ms ease-out, opacity 0ms, -webkit-transform 800ms ease-out; } .home-center-2 #usecases-desktop .left-side { width: 50%; height: 600px; background-color: #f6f6f6; overflow: hidden; position: absolute; z-index: 1; } .home-center-2 #usecases-desktop .bg { position: absolute; } .home-center-2 #usecases-desktop .content { padding-top: 4rem; } .home-center-2 #usecases-desktop .tab { position: relative; width: 100%; } .home-center-2 #usecases-desktop .tab input { left: 0; position: absolute; top: 0; z-index: -999; opacity: 0; } .home-center-2 #usecases-desktop .tab label { color: #a6a6a6; cursor: pointer; display: block; line-height: 1.2; margin: 0.7em 0; text-align: left; font-size: 2.5rem; transition: 0.3s; } .home-center-2 #usecases-desktop .tab input:focus + label, .home-center-2 #usecases-desktop .tab label:hover { color: #444444; } .home-center-2 #usecases-desktop .tab label.active { color: #444444; font-size: 3rem; } .home-center-2 #usecases-desktop .tab-content { color: #7e7e7e; max-height: 0; overflow: hidden; transition: all 0.3s ease-out; text-align: left; opacity: 0; } .home-center-2 #usecases-desktop .tab input:checked ~ .tab-content { max-height: 300px; opacity: 1; transition: all 0.7s ease-out; } .home-center-2 #usecases-desktop .blue-line { content: ""; top: 18px; right: calc(100% + 15px); position: absolute; background-color: #0090ff; width: 0; height: 3px; border-radius: 3px; } .home-center-2 #usecases-desktop .blue-line.active { width: 25px; transition: width 0.3s 0.2s; } .home-center-2 #data-safety .content { position: absolute; z-index: 1; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-center-2 #data-safety .bg-size-cover { background-size: contain; } .home-center-2 #data-safety .bg-first { padding-bottom: 50%; margin-top: 0; left: -80px; } .home-center-2 #data-safety .bg-second { -webkit-animation-name: bg-opacity; animation-name: bg-opacity; -webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .home-center-2 #data-safety .safety-icons { margin-top: 5px; } .home-center-2 #data-safety .safety-icons ul > li { width: 120px; } .home-center-2 #data-safety .safety-icons ul > li div div { width: 120px; } .home-center-2 #data-safety .safety-icons ul img { width: 60px; height: 60px; } .home-center-2 #performance .content { position: absolute; z-index: 1; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .home-center-2 #performance .bg-size-cover { background-size: contain; } .home-center-2 #performance .bg-first { padding-bottom: 50%; margin-top: 0; right: -80px; } .home-center-2 #performance .bg-second { -webkit-animation-name: bg-opacity; animation-name: bg-opacity; -webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .home-center-2 #performance .safety-icons { margin-top: 5px; } .home-center-2 #performance .safety-icons ul > li { width: 120px; } .home-center-2 #performance .safety-icons ul > li div div { width: 110px; } .home-center-2 #performance .safety-icons ul img { width: 60px; height: 60px; } .home-center-2 #network .content { position: absolute; z-index: 1; } .home-center-2 #network .bg { height: 380px; padding-bottom: 0; } .home-center-2 #network .range-icons { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; position: absolute; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; z-index: 1; bottom: 0; width: 100%; right: -10px; } .home-center-2 #network .range-icons .range-description-desktop { color: #0090FF; } .home-center-2 #network .range-icons .range-description-desktop span { display: block; } .home-center-2 #network .range-icons .desc-1 { color: #ff001a; width: 200px; } .home-center-2 #network .range-icons .desc-2 { color: #ff001a; margin-left: 6%; margin-right: 17%; width: 200px; } .home-center-2 #network .range-icons .desc-3 { width: 200px; } .home-center-2 #range h2, .home-center-2 #range p { text-align: left; } .home-center-2 #range video { margin-bottom: -7px; } .home-center-2 #range .content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 1; } .home-center-2 #range .switch-wrapper { margin-left: 51.33333%; -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; } .home-center-2 #range .double-switch-wrapper { margin-left: 48%; -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; } .home-center-2 #range .double-switch-wrapper .switch { width: 300px; } .home-center-2 #range .double-switch-wrapper .switch span:nth-of-type(1) { margin-left: 40px; } .home-center-2 #range .double-switch-wrapper .switch span:nth-of-type(2) { margin-left: 106px; } .home-center-2 #range .double-switch-wrapper .switch .handle { width: 110px; -webkit-transform: translateX(144px); transform: translateX(144px); } .home-center-2 #installer-app .content { position: absolute; z-index: 1; } .home-center-2 #installer-app .bg { padding-bottom: 56%; } .home-center-2 #packshot .content { padding-top: 6rem; } .home-center-2 #packshot img { max-width: initial; display: block; margin-bottom: 40px; } } @media (min-width: 1200px) { .home-center-2 #header-desktop { width: auto; max-width: 2560px; height: calc(100vh - 104px); overflow: hidden; background-color: #000000; } .home-center-2 #header-desktop .buttons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: absolute; top: 50%; right: 10px; z-index: 100; -webkit-transform: translateY(-50%); transform: translateY(-50%); transition: opacity 500ms; opacity: 1; } .home-center-2 #header-desktop .buttons div { color: #7e7e7e; display: inline-block; width: auto; padding: 0 1rem; margin: 0 1rem 2rem; transition: all 500ms; cursor: pointer; } .home-center-2 #header-desktop .buttons div span { background-color: rgba(0, 144, 255, 0.25); border-radius: 17px; width: 12px; height: 12px; display: block; font-size: inherit; } .home-center-2 #header-desktop .buttons div.active span { background-color: #0090ff; } .home-center-2 #header-desktop .content { position: absolute; height: auto; transition: all 1s ease-out 500ms; top: 0; } .home-center-2 #header-desktop .txt1 h1, .home-center-2 #header-desktop .txt2 h1, .home-center-2 #header-desktop .txt3 h1, .home-center-2 #header-desktop .txt4 h1, .home-center-2 #header-desktop .txt5 h1, .home-center-2 #header-desktop .txt6 h1 { font-size: 3.4rem; } .home-center-2 #header-desktop .txt1 { padding-top: 11vh; } .home-center-2 #header-desktop .layer { width: 100%; height: 100%; background-position: bottom center; background-repeat: no-repeat; position: absolute; background-size: cover; } .home-center-2 #header-desktop .stop-scrolling { height: 100%; overflow: hidden; } .home-center-2 #header-desktop .bg2 .content, .home-center-2 #header-desktop .bg3 .content, .home-center-2 #header-desktop .bg4 .content, .home-center-2 #header-desktop .bg5 .content, .home-center-2 #header-desktop .bg6 .content { opacity: 0; -webkit-transform: translateY(40px); transform: translateY(40px); transition: all 0.5s ease-out 0ms; } .home-center-2 #header-desktop .bg2 .content .hc2-icons, .home-center-2 #header-desktop .bg2 .content .hc2-logos, .home-center-2 #header-desktop .bg3 .content .hc2-icons, .home-center-2 #header-desktop .bg3 .content .hc2-logos, .home-center-2 #header-desktop .bg4 .content .hc2-icons, .home-center-2 #header-desktop .bg4 .content .hc2-logos, .home-center-2 #header-desktop .bg5 .content .hc2-icons, .home-center-2 #header-desktop .bg5 .content .hc2-logos, .home-center-2 #header-desktop .bg6 .content .hc2-icons, .home-center-2 #header-desktop .bg6 .content .hc2-logos { opacity: 0; -webkit-transform: translateY(40px); transform: translateY(40px); transition: all 0.5s ease-out 0ms; } .home-center-2 #header-desktop .bg2.active .content, .home-center-2 #header-desktop .bg3.active .content, .home-center-2 #header-desktop .bg4.active .content, .home-center-2 #header-desktop .bg5.active .content, .home-center-2 #header-desktop .bg6.active .content { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); transition: all 1s ease-out 1000ms; } .home-center-2 #header-desktop .bg2.active .content .hc2-icons, .home-center-2 #header-desktop .bg2.active .content .hc2-logos, .home-center-2 #header-desktop .bg3.active .content .hc2-icons, .home-center-2 #header-desktop .bg3.active .content .hc2-logos, .home-center-2 #header-desktop .bg4.active .content .hc2-icons, .home-center-2 #header-desktop .bg4.active .content .hc2-logos, .home-center-2 #header-desktop .bg5.active .content .hc2-icons, .home-center-2 #header-desktop .bg5.active .content .hc2-logos, .home-center-2 #header-desktop .bg6.active .content .hc2-icons, .home-center-2 #header-desktop .bg6.active .content .hc2-logos { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); transition: all 500ms ease-out 1750ms; } .home-center-2 #header-desktop .bg1 .icon-wrapper { position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); bottom: 50px; opacity: 0; } .home-center-2 #header-desktop .bg1 .icon-wrapper .scroll-icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 2em; width: 1.2em; font-size: 22px; color: rgba(255, 255, 255, 0.5); border-radius: 2em; border: solid 2px; transition: .4s; } .home-center-2 #header-desktop .bg1 .icon-wrapper .scroll-icon:hover { background-color: rgba(255, 255, 255, 0.05); color: #fff; } .home-center-2 #header-desktop .bg1 .icon-wrapper .scroll-icon::after { content: ''; width: 5px; height: 5px; background-color: #fff; border-radius: 50%; -webkit-animation: scroll-icon 2.2s infinite cubic-bezier(0.65, 0.05, 0.36, 1); animation: scroll-icon 2.2s infinite cubic-bezier(0.65, 0.05, 0.36, 1); } .home-center-2 #header-desktop .bg1 .bg1-mask { background-color: #000000; width: 100%; height: 99.9%; opacity: 0; } .home-center-2 #header-desktop .bg1 .bg1-image { height: 100%; background-position: bottom center; background-repeat: no-repeat; opacity: 0; transition: all 500ms ease-in; width: auto; position: relative; background-size: contain; } .home-center-2 #header-desktop .bg1 .content { opacity: 0; -webkit-transform: translateY(40px); transform: translateY(40px); } .home-center-2 #header-desktop .bg1 .txt1 { padding-top: 11vh; } .home-center-2 #header-desktop .bg1 .txt1 h1 { font-size: 4.8rem; } .home-center-2 #header-desktop .bg1 .txt1 p { font-size: 3rem; color: rgba(0, 144, 255, 0.5); } .home-center-2 #header-desktop .bg1.active .icon-wrapper { opacity: 1; transition: opacity 1s ease-out 5000ms; } .home-center-2 #header-desktop .bg1.active .bg1-mask { opacity: 1; } .home-center-2 #header-desktop .bg1.active .bg1-image { opacity: 1; transition: all 2000ms ease-in 500ms; } .home-center-2 #header-desktop .bg1.active .content { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); transition: all 1s ease-out 4000ms; } .home-center-2 #header-desktop .bg1.active .txt1 { opacity: 1; } .home-center-2 #header-desktop .bg2 .bg2-mask { width: 102%; height: 100%; opacity: 0; position: absolute; transition: all 500ms ease-in 500ms; -webkit-transform: translateX(-1%); transform: translateX(-1%); background-size: cover; background-color: #F6F6F6; background-position: bottom center; background-repeat: no-repeat; } .home-center-2 #header-desktop .bg2 .bg2-image { height: 100%; background-position: bottom center; background-repeat: no-repeat; transition: opacity 500ms ease-out 500ms, -webkit-transform 500ms ease-out; transition: opacity 500ms ease-out 500ms, transform 500ms ease-out; transition: opacity 500ms ease-out 500ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(1.095) translate(0.1%, -2.7%); transform: scale(1.095) translate(0.1%, -2.7%); opacity: 0; width: auto; position: relative; background-size: contain; } .home-center-2 #header-desktop .bg2 .bg2-image-perspective { width: 100%; height: 100%; background-position: bottom center; background-repeat: no-repeat; position: absolute; transition: opacity 500ms ease-out 500ms, -webkit-transform 500ms ease-out; transition: opacity 500ms ease-out 500ms, transform 500ms ease-out; transition: opacity 500ms ease-out 500ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(1.095) translate(0.1%, -2.7%); transform: scale(1.095) translate(0.1%, -2.7%); opacity: 0; background-size: contain; } .home-center-2 #header-desktop .bg2 .hc2-icons { z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .home-center-2 #header-desktop .bg2 .hc2-icons ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .home-center-2 #header-desktop .bg2 .hc2-icons ul > li { margin: 1px 5px; border-radius: 7px; width: 140px; height: 140px; position: relative; color: #0090ff; } .home-center-2 #header-desktop .bg2 .hc2-icons ul > li div { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .home-center-2 #header-desktop .bg2 .hc2-icons ul > li div div { position: absolute; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); left: 50%; width: 140px; } .home-center-2 #header-desktop .bg2 .hc2-icons ul img { width: 60px; height: 60px; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .home-center-2 #header-desktop .bg2.active .bg2-mask { opacity: 1; transition: all 500ms ease-in; } .home-center-2 #header-desktop .bg2.active .bg2-image { opacity: 1; transition: opacity 500ms ease-out, -webkit-transform 500ms ease-out 1000ms; transition: opacity 500ms ease-out, transform 500ms ease-out 1000ms; transition: opacity 500ms ease-out, transform 500ms ease-out 1000ms, -webkit-transform 500ms ease-out 1000ms; -webkit-transform: scale(1) translateY(0%); transform: scale(1) translateY(0%); } .home-center-2 #header-desktop .bg2.active .bg2-image-perspective { opacity: 1; transition: opacity 500ms ease-out 1000ms, -webkit-transform 500ms ease-out 1000ms; transition: opacity 500ms ease-out 1000ms, transform 500ms ease-out 1000ms; transition: opacity 500ms ease-out 1000ms, transform 500ms ease-out 1000ms, -webkit-transform 500ms ease-out 1000ms; -webkit-transform: scale(1) translateY(0%); transform: scale(1) translateY(0%); } .home-center-2 #header-desktop .bg3 .bg2-mask { width: 100%; height: 100%; opacity: 0; position: absolute; transition: all 0ms ease-in 500ms; background-size: cover; background-color: #F6F6F6; background-position: bottom center; background-repeat: no-repeat; } .home-center-2 #header-desktop .bg3 .bg3-devices { height: 100%; background-position: bottom center; background-repeat: no-repeat; transition: opacity 250ms ease-out 250ms, -webkit-transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(1.3); transform: scale(1.3); opacity: 0; width: auto; position: relative; background-size: contain; } .home-center-2 #header-desktop .bg3 .bg2-image-perspective { width: 100%; height: 100%; background-position: bottom center; background-repeat: no-repeat; position: absolute; transition: opacity 0ms ease-out 500ms, -webkit-transform 500ms ease-out; transition: opacity 0ms ease-out 500ms, transform 500ms ease-out; transition: opacity 0ms ease-out 500ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(1) translateY(0%); transform: scale(1) translateY(0%); opacity: 0; background-size: contain; } .home-center-2 #header-desktop .bg3.active .bg2-mask { opacity: 1; transition: all 0ms ease-in; } .home-center-2 #header-desktop .bg3.active .bg3-devices { opacity: 1; transition: opacity 500ms ease-out, -webkit-transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out, -webkit-transform 650ms ease-out; -webkit-transform: scale(1); transform: scale(1); } .home-center-2 #header-desktop .bg3.active .bg2-image-perspective { opacity: 1; transition: -webkit-transform 650ms ease-out; transition: transform 650ms ease-out; transition: transform 650ms ease-out, -webkit-transform 650ms ease-out; -webkit-transform: scale(0.8) translateY(0%); transform: scale(0.8) translateY(0%); } .home-center-2 #header-desktop .bg4 .bg2-mask { width: 100%; height: 100%; opacity: 0; position: absolute; transition: all 0ms ease-in 500ms; background-size: cover; background-color: #F6F6F6; background-position: bottom center; background-repeat: no-repeat; } .home-center-2 #header-desktop .bg4 .bg3-devices { height: 100%; background-position: bottom center; background-repeat: no-repeat; transition: opacity 250ms ease-out 250ms, -webkit-transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(1); transform: scale(1); opacity: 0; width: auto; position: relative; background-size: contain; } .home-center-2 #header-desktop .bg4 .bg4-logos { height: 100%; background-position: bottom center; background-repeat: no-repeat; transition: opacity 250ms ease-out 250ms, -webkit-transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0; width: auto; position: relative; background-size: contain; } .home-center-2 #header-desktop .bg4 .bg2-image-perspective { width: 100%; height: 100%; background-position: bottom center; background-repeat: no-repeat; position: absolute; transition: opacity 0ms ease-out 500ms, -webkit-transform 500ms ease-out; transition: opacity 0ms ease-out 500ms, transform 500ms ease-out; transition: opacity 0ms ease-out 500ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(0.8) translateY(0%); transform: scale(0.8) translateY(0%); opacity: 0; background-size: contain; } .home-center-2 #header-desktop .bg4.active .bg2-mask { opacity: 1; transition: all 0ms ease-in; } .home-center-2 #header-desktop .bg4.active .bg3-devices { opacity: 1; transition: opacity 500ms ease-out, -webkit-transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out, -webkit-transform 650ms ease-out; -webkit-transform: scale(0.65); transform: scale(0.65); } .home-center-2 #header-desktop .bg4.active .bg4-logos { opacity: 1; transition: opacity 500ms ease-out, -webkit-transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out, -webkit-transform 650ms ease-out; -webkit-transform: scale(1); transform: scale(1); } .home-center-2 #header-desktop .bg4.active .bg2-image-perspective { opacity: 1; transition: -webkit-transform 650ms ease-out; transition: transform 650ms ease-out; transition: transform 650ms ease-out, -webkit-transform 650ms ease-out; -webkit-transform: scale(0.5) translateY(0%); transform: scale(0.5) translateY(0%); } .home-center-2 #header-desktop .bg5 .bg2-mask { width: 100%; height: 100%; opacity: 0; position: absolute; transition: all 0ms ease-in 500ms; background-size: cover; background-color: #F6F6F6; background-position: bottom center; background-repeat: no-repeat; } .home-center-2 #header-desktop .bg5 .bg3-devices { height: 100%; background-position: bottom center; background-repeat: no-repeat; transition: opacity 250ms ease-out 250ms, -webkit-transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(0.65); transform: scale(0.65); opacity: 0; width: auto; position: relative; background-size: contain; } .home-center-2 #header-desktop .bg5 .bg4-logos { height: 100%; background-position: bottom center; background-repeat: no-repeat; transition: opacity 250ms ease-out 250ms, -webkit-transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(1); transform: scale(1); opacity: 0; width: auto; position: relative; background-size: contain; } .home-center-2 #header-desktop .bg5 .bg4-logos-more { height: 100%; background-position: bottom center; background-repeat: no-repeat; transition: opacity 250ms ease-out 250ms, -webkit-transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out; transition: opacity 250ms ease-out 250ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0; width: auto; position: relative; background-size: contain; } .home-center-2 #header-desktop .bg5 .bg2-image-perspective { width: 100%; height: 100%; background-position: bottom center; background-repeat: no-repeat; position: absolute; transition: opacity 0ms ease-out 500ms, -webkit-transform 500ms ease-out; transition: opacity 0ms ease-out 500ms, transform 500ms ease-out; transition: opacity 0ms ease-out 500ms, transform 500ms ease-out, -webkit-transform 500ms ease-out; -webkit-transform: scale(0.5) translateY(0%); transform: scale(0.5) translateY(0%); opacity: 0; background-size: contain; } .home-center-2 #header-desktop .bg5 a { position: relative; } .home-center-2 #header-desktop .bg5 a:after { content: ''; display: block; position: absolute; top: 50%; right: -20px; z-index: 2; width: 10px; height: 10px; border-right: 1px solid #0090ff; border-bottom: 1px solid #0090ff; -webkit-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); transition: all 250ms; } .home-center-2 #header-desktop .bg5.active { z-index: 1; } .home-center-2 #header-desktop .bg5.active .bg2-mask { opacity: 1; transition: all 0ms ease-in; } .home-center-2 #header-desktop .bg5.active .bg3-devices { opacity: 1; transition: opacity 500ms ease-out, -webkit-transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out, -webkit-transform 650ms ease-out; -webkit-transform: scale(0.45); transform: scale(0.45); } .home-center-2 #header-desktop .bg5.active .bg4-logos { opacity: 1; transition: opacity 500ms ease-out, -webkit-transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out, -webkit-transform 650ms ease-out; -webkit-transform: scale(0.7); transform: scale(0.7); } .home-center-2 #header-desktop .bg5.active .bg4-logos-more { opacity: 1; transition: opacity 500ms ease-out, -webkit-transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out; transition: opacity 500ms ease-out, transform 650ms ease-out, -webkit-transform 650ms ease-out; -webkit-transform: scale(1); transform: scale(1); } .home-center-2 #header-desktop .bg5.active .bg2-image-perspective { opacity: 1; transition: -webkit-transform 650ms ease-out; transition: transform 650ms ease-out; transition: transform 650ms ease-out, -webkit-transform 650ms ease-out; -webkit-transform: scale(0.35) translateY(0%); transform: scale(0.35) translateY(0%); } .home-center-2 #header-desktop .bg6 { z-index: 0; transition-property: z-index; transition-duration: 0s; transition-delay: 1s; } .home-center-2 #header-desktop .bg6 .bg6-mask { width: 100%; height: 100%; opacity: 0; position: absolute; transition: opacity 350ms ease-in 750ms, -webkit-transform 750ms ease-out; transition: opacity 350ms ease-in 750ms, transform 750ms ease-out; transition: opacity 350ms ease-in 750ms, transform 750ms ease-out, -webkit-transform 750ms ease-out; background-size: cover; -webkit-transform: scale(2) translate(-0.1%, -8.8%); transform: scale(2) translate(-0.1%, -8.8%); background-position: bottom center; background-repeat: no-repeat; } .home-center-2 #header-desktop .bg6 .hc2-logos { z-index: 1; } .home-center-2 #header-desktop .bg6 .hc2-logos ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .home-center-2 #header-desktop .bg6 .hc2-logos ul li { margin: 0 20px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .z-wave { width: 80px; height: auto; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .google { width: 110px; height: auto; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .amazon { width: 130px; height: auto; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .ifttt { width: 60px; height: auto; } .home-center-2 #header-desktop .bg6.active { z-index: 1; transition-delay: 0s; } .home-center-2 #header-desktop .bg6.active .bg6-mask { opacity: 1; transition: opacity 350ms ease-in, -webkit-transform 1000ms ease-out 350ms; transition: opacity 350ms ease-in, transform 1000ms ease-out 350ms; transition: opacity 350ms ease-in, transform 1000ms ease-out 350ms, -webkit-transform 1000ms ease-out 350ms; -webkit-transform: scale(1) translateY(0%); transform: scale(1) translateY(0%); } .home-center-2 #header-desktop .parent-wrapper { position: relative; width: 100%; height: 100%; } .home-center-2 #header-desktop .parent-wrapper .children { top: 0; position: absolute; width: 100%; height: 100%; } .home-center-2 #parameters { margin-top: 128px; } .home-center-2 #parameters .specs-section { padding-top: 5rem; margin-top: 5rem; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .home-center-2 #parameters .specs-section h3 { padding-bottom: 3rem; font-size: 145%; width: 25%; text-align: right; padding-right: 90px; margin-top: 0; } .home-center-2 #parameters .specs-row-wrapper { width: 75%; } .home-center-2 #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 10px; width: 100%; } .home-center-2 #parameters .specs-row .description { width: 30%; font-size: 110%; } .home-center-2 #parameters .specs-row .value { width: 70%; padding-left: 40px; font-size: 110%; } .home-center-2 #parameters .specs-row .drawing { margin-left: 0; -webkit-transform: translateX(0); transform: translateX(0); width: 100%; } .home-center-2 #parameters .specs-row .drawing img { width: 700px; height: auto; } .home-center-2 #applications img { margin: 15px 25px; width: 165px; height: 50px; } .home-center-2 #applications .badges { margin: 15px 0 30px; } .home-center-2 #panels-desktop .content { padding-top: 9rem; } .home-center-2 #panels-desktop .tab label.active { font-size: 3.2rem; } .home-center-2 #usecases-desktop .content { padding-top: 9rem; } .home-center-2 #usecases-desktop .tab label.active { font-size: 3.2rem; } .home-center-2 #data-safety .bg-size-cover { background-size: cover; } .home-center-2 #data-safety .bg-first { padding-bottom: 46%; left: -40px; } .home-center-2 #performance .bg-size-cover { background-size: cover; } .home-center-2 #performance .bg-first { padding-bottom: 46%; right: -40px; } .home-center-2 #network .bg { height: 460px; padding-bottom: 0; } .home-center-2 #network .range-icons .desc-2 { margin-left: 10%; margin-right: 20%; } .home-center-2 #range .switch-wrapper { margin-left: 59.33333%; } .home-center-2 #range .double-switch-wrapper { margin-left: 57%; } .home-center-2 #range .double-switch-wrapper .switch { width: 300px; } .home-center-2 #range .double-switch-wrapper .switch span:nth-of-type(1) { margin-left: 50px; } .home-center-2 #range .double-switch-wrapper .switch span:nth-of-type(2) { margin-left: 118px; } .home-center-2 #range .double-switch-wrapper .switch .handle { width: 130px; -webkit-transform: translateX(162px); transform: translateX(162px); } .home-center-2 #installer-app .bg { padding-bottom: 0; height: 660px; } .home-center-2 #specification.section-product-footer .top .content { padding-top: 5.6rem; padding-bottom: 5.6rem; } .home-center-2 #specification.section-product-footer .top .content span { font-size: 1.8rem; } .home-center-2 #specification.section-product-footer .top .content a { top: 0; transition: none; } .home-center-2 #specification.section-product-footer .top .content a:hover span { border-bottom: 1px solid #0090FF; } .home-center-2 #packshot .content { padding-top: 7rem; padding-bottom: 7rem; } .home-center-2 #packshot a { margin-bottom: 10px; } .home-center-2 #packshot img { margin-bottom: 40px; margin-top: 20px; } } @media (min-width: 1600px) { .home-center-2 #secondary-nav .title { font-size: 21px; } .home-center-2 #parameters .specs-row .drawing img { width: 500px; } .home-center-2 #header-desktop .content .txt1 { padding-top: 15vh; } .home-center-2 #header-desktop .content .txt1 h1 { font-size: 6.8rem; } .home-center-2 #header-desktop .content .txt1 p { font-size: 4.5rem; } .home-center-2 #header-desktop .bg1 .icon-wrapper { bottom: 100px; } .home-center-2 #header-desktop .bg2 .hc2-icons { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .home-center-2 #header-desktop .bg6 .hc2-logos ul li { margin: 0 30px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .z-wave { width: 100px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .google { width: 130px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .amazon { width: 150px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .ifttt { width: 70px; } .home-center-2 #applications .badges { margin: 20px 0 0; } .home-center-2 #applications img { width: 205px; height: 55px; } .home-center-2 #panels-desktop .left-side { height: 800px; } .home-center-2 #panels-desktop .left-side .image { height: 800px; } .home-center-2 #panels-desktop .right-side { height: 800px; } .home-center-2 #panels-desktop .content { padding-top: 14rem; } .home-center-2 #panels-desktop .tab label { margin: 1em 0; } .home-center-2 #panels-desktop .tab label.active { font-size: 3.5rem; } .home-center-2 #usecases-desktop .right-side { height: 800px; } .home-center-2 #usecases-desktop .right-side .image { height: 800px; } .home-center-2 #usecases-desktop .left-side { height: 800px; } .home-center-2 #usecases-desktop .content { padding-top: 14rem; } .home-center-2 #usecases-desktop .tab label { margin: 1em 0; } .home-center-2 #usecases-desktop .tab label.active { font-size: 3.5rem; } .home-center-2 #data-safety p { margin: 0 50px; } .home-center-2 #data-safety .bg-first { padding-bottom: 36%; left: -40px; } .home-center-2 #data-safety .safety-icons { margin-top: 45px; } .home-center-2 #data-safety .safety-icons ul > li { width: 170px; } .home-center-2 #data-safety .safety-icons ul > li div div { width: 170px; } .home-center-2 #data-safety .safety-icons ul img { width: 90px; height: 90px; } .home-center-2 #performance p { margin: 0 50px; } .home-center-2 #performance .bg-first { padding-bottom: 36%; right: -40px; } .home-center-2 #performance .safety-icons { margin-top: 45px; } .home-center-2 #performance .safety-icons ul > li { width: 170px; } .home-center-2 #performance .safety-icons ul > li div div { width: 170px; } .home-center-2 #performance .safety-icons ul img { width: 90px; height: 90px; } .home-center-2 #network .content p { margin: 0 70px; } .home-center-2 #network .bg { height: 570px; } .home-center-2 #network .range-icons { bottom: 3%; } .home-center-2 #network .range-icons .desc-2 { margin-left: 13%; margin-right: 21%; } .home-center-2 #range .switch-wrapper { margin-top: 50px; } .home-center-2 #installer-app .bg { padding-bottom: 0; height: 830px; } .home-center-2 #specification.section-product-footer .top .content { padding-top: 9.6rem; padding-bottom: 9.6rem; } .home-center-2 #specification.section-product-footer .top .content span { font-size: 2rem; } .home-center-2 #packshot .content { padding-top: 9rem; padding-bottom: 9rem; } .home-center-2 #packshot a { -webkit-transform: scale(1.2); transform: scale(1.2); } .home-center-2 #packshot img { margin-bottom: 20px; margin-top: 30px; } } @media (min-width: 2100px) { .home-center-2 #secondary-nav .title { font-size: 24px; } .home-center-2 #header-desktop .content { margin-top: 7rem; } .home-center-2 #header-desktop .content p { padding: 0 100px 2.4rem; } .home-center-2 #header-desktop .content .txt1 { padding-top: 20vh; } .home-center-2 #header-desktop .content .txt1 h1 { font-size: 7.8rem; } .home-center-2 #header-desktop .content .txt1 p { font-size: 5.2rem; } .home-center-2 #header-desktop .content .txt3, .home-center-2 #header-desktop .content .txt4, .home-center-2 #header-desktop .content .txt5, .home-center-2 #header-desktop .content .txt6 { margin-top: 10rem; } .home-center-2 #header-desktop .bg1 .icon-wrapper { bottom: 100px; } .home-center-2 #header-desktop .bg2 .hc2-icons { margin-top: 40px; } .home-center-2 #header-desktop .bg2 .hc2-icons ul > li { width: 190px; height: 190px; } .home-center-2 #header-desktop .bg2 .hc2-icons ul > li div div { width: 190px; height: 190px; } .home-center-2 #header-desktop .bg2 .hc2-icons ul img { width: 90px; height: 90px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul { margin-top: 50px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul li { margin: 0 50px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .z-wave { width: 150px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .google { width: 180px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .amazon { width: 210px; } .home-center-2 #header-desktop .bg6 .hc2-logos ul .ifttt { width: 100px; } .home-center-2 #parameters { margin-top: 160px; } .home-center-2 #parameters .specs-row .drawing img { width: 700px; } .home-center-2 #applications img { margin: 15px 25px 35px; width: 255px; height: 70px; } .home-center-2 #panels-desktop .left-side { height: 1000px; } .home-center-2 #panels-desktop .left-side .image { height: 1000px; } .home-center-2 #panels-desktop .right-side { height: 1000px; } .home-center-2 #panels-desktop .content { padding-top: 22rem; } .home-center-2 #panels-desktop .tab label { margin: 1.2em 0; } .home-center-2 #panels-desktop .tab label.active { font-size: 3.5rem; } .home-center-2 #usecases-desktop .right-side { height: 1000px; } .home-center-2 #usecases-desktop .right-side .image { height: 1000px; } .home-center-2 #usecases-desktop .left-side { height: 1000px; } .home-center-2 #usecases-desktop .content { padding-top: 22rem; } .home-center-2 #usecases-desktop .tab label { margin: 1.2em 0; } .home-center-2 #usecases-desktop .tab label.active { font-size: 3.5rem; } .home-center-2 #data-safety p { margin: 0 60px; } .home-center-2 #data-safety .safety-icons { margin-top: 65px; } .home-center-2 #data-safety .safety-icons ul > li { width: 170px; } .home-center-2 #data-safety .safety-icons ul > li div div { width: 170px; } .home-center-2 #data-safety .safety-icons ul img { width: 90px; height: 90px; } .home-center-2 #performance p { margin: 0 60px; } .home-center-2 #performance .safety-icons { margin-top: 65px; } .home-center-2 #performance .safety-icons ul > li { width: 170px; } .home-center-2 #performance .safety-icons ul > li div div { width: 170px; } .home-center-2 #performance .safety-icons ul img { width: 90px; height: 90px; } .home-center-2 #applications .applications { width: 80%; margin-bottom: 50px; margin-top: 50px; } .home-center-2 #network .content { padding-top: 13rem; } .home-center-2 #network .content p { margin: 0 180px; } .home-center-2 #network .bg { height: 840px; } .home-center-2 #network .range-icons { bottom: 11%; right: -20px; } .home-center-2 #network .range-icons .desc-2 { margin-left: 15%; margin-right: 24%; } .home-center-2 #range .switch-wrapper { margin-top: 70px; } .home-center-2 #installer-app .bg { padding-bottom: 0; height: 990px; } .home-center-2 #specification.section-product-footer .top .content { padding-top: 11.6rem; padding-bottom: 11.6rem; } .home-center-2 #packshot img { max-width: 1000px; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } } .walli .f-trans { transition: all 0.2s ease-in-out; } .walli .m-trans { transition: all 0.4s ease-in-out; } .walli .s-trans { transition: all 0.6s ease-in-out; } .walli #header { background-color: #1b2139; } .walli #header h1 { color: #ffffff; padding-top: 2.4rem; padding-bottom: 2rem; } .walli #header p { color: #ff734d; font-size: 1.8rem; } .walli #header .bg { width: 100%; padding-bottom: 46%; } .walli #design-mobile { background-color: #111b2c; } .walli #design-mobile .content { padding-bottom: 0; } .walli #design-mobile .section-title { color: rgba(238, 109, 76, 0.05); font-size: 6.5rem; font-weight: 700; text-transform: uppercase; text-align: center; } .walli #design-mobile .swiper-container { height: auto; margin-top: -3rem; } .walli #design-mobile .bg { width: 84%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); padding-bottom: 56%; box-shadow: 0 22px 45px -18px rgba(0, 0, 0, 0.4); } .walli #design-mobile .swiper-pagination-bullets { margin-top: 30px; position: relative; margin-bottom: 10px; } .walli #design-mobile .swiper-pagination-bullet { background: transparent; border: 1px solid #0090ff; opacity: 1; } .walli #design-mobile .swiper-pagination-bullet-active { background: #0090ff; border: 1px solid #0090ff; opacity: 1; } .walli #smart-devices { background-color: #182235; } .walli #smart-devices h2 { color: #ffffff; } .walli #smart-devices p { color: #ff734d; } .walli #smart-devices .wrapper { margin-top: 1rem; } .walli #smart-devices .wrapper .item { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; border: 1px solid rgba(255, 115, 77, 0.2); padding: 20px; margin: 3rem 0; } .walli #smart-devices .wrapper .item .image .bg-img { display: inline-block; width: 100%; height: auto; border: 0; background-size: 400% 400%; -webkit-animation: Gradient 8s ease infinite; animation: Gradient 8s ease infinite; } .walli #smart-devices .wrapper .item .image .bg-img img { width: 100%; height: auto; -webkit-transform: scale(1.1); transform: scale(1.1); } .walli #smart-devices .wrapper .item .image .bg01 { background-image: linear-gradient(to right, #ff1f2b, #ffff26, #00fe80, #01f2ff, #2a3bf8, #ff09f0); } .walli #smart-devices .wrapper .item .image .bg02 { background-image: linear-gradient(to right, #ffff26, #00fe80, #01f2ff, #2a3bf8, #ff09f0, #ff1f2b); } .walli #smart-devices .wrapper .item .image .bg03 { background-image: linear-gradient(to right, #00fe80, #01f2ff, #2a3bf8, #ff09f0, #ff1f2b, #ffff26); } .walli #smart-devices .wrapper .item .image .bg04 { background-image: linear-gradient(to right, #01f2ff, #2a3bf8, #ff09f0, #ff1f2b, #ffff26, #00fe80); } .walli #smart-devices .wrapper .item .image .bg05 { background-image: linear-gradient(to right, #2a3bf8, #ff09f0, #ff1f2b, #ffff26, #00fe80, #01f2ff); } .walli #smart-devices .wrapper .item .description { text-align: left; padding-left: 20px; } .walli #smart-devices .wrapper .item .description p { padding-bottom: 0; } .walli #smart-devices .wrapper .item .description h3 { color: #ffffff; padding-bottom: 2rem; } .walli #smart-devices .wrapper .item .description.mirror { padding-left: 0; padding-right: 20px; } .walli #smart-devices .outer-wrapper { width: 100%; } .walli #functions .wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .walli #functions .wrapper .item { color: #ffffff; background-color: #202841; box-shadow: 0 22px 45px -18px rgba(0, 0, 0, 0.4); margin: 30px 0; padding: 30px 20px; max-width: 300px; min-height: 220px; width: 100%; font-size: 90%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; } .walli #functions .wrapper .item div { padding: 30px 20px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; } .walli #functions .wrapper .item img { width: 130px; height: auto; margin-bottom: 20px; } .walli #functions .wrapper .item p { padding-bottom: 0; } .walli #video .content h2 { padding-bottom: 0; } .walli #video .bg { padding-bottom: 66%; } .walli #wall-sockets { background-image: url("https://www.fibaro.com/wp-content/uploads/sites/5/2018/12/wall-sockets_bg.jpg"); background-repeat: no-repeat; background-position: center top; } .walli #wall-sockets img { width: 100%; height: auto; margin: 10px 0; } .walli #wall-sockets a { color: #444444; text-decoration: underline; } .walli #wall-sockets p { color: #ff734d; } .walli #wall-sockets .asterisk { text-align: left; font-size: 80%; padding-bottom: 0; margin-bottom: -10px; } .walli #wall-sockets .asterisk::before { content: "*"; left: -6px; position: absolute; } .walli #wall-sockets .asterisk2 { text-align: left; font-size: 80%; padding-bottom: 0; margin-bottom: -10px; } .walli #wall-sockets .asterisk2::before { content: "**"; left: -6px; position: absolute; } .walli #usecase-1 .content p, .walli #usecase-2 .content p, .walli #usecase-3 .content p, .walli #usecase-4 .content p, .walli #usecase-5 .content p, .walli #usecase-6 .content p { color: #ff734d; } .walli #usecase-1 .roundit, .walli #usecase-2 .roundit, .walli #usecase-3 .roundit, .walli #usecase-4 .roundit, .walli #usecase-5 .roundit, .walli #usecase-6 .roundit { margin: 1.2rem 0 19rem; } .walli #usecase-1 .hint, .walli #usecase-2 .hint, .walli #usecase-3 .hint, .walli #usecase-4 .hint, .walli #usecase-5 .hint, .walli #usecase-6 .hint { border: 0; color: #ffffff; background-color: #0090ff; position: relative; bottom: -90px; margin-left: 50%; -webkit-transform: translateX(-50%) scale(0); transform: translateX(-50%) scale(0); width: 90%; max-width: 380px; border-radius: 8px; transition: all 500ms ease-in-out; opacity: 0; min-height: 80px; } .walli #usecase-1 .hint figcaption, .walli #usecase-2 .hint figcaption, .walli #usecase-3 .hint figcaption, .walli #usecase-4 .hint figcaption, .walli #usecase-5 .hint figcaption, .walli #usecase-6 .hint figcaption { text-align: left; text-transform: none; line-height: 1.5; } .walli #usecase-1 .hint div, .walli #usecase-2 .hint div, .walli #usecase-3 .hint div, .walli #usecase-4 .hint div, .walli #usecase-5 .hint div, .walli #usecase-6 .hint div { font-size: 90%; line-height: 1.4; } .walli #usecase-1 .hint span, .walli #usecase-2 .hint span, .walli #usecase-3 .hint span, .walli #usecase-4 .hint span, .walli #usecase-5 .hint span, .walli #usecase-6 .hint span { font-size: 110%; padding-top: .6em; } .walli #usecase-1 .hint img, .walli #usecase-2 .hint img, .walli #usecase-3 .hint img, .walli #usecase-4 .hint img, .walli #usecase-5 .hint img, .walli #usecase-6 .hint img { margin-right: 1.4rem; width: 50px !important; max-width: 50px !important; height: 50px !important; max-height: 50px !important; } .walli #usecase-1 .hint-3, .walli #usecase-2 .hint-3, .walli #usecase-3 .hint-3, .walli #usecase-4 .hint-3, .walli #usecase-5 .hint-3, .walli #usecase-6 .hint-3 { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); opacity: 1; } .walli #usecase-1 .device, .walli #usecase-2 .device, .walli #usecase-3 .device, .walli #usecase-4 .device, .walli #usecase-5 .device, .walli #usecase-6 .device { width: 50%; height: auto; margin: -160px 0 20px 0; border-radius: 0; } .walli #usecase-1.active .hint, .walli #usecase-2.active .hint, .walli #usecase-3.active .hint, .walli #usecase-4.active .hint, .walli #usecase-5.active .hint, .walli #usecase-6.active .hint { -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); opacity: 1; } .walli #usecase-2, .walli #usecase-4 { background-color: #f6f6f6; } .walli #usecase-2 .hint, .walli #usecase-4 .hint { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .walli #usecase-2 .hint figcaption, .walli #usecase-4 .hint figcaption { text-align: center; } .walli #usecase-2 .hint div, .walli #usecase-4 .hint div { text-align: center; font-size: 110%; } .walli #usecase-2 .device, .walli #usecase-4 .device { margin: -150px 0 20px 0; } .walli #usecase-3 .hint { border: 1px solid #0090ff; background-color: rgba(0, 144, 255, 0.025); color: #0090FF; } .walli #usecase-3 .hint-2 { border: none; background-color: #0090ff; color: #ffffff; min-height: 90px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .walli #usecase-3 .hint-2 div { text-align: center; font-size: 110%; } .walli #usecase-3 .device { margin: -370px 0 20px 0; } .walli #usecase-3 .roundit { margin: 1.2rem 0 29rem; } .walli #usecase-6 { background-color: #f6f6f6; } .walli #usecase-6 .device { width: 70%; margin: -60px 0 20px 0; } .walli #usecase-6 .roundit { margin: 1.2rem 0 2.4rem; } .walli #voice-control { color: #ffffff; background-color: #12182c; } .walli #voice-control .content { z-index: 1; } .walli #voice-control .content p { color: #ff734d; } .walli #voice-control .content .logos { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .walli #voice-control .content .logos .google img, .walli #voice-control .content .logos .amazon img { width: 100%; height: auto; } .walli #voice-control .content .logos .amazon img { width: 115%; } .walli #voice-control .bg .device-alexa { width: 150%; height: auto; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); position: relative; } .walli #voice-control .bg .device-alexa-glow { width: 150%; height: auto; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); position: absolute; bottom: 26%; } .walli #mobile-app .content p { color: #ff734d; } .walli #mobile-app .content img { width: 100%; height: auto; } .walli #power-metering { background-color: #111b34; } .walli #power-metering h2 { color: #ffffff; } .walli #power-metering p { color: #ff734d; } .walli #power-metering .bg { width: 100%; padding-bottom: 65%; background-position: 0 50%; margin-top: -3rem; } .walli #installer { background-color: #f6f4f1; } .walli #installer .content p { color: #ff734d; } .walli #installer .content .vde { font-size: 120%; font-weight: 400; color: #045b9b; } .walli #installer .content .vde img { width: auto; height: 60px; margin-right: 20px; } .walli #installer .bg { width: 100%; padding-bottom: 55%; background-position: 50% 50%; } .walli #other-devices { background-color: #141a2e; } .walli #other-devices .content h2 { color: #ffffff; } .walli #other-devices .content p { color: #ff734d; } .walli #other-devices .content a { display: inline-block; padding: 10px 32px 10px 32px; border-radius: 25px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5); background: #fff; background-position: center left 22px; background-size: auto 26px; font-size: 90%; -webkit-transform: translateY(70%); transform: translateY(70%); } .walli #other-devices .content a span::after { content: ""; display: inline-block; width: 8px; height: 8px; border-top: 1px solid #0090FF; border-right: 1px solid #0090FF; background-color: transparent; -webkit-transform: rotate(45deg) translate(1px, -2px); transform: rotate(45deg) translate(1px, -2px); } .walli #other-devices .bg { width: 100%; padding-bottom: 55%; background-position: 50% 50%; } .walli #panels-mobile { background-color: #081834; color: #ffffff; } .walli #panels-mobile .swiper-container { padding: 3.2rem 0; height: 550px; } .walli #panels-mobile .bg { border-radius: 10px; width: 84%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); padding-bottom: 56%; box-shadow: 0 22px 15px -18px rgba(0, 0, 0, 0.4); } .walli #panels-mobile .swiper-pagination-bullets { bottom: 2.2rem; } .walli #panels-mobile .swiper-pagination-bullet { background: transparent; border: 1px solid #0090ff; opacity: 1; } .walli #panels-mobile .swiper-pagination-bullet-active { background: #0090ff; border: 1px solid #0090ff; opacity: 1; } .walli #parameters { color: #444444; margin-top: 104px; } .walli #parameters hr { background-image: linear-gradient(to right, #0090ff, #0090ff); display: inline-block; width: 120px; border: 0; height: 2px; margin-bottom: 15px; } .walli #parameters h1 { font-size: 2.8rem; padding-bottom: 0.4rem; } .walli #parameters h2 { padding-bottom: 0.4rem; } .walli #parameters .specs-section { border-top: 1px solid #e1e1e1; padding-top: 3rem; margin-top: 3rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-wrap: wrap; flex-wrap: wrap; } .walli #parameters .specs-section .specs-row-wrapper { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; } .walli #parameters .specs-section h3 { text-transform: uppercase; padding-bottom: 3rem; margin-top: 2rem; font-size: 150%; } .walli #parameters .clear-divider { border-top: 0; padding-top: 0; margin-top: 0; } .walli #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 16px; } .walli #parameters .specs-row .description { width: 35%; text-align: left; } .walli #parameters .specs-row .value { width: 65%; text-align: left; padding-left: 20px; } .walli #parameters .specs-row .value .img { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 5px 0; } .walli #parameters .specs-row .value img { width: auto; height: 50px; margin-right: 10px; } .walli #parameters .specs-row .value.loss_parameters img { width: 100%; height: auto; margin-top: 1rem; } .walli #parameters .specs-row .drawing { width: 100%; height: auto; padding-left: 0; margin-left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .walli #parameters .specs-row .drawing img { width: auto; height: 180px; margin-bottom: 40px; } .walli #parameters .specs-row .contents { text-align: center; margin-bottom: 40px; } .walli #parameters .specs-row .contents img { margin-bottom: 20px; } .walli #parameters .content:last-of-type { padding-bottom: 0; } .walli #parameters .specs-section.package .description { width: 100%; } .walli #back-button .row { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .walli #back-button .back-button { display: inline-block; position: relative; padding: 6px 50px; border-radius: 6px; border: 1px solid #0090ff; color: #0090ff; transition: all 250ms; margin: 20px 0; } .walli #back-button .back-button:hover { background-color: #0090FF; } .walli #back-button .back-button:hover a { color: #ffffff; } .walli #smart-products h1, .walli #non-smart-products h1, .walli #accessories-for-products h1 { font-size: 2.4rem; padding-bottom: 2.4rem; letter-spacing: 0; } .walli #smart-products .items, .walli #non-smart-products .items, .walli #accessories-for-products .items { border-top: 1px solid #e1e1e1; } .walli #smart-products .items .row, .walli #non-smart-products .items .row, .walli #accessories-for-products .items .row { -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; } .walli #smart-products .items .triple img, .walli #non-smart-products .items .triple img, .walli #accessories-for-products .items .triple img { margin-bottom: 15%; } .walli #smart-products .items h3, .walli #non-smart-products .items h3, .walli #accessories-for-products .items h3 { padding-top: 2rem; padding-bottom: 0.5rem; } .walli #smart-products .items p, .walli #non-smart-products .items p, .walli #accessories-for-products .items p { padding-bottom: 0.5rem; font-size: 90%; } .walli #smart-products .items img, .walli #non-smart-products .items img, .walli #accessories-for-products .items img { width: 100%; height: auto; padding: 4rem 1rem 0; } .walli .roundit { display: inline-block; position: relative; border-radius: 50%; width: 240px; height: 0; padding-bottom: 240px; margin: 1.2rem 0 2.4rem; box-shadow: 20px 20px 50px rgba(0, 0, 0, 0.15); } .walli .roundit img { width: 100%; height: auto; border-radius: 50%; } .walli #panels-desktop { color: #FFF; background-color: #263048; } .walli #panels-desktop h2 { position: absolute; top: 2.4rem; z-index: 100; width: 100%; padding: 0 10px; text-align: center; } .walli #panels-desktop .left-side { padding-top: 100px; width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; overflow: hidden; background: #38435e; background: radial-gradient(ellipse at center, #38435e 0%, #1a2139 100%); margin-left: 50%; -webkit-transform: translateX(-48%); transform: translateX(-48%); } .walli #panels-desktop .left-side .mobile-buttons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .walli #panels-desktop .left-side .mobile-buttons button { border: 0; border-radius: 5px; padding: 7px 10px; margin: 10px; background: transparent; color: #ee6d4c; display: -webkit-box; display: -ms-flexbox; display: flex; overflow-wrap: break-word; word-wrap: break-word; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; min-width: 80px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .walli #panels-desktop .left-side .mobile-buttons button.active, .walli #panels-desktop .left-side .mobile-buttons button:hover { background: #ee6d4c; color: #fff; } .walli #panels-desktop .left-side .panels-mobile-description { text-align: center; color: #ee6d4c; margin-bottom: 20px; display: none; } .walli #panels-desktop .left-side .panels-mobile-description.active { display: block; } .walli #panels-desktop .left-side .switch { margin-top: 50px; margin-bottom: 50px; } .walli #panels-desktop .left-side .switch .switch-bg { display: inline-block; width: 100%; height: auto; background-color: red; } .walli #panels-desktop .left-side .switch .switch-bg img { width: 100%; height: auto; opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1); z-index: 100; } .walli #panels-desktop .left-side .switch .switch-bg img.active { opacity: 1; } .walli #panels-desktop .left-side .switch .switch-bg.gradient { background: linear-gradient(to bottom, #02d34c 0%, #02d34c 38%, #ce00ed 71%, #ce00ed 100%); } .walli #panels-desktop .left-side #colorCanvas { display: none; } .walli #panels-desktop .left-side .range-area.active { opacity: 1; display: -webkit-box; display: -ms-flexbox; display: flex; } .walli #panels-desktop .left-side .range-area { padding: 15px; margin-bottom: 20px; width: 100%; background-color: #0c152c; border-radius: 10px; -webkit-transform: scale(1.1); transform: scale(1.1); opacity: 0; display: none; } .walli #panels-desktop .left-side .range-area .range-container { width: 100%; margin: 0 10px; display: -webkit-box; display: -ms-flexbox; display: flex; background-size: 94.5%; background-position: 0; } .walli #panels-desktop .left-side .range-area .range-container .range { margin: 0; padding: 0; width: 100%; min-height: 20px; -webkit-appearance: none; background: transparent; overflow: hidden; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area { position: absolute; height: 30px; width: calc(100% - 70px); top: -16px; margin-left: -10px; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area #range-tooltip { white-space: nowrap; display: inline-block; font-size: 10px; z-index: 100; background: #0091ff; padding: 3px 10px; border-radius: 9px; width: 56px; text-align: center; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area #range-tooltip:after { top: calc(100% - 1px); left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(0, 145, 255, 0); border-top-color: #0091ff; border-width: 7px; margin-left: -8px; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-0 { margin-left: 16%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-1 { margin-left: 24%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-2 { margin-left: 32%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-3 { margin-left: 40%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-4 { margin-left: 49%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-5 { margin-left: 57%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-6 { margin-left: 65%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-7 { margin-left: 73%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-8 { margin-left: 82%; } .walli #panels-desktop .left-side .range-area input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; border: 1px solid #0091ff; height: 20px; width: 20px; border-radius: 10px; background: #ffffff; margin-top: -9px; cursor: pointer; } .walli #panels-desktop .left-side .range-area input[type=range]::-moz-range-thumb { border: 1px solid #0091ff; height: 20px; width: 20px; border-radius: 20px; background: #ffffff; cursor: pointer; } .walli #panels-desktop .left-side .range-area input[type=range]::-ms-thumb { border: 1px solid #0091ff; height: 20px; width: 20px; border-radius: 20px; background: #ffffff; cursor: pointer; } .walli #panels-desktop .left-side .range-area input[type=range]::-webkit-slider-runnable-track { width: 100%; height: 2px; cursor: pointer; background: #323a4c; } .walli #panels-desktop .left-side .range-area input[type=range]::-moz-range-track { width: 100%; height: 2px; cursor: pointer; background: #323a4c; } .walli #panels-desktop .left-side .range-area input[type=range]::-ms-track { width: 100%; height: 2px; cursor: pointer; background: transparent; border-color: transparent; border-width: 10px 0; color: transparent; } .walli #panels-desktop .left-side .range-area input[type=range]:focus::-ms-fill-lower { background: #0091ff; } .walli #panels-desktop .left-side .range-area input[type=range]::-ms-fill-upper { background: #323a4c; } .walli #panels-desktop .left-side .range-area input[type=range]:focus::-ms-fill-upper { background: #323a4c; } .walli #panels-desktop .left-side .range-area input[type=range]:focus { outline: none; } .walli #panels-desktop .left-side .range-area input[type=range]::-ms-track { width: 100%; cursor: pointer; background: transparent; border-color: transparent; color: transparent; } .walli #panels-desktop .left-side .range-area .range-label { font-size: 12px; color: #0091ff; text-align: center; } .walli #panels-desktop .left-side .color-range-area input[type=range]::-webkit-slider-runnable-track { background: linear-gradient(to right, green, yellow, orange, red, indigo, blue, cyan); } .walli #panels-desktop .left-side .color-range-area input[type=range]::-moz-range-track { background: linear-gradient(to right, green, yellow, orange, red, indigo, blue, cyan); } .walli #panels-desktop .left-side .color-range-area input[type=range]:focus::-ms-fill-lower { background: unset; } .walli #panels-desktop .left-side .color-range-area input[type=range]::-ms-fill-upper { background: unset; } .walli #panels-desktop .left-side .color-range-area input[type=range]:focus::-ms-fill-upper { background: unset; } .walli #panels-desktop .left-side .double-switch-area { margin-bottom: 20px; display: none; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .walli #panels-desktop .left-side .double-switch-area span { color: #ed6c4b; margin-left: 10px; } .walli #panels-desktop .left-side .double-switch-area.active { display: -webkit-box; display: -ms-flexbox; display: flex; } .walli #panels-desktop .right-side { background-color: #404b66; background: linear-gradient(to right, #404b66 0%, #263048 100%); } .walli #panels-desktop .bg { position: absolute; } .walli #panels-desktop .tab { position: relative; width: 100%; margin-left: 10px; } .walli #panels-desktop .content { padding-top: 2.4rem; } .walli #panels-desktop .tab input { left: 0; position: absolute; top: 0; z-index: -999; opacity: 0; } .walli #panels-desktop .tab label { color: #0090ff; cursor: pointer; display: block; line-height: 1.2; margin: 0.7em 0; text-align: left; font-size: 2.5rem; transition: 0.3s; } .walli #panels-desktop .tab input:focus + label, .walli #panels-desktop .tab label:hover { color: #FFF; } .walli #panels-desktop .tab label.active { color: #FFF; font-size: 3rem; } .walli #panels-desktop .tab-content { color: #FFF; max-height: 0; overflow: hidden; transition: all 0.3s ease-out; text-align: left; opacity: 0; } .walli #panels-desktop .tab input:checked ~ .tab-content { max-height: 300px; opacity: 1; transition: all 0.7s ease-out; } .walli #panels-desktop .blue-line { content: ""; top: 18px; right: calc(100% + 15px); position: absolute; background-color: #0090ff; width: 0; height: 3px; border-radius: 3px; } .walli #panels-desktop .blue-line.active { width: 25px; transition: width 0.3s 0.2s; } .walli #clicks-desktop { width: 100%; height: 900px; color: #FFF; } .walli #clicks-desktop button:focus { outline: 0; cursor: pointer; } .walli #clicks-desktop .tripleAnimation1.active { -webkit-animation: tripleAnimation1 2s infinite; animation: tripleAnimation1 2s infinite; } .walli #clicks-desktop .tripleAnimation2.active { -webkit-animation: tripleAnimation2 2s infinite; animation: tripleAnimation2 2s infinite; } .walli #clicks-desktop .clickAnimationDimm.active { -webkit-animation: clickAnimationDimm 4s 1; animation: clickAnimationDimm 4s 1; } .walli #clicks-desktop .clickAnimationUp { -webkit-animation: clickAnimationUp 0.7s infinite forwards; animation: clickAnimationUp 0.7s infinite forwards; } .walli #clicks-desktop .clickAnimationDown { -webkit-animation: clickAnimationDown 0.7s infinite forwards; animation: clickAnimationDown 0.7s infinite forwards; } .walli #clicks-desktop .clickMSGAnimation { -webkit-animation: clickMSGAnimation 5s 1; animation: clickMSGAnimation 5s 1; } .walli #clicks-desktop .bg { width: 100%; height: 900px; position: absolute; opacity: 0; background-repeat: no-repeat; } .walli #clicks-desktop .bg.active { opacity: 1; } .walli #clicks-desktop .bg5.active { opacity: 0.5; } .walli #clicks-desktop .content { padding: 0; background-color: #1b2438; } .walli #clicks-desktop .content .container { height: 900px; } .walli #clicks-desktop .content .container .gradient-bg { padding: 50px 0; z-index: 100; position: relative; background: #0f1527; background: linear-gradient(to right, #0f1527 0%, #283147 48%, #0f1527 100%); height: 900px; } .walli #clicks-desktop .content h2 { text-align: center; } .walli #clicks-desktop .content p { font-size: 16px; margin-top: 10px; } .walli #clicks-desktop .content .switchMSG { color: #ee6d4c; font-weight: 400; font-size: 16px; height: 50px; text-align: center; } .walli #clicks-desktop .content .switchMSG .text { text-align: center; position: absolute; width: 100%; opacity: 0; top: 60px; display: none; } .walli #clicks-desktop .content .switchMSG .text.active { display: block; } .walli #clicks-desktop .content .switch { background-repeat: no-repeat; background-size: cover; width: 220px; margin: 0 auto; height: 220px; background-color: #00c000; } .walli #clicks-desktop .content .switch .up, .walli #clicks-desktop .content .switch .down, .walli #clicks-desktop .content .switch .switch-bg { background-repeat: no-repeat; background-size: cover; width: 220px; height: 220px; position: absolute; opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1); } .walli #clicks-desktop .content .switch .up.active, .walli #clicks-desktop .content .switch .down.active, .walli #clicks-desktop .content .switch .switch-bg { opacity: 1; } .walli #clicks-desktop .content .button-area { margin-top: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-wrap: wrap; flex-wrap: wrap; } .walli #clicks-desktop .content .button-area button { background: transparent; color: #0090ff; margin: 10px 5px; font-size: 16px; width: 40%; min-height: 50px; border: 1px solid #0090ff; padding: 5px; border-radius: 5px; letter-spacing: 1px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; overflow-wrap: break-word; word-wrap: break-word; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } .walli #clicks-desktop .content .button-area button.active, .walli #clicks-desktop .content .button-area button:hover { background: #0090ff; color: #FFF; } @media (min-width: 544px) { .walli #header .bg { padding-bottom: 40%; } .walli #smart-devices .wrapper { margin-top: 0; } .walli #smart-devices .wrapper .item { padding: 40px; margin: 4rem 0; } .walli #smart-devices .wrapper .item .description { padding-left: 40px; } .walli #smart-devices .wrapper .item .description h3 { font-size: 140%; } .walli #smart-devices .wrapper .item .description .txt { position: absolute; bottom: 0; } .walli #smart-devices .wrapper .item .description.mirror { padding-right: 40px; } .walli #smart-devices .wrapper .item .description.mirror .txt { padding-right: 40px; } .walli #wall-sockets .asterisk { text-align: center; } .walli #wall-sockets .asterisk::before { content: "*"; left: -2px; position: relative; } .walli #wall-sockets .asterisk2 { text-align: center; } .walli #wall-sockets .asterisk2::before { content: "**"; left: -2px; position: relative; } .walli #design-mobile .swiper-pagination-bullets { margin-top: 40px; margin-bottom: 20px; } .walli #panels-mobile .swiper-container { padding: 4.2rem 0; height: 680px; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-0 { margin-left: 9%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-1 { margin-left: 19%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-2 { margin-left: 29%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-3 { margin-left: 39%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-4 { margin-left: 49%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-5 { margin-left: 60%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-6 { margin-left: 70%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-7 { margin-left: 80%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-8 { margin-left: 90%; } } @media (min-width: 768px) { .walli #design-mobile .section-title { font-size: 14rem; } .walli #design-mobile .swiper-container { margin-top: -7rem; } .walli #panels-desktop { height: 730px; } .walli #panels-desktop h2 { top: 2.4rem; } .walli #panels-desktop .left-side { padding-top: 100px; } .walli #panels-desktop .right-side { padding-top: 150px; } .walli #functions .wrapper .item { margin: 30px 30px; padding: 0 40px; max-width: 310px; min-height: 270px; } .walli #video .content { position: absolute; z-index: 1; } .walli #video .bg { padding-bottom: 60%; } .walli #usecase-1 .content, .walli #usecase-2 .content { padding-top: 4.8rem; padding-bottom: 4.8rem; } .walli #usecase-1 .hint, .walli #usecase-2 .hint { bottom: -130px; } .walli #usecase-1 .roundit, .walli #usecase-2 .roundit { margin: 1.2rem 0 20.4rem; } .walli #usecase-1 .text, .walli #usecase-2 .text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; } .walli #usecase-2 .hint, .walli #usecase-4 .hint, .walli #usecase-5 .hint { width: 70%; } .walli #usecase-2 .device, .walli #usecase-4 .device, .walli #usecase-5 .device { margin: -160px 0 20px 0; } .walli #usecase-3 .hint { bottom: -120px; width: 70%; } .walli #usecase-3 .roundit { margin: 1.2rem 0 32rem; } .walli #usecase-4 .hint, .walli #usecase-5 .hint { bottom: -120px; } .walli #usecase-4 .roundit, .walli #usecase-5 .roundit { margin: 1.2rem 0 21rem; } .walli #usecase-6 .device { margin: -100px 0 20px 0; } .walli #usecase-6 .roundit { margin: 1.2rem 0 6.4rem; } .walli #voice-control .bg .device-alexa { width: 80%; height: auto; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); position: relative; } .walli #voice-control .bg .device-alexa-glow { width: 100%; height: auto; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); position: absolute; bottom: 26%; } .walli #mobile-app .section-title { color: rgba(238, 109, 76, 0.05); font-size: 14rem; font-weight: 700; text-transform: uppercase; text-align: center; position: absolute; top: 7%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .walli #power-metering .content { position: absolute; z-index: 1; } .walli #power-metering .bg { padding-bottom: 65%; margin-top: 0; } .walli #installer .bg { padding-bottom: 45%; } .walli #other-devices .content { position: absolute; z-index: 1; background-color: transparent; } .walli #other-devices .content a { -webkit-transform: translateY(20%); transform: translateY(20%); font-size: 100%; } .walli #other-devices .content a span::after { -webkit-transform: rotate(45deg) translate(1px, -4px); transform: rotate(45deg) translate(1px, -4px); } .walli #other-devices .bg { padding-bottom: 56.25%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-0 { margin-left: 9%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-1 { margin-left: 19%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-2 { margin-left: 29%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-3 { margin-left: 39%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-4 { margin-left: 49%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-5 { margin-left: 60%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-6 { margin-left: 70%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-7 { margin-left: 80%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-8 { margin-left: 90%; } .walli #panels-mobile .swiper-container { padding: 7.2rem 0; height: 660px; } .walli #panels-mobile .bg { width: 70%; padding-bottom: 47%; } .walli #parameters .specs-row .drawing { width: 36%; margin-left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .walli #smart-products .items .triple img, .walli #non-smart-products .items .triple img, .walli #accessories-for-products .items .triple img { margin-bottom: 0; } .walli .roundit { width: 100%; padding-bottom: 100%; margin: 0; } } @media (min-width: 992px) { .walli #header { background-color: transparent; } .walli #header .content { position: absolute; z-index: 1; top: 50%; -webkit-transform: translateY(-110%); transform: translateY(-110%); } .walli #header .bg { padding-bottom: 56%; } .walli #design-mobile .section-title { font-size: 20rem; } .walli #design-mobile .swiper-container { margin-top: -10rem; } .walli #smart-devices .wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 1rem 0; } .walli #smart-devices .wrapper .item { padding: 20px; margin: 0; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; background-color: rgba(255, 115, 77, 0.1); border: 1px solid rgba(255, 115, 77, 0); } .walli #smart-devices .wrapper .item .image .bg-img { margin-bottom: 20px; } .walli #smart-devices .wrapper .item .description { padding-left: 0; text-align: center; height: auto; min-height: 200px; } .walli #smart-devices .wrapper .item .description h3 { font-size: 120%; } .walli #smart-devices .wrapper .item .description .name { font-size: 80%; } .walli #smart-devices .wrapper .item .description .txt { position: relative; font-size: 90%; } .walli #smart-devices .wrapper .item .description.mirror { padding-right: 0; } .walli #smart-devices .wrapper .item .description.mirror .txt { padding-right: 0; } .walli #functions .wrapper .item { max-width: 350px; } .walli #usecase-1 .device, .walli #usecase-2 .device, .walli #usecase-4 .device, .walli #usecase-5 .device { margin: -220px 0 20px 0; } .walli #usecase-3 .device { margin: -410px 0 20px 0; } .walli #usecase-6 .device { margin: -150px 0 20px 0; } .walli #other-devices .content a { -webkit-transform: translateY(60%); transform: translateY(60%); } .walli #smart-products h1, .walli #non-smart-products h1, .walli #accessories-for-products h1 { font-size: 3.2rem; } .walli #panels-desktop { height: 650px; } .walli #panels-desktop h2 { top: 2.4rem; } .walli #panels-desktop .left-side { padding-top: 100px; margin-left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-0 { margin-left: 10%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-1 { margin-left: 19%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-2 { margin-left: 29%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-3 { margin-left: 39%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-4 { margin-left: 49%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-5 { margin-left: 59%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-6 { margin-left: 70%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-7 { margin-left: 79%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-8 { margin-left: 89%; } .walli #panels-desktop .right-side { padding-top: 100px; } .walli #clicks-desktop .content .switch { width: 320px; height: 320px; } .walli #clicks-desktop .content .switch .up, .walli #clicks-desktop .content .switch .down, .walli #clicks-desktop .content .switch .switch-bg { width: 320px; height: 320px; } .walli #parameters h1 { font-size: 3.2rem; padding-bottom: 0.4rem; } } @media (min-width: 1200px) { .walli #header p { font-size: 2.5rem; } .walli #design-desktop { background-color: #182235; } .walli #design-desktop .content { padding-bottom: 0; } .walli #design-desktop .section-title { color: rgba(238, 109, 76, 0.05); font-size: 25rem; font-weight: 700; text-transform: uppercase; text-align: center; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -55%); transform: translate(-50%, -55%); } .walli #design-desktop .image-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 13rem 0 3rem; width: 100%; } .walli #design-desktop .image-wrapper .left { -webkit-transform: translateX(-20%); transform: translateX(-20%); transition: 700ms; } .walli #design-desktop .image-wrapper .right { -webkit-transform: translateX(20%); transform: translateX(20%); transition: 700ms; } .walli #design-desktop .image-wrapper.inview .left { -webkit-transform: translateX(0); transform: translateX(0); } .walli #design-desktop .image-wrapper.inview .right { -webkit-transform: translateX(0); transform: translateX(0); } .walli #design-desktop .image-wrapper img { width: 100%; height: auto; box-shadow: 0 50px 65px -18px rgba(0, 0, 0, 0.4); } .walli #smart-devices .content { padding-bottom: 0.5rem; } .walli #smart-devices .wrapper { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .walli #smart-devices .wrapper .item { background-color: rgba(255, 115, 77, 0); border: 1px solid rgba(255, 115, 77, 0.1); transition: all 150ms ease-out; } .walli #smart-devices .wrapper .item .description { min-height: 40px; } .walli #smart-devices .wrapper .item .description h3 { font-size: 100%; padding-bottom: 0; } .walli #smart-devices .wrapper .item .description .txt { display: none; transition: all 150ms ease-out; } .walli #smart-devices .wrapper .item .description .txt p { padding-bottom: 0; } .walli #smart-devices .wrapper .item:hover { background-color: rgba(255, 115, 77, 0.1); border: 1px solid rgba(255, 115, 77, 0); } .walli #smart-devices .wrapper .item:hover .description h3 { padding-bottom: 2rem; } .walli #smart-devices .wrapper .item:hover .description .txt { display: block; } .walli #smart-devices .outer-wrapper { margin: 3rem 0 0; min-height: 400px; } .walli #functions .wrapper { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .walli #functions .wrapper .item { margin: 60px 0; padding: 0 40px; font-size: 90%; min-height: 270px; min-width: 345px; box-shadow: 0 40px 65px -18px rgba(0, 0, 0, 0.4); } .walli #functions .wrapper .item:nth-of-type(1) { -webkit-transform: translateY(50px); transform: translateY(50px); transition: 500ms ease-out; } .walli #functions .wrapper .item:nth-of-type(1) p { opacity: 0; transition: 500ms ease-out; } .walli #functions .wrapper .item:nth-of-type(1).active { -webkit-transform: translateY(0); transform: translateY(0); } .walli #functions .wrapper .item:nth-of-type(1).active p { opacity: 1; } .walli #functions .wrapper .item:nth-of-type(2) { margin: 60px 30px; -webkit-transform: translateY(50px); transform: translateY(50px); transition: 500ms ease-out 250ms; } .walli #functions .wrapper .item:nth-of-type(2) p { opacity: 0; transition: 500ms ease-out 250ms; } .walli #functions .wrapper .item:nth-of-type(2).active { -webkit-transform: translateY(0); transform: translateY(0); } .walli #functions .wrapper .item:nth-of-type(2).active p { opacity: 1; } .walli #functions .wrapper .item:nth-of-type(3) { -webkit-transform: translateY(50px); transform: translateY(50px); transition: 500ms ease-out 500ms; } .walli #functions .wrapper .item:nth-of-type(3) p { opacity: 0; transition: 500ms ease-out 500ms; } .walli #functions .wrapper .item:nth-of-type(3).active { -webkit-transform: translateY(0); transform: translateY(0); } .walli #functions .wrapper .item:nth-of-type(3).active p { opacity: 1; } .walli #video { line-height: 0; } .walli #video video { height: auto; width: 100vw; } .walli #wall-sockets .content { padding-bottom: 2.5rem; } .walli #wall-sockets img { margin: 40px 0; } .walli #usecase-1 { margin-top: 20rem; } .walli #usecase-1 .section-title { color: rgba(238, 109, 76, 0.05); font-size: 24rem; font-weight: 700; text-transform: uppercase; text-align: center; position: absolute; top: -27%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .walli #usecase-1 .content, .walli #usecase-2 .content, .walli #usecase-3 .content, .walli #usecase-4 .content, .walli #usecase-5 .content { padding-top: 6rem; padding-bottom: 6rem; } .walli #usecase-1 .text, .walli #usecase-2 .text, .walli #usecase-3 .text, .walli #usecase-4 .text, .walli #usecase-5 .text { -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: left; display: -webkit-box; display: -ms-flexbox; display: flex; min-height: 500px; } .walli #usecase-1 .device, .walli #usecase-2 .device, .walli #usecase-3 .device, .walli #usecase-4 .device, .walli #usecase-5 .device { width: 35%; margin: -400px 0 20px 0; -webkit-transform: translateX(-115%); transform: translateX(-115%); } .walli #usecase-1 .hint, .walli #usecase-2 .hint, .walli #usecase-3 .hint, .walli #usecase-4 .hint, .walli #usecase-5 .hint { bottom: 440px; margin-left: 0; background-color: rgba(0, 144, 255, 0.9); } .walli #usecase-1 .hint img, .walli #usecase-2 .hint img, .walli #usecase-3 .hint img, .walli #usecase-4 .hint img, .walli #usecase-5 .hint img { width: 60px !important; max-width: 60px !important; height: 60px !important; max-height: 60px !important; } .walli #usecase-1 .roundit, .walli #usecase-2 .roundit, .walli #usecase-3 .roundit, .walli #usecase-4 .roundit, .walli #usecase-5 .roundit { margin: 1.2rem 0 6.4rem; } .walli #usecase-1 .image, .walli #usecase-2 .image, .walli #usecase-3 .image, .walli #usecase-4 .image, .walli #usecase-5 .image { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; display: -webkit-box; display: -ms-flexbox; display: flex; } .walli #usecase-2, .walli #usecase-4 { background-color: transparent; } .walli #usecase-2 .hint, .walli #usecase-4 .hint { bottom: 250px; width: 50%; -webkit-transform: translateX(130%) scale(0); transform: translateX(130%) scale(0); } .walli #usecase-2 .device, .walli #usecase-4 .device { margin: -320px 0 20px 0; -webkit-transform: translateX(115%); transform: translateX(115%); } .walli #usecase-2.active .hint, .walli #usecase-4.active .hint { -webkit-transform: translateX(130%) scale(1); transform: translateX(130%) scale(1); } .walli #usecase-3 .hint { border: 1px solid #0090ff; background-color: rgba(255, 255, 255, 0.7); color: #0090FF; -webkit-transform: translateX(15%) scale(0); transform: translateX(15%) scale(0); width: 80%; } .walli #usecase-3 .hint-2 { border: none; background-color: #0090ff; color: #ffffff; width: 60%; bottom: 370px; -webkit-transform: translateX(-35%) scale(0); transform: translateX(-35%) scale(0); } .walli #usecase-3 .hint-3 { -webkit-transform: translateX(15%) scale(1); transform: translateX(15%) scale(1); opacity: 1; } .walli #usecase-3 .device { margin: -570px 0 20px 0; } .walli #usecase-3.active .hint { -webkit-transform: translateX(15%) scale(1); transform: translateX(15%) scale(1); } .walli #usecase-3.active .hint-2 { -webkit-transform: translateX(-35%) scale(1); transform: translateX(-35%) scale(1); } .walli #usecase-5 .hint { bottom: 250px; -webkit-transform: translateX(-57%) scale(0); transform: translateX(-57%) scale(0); } .walli #usecase-5 .device { margin: -320px 0 20px 0; } .walli #usecase-5.active .hint { -webkit-transform: translateX(-57%) scale(1); transform: translateX(-57%) scale(1); } .walli #usecase-6 { background-color: transparent; margin-bottom: 15rem; } .walli #usecase-6 .content { padding-top: 6rem; padding-bottom: 6rem; } .walli #usecase-6 .text { -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: left; display: -webkit-box; display: -ms-flexbox; display: flex; } .walli #usecase-6 .device { width: 60%; -webkit-transform: translateX(50%); transform: translateX(50%); margin: -130px 0 20px 0; } .walli #voice-control .content { position: absolute; background-color: transparent; } .walli #voice-control .content .logos { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0 20px; margin-top: 2.4rem; } .walli #voice-control .bg .device-alexa { display: none; } .walli #voice-control .bg .device-alexa-glow { display: none; } .walli #voice-control .bg-first { padding-bottom: 46.95%; } .walli #voice-control .bg-second { padding-bottom: 46.95%; opacity: 0; transition: 2000ms all 1000ms; } .walli #voice-control .bg-second.active { opacity: 1; } .walli #mobile-app .section-title { font-size: 18rem; top: 12%; } .walli #mobile-app .content img { margin-top: 1.4rem; width: 80%; } .walli #power-metering .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left; } .walli #power-metering .bg { background-position: 50% 50%; padding-bottom: 36%; } .walli #installer .content { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left; position: absolute; z-index: 1; } .walli #installer .content .vde { padding-bottom: 0; font-size: 130%; margin-top: 2.4rem; } .walli #installer .content .vde img { height: 80px; } .walli #installer .bg { background-position: 50% 50%; padding-bottom: 36%; } .walli #other-devices .content a { -webkit-transform: translateY(60%); transform: translateY(60%); } .walli #panels-desktop .left-side { padding-top: 150px; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area { top: -25px; } .walli #panels-desktop .right-side { padding-top: 150px; } .walli #panels-desktop h2 { top: 5.5rem; } .walli #panels-desktop .tab label.active { font-size: 3.2rem; } .walli #parameters { margin-top: 128px; } .walli #parameters h1 { font-size: 4rem; text-align: left; } .walli #parameters h2 { text-align: left; } .walli #parameters p { text-align: left; padding-bottom: 0; } .walli #parameters .specs-section { padding-top: 5rem; margin-top: 5rem; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .walli #parameters .specs-section h3 { padding-bottom: 3rem; font-size: 145%; width: 25%; text-align: right; padding-right: 90px; margin-top: 0; } .walli #parameters .specs-row-wrapper { width: 75%; } .walli #parameters .specs-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 10px; width: 100%; } .walli #parameters .specs-row .description { width: 30%; font-size: 110%; } .walli #parameters .specs-row .value { width: 70%; padding-left: 40px; font-size: 110%; } .walli #parameters .specs-row .drawing { width: 33%; } .walli #parameters .specs-row .drawing.module { padding-left: 0; } .walli #smart-products h1, .walli #non-smart-products h1, .walli #accessories-for-products h1 { font-size: 4rem; text-align: left; } .walli #smart-products h2, .walli #non-smart-products h2, .walli #accessories-for-products h2 { text-align: left; } .walli #smart-products .items p, .walli #non-smart-products .items p, .walli #accessories-for-products .items p { font-size: 80%; } .walli #smart-products .items img, .walli #non-smart-products .items img, .walli #accessories-for-products .items img { width: auto; height: 180px; padding: 5rem 1rem 0; } .walli #smart-products .items .second-row, .walli #smart-products .items .third-row, .walli #non-smart-products .items .second-row, .walli #non-smart-products .items .third-row, .walli #accessories-for-products .items .second-row, .walli #accessories-for-products .items .third-row { -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; } .walli #smart-products .more, .walli #non-smart-products .more, .walli #accessories-for-products .more { font-size: 90%; } .walli #non-smart-products .items .row { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .walli #clicks-desktop { height: 800px; } .walli #clicks-desktop .bg { height: 800px; } .walli #clicks-desktop .content .gradient-bg { height: 800px !important; } .walli #clicks-desktop .content .switch { width: 280px; height: 280px; } .walli #clicks-desktop .content .switch .up, .walli #clicks-desktop .content .switch .down, .walli #clicks-desktop .content .switch .switch-bg { width: 280px; height: 280px; } .walli #clicks-desktop .content p { margin-bottom: 40px; } .walli #clicks-desktop .content .button-area { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0; } .walli #clicks-desktop .content .button-area button { width: 100%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } @media (min-width: 1600px) { .walli #header p { font-size: 3.5rem; } .walli #panels-desktop { height: 800px; } .walli #panels-desktop .left-side { padding-top: 180px; } .walli #panels-desktop .right-side { padding-top: 180px; } .walli #design-desktop .section-title { font-size: 35rem; } .walli #design-desktop .image-wrapper { padding: 17rem 0 9rem; } .walli #smart-devices .outer-wrapper { min-height: 450px; } .walli #functions .wrapper .item { margin: 60px 0; padding: 0 40px; font-size: 100%; min-height: 310px; min-width: 430px; } .walli #functions .wrapper .item:nth-of-type(2) { margin: 60px 30px; } .walli #wall-sockets img { margin: 60px 0; } .walli #usecase-1 .section-title { font-size: 30rem; } .walli #usecase-1 .content { padding-top: 8.4rem; padding-bottom: 8.4rem; } .walli #usecase-1 .device { margin: -380px 0 20px 0; -webkit-transform: translateX(-122%); transform: translateX(-122%); } .walli #usecase-1 .hint { max-width: 420px; bottom: 550px; } .walli #usecase-1.active .hint { -webkit-transform: translateX(-60%) scale(1); transform: translateX(-60%) scale(1); } .walli #usecase-2 .hint, .walli #usecase-4 .hint, .walli #usecase-5 .hint { bottom: 280px; } .walli #usecase-3 .hint { bottom: 400px; -webkit-transform: translateX(-34%) scale(0); transform: translateX(-34%) scale(0); } .walli #usecase-3 .hint-3 { bottom: 570px; max-width: 380px; -webkit-transform: translateX(30%) scale(1); transform: translateX(30%) scale(1); opacity: 1; } .walli #usecase-3.active .hint { -webkit-transform: translateX(-34%) scale(1); transform: translateX(-34%) scale(1); } .walli #usecase-3.active .hint-3 { -webkit-transform: translateX(30%) scale(1); transform: translateX(30%) scale(1); } .walli #usecase-5 .hint { -webkit-transform: translateX(-62%) scale(0); transform: translateX(-62%) scale(0); } .walli #usecase-5.active .hint { -webkit-transform: translateX(-62%) scale(1); transform: translateX(-62%) scale(1); } .walli #usecase-6 .device { margin: -160px 0 20px 0; } .walli #mobile-app .section-title { font-size: 24rem; top: 7%; } .walli #mobile-app .content img { width: 90%; } .walli #other-devices .bg { padding-bottom: 47%; } .walli #panels-desktop h2 { top: 7rem; } .walli #panels-desktop .left-side { padding-top: 150px; height: 800px; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-0 { margin-left: 6%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-1 { margin-left: 17%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-2 { margin-left: 28%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-3 { margin-left: 39%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-4 { margin-left: 50%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-5 { margin-left: 60%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-6 { margin-left: 71%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-7 { margin-left: 82%; } .walli #panels-desktop .left-side .range-area .range-container .tooltip-area .step-8 { margin-left: 93%; } .walli #panels-desktop .right-side { padding-top: 150px; height: 800px; } .walli #panels-desktop .tab label { margin: 1em 0; } .walli #panels-desktop .tab label.active { font-size: 3.5rem; } .walli #parameters h1 { font-size: 4.8rem; letter-spacing: 0; } .walli #parameters .specs-row .drawing { width: 25%; } .walli #smart-products h1, .walli #non-smart-products h1, .walli #accessories-for-products h1 { font-size: 4.8rem; } .walli #smart-products .items img, .walli #non-smart-products .items img, .walli #accessories-for-products .items img { width: auto; height: 230px; } .walli #clicks-desktop .content .switch { width: 320px; height: 320px; } .walli #clicks-desktop .content .switch .up, .walli #clicks-desktop .content .switch .down, .walli #clicks-desktop .content .switch .switch-bg { width: 320px; height: 320px; } } @media (min-width: 2100px) { .walli #header p { font-size: 5.5rem; } .walli #design-desktop .section-title { font-size: 45rem; -webkit-transform: translate(-50%, -65%); transform: translate(-50%, -65%); } .walli #design-desktop .image-wrapper { padding: 17rem 0 19rem; } .walli #smart-devices .outer-wrapper { min-height: 500px; } .walli #functions .wrapper .item { font-size: 120%; padding: 0 60px; min-height: 440px; min-width: 600px; } .walli #functions .wrapper .item img { width: 200px; height: auto; margin-bottom: 40px; } .walli #wall-sockets .content { padding-bottom: 4.5rem; } .walli #wall-sockets img { margin: 70px 0; } .walli #usecase-1 { margin-top: 30rem; } .walli #usecase-1 .section-title { font-size: 40rem; } .walli #usecase-1 .content { padding-top: 9.6rem; padding-bottom: 9.6rem; } .walli #usecase-1 .hint { max-width: 450px; bottom: 730px; } .walli #usecase-1.active .hint { -webkit-transform: translateX(-40%) scale(1); transform: translateX(-40%) scale(1); } .walli #usecase-1 .device { margin: -300px 0 20px 0; -webkit-transform: translateX(-200%); transform: translateX(-200%); } .walli #usecase-2 .hint, .walli #usecase-4 .hint { bottom: 370px; width: 43%; -webkit-transform: translateX(160%) scale(0); transform: translateX(160%) scale(0); } .walli #usecase-2 .device, .walli #usecase-4 .device { margin: -420px 0 20px 0; } .walli #usecase-2.active .hint, .walli #usecase-4.active .hint { -webkit-transform: translateX(160%) scale(1); transform: translateX(160%) scale(1); } .walli #usecase-3 .content { padding-top: 9.6rem; padding-bottom: 9.6rem; } .walli #usecase-3 .hint { max-width: 400px; bottom: 520px; -webkit-transform: translateX(-30%) scale(0); transform: translateX(-30%) scale(0); } .walli #usecase-3 .hint-3 { bottom: 700px; max-width: 480px; -webkit-transform: translateX(40%) scale(1); transform: translateX(40%) scale(1); opacity: 1; } .walli #usecase-3.active .hint { -webkit-transform: translateX(-30%) scale(1); transform: translateX(-30%) scale(1); } .walli #usecase-3.active .hint-3 { -webkit-transform: translateX(40%) scale(1); transform: translateX(40%) scale(1); } .walli #usecase-3 .device { margin: -720px 0 20px 0; } .walli #usecase-5 .content { padding-top: 9.6rem; padding-bottom: 9.6rem; } .walli #usecase-5 .device { margin: -320px 0 20px 0; -webkit-transform: translateX(-200%); transform: translateX(-200%); } .walli #usecase-5 .hint { max-width: 400px; bottom: 380px; -webkit-transform: translateX(-52%) scale(0); transform: translateX(-52%) scale(0); } .walli #usecase-5.active .hint { -webkit-transform: translateX(-52%) scale(1); transform: translateX(-52%) scale(1); } .walli #usecase-6 { margin-bottom: 25rem; } .walli #usecase-6 .device { margin: -220px 0 20px 0; } .walli #voice-control .content .logos { margin-top: 4.4rem; } .walli #mobile-app .section-title { font-size: 30rem; top: 5%; } .walli #mobile-app .content img { margin-top: 2.4rem; width: 120%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); position: relative; } .walli #other-devices .bg { padding-bottom: 35%; } .walli #panels-desktop h2 { top: 7rem; } .walli #panels-desktop .left-side { padding-top: 200px; height: 1000px; } .walli #panels-desktop .left-side .image { height: 1000px; } .walli #panels-desktop .right-side { padding-top: 200px; height: 1000px; } .walli #panels-desktop .tab label { margin: 1.2em 0; } .walli #panels-desktop .tab label.active { font-size: 3.5rem; } .walli #parameters { margin-top: 160px; } .walli #parameters h1 { font-size: 6rem; } .walli #parameters .specs-row .drawing.module { text-align: center; } .walli #smart-products h1, .walli #non-smart-products h1, .walli #accessories-for-products h1 { font-size: 6rem; } .walli #smart-products .items img, .walli #non-smart-products .items img, .walli #accessories-for-products .items img { width: auto; height: 300px; } } @supports (-ms-ime-align: auto) { .walli .roundit { box-shadow: none; } } .config-tool main { background-color: #f6f6f6; } .config-tool #configurator h3 { font-size: 1.4em; font-weight: 600; padding-bottom: 0.8rem; line-height: 1.5; } @keyframes shake { 10%, 90% { -webkit-transform: translate3d(-1px, 0, 0); transform: translate3d(-1px, 0, 0); } 20%, 80% { -webkit-transform: translate3d(2px, 0, 0); transform: translate3d(2px, 0, 0); } 30%, 50%, 70% { -webkit-transform: translate3d(-4px, 0, 0); transform: translate3d(-4px, 0, 0); } 40%, 60% { -webkit-transform: translate3d(4px, 0, 0); transform: translate3d(4px, 0, 0); } } .config-tool #configurator .apply-shake { -webkit-animation: shake 0.42s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; animation: shake 0.42s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; } .config-tool #configurator .content { text-align: left; } .config-tool #configurator .swiper-container { background-color: #fff; border-radius: 10px 10px 0 0; } .config-tool #configurator .swiper-container p { font-size: 0.9em; } .config-tool #configurator .swiper-container label { display: block; margin-bottom: 1.5em; } .config-tool #configurator .swiper-container label .custom span:nth-of-type(1) { font-size: 1em; color: #0090ff; font-weight: 600; } .config-tool #configurator .swiper-container label .custom span:nth-of-type(2) { display: block; font-size: 0.9em; width: 70%; } .config-tool #configurator .swiper-container .device-select, .config-tool #configurator .swiper-container .custom-select, .config-tool #configurator .swiper-container .walli-devices-list, .config-tool #configurator .swiper-container .other-devices-list { margin-top: 1em; } .config-tool #configurator .swiper-container .custom-select { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .config-tool #configurator .swiper-container .custom-select select { width: auto; margin-bottom: 2em; margin-right: 2em; } .config-tool #configurator .swiper-container .custom-select select option[disabled] { display: none; } .config-tool #configurator .swiper-container .custom-select label, .config-tool #configurator .swiper-container .custom-select h3 { font-size: 1em; color: #0090ff; font-weight: 600; padding-bottom: 0.8rem; margin-bottom: 0; } .config-tool #configurator .swiper-container #step-4 h3 { padding-bottom: 2.4rem; } .config-tool #configurator .swiper-container #step-4 .walli-devices-list h3, .config-tool #configurator .swiper-container #step-4 .other-devices-list h3 { font-size: 1em; color: #0090ff; font-weight: 600; padding-bottom: 1.4rem; } .config-tool #configurator .swiper-container #step-4 .other-devices-list { display: none; } .config-tool #configurator .swiper-container #step-4 .other-devices-list.active { display: block; } .config-tool #configurator .swiper-container #step-4 .device-item { border: 1px solid #c9c9c9; border-radius: 10px; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 1em; } .config-tool #configurator .swiper-container #step-4 .device-item .image { width: 100px; height: 100px; position: relative; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; margin: 0 20px; } .config-tool #configurator .swiper-container #step-4 .device-item .name { padding: 10px 20px; } .config-tool #configurator .swiper-container #step-4 .device-item .quantity { color: #0090ff; font-weight: 600; padding: 10px 40px 10px 20px; margin-right: 0; } .config-tool #configurator .swiper-container #step-4 .device-item:last-of-type { margin-bottom: 3rem; } .config-tool #configurator .swiper-container #step-4 #disclaimer { display: none; } .config-tool #configurator .swiper-container #step-4 #disclaimer.active { display: block; } .config-tool #configurator .nav-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background-color: #fff; border-radius: 0 0 10px 10px; padding: 2rem 0 6rem; margin: 0 auto; width: 100%; } .config-tool #configurator .nav-container button { background-color: #ffffff; } .config-tool #configurator .nav-container button:focus { outline: none; } .config-tool #configurator .nav-container .prev, .config-tool #configurator .nav-container .next, .config-tool #configurator .nav-container .reset, .config-tool #configurator .nav-container .print { font-size: 1em; border-radius: 25px; padding: 4px 20px; width: auto; min-width: 120px; text-align: center; margin: 0 20px; } .config-tool #configurator .nav-container .prev, .config-tool #configurator .nav-container .reset { border: 1px solid #444444; color: #444444; display: none; } .config-tool #configurator .nav-container .prev.visible, .config-tool #configurator .nav-container .reset.visible { display: block; } .config-tool #configurator .nav-container .next { color: #fff; background-color: #c6c6c6; border: 1px solid #c6c6c6; } .config-tool #configurator .nav-container .next.active { background-color: #0090ff; border: 1px solid #0090ff; } .config-tool #configurator .nav-container .print { color: #fff; background-color: #0090ff; border: 1px solid #0090ff; display: none; } .config-tool #configurator .nav-container .print.visible { display: block; } .config-tool #configurator .nav-container .hide { display: none; } .config-tool #configurator .nav-container .show { display: block; } @media (min-width: 768px) { .config-tool #configurator .swiper-container #step-4 .device-item .quantity { position: absolute; right: 0; } } .fixed-grid main { font-size: 13px; } .fixed-grid main h1 { font-size: 32px; } .fixed-grid main h2 { font-size: 26px; padding-bottom: 13px; } .fixed-grid main p { padding-bottom: 13px; } .fixed-grid .section-product-footer .top { background: #087ebe; background: linear-gradient(to right, #087ebe 0%, #104587 100%); background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; } .fixed-grid .section-product-footer .top .content { padding-top: 6rem; padding-bottom: 6rem; color: #fff; } .fixed-grid .section-product-footer .top .content a { display: inline-block; padding: 8px 22px 8px 66px; border-radius: 20px / 50%; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5); background: #fff url("../img/icons/icon_cart_wtb.svg") no-repeat; background-position: center left 22px; background-size: auto 26px; font-size: 18px; font-weight: 400; } .fixed-grid .section-product-footer .sub .content { padding-top: 1.2rem; padding-bottom: 1.2rem; } .fixed-grid .section-product-footer .sub .content a { display: inline-block; position: relative; margin-top: 2.4rem; margin-bottom: 2.4rem; padding: 0 1.3rem; } .fixed-grid .section-product-footer .sub .content a img { display: block; height: 100px; width: auto; margin: 0 auto; } .fixed-grid .section-product-footer .sub .content a span { font-size: 13px; } .fixed-grid .section-product-footer .sub .content a span:after { content: ""; display: inline-block; width: 6px; height: 6px; border-top: 1px solid #0090FF; border-right: 1px solid #0090FF; background-color: transparent; -webkit-transform: rotate(45deg) translate(1px, -2px); transform: rotate(45deg) translate(1px, -2px); } @media screen and (min-width: 360px) { .fixed-grid .section-product-footer .sub .content a span { font-size: 14px; } .fixed-grid .section-product-footer .sub .content a span:after { width: 8px; height: 8px; } } @media (min-width: 768px) { .fixed-grid .section-product-footer .top .content { padding-top: 7.2rem; padding-bottom: 7.2rem; } .fixed-grid .section-product-footer .top .content h2 { padding-bottom: 0; display: inline-block; margin-right: 28px; } .fixed-grid .section-product-footer .top .content a { font-size: 18px; position: relative; top: -2px; } } @media (min-width: 1200px) { .fixed-grid.site-wrapper { background-color: #fbfbfb; } .fixed-grid main { overflow: hidden; background-color: #fff; } .fixed-grid section { width: 1140px; margin-left: auto; margin-right: auto; } .fixed-grid .content { padding-top: 3.2rem; padding-bottom: 3.2rem; } .fixed-grid .section-product-footer .top .content { padding-top: 7.2rem; padding-bottom: 7.2rem; } .fixed-grid .section-product-footer .top .content h2 { padding-bottom: 0; display: inline-block; margin-right: 28px; font-size: 3.6rem; } .fixed-grid .section-product-footer .top .content a { padding: 10px 26px 10px 72px; border-radius: 24px / 50%; font-size: 18px; position: relative; top: -5px; background-position: center left 25px; background-size: auto 30px; transition: all 125ms; } .fixed-grid .section-product-footer .top .content a:hover { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); -webkit-transform: translateY(1px); transform: translateY(1px); } .fixed-grid .section-product-footer .sub .content { padding-bottom: 2.4rem; } .fixed-grid .section-product-footer .sub .content a { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .fixed-grid .section-product-footer .sub .content a span { border-bottom: 1px solid transparent; transition: border-bottom 250ms; } .fixed-grid .section-product-footer .sub .content a:hover span { border-bottom: 1px solid #0090FF; } } @media (min-width: 1600px) { .fixed-grid main { font-size: 15px; } .fixed-grid main h1 { font-size: 38px; } .fixed-grid main h2 { font-size: 32px; padding-bottom: 15px; } .fixed-grid main p { padding-bottom: 15px; } .fixed-grid section { width: 1440px; } .fixed-grid .content { padding-top: 4.8rem; padding-bottom: 4.8rem; } .fixed-grid .section-product-footer .top .content { padding-top: 10.8rem; padding-bottom: 10.8rem; } .fixed-grid .section-product-footer .sub .content a span { font-size: inherit; } } @media (min-width: 2100px) { .fixed-grid main { font-size: 18px; } .fixed-grid main h1 { font-size: 56px; } .fixed-grid main h2 { font-size: 42px; padding-bottom: 18px; } .fixed-grid section { width: 1920px; } .fixed-grid .section-product-footer .top .content { padding-top: 12rem; padding-bottom: 12rem; } .fixed-grid .section-product-footer .top .content h2 { font-size: 4.8rem; } .fixed-grid .section-product-footer .top .content a { border-radius: 26px / 50%; font-size: 22px; top: -6px; } } .section-header-simple .bg { padding-bottom: 0; height: 240px; } .section-device-simple .content h1 { font-size: 2.8rem; letter-spacing: normal; } .section-device-simple .content .packshot-hc2 h1, .section-device-simple .content .packshot-hc2 h2, .section-device-simple .content .packshot-hc2 p { text-align: center; } .section-device-simple img { display: inline-block; width: 100%; height: auto; } .section-device-simple img.hidden-tabletL-up { max-width: 280px; margin-bottom: 3.6rem; margin-top: 2.4rem; } .section-device-simple .icons ul { margin-top: 1.2rem; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .section-device-simple .icons li { -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; display: block; background-repeat: no-repeat; margin-bottom: 4rem; width: 50%; } .section-device-simple .icons li img { height: 70px; width: auto; margin-bottom: 1.6rem; } .section-device-simple .icons li span { color: #0090FF; text-align: center; display: block; width: 100%; font-size: 90%; } .packshot-slider .swiper-wrapper { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .packshot-slider .swiper-wrapper, .packshot-slider .swiper-slide { box-sizing: border-box; } .packshot-slider .buttons { margin-top: 1rem; margin-bottom: 3rem; } .packshot-slider .buttons a { display: inline-block; margin: 0 .5rem; padding: .5rem 2rem; min-width: 130px; border: 1px solid #0090FF; border-radius: 16px/50%; transition: all 250ms; } .packshot-slider .buttons a:hover, .packshot-slider .buttons a.active { color: #fff; background-color: #0090FF; text-decoration: none; } @media (min-width: 768px) { .section-header-simple .bg { padding-bottom: 0; height: 355px; } .section-device-simple .content { padding-top: 4.8rem; } .section-device-simple .icons ul li { width: 33.33%; } .packshot-slider .buttons { margin-top: 0; margin-bottom: 4rem; } .app { padding-top: 5.8rem; } } @media (max-width: 1199px) { .section-device-simple .notice { padding-top: 2.4rem; padding-bottom: 2.4rem; } } @media (min-width: 992px) { .section-device-simple .content h1 { font-size: 3.2rem; } .section-device-simple .content h1, .section-device-simple .content h2, .section-device-simple .content p { text-align: left; } .section-device-simple .content .hidden-tabletP-down { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .section-device-simple .hidden-tabletP-down img { max-height: 320px; max-width: 100%; width: auto; } .section-device-simple .icons ul { margin-top: 4.8rem; } .section-device-simple .icons ul li { width: 16.66%; } .section-device-simple.home-center .icons ul li { width: 12.5%; } .relay .icons ul li, .switches-2 .icons ul li { width: 12.5%; } } @media (min-width: 1200px) { .section-device-simple .content { padding-top: 7.2rem; } .section-device-simple .content h1 { font-size: 4rem; } .section-device-simple .icons { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .section-device-simple .icons ul li img { height: 80px; } .section-device-simple .app { padding-top: 8.8rem; } .packshot-slider .buttons a { margin-left: 1.5rem; margin-right: 1.5rem; margin-bottom: 2.4rem; padding: .5rem 2.4rem; border-radius: 20px/50%; } } @media (min-width: 1600px) { .section-device-simple .content { padding-top: 9.6rem; } .section-device-simple .content h1 { font-size: 4.8rem; } .section-device-simple .icons ul { margin-top: 9.6rem; } .section-device-simple .notice { margin-top: 7.2rem; } } @media (min-width: 2100px) { .section-device-simple .content h1 { font-size: 6rem; } .section-device-simple .app h2 { font-size: 5.4rem; } } @-webkit-keyframes noticeBg { 0% { top: 100%; } 50% { top: 0; height: 100%; } 100% { top: 0; height: 0; } } @keyframes noticeBg { 0% { top: 100%; } 50% { top: 0; height: 100%; } 100% { top: 0; height: 0; } } @-webkit-keyframes noticeColor { 0% { color: #fff; border: 1px solid #fff; } 100% { color: #0090FF; border: 1px solid #0090FF; } } @keyframes noticeColor { 0% { color: #fff; border: 1px solid #fff; } 100% { color: #0090FF; border: 1px solid #0090FF; } } /*# sourceMappingURL=main.css.map */ /*Contact Form /*/ /* Contact Form 7 */ .wpcf7 p {padding-bottom: 0;} .wpcf7,.wpcf7-response-output{margin: 0;padding: 0;} .wpcf7-response-output{float: left;} .wpcf7 .screen-reader-response{position: absolute;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);height: 1px;width: 1px;margin: 0;padding: 0;border: 0;} .wpcf7-mail-sent-ok{color:#0090ff;display: none !important;} .wpcf7-mail-sent-ng{color:#ff0000;} .wpcf7-spam-blocked{color:#ffa500;} .wpcf7-validation-errors{color:#ff0000;} .wpcf7-form-control-wrap{position:relative;display:inline-block;width:100%;} .wpcf7-form-control-wrap.terms,.wpcf7-form-control-wrap.terms2,.wpcf7-form-control-wrap.terms3{position:relative;display:inline-block;width:auto;} .wpcf7-not-valid-tip { color: #f00; font-size: 1.4rem; display: block; } .use-floating-validation-tip .wpcf7-not-valid-tip { position: relative; background: #fff; display: inline-block; width:100%; } .wpcf7-select{width:100%;} .wpcf7-list-item{display:inline-block;margin:0 0 0 1em;} .wpcf7-list-item-label::before,.wpcf7-list-item-label::after{content:" ";} .wpcf7-display-none{display:none;} .wpcf7 .ajax-loader {visibility:hidden;display:block;background:url('../img/common/form-wait.gif') no-repeat left 2px top 0;width:100%;height:15px;border:none;padding:0;vertical-align:middle;} /*.wpcf7 .ajax-loader {visibility:hidden;display:inline-block;background-image:url('../img/common/wait.gif');width:32px;height:32px;border:none;padding:0;margin:0 0 0 4px;vertical-align:middle;}*/ .wpcf7 .ajax-loader.is-active{visibility:visible;} .wpcf7 .ajax-error{display: none;} .wpcf7 .placeheld{color:#444;} .wpcf7 .wpcf7-recaptcha iframe{margin-bottom: 0;} .wpcf7 input{outline:0;border-radius:4px;padding:8px;border:1px solid #0090ff;margin-bottom: 1.4rem;} .wpcf7 input[type="checkbox"]{margin-bottom: 0;} .wpcf7 input[type="file"]{cursor: pointer;} .wpcf7 input[type="file"]:disabled{cursor: default;} .wpcf7 textarea{width:388px;outline:0;border:1px solid #0090ff;border-radius:4px;padding:8px;} .wpcf7 input[type="text"],.wpcf7 input[type="tel"],.wpcf7 input[type="email"],.wpcf7 textarea{-webkit-appearance: none;} .wpcf7 input[type="text"]:focus,.wpcf7 input[type="tel"]:focus,.wpcf7 input[type="email"]:focus,.wpcf7 textarea:focus{-webkit-box-shadow:0 2px 2px rgba(0, 0, 0, 0.2);box-shadow:0 2px 2px rgba(0, 0, 0, 0.2);} .wpcf7 input[type="submit"]{border-radius:4px;padding:8px 0;width:134px;border:1px solid #0090ff;background-color: #0090ff;color:#fff;margin-bottom: 1.2rem;} .wpcf7 input[type="submit"]:disabled{background-color: #f0f0f0;border:1px solid #f0f0f0;} .wpcf7 .chosen-container input[type="text"]:focus{-webkit-box-shadow: none;box-shadow: none;} .wpcf7 .req{color: #ff0000;vertical-align:top;} .wpcf7 input[type="text"],.wpcf7 input[type="email"],.wpcf7 input[type="tel"],.wpcf7 textarea{width: 100%;} .wpcf7 .chosen-container {margin-bottom: 1.4rem;} .wpcf7 .form-acceptance{padding-top:6px;} .wpcf7 .form-acceptance .copy {display:block;font-size:60%;line-height: 1.4;} .wpcf7 .terms, .wpcf7 .terms2, .wpcf7 .terms3{float:left;margin-right: 12px;} .wpcf7 .form-left-wrapper,.wpcf7 .form-right-wrapper{width:100%;} @media screen and (max-width:767px) { select { border: 1px solid #0090ff; background-color: #fff; padding: 8px; border-radius: 4px !important; outline: 0 !important; margin-bottom: 1.4rem !important; } .wpcf7-recaptcha { margin-top: 1.4rem; transform:scale(0.77);-webkit-transform:scale(0.77);transform-origin:0 0;-webkit-transform-origin:0 0 } } @media screen and (min-width:768px) { /*.wpcf7 select {width:100%;opacity:0;}*/ .wpcf7-not-valid-tip { position: absolute; top: 4px; left: 100%; z-index: 100; background: #fff; margin-left: 1rem; display: block; width:200px; } .wpcf7 .ajax-loader {visibility:hidden;display:block;background:url('../img/common/form-wait.gif') no-repeat right 2px top 0;width:100%;height:15px;border:none;padding:0;vertical-align:middle;} .wpcf7 .form-left-wrapper,.wpcf7 .form-right-wrapper{width:50%;float: left;margin-top:12px;} .wpcf7 .form-right-wrapper{text-align: right;} }