| @import url(font-awesome.min.css); |
| @import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,300i,400i"); |
| |
|
|
| html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { |
| margin: 0; |
| padding: 0; |
| border: 0; |
| font-size: 100%; |
| font: inherit; |
| vertical-align: baseline; |
| } |
|
|
| article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { |
| display: block; |
| } |
|
|
| body { |
| line-height: 1; |
| } |
|
|
| ol, ul { |
| list-style: none; |
| } |
|
|
| blockquote, q { |
| quotes: none; |
| } |
|
|
| blockquote:before, blockquote:after, q:before, q:after { |
| content: ''; |
| content: none; |
| } |
|
|
| table { |
| border-collapse: collapse; |
| border-spacing: 0; |
| } |
|
|
| body { |
| -webkit-text-size-adjust: none; |
| } |
| |
| .copyrights{ |
| text-indent:-9999px; |
| height:0; |
| line-height:0; |
| font-size:0; |
| overflow:hidden; |
| } |
|
|
| |
|
|
| *, *:before, *:after { |
| -moz-box-sizing: border-box; |
| -webkit-box-sizing: border-box; |
| box-sizing: border-box; |
| } |
|
|
| |
|
|
| @-moz-keyframes load-spinner { |
| 0% { |
| -moz-transform: rotate(0deg); |
| -webkit-transform: rotate(0deg); |
| -ms-transform: rotate(0deg); |
| transform: rotate(0deg); |
| } |
|
|
| 100% { |
| -moz-transform: rotate(360deg); |
| -webkit-transform: rotate(360deg); |
| -ms-transform: rotate(360deg); |
| transform: rotate(360deg); |
| } |
| } |
|
|
| @-webkit-keyframes load-spinner { |
| 0% { |
| -moz-transform: rotate(0deg); |
| -webkit-transform: rotate(0deg); |
| -ms-transform: rotate(0deg); |
| transform: rotate(0deg); |
| } |
|
|
| 100% { |
| -moz-transform: rotate(360deg); |
| -webkit-transform: rotate(360deg); |
| -ms-transform: rotate(360deg); |
| transform: rotate(360deg); |
| } |
| } |
|
|
| @-ms-keyframes load-spinner { |
| 0% { |
| -moz-transform: rotate(0deg); |
| -webkit-transform: rotate(0deg); |
| -ms-transform: rotate(0deg); |
| transform: rotate(0deg); |
| } |
|
|
| 100% { |
| -moz-transform: rotate(360deg); |
| -webkit-transform: rotate(360deg); |
| -ms-transform: rotate(360deg); |
| transform: rotate(360deg); |
| } |
| } |
|
|
| @keyframes load-spinner { |
| 0% { |
| -moz-transform: rotate(0deg); |
| -webkit-transform: rotate(0deg); |
| -ms-transform: rotate(0deg); |
| transform: rotate(0deg); |
| } |
|
|
| 100% { |
| -moz-transform: rotate(360deg); |
| -webkit-transform: rotate(360deg); |
| -ms-transform: rotate(360deg); |
| transform: rotate(360deg); |
| } |
| } |
|
|
| @-ms-viewport { |
| width: device-width; |
| } |
|
|
| html { |
| width: 100%; |
| height: 100%; |
| } |
|
|
| body { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-align-items: center; |
| -webkit-align-items: center; |
| -ms-align-items: center; |
| align-items: center; |
| -moz-justify-content: -moz-flex-start; |
| -webkit-justify-content: -webkit-flex-start; |
| -ms-justify-content: -ms-flex-start; |
| justify-content: flex-start; |
| -ms-overflow-style: scrollbar; |
| width: 100%; |
| height: 100%; |
| min-height: 30rem; |
| overflow: hidden; |
| } |
|
|
| body:before { |
| -moz-animation: load-spinner 1s infinite linear; |
| -webkit-animation: load-spinner 1s infinite linear; |
| -ms-animation: load-spinner 1s infinite linear; |
| animation: load-spinner 1s infinite linear; |
| -moz-transition: opacity 0.25s ease; |
| -webkit-transition: opacity 0.25s ease; |
| -ms-transition: opacity 0.25s ease; |
| transition: opacity 0.25s ease; |
| -moz-transition-delay: 0s; |
| -webkit-transition-delay: 0s; |
| -ms-transition-delay: 0s; |
| transition-delay: 0s; |
| -moz-pointer-events: none; |
| -webkit-pointer-events: none; |
| -ms-pointer-events: none; |
| pointer-events: none; |
| content: ''; |
| display: block; |
| position: absolute; |
| top: 50%; |
| left: 50%; |
| width: 4rem; |
| height: 4rem; |
| margin: -2rem 0 0 -2rem; |
| background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='96px' height='96px' viewBox='0 0 96 96' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: %232e2b37%3B stroke-width: 1.5px%3B %7D%3C/style%3E%3Cdefs%3E%3CclipPath id='corner'%3E%3Cpolygon points='0,0 48,0 48,48 96,48 96,96 0,96' /%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23corner)'%3E%3Ccircle cx='48' cy='48' r='32'/%3E%3C/g%3E%3C/svg%3E"); |
| background-position: center; |
| background-repeat: no-repeat; |
| background-size: 4rem; |
| opacity: 0; |
| } |
|
|
| body:after { |
| -moz-pointer-events: none; |
| -webkit-pointer-events: none; |
| -ms-pointer-events: none; |
| pointer-events: none; |
| content: ''; |
| display: block; |
| position: fixed; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| z-index: -1; |
| background-attachment: fixed; |
| background-color: #e1e6e1; |
| background-image: url("../../images/overlay.png"), url("../../images/bg.jpg"); |
| background-repeat: repeat, repeat-x; |
| background-size: 128px 128px, cover; |
| } |
|
|
| body.is-loading *, body.is-loading *:before, body.is-loading *:after { |
| -moz-animation: none !important; |
| -webkit-animation: none !important; |
| -ms-animation: none !important; |
| animation: none !important; |
| -moz-transition: none !important; |
| -webkit-transition: none !important; |
| -ms-transition: none !important; |
| transition: none !important; |
| } |
|
|
| body.is-loading:before { |
| -moz-transition: opacity 1s ease; |
| -webkit-transition: opacity 1s ease; |
| -ms-transition: opacity 1s ease; |
| transition: opacity 1s ease; |
| -moz-transition-delay: 0.75s; |
| -webkit-transition-delay: 0.75s; |
| -ms-transition-delay: 0.75s; |
| transition-delay: 0.75s; |
| opacity: 0.25; |
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| html { |
| height: auto; |
| } |
|
|
| body { |
| height: auto; |
| overflow-x: hidden; |
| overflow-y: auto; |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 480px) { |
|
|
| html, body { |
| min-width: 320px; |
| } |
|
|
| } |
|
|
| |
|
|
| html { |
| font-size: 18pt; |
| font-size: 1vmax; |
| } |
|
|
| @media screen and (max-width: 1680px) { |
|
|
| html { |
| font-size: 12pt; |
| font-size: 1.1vmax; |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 1280px) { |
|
|
| html { |
| font-size: 11pt; |
| font-size: 1.5vmax; |
| } |
|
|
| } |
|
|
| body, input, select, textarea { |
| color: rgba(255, 255, 255, 0.75); |
| font-family: "Source Sans Pro", Helvetica, sans-serif; |
| font-size: 1rem; |
| font-weight: 300; |
| line-height: 1.65; |
| } |
|
|
| a { |
| -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; |
| -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; |
| -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; |
| transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; |
| color: inherit; |
| border-bottom: dotted 1px; |
| text-decoration: none; |
| } |
|
|
| a:hover { |
| border-bottom-color: transparent; |
| color: #ffe4b4; |
| } |
|
|
| strong, b { |
| color: rgba(255, 255, 255, 0.875); |
| font-weight: 400; |
| } |
|
|
| em, i { |
| font-style: italic; |
| } |
|
|
| p { |
| margin: 0 0 1.5rem 0; |
| } |
|
|
| body.is-ie p { |
| width: 100%; |
| } |
|
|
| h1, h2, h3, h4, h5, h6 { |
| color: rgba(255, 255, 255, 0.875); |
| font-family: Arial, Helvetica, sans-serif; |
| font-weight: 700; |
| line-height: 1.3; |
| margin: 0 0 0.75rem 0; |
| letter-spacing: -0.05em; |
| } |
|
|
| h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { |
| color: inherit; |
| text-decoration: none; |
| } |
|
|
| h1.major, h2.major, h3.major { |
| position: relative; |
| } |
|
|
| h1.major:after, h2.major:after, h3.major:after { |
| content: ''; |
| position: absolute; |
| left: 0; |
| width: 3.5rem; |
| height: 0.1rem; |
| background-color: rgba(255, 255, 255, 0.25); |
| } |
|
|
| h1 { |
| font-size: 3rem; |
| line-height: 1.2; |
| } |
|
|
| h1.major { |
| margin: 0 0 2.625rem 0; |
| } |
|
|
| h1.major:after { |
| bottom: -1.325rem; |
| } |
|
|
| h2 { |
| font-size: 1.75rem; |
| line-height: 1.2; |
| } |
|
|
| h2.major { |
| margin: 0 0 1.9875rem 0; |
| } |
|
|
| h2.major:after { |
| bottom: -1.2rem; |
| } |
|
|
| h3 { |
| font-size: 1.325rem; |
| } |
|
|
| h3.major { |
| margin: 0 0 1.875rem 0; |
| } |
|
|
| h3.major:after { |
| bottom: -0.75rem; |
| } |
|
|
| h4 { |
| font-size: 1rem; |
| } |
|
|
| h5 { |
| font-size: 0.9rem; |
| } |
|
|
| h6 { |
| font-size: 0.7rem; |
| } |
|
|
| sub { |
| font-size: 0.8rem; |
| position: relative; |
| top: 0.5rem; |
| } |
|
|
| sup { |
| font-size: 0.8rem; |
| position: relative; |
| top: -0.5rem; |
| } |
|
|
| blockquote { |
| border-left: solid 0.25rem rgba(255, 255, 255, 0.25); |
| font-style: italic; |
| margin: 0 0 1.5rem 0; |
| padding: 0.375rem 0 0.375rem 1.5rem; |
| } |
|
|
| code { |
| background: rgba(255, 255, 255, 0.075); |
| border-radius: 0.25rem; |
| font-family: "Courier New", monospace; |
| font-size: 0.8rem; |
| margin: 0 0.25rem; |
| padding: 0.25rem 0.65rem; |
| } |
|
|
| pre { |
| -webkit-overflow-scrolling: touch; |
| font-family: "Courier New", monospace; |
| font-size: 0.8rem; |
| margin: 0 0 1.5rem 0; |
| white-space: pre-wrap; |
| } |
|
|
| pre code { |
| display: block; |
| line-height: 1.625; |
| padding: 1rem 1.5rem; |
| overflow-x: auto; |
| margin: 0; |
| } |
|
|
| hr { |
| border: 0; |
| border-bottom: solid 2px rgba(255, 255, 255, 0.25); |
| margin: 1.875rem 0; |
| } |
|
|
| .align-left { |
| text-align: left; |
| } |
|
|
| .align-center { |
| text-align: center; |
| } |
|
|
| .align-right { |
| text-align: right; |
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| html { |
| font-size: 12pt; |
| } |
|
|
| h1 { |
| font-size: 2.25rem; |
| line-height: 1.2; |
| } |
|
|
| h1.major { |
| margin: 0 0 2.625rem 0; |
| } |
|
|
| h1.major:after { |
| bottom: -1.325rem; |
| } |
|
|
| h2 { |
| font-size: 1.5rem; |
| line-height: 1.2; |
| } |
|
|
| h2.major { |
| margin: 0 0 1.9875rem 0; |
| } |
|
|
| h2.major:after { |
| bottom: -1.2rem; |
| } |
|
|
| h3 { |
| font-size: 1rem; |
| } |
|
|
| h3.major { |
| margin: 0 0 1.875rem 0; |
| } |
|
|
| h3.major:after { |
| bottom: -0.75rem; |
| } |
|
|
| h4 { |
| font-size: 1rem; |
| } |
|
|
| h5 { |
| font-size: 0.9rem; |
| } |
|
|
| h6 { |
| font-size: 0.7rem; |
| } |
|
|
| h1 br, h2 br, h3 br, h4 br, h5 br, h6 br { |
| display: none; |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 360px) { |
|
|
| html { |
| font-size: 11pt; |
| } |
|
|
| } |
|
|
| |
|
|
| form { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| -ms-flex-wrap: wrap; |
| flex-wrap: wrap; |
| width: calc(100% + 3rem); |
| margin: -1.5rem 0 1.5rem -1.5rem; |
| } |
|
|
| form > .field { |
| -moz-flex-grow: 0; |
| -webkit-flex-grow: 0; |
| -ms-flex-grow: 0; |
| flex-grow: 0; |
| -moz-flex-shrink: 0; |
| -webkit-flex-shrink: 0; |
| -ms-flex-shrink: 0; |
| flex-shrink: 0; |
| padding: 1.5rem 0 0 1.5rem; |
| width: calc(100% - 1.5rem); |
| } |
|
|
| form > .field.half { |
| width: calc(50% - 0.75rem); |
| } |
|
|
| form > .field.third { |
| width: calc(100%/3 - 0.5rem); |
| } |
|
|
| form > .field.quarter { |
| width: calc(25% - 0.375rem); |
| } |
|
|
| form > .actions { |
| -moz-flex-grow: 0; |
| -webkit-flex-grow: 0; |
| -ms-flex-grow: 0; |
| flex-grow: 0; |
| -moz-flex-shrink: 1; |
| -webkit-flex-shrink: 1; |
| -ms-flex-shrink: 1; |
| flex-shrink: 1; |
| margin: 1.5rem 0 0 1.5rem; |
| } |
|
|
| label { |
| color: rgba(255, 255, 255, 0.875); |
| display: block; |
| font-family: Arial, Helvetica, sans-serif; |
| font-size: 0.8rem; |
| font-weight: 700; |
| margin: 0 0 0.4875rem 0; |
| } |
|
|
| input[type="text"], |
| input[type="password"], |
| input[type="email"], |
| input[type="tel"], |
| select, |
| textarea { |
| -moz-appearance: none; |
| -webkit-appearance: none; |
| -ms-appearance: none; |
| appearance: none; |
| background: transparent; |
| border: solid 2px rgba(255, 255, 255, 0.25); |
| border-radius: 0.25rem; |
| color: inherit; |
| display: block; |
| outline: 0; |
| padding: 0 0.75rem; |
| text-decoration: none; |
| width: 100%; |
| } |
|
|
| input[type="text"]:invalid, |
| input[type="password"]:invalid, |
| input[type="email"]:invalid, |
| input[type="tel"]:invalid, |
| select:invalid, |
| textarea:invalid { |
| box-shadow: none; |
| } |
|
|
| input[type="text"]:focus, |
| input[type="password"]:focus, |
| input[type="email"]:focus, |
| input[type="tel"]:focus, |
| select:focus, |
| textarea:focus { |
| border-color: #ffe4b4; |
| } |
|
|
| option { |
| background-color: rgba(255, 255, 255, 0.875); |
| color: #2e2b37; |
| } |
|
|
| .select-wrapper { |
| text-decoration: none; |
| display: block; |
| position: relative; |
| } |
|
|
| .select-wrapper:before { |
| -moz-osx-font-smoothing: grayscale; |
| -webkit-font-smoothing: antialiased; |
| font-family: FontAwesome; |
| font-style: normal; |
| font-weight: normal; |
| text-transform: none !important; |
| } |
|
|
| .select-wrapper:before { |
| display: block; |
| content: '\f107'; |
| position: absolute; |
| top: 0; |
| right: 0; |
| width: 2.5rem; |
| height: 2.5rem; |
| line-height: 2.5rem; |
| color: rgba(255, 255, 255, 0.75); |
| pointer-events: none; |
| text-align: center; |
| } |
|
|
| body.is-ie .select-wrapper:before { |
| line-height: 2.5; |
| } |
|
|
| .select-wrapper select::-ms-expand { |
| display: none; |
| } |
|
|
| input[type="text"], |
| input[type="password"], |
| input[type="email"], |
| select { |
| height: 2.5rem; |
| } |
|
|
| textarea { |
| padding: 0.75rem 1rem; |
| } |
|
|
| input[type="checkbox"], |
| input[type="radio"] { |
| -moz-appearance: none; |
| -webkit-appearance: none; |
| -ms-appearance: none; |
| appearance: none; |
| display: block; |
| float: left; |
| margin-right: -2rem; |
| opacity: 0; |
| width: 1rem; |
| z-index: -1; |
| } |
|
|
| input[type="checkbox"] + label, |
| input[type="radio"] + label { |
| text-decoration: none; |
| position: relative; |
| color: rgba(255, 255, 255, 0.75); |
| cursor: pointer; |
| display: inline-block; |
| font-size: 1rem; |
| font-weight: 300; |
| margin-bottom: 0; |
| padding-left: 2.5rem; |
| padding-right: 1rem; |
| } |
|
|
| input[type="checkbox"] + label:before, |
| input[type="radio"] + label:before { |
| -moz-osx-font-smoothing: grayscale; |
| -webkit-font-smoothing: antialiased; |
| font-family: FontAwesome; |
| font-style: normal; |
| font-weight: normal; |
| text-transform: none !important; |
| } |
|
|
| input[type="checkbox"] + label:before, |
| input[type="radio"] + label:before { |
| content: ''; |
| display: inline-block; |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 1.5rem; |
| height: 1.5rem; |
| line-height: 1.4375rem; |
| background: rgba(255, 255, 255, 0.075); |
| border: solid 1px rgba(255, 255, 255, 0.25); |
| border-radius: 0.25rem; |
| color: #2e2b37; |
| text-align: center; |
| } |
|
|
| body.is-ie input[type="checkbox"] + label:before, body.is-ie |
| input[type="radio"] + label:before { |
| line-height: 1.5; |
| } |
|
|
| input[type="checkbox"]:checked + label:before, |
| input[type="radio"]:checked + label:before { |
| content: '\f00c'; |
| background: rgba(255, 255, 255, 0.875); |
| border-color: rgba(255, 255, 255, 0.875); |
| } |
|
|
| input[type="checkbox"]:focus + label:before, |
| input[type="radio"]:focus + label:before { |
| border-color: #ffe4b4; |
| box-shadow: 0 0 0 1px #ffe4b4; |
| } |
|
|
| input[type="checkbox"]:focus:checked + label:before, |
| input[type="radio"]:focus:checked + label:before { |
| background: #ffe4b4; |
| } |
|
|
| input[type="checkbox"].color1 + label:before, |
| input[type="radio"].color1 + label:before { |
| color: #726193; |
| } |
|
|
| input[type="checkbox"].color2 + label:before, |
| input[type="radio"].color2 + label:before { |
| color: #e37b7c; |
| } |
|
|
| input[type="checkbox"].color3 + label:before, |
| input[type="radio"].color3 + label:before { |
| color: #ffe4b4; |
| } |
|
|
| input[type="checkbox"].color4 + label:before, |
| input[type="radio"].color4 + label:before { |
| color: #353865; |
| } |
|
|
| input[type="checkbox"] + label:before { |
| border-radius: 0.25rem; |
| } |
|
|
| input[type="radio"] + label:before { |
| border-radius: 100%; |
| } |
|
|
| ::-webkit-input-placeholder { |
| color: rgba(255, 255, 255, 0.5) !important; |
| opacity: 1.0; |
| } |
|
|
| :-moz-placeholder { |
| color: rgba(255, 255, 255, 0.5) !important; |
| opacity: 1.0; |
| } |
|
|
| ::-moz-placeholder { |
| color: rgba(255, 255, 255, 0.5) !important; |
| opacity: 1.0; |
| } |
|
|
| :-ms-input-placeholder { |
| color: rgba(255, 255, 255, 0.5) !important; |
| opacity: 1.0; |
| } |
|
|
| .formerize-placeholder { |
| color: rgba(255, 255, 255, 0.5) !important; |
| opacity: 1.0; |
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| form { |
| margin: -1.5rem 0 1.5rem 0; |
| width: 100%; |
| } |
|
|
| form > .field { |
| padding: 1.5rem 0 0 0; |
| width: 100% !important; |
| } |
|
|
| form > .actions { |
| margin: 1.5rem 0 0 0; |
| } |
|
|
| } |
|
|
| |
|
|
| .icon { |
| text-decoration: none; |
| position: relative; |
| border-bottom: none; |
| } |
|
|
| .icon:before { |
| -moz-osx-font-smoothing: grayscale; |
| -webkit-font-smoothing: antialiased; |
| font-family: FontAwesome; |
| font-style: normal; |
| font-weight: normal; |
| text-transform: none !important; |
| } |
|
|
| .icon > .label { |
| display: none; |
| } |
|
|
| |
|
|
| .image { |
| display: inline-block; |
| position: relative; |
| border: 0; |
| } |
|
|
| .image.filtered:after { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| -moz-pointer-events: none; |
| -webkit-pointer-events: none; |
| -ms-pointer-events: none; |
| pointer-events: none; |
| content: ''; |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| opacity: 1; |
| z-index: 1; |
| } |
|
|
| .image.filtered.tinted:after { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)), linear-gradient(0deg, rgba(0, 0, 0, 0.125), rgba(0, 0, 0, 0.125)); |
| background-size: 128px 128px, auto, auto; |
| } |
|
|
| .image[data-position] img { |
| -moz-object-fit: cover; |
| -webkit-object-fit: cover; |
| -ms-object-fit: cover; |
| object-fit: cover; |
| display: block; |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| } |
|
|
| .image[data-position="top left"] img { |
| -moz-object-position: top left; |
| -webkit-object-position: top left; |
| -ms-object-position: top left; |
| object-position: top left; |
| } |
|
|
| .image[data-position="top"] img { |
| -moz-object-position: top; |
| -webkit-object-position: top; |
| -ms-object-position: top; |
| object-position: top; |
| } |
|
|
| .image[data-position="top right"] img { |
| -moz-object-position: top right; |
| -webkit-object-position: top right; |
| -ms-object-position: top right; |
| object-position: top right; |
| } |
|
|
| .image[data-position="right"] img { |
| -moz-object-position: right; |
| -webkit-object-position: right; |
| -ms-object-position: right; |
| object-position: right; |
| } |
|
|
| .image[data-position="bottom right"] img { |
| -moz-object-position: bottom right; |
| -webkit-object-position: bottom right; |
| -ms-object-position: bottom right; |
| object-position: bottom right; |
| } |
|
|
| .image[data-position="bottom"] img { |
| -moz-object-position: bottom; |
| -webkit-object-position: bottom; |
| -ms-object-position: bottom; |
| object-position: bottom; |
| } |
|
|
| .image[data-position="bottom left"] img { |
| -moz-object-position: bottom left; |
| -webkit-object-position: bottom left; |
| -ms-object-position: bottom left; |
| object-position: bottom left; |
| } |
|
|
| .image[data-position="left"] img { |
| -moz-object-position: left; |
| -webkit-object-position: left; |
| -ms-object-position: left; |
| object-position: left; |
| } |
|
|
| .image[data-position="center"] img { |
| -moz-object-position: center; |
| -webkit-object-position: center; |
| -ms-object-position: center; |
| object-position: center; |
| } |
|
|
| .image[data-position="25% 25%"] img { |
| -moz-object-position: 25% 25%; |
| -webkit-object-position: 25% 25%; |
| -ms-object-position: 25% 25%; |
| object-position: 25% 25%; |
| } |
|
|
| .image[data-position="75% 25%"] img { |
| -moz-object-position: 75% 25%; |
| -webkit-object-position: 75% 25%; |
| -ms-object-position: 75% 25%; |
| object-position: 75% 25%; |
| } |
|
|
| .image[data-position="75% 75%"] img { |
| -moz-object-position: 75% 75%; |
| -webkit-object-position: 75% 75%; |
| -ms-object-position: 75% 75%; |
| object-position: 75% 75%; |
| } |
|
|
| .image[data-position="25% 75%"] img { |
| -moz-object-position: 25% 75%; |
| -webkit-object-position: 25% 75%; |
| -ms-object-position: 25% 75%; |
| object-position: 25% 75%; |
| } |
|
|
| .image img { |
| display: block; |
| } |
|
|
| .image.left, .image.right { |
| max-width: 40%; |
| } |
|
|
| .image.left img, .image.right img { |
| width: 100%; |
| } |
|
|
| .image.left { |
| float: left; |
| padding: 0 1.5rem 1rem 0; |
| top: 0.25rem; |
| } |
|
|
| .image.right { |
| float: right; |
| padding: 0 0 1rem 1.5rem; |
| top: 0.25rem; |
| } |
|
|
| .image.fit { |
| display: block; |
| margin: 0 0 1.5rem 0; |
| width: 100%; |
| } |
|
|
| .image.fit img { |
| width: 100%; |
| } |
|
|
| .image.main { |
| display: block; |
| margin: 0 0 2.25rem 0; |
| width: 100%; |
| } |
|
|
| .image.main img { |
| width: 100%; |
| } |
|
|
| |
|
|
| ol { |
| list-style: decimal; |
| margin: 0 0 1.5rem 0; |
| padding-left: 1.25rem; |
| } |
|
|
| ol li { |
| padding-left: 0.25rem; |
| } |
|
|
| ul { |
| list-style: disc; |
| margin: 0 0 1.5rem 0; |
| padding-left: 1rem; |
| } |
|
|
| ul li { |
| padding-left: 0.5rem; |
| } |
|
|
| ul.alt { |
| list-style: none; |
| padding-left: 0; |
| } |
|
|
| ul.alt li { |
| border-top: solid 1px rgba(255, 255, 255, 0.25); |
| padding: 0.5rem 0; |
| } |
|
|
| ul.alt li:first-child { |
| border-top: 0; |
| padding-top: 0; |
| } |
|
|
| ul.icons { |
| cursor: default; |
| list-style: none; |
| padding-left: 0; |
| } |
|
|
| ul.icons li { |
| display: inline-block; |
| padding: 0 1rem 0 0; |
| } |
|
|
| ul.icons li:last-child { |
| padding-right: 0; |
| } |
|
|
| ul.icons li .icon:before { |
| font-size: 1.25em; |
| } |
|
|
| ul.actions { |
| cursor: default; |
| list-style: none; |
| padding-left: 0; |
| } |
|
|
| ul.actions li { |
| display: inline-block; |
| padding: 0 0.75rem 0 0; |
| vertical-align: middle; |
| } |
|
|
| ul.actions li:last-child { |
| padding-right: 0; |
| } |
|
|
| ul.actions.small li { |
| padding: 0 0.375rem 0 0; |
| } |
|
|
| ul.actions.vertical li { |
| display: block; |
| padding: 0.75rem 0 0 0; |
| } |
|
|
| ul.actions.vertical li:first-child { |
| padding-top: 0; |
| } |
|
|
| ul.actions.vertical li > * { |
| margin-bottom: 0; |
| } |
|
|
| ul.actions.vertical.small li { |
| padding: 0.375rem 0 0 0; |
| } |
|
|
| ul.actions.vertical.small li:first-child { |
| padding-top: 0; |
| } |
|
|
| ul.actions.fit { |
| display: table; |
| margin-left: -0.75rem; |
| padding: 0; |
| table-layout: fixed; |
| width: calc(100% + 0.75rem); |
| } |
|
|
| ul.actions.fit li { |
| display: table-cell; |
| padding: 0 0 0 0.75rem; |
| } |
|
|
| ul.actions.fit li > * { |
| margin-bottom: 0; |
| } |
|
|
| ul.actions.fit.small { |
| margin-left: -0.375rem; |
| width: calc(100% + 0.375rem); |
| } |
|
|
| ul.actions.fit.small li { |
| padding: 0 0 0 0.375rem; |
| } |
|
|
| ul.contact-icons { |
| list-style: none; |
| padding-left: 0; |
| } |
|
|
| ul.contact-icons > li { |
| margin: 1.25rem 0 0 0; |
| padding-left: 0; |
| } |
|
|
| ul.contact-icons > li:before { |
| display: inline-block; |
| width: 2.25rem; |
| height: 2.25rem; |
| line-height: 2.25rem; |
| border-radius: 2.25rem; |
| background-color: white; |
| color: #2e2b37; |
| cursor: default; |
| font-size: 1.125rem; |
| margin-right: 1rem; |
| text-align: center; |
| vertical-align: middle; |
| } |
|
|
| body.is-ie ul.contact-icons > li:before { |
| line-height: 2.125; |
| } |
|
|
| ul.contact-icons > li a { |
| border-bottom: 0; |
| } |
|
|
| ul.contact-icons.color1 > li:before { |
| color: #726193; |
| } |
|
|
| ul.contact-icons.color2 > li:before { |
| color: #e37b7c; |
| } |
|
|
| ul.contact-icons.color3 > li:before { |
| color: #ffe4b4; |
| } |
|
|
| ul.contact-icons.color4 > li:before { |
| color: #353865; |
| } |
|
|
| ul.grid-icons { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| -ms-flex-wrap: wrap; |
| flex-wrap: wrap; |
| -moz-justify-content: center; |
| -webkit-justify-content: center; |
| -ms-justify-content: center; |
| justify-content: center; |
| list-style: none; |
| margin: 0 0 1.5rem 0; |
| padding-left: 0; |
| } |
|
|
| ul.grid-icons .icon { |
| display: block; |
| position: relative; |
| width: 100%; |
| text-align: center; |
| } |
|
|
| ul.grid-icons .icon:before { |
| display: block; |
| width: 6rem; |
| height: 6rem; |
| line-height: 6rem; |
| border-radius: 6rem; |
| box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.25); |
| font-size: 2.5rem; |
| margin: 0 auto; |
| text-align: center; |
| } |
|
|
| body.is-ie ul.grid-icons .icon:before { |
| line-height: 2.375; |
| } |
|
|
| ul.grid-icons > li { |
| -moz-flex-grow: 0; |
| -webkit-flex-grow: 0; |
| -ms-flex-grow: 0; |
| flex-grow: 0; |
| -moz-flex-shrink: 0; |
| -webkit-flex-shrink: 0; |
| -ms-flex-shrink: 0; |
| flex-shrink: 0; |
| position: relative; |
| margin: 1.5rem 0 0 1.5rem; |
| padding-left: 0; |
| } |
|
|
| ul.grid-icons.connected > li:before { |
| content: ''; |
| display: block; |
| position: absolute; |
| width: 1.5rem; |
| height: 2px; |
| top: 50%; |
| left: -1.5rem; |
| background-color: rgba(255, 255, 255, 0.25); |
| } |
|
|
| ul.grid-icons.connected > li:after { |
| content: ''; |
| display: block; |
| position: absolute; |
| width: 2px; |
| height: 1.5rem; |
| top: -1.5rem; |
| left: 50%; |
| background-color: rgba(255, 255, 255, 0.25); |
| } |
|
|
| ul.grid-icons.two { |
| width: 14rem; |
| } |
|
|
| ul.grid-icons.two > li:nth-child(-n + 2) { |
| margin-top: 0; |
| } |
|
|
| ul.grid-icons.two > li:nth-child(-n + 2):after { |
| display: none; |
| } |
|
|
| ul.grid-icons.two > li:nth-child(2n - 1) { |
| margin-left: 0; |
| } |
|
|
| ul.grid-icons.two > li:nth-child(2n - 1):before { |
| display: none; |
| } |
|
|
| ul.grid-icons.three { |
| width: 21.5rem; |
| } |
|
|
| ul.grid-icons.three > li:nth-child(-n + 3) { |
| margin-top: 0; |
| } |
|
|
| ul.grid-icons.three > li:nth-child(-n + 3):after { |
| display: none; |
| } |
|
|
| ul.grid-icons.three > li:nth-child(3n - 2) { |
| margin-left: 0; |
| } |
|
|
| ul.grid-icons.three > li:nth-child(3n - 2):before { |
| display: none; |
| } |
|
|
| ul.grid-icons.four { |
| width: 29rem; |
| } |
|
|
| ul.grid-icons.four > li:nth-child(-n + 4) { |
| margin-top: 0; |
| } |
|
|
| ul.grid-icons.four > li:nth-child(-n + 4):after { |
| display: none; |
| } |
|
|
| ul.grid-icons.four > li:nth-child(4n - 3) { |
| margin-left: 0; |
| } |
|
|
| ul.grid-icons.four > li:nth-child(4n - 3):before { |
| display: none; |
| } |
|
|
| dl { |
| margin: 0 0 1.5rem 0; |
| } |
|
|
| dl dt { |
| display: block; |
| font-weight: 400; |
| margin: 0 0 0.75rem 0; |
| } |
|
|
| dl dd { |
| margin-left: 1.5rem; |
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| ul.grid-icons { |
| -moz-justify-content: -moz-flex-start; |
| -webkit-justify-content: -webkit-flex-start; |
| -ms-justify-content: -ms-flex-start; |
| justify-content: flex-start; |
| width: 100% !important; |
| margin: -1rem 0 1.5rem -1rem; |
| } |
|
|
| ul.grid-icons .icon:before { |
| width: 4.5rem; |
| height: 4.5rem; |
| line-height: 4.5rem; |
| font-size: 1.75rem; |
| } |
|
|
| ul.grid-icons > li { |
| margin: 1rem 0 0 1rem !important; |
| } |
|
|
| ul.grid-icons > li:before { |
| display: none !important; |
| } |
|
|
| ul.grid-icons > li:after { |
| display: none !important; |
| } |
|
|
| } |
|
|
| |
|
|
| .table-wrapper { |
| -webkit-overflow-scrolling: touch; |
| overflow-x: auto; |
| } |
|
|
| table { |
| margin: 0 0 1.5rem 0; |
| width: 100%; |
| } |
|
|
| table tbody tr { |
| border: solid 1px rgba(255, 255, 255, 0.25); |
| border-left: 0; |
| border-right: 0; |
| } |
|
|
| table tbody tr:nth-child(2n + 1) { |
| background-color: rgba(255, 255, 255, 0.075); |
| } |
|
|
| table td { |
| padding: 0.75rem 0.75rem; |
| } |
|
|
| table th { |
| color: rgba(255, 255, 255, 0.875); |
| font-size: 0.9rem; |
| font-weight: 400; |
| padding: 0 0.75rem 0.75rem 0.75rem; |
| text-align: left; |
| } |
|
|
| table thead { |
| border-bottom: solid 2px rgba(255, 255, 255, 0.25); |
| } |
|
|
| table tfoot { |
| border-top: solid 2px rgba(255, 255, 255, 0.25); |
| } |
|
|
| table.alt { |
| border-collapse: separate; |
| } |
|
|
| table.alt tbody tr td { |
| border: solid 1px rgba(255, 255, 255, 0.25); |
| border-left-width: 0; |
| border-top-width: 0; |
| } |
|
|
| table.alt tbody tr td:first-child { |
| border-left-width: 1px; |
| } |
|
|
| table.alt tbody tr:first-child td { |
| border-top-width: 1px; |
| } |
|
|
| table.alt thead { |
| border-bottom: 0; |
| } |
|
|
| table.alt tfoot { |
| border-top: 0; |
| } |
|
|
| |
|
|
| input[type="submit"], |
| input[type="reset"], |
| input[type="button"], |
| button, |
| .button { |
| -moz-appearance: none; |
| -webkit-appearance: none; |
| -ms-appearance: none; |
| appearance: none; |
| -moz-transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out; |
| -webkit-transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out; |
| -ms-transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out; |
| transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out; |
| background-color: transparent; |
| border: 0; |
| border-radius: 0.25rem; |
| box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.25); |
| color: rgba(255, 255, 255, 0.875) !important; |
| cursor: pointer; |
| display: inline-block; |
| font-family: Arial, Helvetica, sans-serif; |
| font-size: 0.6rem; |
| font-weight: 700; |
| height: 2.75rem; |
| letter-spacing: 0.15rem; |
| line-height: 2.75rem; |
| padding: 0 1.5rem 0 1.65rem; |
| text-align: center; |
| text-decoration: none; |
| text-transform: uppercase; |
| white-space: nowrap; |
| } |
|
|
| input[type="submit"]:hover, |
| input[type="reset"]:hover, |
| input[type="button"]:hover, |
| button:hover, |
| .button:hover { |
| box-shadow: inset 0 0 0 2px #ffe4b4; |
| color: #ffe4b4 !important; |
| } |
|
|
| input[type="submit"]:active, |
| input[type="reset"]:active, |
| input[type="button"]:active, |
| button:active, |
| .button:active { |
| background-color: rgba(255, 228, 180, 0.125); |
| } |
|
|
| input[type="submit"].icon:before, |
| input[type="reset"].icon:before, |
| input[type="button"].icon:before, |
| button.icon:before, |
| .button.icon:before { |
| display: inline-block; |
| position: relative; |
| top: -0.075rem; |
| vertical-align: middle; |
| font-size: 0.8rem; |
| margin: 0 0.375rem 0 -0.325rem; |
| } |
|
|
| input[type="submit"].icon.circle, |
| input[type="reset"].icon.circle, |
| input[type="button"].icon.circle, |
| button.icon.circle, |
| .button.icon.circle { |
| position: relative; |
| width: 3.125rem; |
| height: 3.125rem; |
| line-height: 3.125rem; |
| text-indent: 3.125rem; |
| border-radius: 100%; |
| overflow: hidden; |
| padding: 0; |
| letter-spacing: 0; |
| } |
|
|
| input[type="submit"].icon.circle:before, |
| input[type="reset"].icon.circle:before, |
| input[type="button"].icon.circle:before, |
| button.icon.circle:before, |
| .button.icon.circle:before { |
| display: block; |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: inherit; |
| height: inherit; |
| font-size: 1.25rem; |
| line-height: inherit; |
| margin: 0; |
| text-indent: 0; |
| } |
|
|
| input[type="submit"].icon.circle.fa-angle-left:before, |
| input[type="reset"].icon.circle.fa-angle-left:before, |
| input[type="button"].icon.circle.fa-angle-left:before, |
| button.icon.circle.fa-angle-left:before, |
| .button.icon.circle.fa-angle-left:before { |
| position: relative; |
| left: -0.1rem; |
| font-size: 1.75rem; |
| } |
|
|
| input[type="submit"].icon.circle.fa-angle-right:before, |
| input[type="reset"].icon.circle.fa-angle-right:before, |
| input[type="button"].icon.circle.fa-angle-right:before, |
| button.icon.circle.fa-angle-right:before, |
| .button.icon.circle.fa-angle-right:before { |
| position: relative; |
| left: 0.1rem; |
| font-size: 1.75rem; |
| } |
|
|
| input[type="submit"].fit, |
| input[type="reset"].fit, |
| input[type="button"].fit, |
| button.fit, |
| .button.fit { |
| display: block; |
| margin: 0 0 0.75rem 0; |
| width: 100%; |
| } |
|
|
| input[type="submit"].small, |
| input[type="reset"].small, |
| input[type="button"].small, |
| button.small, |
| .button.small { |
| font-size: 0.4rem; |
| height: 1.875rem; |
| line-height: 1.875rem; |
| padding: 0 1.25rem 0 1.4rem; |
| } |
|
|
| input[type="submit"].large, |
| input[type="reset"].large, |
| input[type="button"].large, |
| button.large, |
| .button.large { |
| font-size: 0.8rem; |
| height: 3.3125rem; |
| line-height: 3.3125rem; |
| padding: 0 2rem 0 2.15rem; |
| } |
|
|
| input[type="submit"].special, |
| input[type="reset"].special, |
| input[type="button"].special, |
| button.special, |
| .button.special { |
| background-color: white; |
| box-shadow: none; |
| color: #2e2b37 !important; |
| } |
|
|
| input[type="submit"].special.color1, |
| input[type="reset"].special.color1, |
| input[type="button"].special.color1, |
| button.special.color1, |
| .button.special.color1 { |
| color: #726193 !important; |
| } |
|
|
| input[type="submit"].special.color2, |
| input[type="reset"].special.color2, |
| input[type="button"].special.color2, |
| button.special.color2, |
| .button.special.color2 { |
| color: #e37b7c !important; |
| } |
|
|
| input[type="submit"].special.color3, |
| input[type="reset"].special.color3, |
| input[type="button"].special.color3, |
| button.special.color3, |
| .button.special.color3 { |
| color: #ffe4b4 !important; |
| } |
|
|
| input[type="submit"].special.color4, |
| input[type="reset"].special.color4, |
| input[type="button"].special.color4, |
| button.special.color4, |
| .button.special.color4 { |
| color: #353865 !important; |
| } |
|
|
| input[type="submit"].special:hover, |
| input[type="reset"].special:hover, |
| input[type="button"].special:hover, |
| button.special:hover, |
| .button.special:hover { |
| background-color: #ffe4b4; |
| } |
|
|
| input[type="submit"].special:active, |
| input[type="reset"].special:active, |
| input[type="button"].special:active, |
| button.special:active, |
| .button.special:active { |
| background-color: #fdd997; |
| } |
|
|
| input[type="submit"].disabled, input[type="submit"]:disabled, |
| input[type="reset"].disabled, |
| input[type="reset"]:disabled, |
| input[type="button"].disabled, |
| input[type="button"]:disabled, |
| button.disabled, |
| button:disabled, |
| .button.disabled, |
| .button:disabled { |
| -moz-pointer-events: none; |
| -webkit-pointer-events: none; |
| -ms-pointer-events: none; |
| pointer-events: none; |
| cursor: default; |
| opacity: 0.5; |
| } |
|
|
| |
|
|
| @-moz-keyframes gallery-modal-spinner { |
| 0% { |
| -moz-transform: rotate(0deg); |
| -webkit-transform: rotate(0deg); |
| -ms-transform: rotate(0deg); |
| transform: rotate(0deg); |
| } |
|
|
| 100% { |
| -moz-transform: rotate(360deg); |
| -webkit-transform: rotate(360deg); |
| -ms-transform: rotate(360deg); |
| transform: rotate(360deg); |
| } |
| } |
|
|
| @-webkit-keyframes gallery-modal-spinner { |
| 0% { |
| -moz-transform: rotate(0deg); |
| -webkit-transform: rotate(0deg); |
| -ms-transform: rotate(0deg); |
| transform: rotate(0deg); |
| } |
|
|
| 100% { |
| -moz-transform: rotate(360deg); |
| -webkit-transform: rotate(360deg); |
| -ms-transform: rotate(360deg); |
| transform: rotate(360deg); |
| } |
| } |
|
|
| @-ms-keyframes gallery-modal-spinner { |
| 0% { |
| -moz-transform: rotate(0deg); |
| -webkit-transform: rotate(0deg); |
| -ms-transform: rotate(0deg); |
| transform: rotate(0deg); |
| } |
|
|
| 100% { |
| -moz-transform: rotate(360deg); |
| -webkit-transform: rotate(360deg); |
| -ms-transform: rotate(360deg); |
| transform: rotate(360deg); |
| } |
| } |
|
|
| @keyframes gallery-modal-spinner { |
| 0% { |
| -moz-transform: rotate(0deg); |
| -webkit-transform: rotate(0deg); |
| -ms-transform: rotate(0deg); |
| transform: rotate(0deg); |
| } |
|
|
| 100% { |
| -moz-transform: rotate(360deg); |
| -webkit-transform: rotate(360deg); |
| -ms-transform: rotate(360deg); |
| transform: rotate(360deg); |
| } |
| } |
|
|
| .gallery { |
| -moz-align-items: stretch; |
| -webkit-align-items: stretch; |
| -ms-align-items: stretch; |
| align-items: stretch; |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| height: 100%; |
| } |
|
|
| .gallery > * { |
| width: 20rem; |
| height: 100%; |
| } |
|
|
| .gallery .image { |
| display: block; |
| position: relative; |
| border-bottom: 0; |
| overflow: hidden; |
| } |
|
|
| .gallery .image img { |
| -moz-transition: -moz-transform 0.2s ease-in-out; |
| -webkit-transition: -webkit-transform 0.2s ease-in-out; |
| -ms-transition: -ms-transform 0.2s ease-in-out; |
| transition: transform 0.2s ease-in-out; |
| } |
|
|
| .gallery .image:after { |
| -moz-transition: opacity 0.2s ease-in-out; |
| -webkit-transition: opacity 0.2s ease-in-out; |
| -ms-transition: opacity 0.2s ease-in-out; |
| transition: opacity 0.2s ease-in-out; |
| } |
|
|
| .gallery .image:hover img { |
| -moz-transform: scale(1.025); |
| -webkit-transform: scale(1.025); |
| -ms-transform: scale(1.025); |
| transform: scale(1.025); |
| } |
|
|
| .gallery .image:hover:after { |
| opacity: 0; |
| } |
|
|
| .gallery .group { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| -ms-flex-wrap: wrap; |
| flex-wrap: wrap; |
| } |
|
|
| .gallery .group > * { |
| height: 50%; |
| } |
|
|
| .gallery .modal { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-align-items: center; |
| -webkit-align-items: center; |
| -ms-align-items: center; |
| align-items: center; |
| -moz-justify-content: center; |
| -webkit-justify-content: center; |
| -ms-justify-content: center; |
| justify-content: center; |
| -moz-pointer-events: none; |
| -webkit-pointer-events: none; |
| -ms-pointer-events: none; |
| pointer-events: none; |
| -moz-user-select: none; |
| -webkit-user-select: none; |
| -ms-user-select: none; |
| user-select: none; |
| -moz-transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s; |
| -webkit-transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s; |
| -ms-transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s; |
| transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s; |
| -webkit-tap-highlight-color: transparent; |
| position: fixed; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| background-color: rgba(46, 43, 55, 0.875); |
| opacity: 0; |
| outline: 0; |
| visibility: none; |
| z-index: 0; |
| } |
|
|
| .gallery .modal:before { |
| -moz-animation: gallery-modal-spinner 1s infinite linear; |
| -webkit-animation: gallery-modal-spinner 1s infinite linear; |
| -ms-animation: gallery-modal-spinner 1s infinite linear; |
| animation: gallery-modal-spinner 1s infinite linear; |
| -moz-transition: opacity 0.25s ease; |
| -webkit-transition: opacity 0.25s ease; |
| -ms-transition: opacity 0.25s ease; |
| transition: opacity 0.25s ease; |
| -moz-transition-delay: 0.5s; |
| -webkit-transition-delay: 0.5s; |
| -ms-transition-delay: 0.5s; |
| transition-delay: 0.5s; |
| content: ''; |
| display: block; |
| position: absolute; |
| top: 50%; |
| left: 50%; |
| width: 4rem; |
| height: 4rem; |
| margin: -2rem 0 0 -2rem; |
| background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='96px' height='96px' viewBox='0 0 96 96' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: rgba(255, 255, 255, 0.875)%3B stroke-width: 1.5px%3B %7D%3C/style%3E%3Cdefs%3E%3CclipPath id='corner'%3E%3Cpolygon points='0,0 48,0 48,48 96,48 96,96 0,96' /%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23corner)'%3E%3Ccircle cx='48' cy='48' r='32'/%3E%3C/g%3E%3C/svg%3E"); |
| background-position: center; |
| background-repeat: no-repeat; |
| background-size: 4rem; |
| opacity: 0; |
| } |
|
|
| .gallery .modal:after { |
| content: ''; |
| display: block; |
| position: absolute; |
| top: 0.5rem; |
| right: 0.5rem; |
| width: 4rem; |
| height: 4rem; |
| background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='64px' viewBox='0 0 64 64' zoomAndPan='disable'%3E%3Cstyle%3Eline %7Bstroke: rgba(255, 255, 255, 0.875)%3Bstroke-width: 1.5px%3B%7D%3C/style%3E%3Cline x1='20' y1='20' x2='44' y2='44' /%3E%3Cline x1='20' y1='44' x2='44' y2='20' /%3E%3C/svg%3E"); |
| background-position: center; |
| background-repeat: no-repeat; |
| background-size: 3rem; |
| cursor: pointer; |
| } |
|
|
| .gallery .modal .inner { |
| -moz-transform: translateY(0.75rem); |
| -webkit-transform: translateY(0.75rem); |
| -ms-transform: translateY(0.75rem); |
| transform: translateY(0.75rem); |
| -moz-transition: opacity 0.25s ease, -moz-transform 0.25s ease; |
| -webkit-transition: opacity 0.25s ease, -webkit-transform 0.25s ease; |
| -ms-transition: opacity 0.25s ease, -ms-transform 0.25s ease; |
| transition: opacity 0.25s ease, transform 0.25s ease; |
| opacity: 0; |
| } |
|
|
| .gallery .modal .inner img { |
| display: block; |
| max-width: 90vw; |
| max-height: 85vh; |
| box-shadow: 0 1rem 3rem 0 rgba(0, 0, 0, 0.35); |
| } |
|
|
| .gallery .modal.visible { |
| -moz-pointer-events: auto; |
| -webkit-pointer-events: auto; |
| -ms-pointer-events: auto; |
| pointer-events: auto; |
| opacity: 1; |
| visibility: visible; |
| z-index: 11000; |
| } |
|
|
| .gallery .modal.visible:before { |
| opacity: 1; |
| } |
|
|
| .gallery .modal.loaded .inner { |
| -moz-transform: translateY(0); |
| -webkit-transform: translateY(0); |
| -ms-transform: translateY(0); |
| transform: translateY(0); |
| -moz-transition: opacity 0.5s ease, -moz-transform 0.5s ease; |
| -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease; |
| -ms-transition: opacity 0.5s ease, -ms-transform 0.5s ease; |
| transition: opacity 0.5s ease, transform 0.5s ease; |
| opacity: 1; |
| } |
|
|
| .gallery .modal.loaded:before { |
| -moz-transition-delay: 0s; |
| -webkit-transition-delay: 0s; |
| -ms-transition-delay: 0s; |
| transition-delay: 0s; |
| opacity: 0; |
| } |
|
|
| @media screen and (max-width: 980px) { |
|
|
| .gallery .modal .inner img { |
| max-width: 100vw; |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| .gallery { |
| -moz-flex-direction: column; |
| -webkit-flex-direction: column; |
| -ms-flex-direction: column; |
| flex-direction: column; |
| height: auto; |
| } |
|
|
| .gallery > * { |
| height: auto; |
| width: 100%; |
| } |
|
|
| .gallery .image { |
| width: 100%; |
| height: 40rem; |
| } |
|
|
| .gallery .group .span-0-25 { |
| width: 8.33333%; |
| } |
|
|
| .gallery .group .span-0-5 { |
| width: 16.66666%; |
| } |
|
|
| .gallery .group .span-0-75 { |
| width: 25%; |
| } |
|
|
| .gallery .group .span-1 { |
| width: 33.33333%; |
| } |
|
|
| .gallery .group .span-1-25 { |
| width: 41.66666%; |
| } |
|
|
| .gallery .group .span-1-5 { |
| width: 50%; |
| } |
|
|
| .gallery .group .span-1-75 { |
| width: 58.33333%; |
| } |
|
|
| .gallery .group .span-2 { |
| width: 66.66666%; |
| } |
|
|
| .gallery .group .span-2-25 { |
| width: 74.99999%; |
| } |
|
|
| .gallery .group .span-2-5 { |
| width: 83.33332%; |
| } |
|
|
| .gallery .group .span-2-75 { |
| width: 91.66666%; |
| } |
|
|
| .gallery .group .span-3 { |
| width: 99.99999%; |
| } |
|
|
| .gallery .group .span-3-25 { |
| width: 108.33332%; |
| } |
|
|
| .gallery .group .span-3-5 { |
| width: 116.66666%; |
| } |
|
|
| .gallery .group .span-3-75 { |
| width: 124.99999%; |
| } |
|
|
| .gallery .group .span-4 { |
| width: 133.33332%; |
| } |
|
|
| .gallery .group .span-4-25 { |
| width: 141.66665%; |
| } |
|
|
| .gallery .group .span-4-5 { |
| width: 149.99998%; |
| } |
|
|
| .gallery .group .span-4-75 { |
| width: 158.33332%; |
| } |
|
|
| .gallery .group .span-5 { |
| width: 166.66665%; |
| } |
|
|
| .gallery .group .span-5-25 { |
| width: 174.99998%; |
| } |
|
|
| .gallery .group .span-5-5 { |
| width: 183.33331%; |
| } |
|
|
| .gallery .group .span-5-75 { |
| width: 191.66665%; |
| } |
|
|
| .gallery .group .span-6 { |
| width: 199.99998%; |
| } |
|
|
| .gallery .group .span-6-25 { |
| width: 208.33331%; |
| } |
|
|
| .gallery .group .span-6-5 { |
| width: 216.66665%; |
| } |
|
|
| .gallery .group .span-6-75 { |
| width: 224.99998%; |
| } |
|
|
| .gallery .group .span-7 { |
| width: 233.33331%; |
| } |
|
|
| .gallery .group .span-7-25 { |
| width: 241.66664%; |
| } |
|
|
| .gallery .group .span-7-5 { |
| width: 249.99997%; |
| } |
|
|
| .gallery .group .span-7-75 { |
| width: 258.33331%; |
| } |
|
|
| .gallery .group .span-8 { |
| width: 266.66664%; |
| } |
|
|
| .gallery .group .span-8-25 { |
| width: 274.99997%; |
| } |
|
|
| .gallery .group .span-8-5 { |
| width: 283.33331%; |
| } |
|
|
| .gallery .group .span-8-75 { |
| width: 291.66664%; |
| } |
|
|
| .gallery .group .span-9 { |
| width: 299.99997%; |
| } |
|
|
| .gallery .group .span-9-25 { |
| width: 308.3333%; |
| } |
|
|
| .gallery .group .span-9-5 { |
| width: 316.66664%; |
| } |
|
|
| .gallery .group .span-9-75 { |
| width: 324.99997%; |
| } |
|
|
| .gallery .group .span-10 { |
| width: 333.3333%; |
| } |
|
|
| .gallery .group .image { |
| height: 20rem; |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 480px) { |
|
|
| .gallery .image { |
| height: 30rem; |
| } |
|
|
| .gallery .group .image { |
| height: 12.5rem; |
| } |
|
|
| } |
|
|
| |
|
|
| .panel { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-flex-grow: 0; |
| -webkit-flex-grow: 0; |
| -ms-flex-grow: 0; |
| flex-grow: 0; |
| -moz-flex-shrink: 0; |
| -webkit-flex-shrink: 0; |
| -ms-flex-shrink: 0; |
| flex-shrink: 0; |
| -moz-justify-content: center; |
| -webkit-justify-content: center; |
| -ms-justify-content: center; |
| justify-content: center; |
| -moz-align-items: stretch; |
| -webkit-align-items: stretch; |
| -ms-align-items: stretch; |
| align-items: stretch; |
| height: 100%; |
| overflow-x: hidden; |
| overflow-y: auto; |
| } |
|
|
| .panel > * { |
| position: relative; |
| min-width: 10rem; |
| } |
|
|
| .panel > *.color0 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, #726193 20%, #e37b7c 60%, #ffe4b4); |
| background-size: 128px 128px, auto; |
| } |
|
|
| .panel > *.color1 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #726193; |
| } |
|
|
| .panel > *.color2 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #e37b7c; |
| } |
|
|
| .panel > *.color3 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #ffe4b4; |
| } |
|
|
| .panel > *.color4 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #353865; |
| } |
|
|
| .panel > *.color1-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #6c5e86; |
| } |
|
|
| .panel > *.color2-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #de7172; |
| } |
|
|
| .panel > *.color3-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #fedea6; |
| } |
|
|
| .panel > *.color4-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #323459; |
| } |
|
|
| .panel > .intro { |
| padding: 3.5rem 3.5rem 2rem 3.5rem ; |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-flex-grow: 0; |
| -webkit-flex-grow: 0; |
| -ms-flex-grow: 0; |
| flex-grow: 0; |
| -moz-flex-shrink: 0; |
| -webkit-flex-shrink: 0; |
| -ms-flex-shrink: 0; |
| flex-shrink: 0; |
| -moz-justify-content: center; |
| -webkit-justify-content: center; |
| -ms-justify-content: center; |
| justify-content: center; |
| -moz-align-items: -moz-flex-start; |
| -webkit-align-items: -webkit-flex-start; |
| -ms-align-items: -ms-flex-start; |
| align-items: flex-start; |
| -moz-flex-direction: column; |
| -webkit-flex-direction: column; |
| -ms-flex-direction: column; |
| flex-direction: column; |
| width: 22rem; |
| } |
|
|
| .panel > .intro.joined { |
| width: 18.5rem; |
| padding-right: 0; |
| } |
|
|
| .panel > .intro.joined + .inner { |
| padding-left: 2.625rem; |
| } |
|
|
| .panel > .inner { |
| padding: 3.5rem 3.5rem 2rem 3.5rem ; |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-flex-grow: 1; |
| -webkit-flex-grow: 1; |
| -ms-flex-grow: 1; |
| flex-grow: 1; |
| -moz-flex-shrink: 1; |
| -webkit-flex-shrink: 1; |
| -ms-flex-shrink: 1; |
| flex-shrink: 1; |
| -moz-justify-content: center; |
| -webkit-justify-content: center; |
| -ms-justify-content: center; |
| justify-content: center; |
| -moz-align-items: -moz-flex-start; |
| -webkit-align-items: -webkit-flex-start; |
| -ms-align-items: -ms-flex-start; |
| align-items: flex-start; |
| -moz-flex-direction: column; |
| -webkit-flex-direction: column; |
| -ms-flex-direction: column; |
| flex-direction: column; |
| position: relative; |
| width: 100%; |
| } |
|
|
| .panel > .inner.columns { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-justify-content: center; |
| -webkit-justify-content: center; |
| -ms-justify-content: center; |
| justify-content: center; |
| -moz-align-items: center; |
| -webkit-align-items: center; |
| -ms-align-items: center; |
| align-items: center; |
| -moz-flex-direction: row; |
| -webkit-flex-direction: row; |
| -ms-flex-direction: row; |
| flex-direction: row; |
| } |
|
|
| .panel > .inner.columns > * { |
| -moz-flex-grow: 0; |
| -webkit-flex-grow: 0; |
| -ms-flex-grow: 0; |
| flex-grow: 0; |
| -moz-flex-shrink: 0; |
| -webkit-flex-shrink: 0; |
| -ms-flex-shrink: 0; |
| flex-shrink: 0; |
| margin-left: 3.5rem; |
| } |
|
|
| .panel > .inner.columns > :first-child { |
| margin-left: 0; |
| } |
|
|
| .panel > .inner.columns.divided > * { |
| margin-left: 7rem; |
| } |
|
|
| .panel > .inner.columns.divided > *:before { |
| content: ''; |
| position: absolute; |
| top: 3.5rem; |
| width: 2px; |
| height: calc(100% - 7rem); |
| margin-left: -3.5rem; |
| background-color: rgba(255, 255, 255, 0.25); |
| } |
|
|
| .panel > .inner.columns.divided > :first-child { |
| margin-left: 0; |
| } |
|
|
| .panel > .inner.columns.divided > :first-child:before { |
| display: none; |
| } |
|
|
| .panel > .inner.columns.aligned { |
| -moz-align-items: -moz-flex-start; |
| -webkit-align-items: -webkit-flex-start; |
| -ms-align-items: -ms-flex-start; |
| align-items: flex-start; |
| } |
|
|
| .panel .span-0-25 { |
| width: 2.5rem; |
| } |
|
|
| .panel .span-0-5 { |
| width: 5rem; |
| } |
|
|
| .panel .span-0-75 { |
| width: 7.5rem; |
| } |
|
|
| .panel .span-1 { |
| width: 10rem; |
| } |
|
|
| .panel .span-1-25 { |
| width: 12.5rem; |
| } |
|
|
| .panel .span-1-5 { |
| width: 15rem; |
| } |
|
|
| .panel .span-1-75 { |
| width: 17.5rem; |
| } |
|
|
| .panel .span-2 { |
| width: 20rem; |
| } |
|
|
| .panel .span-2-25 { |
| width: 22.5rem; |
| } |
|
|
| .panel .span-2-5 { |
| width: 25rem; |
| } |
|
|
| .panel .span-2-75 { |
| width: 27.5rem; |
| } |
|
|
| .panel .span-3 { |
| width: 30rem; |
| } |
|
|
| .panel .span-3-25 { |
| width: 32.5rem; |
| } |
|
|
| .panel .span-3-5 { |
| width: 35rem; |
| } |
|
|
| .panel .span-3-75 { |
| width: 37.5rem; |
| } |
|
|
| .panel .span-4 { |
| width: 40rem; |
| } |
|
|
| .panel .span-4-25 { |
| width: 42.5rem; |
| } |
|
|
| .panel .span-4-5 { |
| width: 45rem; |
| } |
|
|
| .panel .span-4-75 { |
| width: 47.5rem; |
| } |
|
|
| .panel .span-5 { |
| width: 50rem; |
| } |
|
|
| .panel .span-5-25 { |
| width: 52.5rem; |
| } |
|
|
| .panel .span-5-5 { |
| width: 55rem; |
| } |
|
|
| .panel .span-5-75 { |
| width: 57.5rem; |
| } |
|
|
| .panel .span-6 { |
| width: 60rem; |
| } |
|
|
| .panel .span-6-25 { |
| width: 62.5rem; |
| } |
|
|
| .panel .span-6-5 { |
| width: 65rem; |
| } |
|
|
| .panel .span-6-75 { |
| width: 67.5rem; |
| } |
|
|
| .panel .span-7 { |
| width: 70rem; |
| } |
|
|
| .panel .span-7-25 { |
| width: 72.5rem; |
| } |
|
|
| .panel .span-7-5 { |
| width: 75rem; |
| } |
|
|
| .panel .span-7-75 { |
| width: 77.5rem; |
| } |
|
|
| .panel .span-8 { |
| width: 80rem; |
| } |
|
|
| .panel .span-8-25 { |
| width: 82.5rem; |
| } |
|
|
| .panel .span-8-5 { |
| width: 85rem; |
| } |
|
|
| .panel .span-8-75 { |
| width: 87.5rem; |
| } |
|
|
| .panel .span-9 { |
| width: 90rem; |
| } |
|
|
| .panel .span-9-25 { |
| width: 92.5rem; |
| } |
|
|
| .panel .span-9-5 { |
| width: 95rem; |
| } |
|
|
| .panel .span-9-75 { |
| width: 97.5rem; |
| } |
|
|
| .panel .span-10 { |
| width: 100rem; |
| } |
|
|
| .panel.small { |
| width: 35rem; |
| } |
|
|
| .panel.medium { |
| width: 50rem; |
| } |
|
|
| .panel.large { |
| width: 65rem; |
| } |
|
|
| .panel.small .span-0-25, .panel.medium .span-0-25, .panel.large .span-0-25 { |
| width: 2.5%; |
| } |
|
|
| .panel.small .span-0-5, .panel.medium .span-0-5, .panel.large .span-0-5 { |
| width: 5%; |
| } |
|
|
| .panel.small .span-0-75, .panel.medium .span-0-75, .panel.large .span-0-75 { |
| width: 7.5%; |
| } |
|
|
| .panel.small .span-1, .panel.medium .span-1, .panel.large .span-1 { |
| width: 10%; |
| } |
|
|
| .panel.small .span-1-25, .panel.medium .span-1-25, .panel.large .span-1-25 { |
| width: 12.5%; |
| } |
|
|
| .panel.small .span-1-5, .panel.medium .span-1-5, .panel.large .span-1-5 { |
| width: 15%; |
| } |
|
|
| .panel.small .span-1-75, .panel.medium .span-1-75, .panel.large .span-1-75 { |
| width: 17.5%; |
| } |
|
|
| .panel.small .span-2, .panel.medium .span-2, .panel.large .span-2 { |
| width: 20%; |
| } |
|
|
| .panel.small .span-2-25, .panel.medium .span-2-25, .panel.large .span-2-25 { |
| width: 22.5%; |
| } |
|
|
| .panel.small .span-2-5, .panel.medium .span-2-5, .panel.large .span-2-5 { |
| width: 25%; |
| } |
|
|
| .panel.small .span-2-75, .panel.medium .span-2-75, .panel.large .span-2-75 { |
| width: 27.5%; |
| } |
|
|
| .panel.small .span-3, .panel.medium .span-3, .panel.large .span-3 { |
| width: 30%; |
| } |
|
|
| .panel.small .span-3-25, .panel.medium .span-3-25, .panel.large .span-3-25 { |
| width: 32.5%; |
| } |
|
|
| .panel.small .span-3-5, .panel.medium .span-3-5, .panel.large .span-3-5 { |
| width: 35%; |
| } |
|
|
| .panel.small .span-3-75, .panel.medium .span-3-75, .panel.large .span-3-75 { |
| width: 37.5%; |
| } |
|
|
| .panel.small .span-4, .panel.medium .span-4, .panel.large .span-4 { |
| width: 40%; |
| } |
|
|
| .panel.small .span-4-25, .panel.medium .span-4-25, .panel.large .span-4-25 { |
| width: 42.5%; |
| } |
|
|
| .panel.small .span-4-5, .panel.medium .span-4-5, .panel.large .span-4-5 { |
| width: 45%; |
| } |
|
|
| .panel.small .span-4-75, .panel.medium .span-4-75, .panel.large .span-4-75 { |
| width: 47.5%; |
| } |
|
|
| .panel.small .span-5, .panel.medium .span-5, .panel.large .span-5 { |
| width: 50%; |
| } |
|
|
| .panel.small .span-5-25, .panel.medium .span-5-25, .panel.large .span-5-25 { |
| width: 52.5%; |
| } |
|
|
| .panel.small .span-5-5, .panel.medium .span-5-5, .panel.large .span-5-5 { |
| width: 55%; |
| } |
|
|
| .panel.small .span-5-75, .panel.medium .span-5-75, .panel.large .span-5-75 { |
| width: 57.5%; |
| } |
|
|
| .panel.small .span-6, .panel.medium .span-6, .panel.large .span-6 { |
| width: 60%; |
| } |
|
|
| .panel.small .span-6-25, .panel.medium .span-6-25, .panel.large .span-6-25 { |
| width: 62.5%; |
| } |
|
|
| .panel.small .span-6-5, .panel.medium .span-6-5, .panel.large .span-6-5 { |
| width: 65%; |
| } |
|
|
| .panel.small .span-6-75, .panel.medium .span-6-75, .panel.large .span-6-75 { |
| width: 67.5%; |
| } |
|
|
| .panel.small .span-7, .panel.medium .span-7, .panel.large .span-7 { |
| width: 70%; |
| } |
|
|
| .panel.small .span-7-25, .panel.medium .span-7-25, .panel.large .span-7-25 { |
| width: 72.5%; |
| } |
|
|
| .panel.small .span-7-5, .panel.medium .span-7-5, .panel.large .span-7-5 { |
| width: 75%; |
| } |
|
|
| .panel.small .span-7-75, .panel.medium .span-7-75, .panel.large .span-7-75 { |
| width: 77.5%; |
| } |
|
|
| .panel.small .span-8, .panel.medium .span-8, .panel.large .span-8 { |
| width: 80%; |
| } |
|
|
| .panel.small .span-8-25, .panel.medium .span-8-25, .panel.large .span-8-25 { |
| width: 82.5%; |
| } |
|
|
| .panel.small .span-8-5, .panel.medium .span-8-5, .panel.large .span-8-5 { |
| width: 85%; |
| } |
|
|
| .panel.small .span-8-75, .panel.medium .span-8-75, .panel.large .span-8-75 { |
| width: 87.5%; |
| } |
|
|
| .panel.small .span-9, .panel.medium .span-9, .panel.large .span-9 { |
| width: 90%; |
| } |
|
|
| .panel.small .span-9-25, .panel.medium .span-9-25, .panel.large .span-9-25 { |
| width: 92.5%; |
| } |
|
|
| .panel.small .span-9-5, .panel.medium .span-9-5, .panel.large .span-9-5 { |
| width: 95%; |
| } |
|
|
| .panel.small .span-9-75, .panel.medium .span-9-75, .panel.large .span-9-75 { |
| width: 97.5%; |
| } |
|
|
| .panel.small .span-10, .panel.medium .span-10, .panel.large .span-10 { |
| width: 100%; |
| } |
|
|
| .panel.color0 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, #726193 20%, #e37b7c 60%, #ffe4b4); |
| background-size: 128px 128px, auto; |
| } |
|
|
| .panel.color1 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #726193; |
| } |
|
|
| .panel.color2 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #e37b7c; |
| } |
|
|
| .panel.color3 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #ffe4b4; |
| } |
|
|
| .panel.color4 { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #353865; |
| } |
|
|
| .panel.color1-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #6c5e86; |
| } |
|
|
| .panel.color2-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #de7172; |
| } |
|
|
| .panel.color3-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #fedea6; |
| } |
|
|
| .panel.color4-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(45deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #323459; |
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| .panel { |
| -moz-flex-direction: column; |
| -webkit-flex-direction: column; |
| -ms-flex-direction: column; |
| flex-direction: column; |
| height: auto; |
| } |
|
|
| .panel > *.color1 { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #726193; |
| } |
|
|
| .panel > *.color2 { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #e37b7c; |
| } |
|
|
| .panel > *.color3 { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #ffe4b4; |
| } |
|
|
| .panel > *.color4 { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #353865; |
| } |
|
|
| .panel > *.color1-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #6c5e86; |
| } |
|
|
| .panel > *.color2-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #de7172; |
| } |
|
|
| .panel > *.color3-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #fedea6; |
| } |
|
|
| .panel > *.color4-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #323459; |
| } |
|
|
| .panel > .intro { |
| padding: 2.8875rem 1.75rem 1.3875rem 1.75rem ; |
| width: 100% !important; |
| } |
|
|
| .panel > .intro.joined { |
| padding-bottom: 0; |
| padding-right: 1.75rem; |
| } |
|
|
| .panel > .intro.joined + .inner { |
| padding-top: 0; |
| padding-left: 1.75rem; |
| } |
|
|
| .panel > .inner { |
| padding: 2.8875rem 1.75rem 1.3875rem 1.75rem ; |
| } |
|
|
| .panel > .inner.columns { |
| -moz-flex-direction: column; |
| -webkit-flex-direction: column; |
| -ms-flex-direction: column; |
| flex-direction: column; |
| } |
|
|
| .panel > .inner.columns > * { |
| margin-left: 0; |
| margin-top: 0; |
| } |
|
|
| .panel > .inner.columns > :first-child { |
| margin-top: 0; |
| } |
|
|
| .panel > .inner.columns.divided > * { |
| margin-left: 0; |
| margin-top: 3.5rem; |
| } |
|
|
| .panel > .inner.columns.divided > *:before { |
| content: ''; |
| position: absolute; |
| top: auto; |
| left: 1.75rem; |
| width: calc(100% - 3.5rem); |
| height: 2px; |
| margin-left: 0; |
| margin-top: -1.75rem; |
| } |
|
|
| .panel > .inner.columns.divided > :first-child { |
| margin-top: 0; |
| } |
|
|
| .panel .span-0-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-0-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-0-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-1 { |
| width: 100%; |
| } |
|
|
| .panel .span-1-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-1-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-1-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-2 { |
| width: 100%; |
| } |
|
|
| .panel .span-2-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-2-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-2-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-3 { |
| width: 100%; |
| } |
|
|
| .panel .span-3-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-3-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-3-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-4 { |
| width: 100%; |
| } |
|
|
| .panel .span-4-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-4-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-4-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-5-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-5-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-5-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-6 { |
| width: 100%; |
| } |
|
|
| .panel .span-6-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-6-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-6-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-7 { |
| width: 100%; |
| } |
|
|
| .panel .span-7-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-7-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-7-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-8 { |
| width: 100%; |
| } |
|
|
| .panel .span-8-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-8-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-8-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-9 { |
| width: 100%; |
| } |
|
|
| .panel .span-9-25 { |
| width: 100%; |
| } |
|
|
| .panel .span-9-5 { |
| width: 100%; |
| } |
|
|
| .panel .span-9-75 { |
| width: 100%; |
| } |
|
|
| .panel .span-10 { |
| width: 100%; |
| } |
|
|
| .panel.small, .panel.medium, .panel.large { |
| width: 100% !important; |
| } |
|
|
| .panel.small .span-0-25, .panel.medium .span-0-25, .panel.large .span-0-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-0-5, .panel.medium .span-0-5, .panel.large .span-0-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-0-75, .panel.medium .span-0-75, .panel.large .span-0-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-1, .panel.medium .span-1, .panel.large .span-1 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-1-25, .panel.medium .span-1-25, .panel.large .span-1-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-1-5, .panel.medium .span-1-5, .panel.large .span-1-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-1-75, .panel.medium .span-1-75, .panel.large .span-1-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-2, .panel.medium .span-2, .panel.large .span-2 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-2-25, .panel.medium .span-2-25, .panel.large .span-2-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-2-5, .panel.medium .span-2-5, .panel.large .span-2-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-2-75, .panel.medium .span-2-75, .panel.large .span-2-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-3, .panel.medium .span-3, .panel.large .span-3 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-3-25, .panel.medium .span-3-25, .panel.large .span-3-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-3-5, .panel.medium .span-3-5, .panel.large .span-3-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-3-75, .panel.medium .span-3-75, .panel.large .span-3-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-4, .panel.medium .span-4, .panel.large .span-4 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-4-25, .panel.medium .span-4-25, .panel.large .span-4-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-4-5, .panel.medium .span-4-5, .panel.large .span-4-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-4-75, .panel.medium .span-4-75, .panel.large .span-4-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-5, .panel.medium .span-5, .panel.large .span-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-5-25, .panel.medium .span-5-25, .panel.large .span-5-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-5-5, .panel.medium .span-5-5, .panel.large .span-5-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-5-75, .panel.medium .span-5-75, .panel.large .span-5-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-6, .panel.medium .span-6, .panel.large .span-6 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-6-25, .panel.medium .span-6-25, .panel.large .span-6-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-6-5, .panel.medium .span-6-5, .panel.large .span-6-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-6-75, .panel.medium .span-6-75, .panel.large .span-6-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-7, .panel.medium .span-7, .panel.large .span-7 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-7-25, .panel.medium .span-7-25, .panel.large .span-7-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-7-5, .panel.medium .span-7-5, .panel.large .span-7-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-7-75, .panel.medium .span-7-75, .panel.large .span-7-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-8, .panel.medium .span-8, .panel.large .span-8 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-8-25, .panel.medium .span-8-25, .panel.large .span-8-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-8-5, .panel.medium .span-8-5, .panel.large .span-8-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-8-75, .panel.medium .span-8-75, .panel.large .span-8-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-9, .panel.medium .span-9, .panel.large .span-9 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-9-25, .panel.medium .span-9-25, .panel.large .span-9-25 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-9-5, .panel.medium .span-9-5, .panel.large .span-9-5 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-9-75, .panel.medium .span-9-75, .panel.large .span-9-75 { |
| width: 100%; |
| } |
|
|
| .panel.small .span-10, .panel.medium .span-10, .panel.large .span-10 { |
| width: 100%; |
| } |
|
|
| .panel.color1 { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #726193; |
| } |
|
|
| .panel.color2 { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #e37b7c; |
| } |
|
|
| .panel.color3 { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #ffe4b4; |
| } |
|
|
| .panel.color4 { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.25) 25%, rgba(227, 123, 124, 0.25) 50%, rgba(255, 228, 180, 0.25)); |
| background-size: 128px 128px, auto; |
| background-color: #353865; |
| } |
|
|
| .panel.color1-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #6c5e86; |
| } |
|
|
| .panel.color2-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #de7172; |
| } |
|
|
| .panel.color3-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #fedea6; |
| } |
|
|
| .panel.color4-alt { |
| background-image: url("../../images/overlay.png"), linear-gradient(135deg, rgba(114, 97, 147, 0.175) 25%, rgba(227, 123, 124, 0.175) 50%, rgba(255, 228, 180, 0.175)); |
| background-size: 128px 128px, auto; |
| background-color: #323459; |
| } |
|
|
| } |
|
|
| |
|
|
| .panel.banner { |
| -moz-align-items: stretch; |
| -webkit-align-items: stretch; |
| -ms-align-items: stretch; |
| align-items: stretch; |
| } |
|
|
| .panel.banner .content { |
| padding: 3.5rem 3.5rem 2rem 3.5rem ; |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-flex-direction: column; |
| -webkit-flex-direction: column; |
| -ms-flex-direction: column; |
| flex-direction: column; |
| -moz-justify-content: center; |
| -webkit-justify-content: center; |
| -ms-justify-content: center; |
| justify-content: center; |
| -moz-flex-grow: 0; |
| -webkit-flex-grow: 0; |
| -ms-flex-grow: 0; |
| flex-grow: 0; |
| -moz-flex-shrink: 0; |
| -webkit-flex-shrink: 0; |
| -ms-flex-shrink: 0; |
| flex-shrink: 0; |
| } |
|
|
| .panel.banner .content > .actions:last-child { |
| margin-bottom: 0; |
| } |
|
|
| .panel.banner .image { |
| -moz-flex-grow: 0; |
| -webkit-flex-grow: 0; |
| -ms-flex-grow: 0; |
| flex-grow: 0; |
| -moz-flex-shrink: 0; |
| -webkit-flex-shrink: 0; |
| -ms-flex-shrink: 0; |
| flex-shrink: 0; |
| position: relative; |
| } |
|
|
| .panel.banner .image img { |
| -moz-object-fit: cover; |
| -webkit-object-fit: cover; |
| -ms-object-fit: cover; |
| object-fit: cover; |
| display: block; |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| } |
|
|
| .panel.banner.left { |
| -moz-flex-direction: row; |
| -webkit-flex-direction: row; |
| -ms-flex-direction: row; |
| flex-direction: row; |
| } |
|
|
| .panel.banner.right { |
| -moz-flex-direction: row-reverse; |
| -webkit-flex-direction: row-reverse; |
| -ms-flex-direction: row-reverse; |
| flex-direction: row-reverse; |
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| .panel.banner .content { |
| padding: 2.8875rem 1.75rem 1.3875rem 1.75rem ; |
| -moz-flex-basis: 60%; |
| -webkit-flex-basis: 60%; |
| -ms-flex-basis: 60%; |
| flex-basis: 60%; |
| } |
|
|
| .panel.banner .content > .actions:last-child { |
| margin-bottom: 1.5rem; |
| } |
|
|
| .panel.banner .image { |
| -moz-flex-basis: 40%; |
| -webkit-flex-basis: 40%; |
| -ms-flex-basis: 40%; |
| flex-basis: 40%; |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 736px) and (orientation: portrait) { |
|
|
| .panel.banner .content { |
| -moz-flex-basis: auto; |
| -webkit-flex-basis: auto; |
| -ms-flex-basis: auto; |
| flex-basis: auto; |
| } |
|
|
| .panel.banner .image { |
| -moz-flex-basis: auto; |
| -webkit-flex-basis: auto; |
| -ms-flex-basis: auto; |
| flex-basis: auto; |
| height: 18rem; |
| } |
|
|
| .panel.banner.left { |
| -moz-flex-direction: column; |
| -webkit-flex-direction: column; |
| -ms-flex-direction: column; |
| flex-direction: column; |
| } |
|
|
| .panel.banner.right { |
| -moz-flex-direction: column-reverse; |
| -webkit-flex-direction: column-reverse; |
| -ms-flex-direction: column-reverse; |
| flex-direction: column-reverse; |
| } |
|
|
| } |
|
|
| |
|
|
| .panel.spotlight { |
| -moz-align-items: stretch; |
| -webkit-align-items: stretch; |
| -ms-align-items: stretch; |
| align-items: stretch; |
| position: relative; |
| } |
|
|
| .panel.spotlight > * { |
| z-index: 1; |
| } |
|
|
| .panel.spotlight .content { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-flex-direction: column; |
| -webkit-flex-direction: column; |
| -ms-flex-direction: column; |
| flex-direction: column; |
| -moz-justify-content: center; |
| -webkit-justify-content: center; |
| -ms-justify-content: center; |
| justify-content: center; |
| padding: 3.5rem 3.5rem 2rem 3.5rem ; |
| } |
|
|
| .panel.spotlight .image { |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| z-index: 0; |
| } |
|
|
| .panel.spotlight .image img { |
| -moz-object-fit: cover; |
| -webkit-object-fit: cover; |
| -ms-object-fit: cover; |
| object-fit: cover; |
| display: block; |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| } |
|
|
| .panel.spotlight.left { |
| -moz-justify-content: -moz-flex-start; |
| -webkit-justify-content: -webkit-flex-start; |
| -ms-justify-content: -ms-flex-start; |
| justify-content: flex-start; |
| } |
|
|
| .panel.spotlight.left .content { |
| background-image: linear-gradient(-90deg, transparent 0%, rgba(0, 0, 0, 0.125) 30%, rgba(0, 0, 0, 0.175) 50%); |
| } |
|
|
| .panel.spotlight.right { |
| -moz-justify-content: -moz-flex-end; |
| -webkit-justify-content: -webkit-flex-end; |
| -ms-justify-content: -ms-flex-end; |
| justify-content: flex-end; |
| } |
|
|
| .panel.spotlight.right .content { |
| background-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.125) 30%, rgba(0, 0, 0, 0.175) 50%); |
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| .panel.spotlight .content { |
| padding: 2.8875rem 1.75rem 1.3875rem 1.75rem ; |
| -moz-flex-direction: column !important; |
| -webkit-flex-direction: column !important; |
| -ms-flex-direction: column !important; |
| flex-direction: column !important; |
| background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.25) 70%, rgba(0, 0, 0, 0.175)) !important; |
| min-height: 25rem; |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 480px) { |
|
|
| .panel.spotlight .content { |
| min-height: 30rem; |
| } |
|
|
| } |
|
|
| |
|
|
| .page-wrapper { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-align-items: center; |
| -webkit-align-items: center; |
| -ms-align-items: center; |
| align-items: center; |
| -moz-justify-content: -moz-flex-start; |
| -webkit-justify-content: -webkit-flex-start; |
| -ms-justify-content: -ms-flex-start; |
| justify-content: flex-start; |
| -moz-flex-grow: 1; |
| -webkit-flex-grow: 1; |
| -ms-flex-grow: 1; |
| flex-grow: 1; |
| -moz-flex-shrink: 1; |
| -webkit-flex-shrink: 1; |
| -ms-flex-shrink: 1; |
| flex-shrink: 1; |
| height: 100%; |
| padding: 5rem; |
| } |
|
|
| @media screen and (orientation: portrait) { |
|
|
| .page-wrapper { |
| padding-left: 2rem; |
| padding-right: 2rem; |
| } |
|
|
| } |
|
|
| @media screen and (min-aspect-ratio: 16 / 7) { |
|
|
| .page-wrapper { |
| padding: 6vh; |
| } |
|
|
| } |
|
|
| @media screen and (min-aspect-ratio: 16 / 6) { |
|
|
| .page-wrapper { |
| padding: 0; |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| .page-wrapper { |
| height: auto; |
| padding: 1rem; |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 480px) { |
|
|
| .page-wrapper { |
| padding: 0; |
| } |
|
|
| } |
|
|
| |
|
|
| .wrapper { |
| display: -moz-flex; |
| display: -webkit-flex; |
| display: -ms-flex; |
| display: flex; |
| -moz-flex-direction: row; |
| -webkit-flex-direction: row; |
| -ms-flex-direction: row; |
| flex-direction: row; |
| -moz-transition: opacity 1s ease-out, -moz-transform 0.75s ease-out; |
| -webkit-transition: opacity 1s ease-out, -webkit-transform 0.75s ease-out; |
| -ms-transition: opacity 1s ease-out, -ms-transform 0.75s ease-out; |
| transition: opacity 1s ease-out, transform 0.75s ease-out; |
| -moz-transition-delay: 0.25s; |
| -webkit-transition-delay: 0.25s; |
| -ms-transition-delay: 0.25s; |
| transition-delay: 0.25s; |
| cursor: default; |
| position: relative; |
| height: 32rem; |
| box-shadow: 0 2rem 4rem 0.25rem rgba(46, 43, 55, 0.575); |
| } |
|
|
| .wrapper > .scrollZone { |
| position: fixed; |
| width: 6rem; |
| height: inherit; |
| cursor: -moz-grab; |
| cursor: -webkit-grab; |
| cursor: -ms-grab; |
| cursor: grab; |
| z-index: 10100; |
| } |
|
|
| .wrapper > .scrollZone.left { |
| left: 0; |
| } |
|
|
| .wrapper > .scrollZone.right { |
| right: 0; |
| } |
|
|
| .wrapper > .copyright { |
| position: absolute; |
| bottom: -3rem; |
| right: 31%; |
| font-size: 0.8rem; |
| color: rgba(0, 0, 0, 0.93); |
| margin-bottom: 0; |
| } |
|
|
| .wrapper > .copyright a:hover { |
| color: inherit; |
| } |
|
|
| .wrapper.is-dragging { |
| -moz-user-select: none; |
| -webkit-user-select: none; |
| -ms-user-select: none; |
| user-select: none; |
| cursor: -moz-grab; |
| cursor: -webkit-grab; |
| cursor: -ms-grab; |
| cursor: grab; |
| } |
|
|
| .wrapper.is-dragging * { |
| -moz-user-select: none; |
| -webkit-user-select: none; |
| -ms-user-select: none; |
| user-select: none; |
| } |
|
|
| .wrapper.is-dragging *:not(a, .image) { |
| cursor: -moz-grab; |
| cursor: -webkit-grab; |
| cursor: -ms-grab; |
| cursor: grab; |
| } |
|
|
| .wrapper.is-dragged * { |
| -moz-pointer-events: none; |
| -webkit-pointer-events: none; |
| -ms-pointer-events: none; |
| pointer-events: none; |
| } |
|
|
| body.is-loading .wrapper { |
| -moz-transform: translateX(2rem); |
| -webkit-transform: translateX(2rem); |
| -ms-transform: translateX(2rem); |
| transform: translateX(2rem); |
| opacity: 0; |
| } |
|
|
| @media screen and (max-width: 736px) { |
|
|
| .wrapper { |
| -moz-flex-direction: column; |
| -webkit-flex-direction: column; |
| -ms-flex-direction: column; |
| flex-direction: column; |
| height: auto; |
| margin: 0 0 5rem 0; |
| box-shadow: 0 0.25rem 1.5rem 0.25rem rgba(46, 43, 55, 0.5); |
| } |
|
|
| .wrapper > .scrollZone { |
| display: none; |
| } |
|
|
| .wrapper > .copyright { |
| display: block; |
| width: 100%; |
| text-align: center; |
| } |
|
|
| body.is-loading .wrapper { |
| -moz-transform: translateY(1rem); |
| -webkit-transform: translateY(1rem); |
| -ms-transform: translateY(1rem); |
| transform: translateY(1rem); |
| } |
|
|
| } |
|
|
| @media screen and (max-width: 480px) { |
|
|
| .wrapper { |
| box-shadow: none; |
| } |
|
|
| body.is-loading .wrapper { |
| -moz-transform: none; |
| -webkit-transform: none; |
| -ms-transform: none; |
| transform: none; |
| } |
|
|
| } |
