.button-fill,
.button-filled,
.button-get-started,
.button-underline,
.error span,
.font-label,
.font-link,
.font-paragraph-medium,
.font-paragraph-small,
.input-default,
.page-about .customers .name,
.page-blog-detail .body h2,
.page-career-detail .body h2,
.page-landing .customers .name,
.textarea-default,
body,
footer h1,
footer li,
header nav,
header.compact .number {

    font-family: 'Oswald';
    font-weight: 300;

}
.font-h1,

.font-h2,

.font-h3,

.font-hero,

.page-blog-detail .body h1,

.page-career-detail .body h1 {

    font-family: 'Oswald';

    font-weight: bold;

}



/*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */



html {

    line-height: 1.15;

    -ms-text-size-adjust: 100%;

    -webkit-text-size-adjust: 100%

}



body {

    margin: 0

}



article,

aside,

footer,

header,

nav,

section {

    display: block

}



h1 {

    font-size: 2em;

    margin: .67em 0

}



figcaption,

figure {

    display: block

}



figure {

    margin: 1em 40px

}



hr {

    -webkit-box-sizing: content-box;

    box-sizing: content-box;

    height: 0;

    overflow: visible

}



main {

    display: block

}



pre {

    font-family: monospace, monospace;

    font-size: 1em

}



a {

    background-color: transparent;

    -webkit-text-decoration-skip: objects

}



abbr[title] {

    border-bottom: none;

    text-decoration: underline;

    -webkit-text-decoration: underline dotted;

    text-decoration: underline dotted

}



b,

strong {

    font-weight: inherit

}



b,

strong {

    font-weight: bolder

}



code,

kbd,

samp {

    font-family: monospace, monospace;

    font-size: 1em

}



dfn {

    font-style: italic

}



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: -.25em

}



sup {

    top: -.5em

}



audio,

video {

    display: inline-block

}



audio:not([controls]) {

    display: none;

    height: 0

}



img {

    border-style: none

}



svg:not(:root) {

    overflow: hidden

}



button,

input,

optgroup,

select,

textarea {

    font-family: sans-serif;

    font-size: 100%;

    line-height: 1.15;

    margin: 0

}



button {

    overflow: visible

}



button,

select {

    text-transform: none

}



[type=reset],

[type=submit],

button,

html [type=button] {

    -webkit-appearance: button

}



[type=button]::-moz-focus-inner,

[type=reset]::-moz-focus-inner,

[type=submit]::-moz-focus-inner,

button::-moz-focus-inner {

    border-style: none;

    padding: 0

}



[type=button]:-moz-focusring,

[type=reset]:-moz-focusring,

[type=submit]:-moz-focusring,

button:-moz-focusring {

    outline: 1px dotted ButtonText;

}



input {

    overflow: visible

}



[type=checkbox],

[type=radio] {

    -webkit-box-sizing: border-box;

    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;

    outline-offset: -2px

}



[type=search]::-webkit-search-cancel-button,

[type=search]::-webkit-search-decoration {

    -webkit-appearance: none

}



::-webkit-file-upload-button {

    -webkit-appearance: button;

    font: inherit

}



fieldset {

    padding: .35em .75em .625em

}



legend {

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    display: table;

    max-width: 100%;

    padding: 0;

    color: inherit;

    white-space: normal

}



progress {

    display: inline-block;

    vertical-align: baseline

}



textarea {

    overflow: auto

}



details {

    display: block

}



summary {

    display: list-item

}



menu {

    display: block

}



canvas {

    display: inline-block

}



template {

    display: none

}



[hidden] {

    display: none

}



.jssocials-shares {

    margin: .2em 0

}



.jssocials-shares * {

    -webkit-box-sizing: border-box;

    box-sizing: border-box

}



.jssocials-share {

    display: inline-block;

    vertical-align: top;

    margin: .3em .6em .3em 0

}



.jssocials-share:last-child {

    margin-right: 0

}



.jssocials-share-logo {

    width: 1em;

    vertical-align: middle;

    font-size: 1.5em

}



img.jssocials-share-logo {

    width: auto;

    height: 1em

}



.jssocials-share-link {

    display: inline-block;

    text-align: center;

    text-decoration: none;

    line-height: 1

}



.jssocials-share-link.jssocials-share-link-count {

    padding-top: .2em

}



.jssocials-share-link.jssocials-share-link-count .jssocials-share-count {

    display: block;

    font-size: .6em;

    margin: 0 -.5em -.8em -.5em

}



.jssocials-share-link.jssocials-share-no-count {

    padding-top: .5em

}



.jssocials-share-link.jssocials-share-no-count .jssocials-share-count {

    height: 1em

}



.jssocials-share-label {

    padding-left: .3em;

    vertical-align: middle

}



.jssocials-share-count-box {

    display: inline-block;

    height: 1.5em;

    padding: 0 .3em;

    line-height: 1;

    vertical-align: middle;

    cursor: default

}



.jssocials-share-count-box.jssocials-share-no-count {

    display: none

}



.jssocials-share-count {

    line-height: 1.5em;

    vertical-align: middle

}



.jssocials-share-twitter .jssocials-share-link {

    background: #00aced

}



.jssocials-share-twitter .jssocials-share-link:hover {

    background: #0087ba

}



.jssocials-share-facebook .jssocials-share-link {

    background: #3b5998

}



.jssocials-share-facebook .jssocials-share-link:hover {

    background: #2d4373

}



.jssocials-share-googleplus .jssocials-share-link {

    background: #dd4b39

}



.jssocials-share-googleplus .jssocials-share-link:hover {

    background: #c23321

}



.jssocials-share-linkedin .jssocials-share-link {

    background: #007bb6

}



.jssocials-share-linkedin .jssocials-share-link:hover {

    background: #005983

}



.jssocials-share-pinterest .jssocials-share-link {

    background: #cb2027

}



.jssocials-share-pinterest .jssocials-share-link:hover {

    background: #9f191f

}



.jssocials-share-email .jssocials-share-link {

    background: #3490f3

}



.jssocials-share-email .jssocials-share-link:hover {

    background: #0e76e6

}



.jssocials-share-stumbleupon .jssocials-share-link {

    background: #eb4823

}



.jssocials-share-stumbleupon .jssocials-share-link:hover {

    background: #c93412

}



.jssocials-share-whatsapp .jssocials-share-link {

    background: #29a628

}



.jssocials-share-whatsapp .jssocials-share-link:hover {

    background: #1f7d1e

}



.jssocials-share-telegram .jssocials-share-link {

    background: #2ca5e0

}



.jssocials-share-telegram .jssocials-share-link:hover {

    background: #1c88bd

}



.jssocials-share-line .jssocials-share-link {

    background: #25af00

}



.jssocials-share-line .jssocials-share-link:hover {

    background: #1a7c00

}



.jssocials-share-viber .jssocials-share-link {

    background: #7b519d

}



.jssocials-share-viber .jssocials-share-link:hover {

    background: #61407b

}



.jssocials-share-pocket .jssocials-share-link {

    background: #ef4056

}



.jssocials-share-pocket .jssocials-share-link:hover {

    background: #e9132e

}



.jssocials-share-messenger .jssocials-share-link {

    background: #0084ff

}



.jssocials-share-messenger .jssocials-share-link:hover {

    background: #006acc

}



.jssocials-share-vkontakte .jssocials-share-link {

    background: #45668e

}



.jssocials-share-vkontakte .jssocials-share-link:hover {

    background: #344d6c

}



.jssocials-share-rss .jssocials-share-link {

    background: #f90

}



.jssocials-share-rss .jssocials-share-link:hover {

    background: #cc7a00

}



.jssocials-share-link {

    padding: .5em .6em;

    color: #fff;

    -webkit-transition: background .2s ease-in-out, border-color .2s ease-in-out;

    transition: background .2s ease-in-out, border-color .2s ease-in-out

}



.jssocials-share-link:active,

.jssocials-share-link:focus,

.jssocials-share-link:hover {

    color: #fff

}



.jssocials-share-count-box {

    position: relative;

    height: 2.5em;

    padding: 0 .3em;

    margin-left: .3em;

    background: #f5f5f5;

    -webkit-transition: background .2s ease-in-out, border-color .2s ease-in-out;

    transition: background .2s ease-in-out, border-color .2s ease-in-out

}



.jssocials-share-count-box:hover {

    background: #dcdcdc

}



.jssocials-share-count-box:hover:after {

    border-color: transparent #dcdcdc transparent transparent

}



.jssocials-share-count-box:after {

    content: "";

    display: block;

    position: absolute;

    top: .85em;

    left: -.3em;

    width: 0;

    height: 0;

    border-width: .4em .4em .4em 0;

    border-style: solid;

    border-color: transparent #f5f5f5 transparent transparent;

    -webkit-transform: rotate(360deg);

    transform: rotate(360deg);

    -webkit-transition: background .2s ease-in-out, border-color .2s ease-in-out;

    transition: background .2s ease-in-out, border-color .2s ease-in-out

}



.jssocials-share-count-box .jssocials-share-count {

    line-height: 2.5em;

    color: #444

}



.swiper-container {

    margin: 0 auto;

    position: relative;

    overflow: hidden;

    list-style: none;

    padding: 0;

    z-index: 1

}



.swiper-container-no-flexbox .swiper-slide {

    float: left

}



.swiper-container-vertical>.swiper-wrapper {

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -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;

    -webkit-transition-property: -webkit-transform;

    transition-property: -webkit-transform;

    transition-property: transform;

    transition-property: transform, -webkit-transform;

    -webkit-box-sizing: content-box;

    box-sizing: content-box

}



.swiper-container-android .swiper-slide,

.swiper-wrapper {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0)

}



.swiper-container-multirow>.swiper-wrapper {

    -ms-flex-wrap: wrap;

    flex-wrap: wrap

}



.swiper-container-free-mode>.swiper-wrapper {

    -webkit-transition-timing-function: ease-out;

    transition-timing-function: ease-out;

    margin: 0 auto

}



.swiper-slide {

    -ms-flex-negative: 0;

    flex-shrink: 0;

    width: 100%;

    height: 100%;

    position: relative;

    -webkit-transition-property: -webkit-transform;

    transition-property: -webkit-transform;

    transition-property: transform;

    transition-property: transform, -webkit-transform

}



.swiper-slide-invisible-blank {

    visibility: hidden

}



.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;

    -webkit-transition-property: height, -webkit-transform;

    transition-property: height, -webkit-transform;

    transition-property: transform, height;

    transition-property: transform, height, -webkit-transform

}



.swiper-container-3d {

    -webkit-perspective: 1200px;

    perspective: 1200px

}



.swiper-container-3d .swiper-cube-shadow,

.swiper-container-3d .swiper-slide,

.swiper-container-3d .swiper-slide-shadow-bottom,

.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-wrapper {

    -webkit-transform-style: preserve-3d;

    transform-style: preserve-3d

}



.swiper-container-3d .swiper-slide-shadow-bottom,

.swiper-container-3d .swiper-slide-shadow-left,

.swiper-container-3d .swiper-slide-shadow-right,

.swiper-container-3d .swiper-slide-shadow-top {

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    pointer-events: none;

    z-index: 10

}



.swiper-container-3d .swiper-slide-shadow-left {

    background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));

    background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))

}



.swiper-container-3d .swiper-slide-shadow-right {

    background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));

    background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))

}



.swiper-container-3d .swiper-slide-shadow-top {

    background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));

    background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))

}



.swiper-container-3d .swiper-slide-shadow-bottom {

    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));

    background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))

}



.swiper-container-wp8-horizontal,

.swiper-container-wp8-horizontal>.swiper-wrapper {

    -ms-touch-action: pan-y;

    touch-action: pan-y

}



.swiper-container-wp8-vertical,

.swiper-container-wp8-vertical>.swiper-wrapper {

    -ms-touch-action: pan-x;

    touch-action: pan-x

}



.swiper-button-next,

.swiper-button-prev {

    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-next.swiper-button-disabled,

.swiper-button-prev.swiper-button-disabled {

    opacity: .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-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-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-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")

}



.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-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-lock {

    display: none

}



.swiper-pagination {

    position: absolute;

    text-align: center;

    -webkit-transition: .3s opacity;

    transition: .3s opacity;

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

    z-index: 10

}



.swiper-pagination.swiper-pagination-hidden {

    opacity: 0

}



.swiper-container-horizontal>.swiper-pagination-bullets,

.swiper-pagination-custom,

.swiper-pagination-fraction {

    bottom: 10px;

    left: 0;

    width: 100%

}



.swiper-pagination-bullets-dynamic {

    overflow: hidden;

    font-size: 0

}



.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {

    -webkit-transform: scale(.33);

    transform: scale(.33);

    position: relative

}



.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {

    -webkit-transform: scale(1);

    transform: scale(1)

}



.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {

    -webkit-transform: scale(1);

    transform: scale(1)

}



.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {

    -webkit-transform: scale(.66);

    transform: scale(.66)

}



.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {

    -webkit-transform: scale(.33);

    transform: scale(.33)

}



.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {

    -webkit-transform: scale(.66);

    transform: scale(.66)

}



.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {

    -webkit-transform: scale(.33);

    transform: scale(.33)

}



.swiper-pagination-bullet {

    width: 8px;

    height: 8px;

    display: inline-block;

    border-radius: 100%;

    background: #000;

    opacity: .2

}



button.swiper-pagination-bullet {

    border: none;

    margin: 0;

    padding: 0;

    -webkit-box-shadow: none;

    box-shadow: none;

    -webkit-appearance: none;

    -moz-appearance: none;

    appearance: none

}



.swiper-pagination-clickable .swiper-pagination-bullet {

    cursor: pointer

}



.swiper-pagination-bullet-active {

    opacity: 1;

    background: #007aff

}



.swiper-container-vertical>.swiper-pagination-bullets {

    right: 10px;

    top: 50%;

    -webkit-transform: translate3d(0, -50%, 0);

    transform: translate3d(0, -50%, 0)

}



.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {

    margin: 6px 0;

    display: block

}



.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {

    top: 50%;

    -webkit-transform: translateY(-50%);

    transform: translateY(-50%);

    width: 8px

}



.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {

    display: inline-block;

    -webkit-transition: .2s top, .2s -webkit-transform;

    transition: .2s top, .2s -webkit-transform;

    transition: .2s transform, .2s top;

    transition: .2s transform, .2s top, .2s -webkit-transform

}



.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {

    margin: 0 4px

}



.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {

    left: 50%;

    -webkit-transform: translateX(-50%);

    transform: translateX(-50%);

    white-space: nowrap

}



.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {

    -webkit-transition: .2s left, .2s -webkit-transform;

    transition: .2s left, .2s -webkit-transform;

    transition: .2s transform, .2s left;

    transition: .2s transform, .2s left, .2s -webkit-transform

}



.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {

    -webkit-transition: .2s right, .2s -webkit-transform;

    transition: .2s right, .2s -webkit-transform;

    transition: .2s transform, .2s right;

    transition: .2s transform, .2s right, .2s -webkit-transform

}



.swiper-pagination-progressbar {

    background: rgba(0, 0, 0, .25);

    position: absolute

}



.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {

    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-progressbar .swiper-pagination-progressbar-fill {

    -webkit-transform-origin: right top;

    transform-origin: right top

}



.swiper-container-horizontal>.swiper-pagination-progressbar,

.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {

    width: 100%;

    height: 4px;

    left: 0;

    top: 0

}



.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,

.swiper-container-vertical>.swiper-pagination-progressbar {

    width: 4px;

    height: 100%;

    left: 0;

    top: 0

}



.swiper-pagination-white .swiper-pagination-bullet-active {

    background: #fff

}



.swiper-pagination-progressbar.swiper-pagination-white {

    background: rgba(255, 255, 255, .25)

}



.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {

    background: #fff

}



.swiper-pagination-black .swiper-pagination-bullet-active {

    background: #000

}



.swiper-pagination-progressbar.swiper-pagination-black {

    background: rgba(0, 0, 0, .25)

}



.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {

    background: #000

}



.swiper-pagination-lock {

    display: none

}



.swiper-scrollbar {

    border-radius: 10px;

    position: relative;

    -ms-touch-action: none;

    background: rgba(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, .5);

    border-radius: 10px;

    left: 0;

    top: 0

}



.swiper-scrollbar-cursor-drag {

    cursor: move

}



.swiper-scrollbar-lock {

    display: none

}



.swiper-zoom-container {

    width: 100%;

    height: 100%;

    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;

    text-align: center

}



.swiper-zoom-container>canvas,

.swiper-zoom-container>img,

.swiper-zoom-container>svg {

    max-width: 100%;

    max-height: 100%;

    -o-object-fit: contain;

    object-fit: contain

}



.swiper-slide-zoomed {

    cursor: move

}



.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);

        transform: rotate(360deg)

    }

}



@keyframes swiper-preloader-spin {

    100% {

        -webkit-transform: rotate(360deg);

        transform: rotate(360deg)

    }

}



.swiper-container .swiper-notification {

    position: absolute;

    left: 0;

    top: 0;

    pointer-events: none;

    opacity: 0;

    z-index: -1000

}



.swiper-container-fade.swiper-container-free-mode .swiper-slide {

    -webkit-transition-timing-function: ease-out;

    transition-timing-function: ease-out

}



.swiper-container-fade .swiper-slide {

    pointer-events: none;

    -webkit-transition-property: opacity;

    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

}



.swiper-container-cube {

    overflow: visible

}



.swiper-container-cube .swiper-slide {

    pointer-events: none;

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden;

    z-index: 1;

    visibility: hidden;

    -webkit-transform-origin: 0 0;

    transform-origin: 0 0;

    width: 100%;

    height: 100%

}



.swiper-container-cube .swiper-slide .swiper-slide {

    pointer-events: none

}



.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-active .swiper-slide-active {

    pointer-events: auto

}



.swiper-container-cube .swiper-slide-active,

.swiper-container-cube .swiper-slide-next,

.swiper-container-cube .swiper-slide-next+.swiper-slide,

.swiper-container-cube .swiper-slide-prev {

    pointer-events: auto;

    visibility: visible

}



.swiper-container-cube .swiper-slide-shadow-bottom,

.swiper-container-cube .swiper-slide-shadow-left,

.swiper-container-cube .swiper-slide-shadow-right,

.swiper-container-cube .swiper-slide-shadow-top {

    z-index: 0;

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden

}



.swiper-container-cube .swiper-cube-shadow {

    position: absolute;

    left: 0;

    bottom: 0;

    width: 100%;

    height: 100%;

    background: #000;

    opacity: .6;

    -webkit-filter: blur(50px);

    filter: blur(50px);

    z-index: 0

}



.swiper-container-flip {

    overflow: visible

}



.swiper-container-flip .swiper-slide {

    pointer-events: none;

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden;

    z-index: 1

}



.swiper-container-flip .swiper-slide .swiper-slide {

    pointer-events: none

}



.swiper-container-flip .swiper-slide-active,

.swiper-container-flip .swiper-slide-active .swiper-slide-active {

    pointer-events: auto

}



.swiper-container-flip .swiper-slide-shadow-bottom,

.swiper-container-flip .swiper-slide-shadow-left,

.swiper-container-flip .swiper-slide-shadow-right,

.swiper-container-flip .swiper-slide-shadow-top {

    z-index: 0;

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden

}



.swiper-container-coverflow .swiper-wrapper {

    -ms-perspective: 1200px

}
.grey{
    background-color: #f6f6f7;
}


/*!

 * Hamburgers

 * @description Tasty CSS-animated hamburgers

 * @author Jonathan Suh @jonsuh

 * @site https://jonsuh.com/hamburgers

 * @link https://github.com/jonsuh/hamburgers

 */



.hamburger {

    padding: 0 0;

    display: inline-block;

    cursor: pointer;

    -webkit-transition-property: opacity, -webkit-filter;

    transition-property: opacity, -webkit-filter;

    transition-property: opacity, filter;

    transition-property: opacity, filter, -webkit-filter;

    -webkit-transition-duration: .55s;

    transition-duration: .55s;

    -webkit-transition-timing-function: cubic-bezier(.475, .425, 0, .995);

    transition-timing-function: cubic-bezier(.475, .425, 0, .995);

    font: inherit;

    color: inherit;

    text-transform: none;

    background-color: transparent;

    border: 0;

    margin: 0;

    overflow: visible

}



.hamburger:hover {

    opacity: 1

}



.hamburger-box {

    width: 27px;

    height: 18px;

    display: inline-block;

    position: relative

}



.hamburger-inner {

    display: block;

    top: 50%;

    margin-top: -1px

}



.hamburger-inner,

.hamburger-inner::after,

.hamburger-inner::before {

    width: 27px;

    height: 2px;

    background-color: #b9b9b9;

    border-radius: 0;

    position: absolute;

    -webkit-transition-property: -webkit-transform;

    transition-property: -webkit-transform;

    transition-property: transform;

    transition-property: transform, -webkit-transform;

    -webkit-transition-duration: .15s;

    transition-duration: .15s;

    -webkit-transition-timing-function: ease;

    transition-timing-function: ease

}



.hamburger-inner::after,

.hamburger-inner::before {

    content: "";

    display: block

}



.hamburger-inner::before {

    top: -8px

}



.hamburger-inner::after {

    bottom: -8px

}



.hamburger--squeeze .hamburger-inner {

    -webkit-transition-duration: 75ms;

    transition-duration: 75ms;

    -webkit-transition-timing-function: cubic-bezier(.55, .055, .675, .19);

    transition-timing-function: cubic-bezier(.55, .055, .675, .19)

}



.hamburger--squeeze .hamburger-inner::before {

    -webkit-transition: top 75ms .12s ease, opacity 75ms ease;

    transition: top 75ms .12s ease, opacity 75ms ease

}



.hamburger--squeeze .hamburger-inner::after {

    -webkit-transition: bottom 75ms .12s ease, -webkit-transform 75ms cubic-bezier(.55, .055, .675, .19);

    transition: bottom 75ms .12s ease, -webkit-transform 75ms cubic-bezier(.55, .055, .675, .19);

    transition: bottom 75ms .12s ease, transform 75ms cubic-bezier(.55, .055, .675, .19);

    transition: bottom 75ms .12s ease, transform 75ms cubic-bezier(.55, .055, .675, .19), -webkit-transform 75ms cubic-bezier(.55, .055, .675, .19)

}



.hamburger--squeeze.is-active .hamburger-inner {

    -webkit-transform: rotate(45deg);

    transform: rotate(45deg);

    -webkit-transition-delay: .12s;

    transition-delay: .12s;

    -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);

    transition-timing-function: cubic-bezier(.215, .61, .355, 1)

}



.hamburger--squeeze.is-active .hamburger-inner::before {

    top: 0;

    opacity: 0;

    -webkit-transition: top 75ms ease, opacity 75ms .12s ease;

    transition: top 75ms ease, opacity 75ms .12s ease

}



.hamburger--squeeze.is-active .hamburger-inner::after {

    bottom: 0;

    -webkit-transform: rotate(-90deg);

    transform: rotate(-90deg);

    -webkit-transition: bottom 75ms ease, -webkit-transform 75ms .12s cubic-bezier(.215, .61, .355, 1);

    transition: bottom 75ms ease, -webkit-transform 75ms .12s cubic-bezier(.215, .61, .355, 1);

    transition: bottom 75ms ease, transform 75ms .12s cubic-bezier(.215, .61, .355, 1);

    transition: bottom 75ms ease, transform 75ms .12s cubic-bezier(.215, .61, .355, 1), -webkit-transform 75ms .12s cubic-bezier(.215, .61, .355, 1)

}



body {

    color: #000

}



ol,

ul {

    list-style: none;

    padding: 0;

    margin: 0

}



a {

    color: inherit;

    text-decoration: none

}



button {

    border: 0;

    background: 0 0;

    outline: 0

}



h1,

h2,

h3,

h4,

h5,

h6 {

    margin: 0;

    padding: 0

}



.font-hero {

    font-weight: 700;

    font-size: 65px;

    line-height: 75px

}



.pink-bg {

    background-color: #FFFFFF;

}
.yellow-bg {

    background-color: #fab915;

}


.padding-btm {

    padding: 0 0 100px 0 !important;

}
.portfolio{
    display:flex;
    flex-wrap: wrap;
    text-align: center;
    
    line-height: 0;
}

  .container-portfolio img{
    width: 100%;
    max-width: 320px;
    height: 300px;
    border:1px solid #FFF;
    border-radius: 1px;
    
}

  .image {
    opacity: 1;    
    width: 100%;
    height: auto;
    transition: .5s ease;
    backface-visibility: hidden;
  }
  
  .middle {
    transition: .5s ease;
    opacity: 0;
    position: relative;
    top: -10%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
    width: 320px;
  }
  
  .container-portfolio:hover .image {
    opacity: 0.2;
  }
  
  .container-portfolio:hover .middle {
    opacity: 1;
  }
  
  .text-p {
    background-color: grey;
    color: black;
    font-size: 22px;
    text-decoration: underline;   
    font-weight: 600;
    text-transform: uppercase; 
    
  }

@media (max-width:767px) {

    .font-hero {

        font-size: 45px;

        line-height: 50px

    }

}



.font-h1 {

    font-weight: 700;

    font-size: 50px;

    line-height: 60px

}



@media (max-width:767px) {

    .font-h1 {

        font-size: 30px;

        line-height: 35px

    }

}



.font-h2 {

    font-weight: 700;

    font-size: 45px;

    line-height: 55px

}



@media (max-width:767px) {

    .font-h2 {

        font-size: 28px;

        line-height: 33px

    }

}



.font-h3 {

    font-weight: 700;

    font-size: 30px;

    line-height: 40px

}



@media (max-width:767px) {

    .font-h3 {

        font-size: 23px;

        line-height: 28px

    }

}



.font-paragraph-medium {

    font-weight: 400;

    font-size: 24px;

    line-height: 34px

}



@media (max-width:767px) {

    .font-paragraph-medium {

        line-height: 29px

    }

}



.font-paragraph-small,

body {

    font-weight: 300;

    font-size: 22px;

    line-height: 35px;

}



.font-link {

    font-weight: 400;

    font-size: 20px;

    line-height: 30px;

    color: #ba9095

}



.font-label {

    font-weight: 700;

    font-size: 16px;

    line-height: 26px;

    color: #ba9095;

    text-transform: uppercase

}



@media (max-width:767px) {

    .font-label {

        line-height: 21px

    }

}



main {

    margin-top: 160px

}



@media (max-width:767px) {

    main {

        margin-top: 80px

    }

}



.container-content {

    width: 100%;

    min-width: 1200px;

    margin: 0 auto;

    padding: 160px 100px;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    overflow: hidden

}



@media (max-width:767px) {

    .container-content {

        min-width: unset;

        max-width: unset;

        padding: 75px 25px

    }

}



@media (min-width:768px) and (max-width:1024px) {

    .container-content {

        min-width: unset;

        max-width: unset;

        padding: 160px 50px

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .container-content {

        padding-left: calc((100% - 1000px)/ 2);

        padding-right: calc((100% - 1000px)/ 2);

        min-width: unset

    }

}



@media (min-width:1600px) {

    .container-content {

        padding: 120px calc(((100% - 1200px) * .5) + 100px)

    }

}



.container-content.no-padding {

    padding-top: 0;

    padding-bottom: 0

}



.container-content.more-padding {

    padding-left: calc((100% - 1000px)/ 2);

    padding-right: calc((100% - 1000px)/ 2)

}



@media (max-width:767px) {

    .container-content.more-padding {

        min-width: unset;

        max-width: unset;

        padding: 75px 25px

    }

}



@media (min-width:768px) and (max-width:1024px) {

    .container-content.more-padding {

        min-width: unset;

        max-width: unset;

        padding-left: 50px;

        padding-right: 50px

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .container-content.more-padding {

        min-width: unset;

        width: 100%

    }

}



.container-content.small-padding {

    padding-left: calc((100% - 850px)/ 2);

    padding-right: calc((100% - 850px)/ 2)

}



@media (min-width:768px) and (max-width:1024px) {

    .container-content.small-padding {

        padding-left: 50px;

        padding-right: 50px

    }

}



@media (max-width:767px) {

    .container-content.small-padding {

        padding-left: 25px;

        padding-right: 25px

    }

}



.container-content.left-padding {

    padding-left: 190px

}



@media (max-width:767px) {

    .container-content.left-padding {

        padding-left: 25px

    }

}



@media (min-width:768px) and (max-width:1024px) {

    .container-content.left-padding {

        padding-left: 50px

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .container-content.left-padding {

        padding-left: 100px

    }

}



@media (min-width:1600px) {

    .container-content.left-padding {

        padding-left: calc(((100% - 1600px) * .5) + 190px)

    }

}



.button-fill,

.button-filled {

    display: inline-block;

    height: 55px;

    padding: 0 57px;

    border-radius: 26px;

    font-weight: 700;

    font-size: 14px;

    line-height: 55px;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    text-transform: uppercase;

    -ms-flex-item-align: left;

    align-self: left;

    -webkit-transform: translateZ(0);

    transform: translateZ(0);

    margin-top: 50px;

}



@media (max-width:767px) {

    .button-fill,

    .button-filled {

        padding: 0 45px

    }

}



.button-fill:before,

.button-filled:before {

    content: "";

    width: 110%;

    height: 110%;

    border-radius: 26px;

    position: absolute;

    -webkit-transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1), -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(0);

    transform: scaleX(0);

    left: -5%;

    will-change: transform;

    z-index: 1

}



.button-fill .text,

.button-filled .text {

    position: relative;

    z-index: 2

}



.button-filled {

    background-color: rgb(73, 73, 73);

    color: #fff;

    position: relative;

    overflow: hidden;

    -webkit-transition: background-color 10ms none;

    transition: background-color 10ms none

}



.button-filled:before {

    background-color: #ba9095

}



.button-filled:hover:not(.disabled) {

    background-color: transparent;

    -webkit-transition-delay: .45s;

    transition-delay: .45s

}



.button-filled:hover:not(.disabled):before {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1)

}



.button-filled.disabled {

    opacity: .5;

    cursor: progress

}



.button-fill {

    background-color: transparent;

    color: #000;

    border: 2px solid #000;

    padding-bottom: 3px;

    position: relative;

    overflow: hidden;

    -webkit-transition: color .45s cubic-bezier(.475, .425, 0, .995);

    transition: color .45s cubic-bezier(.475, .425, 0, .995);

    line-height: 52px

}



.button-fill:before {

    background-color: #000

}



.button-fill:hover {

    color: #fff

}



.button-fill:hover:before {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1)

}



.button-get-started {

    font-weight: 700;

    font-size: 16px;

    line-height: 26px;

    color: #ba9095;

    text-transform: uppercase;

    position: relative;

    -webkit-transition: color .45s cubic-bezier(.475, .425, 0, .995);

    transition: color .45s cubic-bezier(.475, .425, 0, .995)

}



.button-get-started:before {

    content: "";

    position: absolute;

    width: 100%;

    height: 2px;

    background-color: #ba9095;

    bottom: -1px;

    left: 0;

    -webkit-transition: all .45s cubic-bezier(.835, -.005, .06, 1);

    transition: all .45s cubic-bezier(.835, -.005, .06, 1);

    z-index: -1;

    will-change: transform

}



.button-get-started.active,

.button-get-started:hover {

    color: #fff

}



.button-get-started.active:before,

.button-get-started:hover:before {

    width: 160px;

    height: 55px;

    border-radius: 25px;

    left: -40px;

    -webkit-transform: translateY(13px);

    transform: translateY(13px)

}



.button-toggle {

    position: relative;

    width: 20px;

    height: 20px;

    padding: 0;

    margin: 0;

    vertical-align: middle

}



@media (max-width:767px) {

    .button-toggle {

        width: 16px;

        height: 16px

    }

}



.button-toggle:after,

.button-toggle:before {

    content: "";

    position: absolute;

    background-color: #ba9095;

    -webkit-transition: -webkit-transform .35s cubic-bezier(.475, .425, 0, .995);

    transition: -webkit-transform .35s cubic-bezier(.475, .425, 0, .995);

    transition: transform .35s cubic-bezier(.475, .425, 0, .995);

    transition: transform .35s cubic-bezier(.475, .425, 0, .995), -webkit-transform .35s cubic-bezier(.475, .425, 0, .995)

}



.button-toggle:before {

    top: 0;

    left: 50%;

    width: 2px;

    height: 100%;

    margin-left: -1px

}



.button-toggle:after {

    top: 50%;

    left: 0;

    width: 100%;

    height: 2px;

    margin-top: -1px

}



.button-toggle.active:before {

    -webkit-transform: rotate(90deg);

    transform: rotate(90deg)

}



.button-toggle.active:after {

    -webkit-transform: rotate(180deg);

    transform: rotate(180deg)

}



.button-underline {

    font-weight: 700;

    font-size: 16px;

    line-height: 26px;

    color: rgba(43, 43, 43, .7);

    text-transform: uppercase;

    position: relative;

    -webkit-transition: color .45s cubic-bezier(.475, .425, 0, .995);

    transition: color .45s cubic-bezier(.475, .425, 0, .995)

}



.button-underline:before {

    content: "";

    position: absolute;

    width: 100%;

    height: 2px;

    background-color: rgba(43, 43, 43, .7);

    bottom: -1px;

    left: 0;

    -webkit-transition: all .45s cubic-bezier(.835, -.005, .06, 1);

    transition: all .45s cubic-bezier(.835, -.005, .06, 1);

    z-index: 1;

    will-change: transform

}



.button-underline.active,

.button-underline:hover {

    color: #ba9095

}



.button-underline.active:before,

.button-underline:hover:before {

    background-color: #ba9095

}



@-webkit-keyframes toggle-header {

    from {

        top: -160px

    }

    to {

        top: 0;

        position: fixed

    }

}



@keyframes toggle-header {

    from {

        top: -160px

    }

    to {

        top: 0;

        position: fixed

    }

}



header {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    height: 160px;

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    z-index: 5;

    -webkit-transition: all .55s cubic-bezier(.475, .425, 0, .995);

    transition: all .55s cubic-bezier(.475, .425, 0, .995);

    will-change: transform;

}



@media (max-width:767px) {

    header {

        height: 80px

    }

}



header.scroll-up {

    position: fixed;

    background-color: #fff;

    top: 0;

    height: 110px;

}



@media (max-width:767px) {

    header.scroll-up {

        height: 80px

    }

}



header.scroll-down {

    position: fixed;

    top: -160px

}



header .logo {

    -ms-flex-item-align: center;

    align-self: center

}



header .logo svg {

    width: 100px;

}



header .logo img {

    vertical-align: middle

}



@media (max-width:767px) {

    header .logo svg {

        width: 70px;

        margin-top: 8px;

    }

}



header .get-started-space {

    width: 100px

}



header .button-hamburger {

    -webkit-box-flex: 3;

    -ms-flex: 3;

    flex: 3;

    -ms-flex-item-align: center;

    align-self: center;

    text-align: right;

    height: 20px

}



@media (min-width:1025px) {

    header .button-hamburger {

        display: none

    }

    .hero-content {

        left: 200px;

    }

}



header nav {

    font-weight: 700;

    font-size: 16px;

    line-height: 26px;

    color: #2b2b2b;

    text-transform: uppercase;

    -webkit-box-flex: 3;

    -ms-flex: 3;

    flex: 3;

    -ms-flex-item-align: center;

    align-self: center;

    text-align: right;

    padding-right: 100px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: end;

    -ms-flex-pack: end;

    justify-content: flex-end

}



@media (max-width:1024px) {

    header nav {

        display: none

    }

}



header nav a:not(:last-of-type) {

    margin-right: 52px

}



@media (max-width:767px) {

    header nav a:not(:last-of-type) {

        margin-right: 49px

    }

}



header nav a:after {

    content: "";

    display: block;

    width: 100%;

    height: 2px;

    background-color: #2b2b2b;

    -webkit-transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1), -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(0);

    transform: scaleX(0)

}



header nav a.active:after,

header nav a:hover:after {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1)

}



header.compact {

    position: fixed;

    top: 0;

    left: 0;

    right: 0;

    background-color: #fff

}



header.compact .get-started-space {

    -webkit-box-flex: 2;

    -ms-flex: 2;

    flex: 2;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: end;

    -ms-flex-pack: end;

    justify-content: flex-end

}



header.compact .number {

    font-weight: 700;

    font-size: 20px;

    color: #b9b9b9;

    -ms-flex-item-align: center;

    align-self: center

}



@media (max-width:767px) {

    header.compact .number {

        display: none

    }

}



header.compact .button-hamburger {

    -webkit-box-flex: unset;

    -ms-flex: unset;

    flex: unset

}



@media (min-width:1025px) {

    header.compact .button-hamburger {

        display: block

    }

}



.button-get-started {

    position: fixed;

    top: 66px;

    right: 100px;

    z-index: 10;

    -webkit-transition: top .45s cubic-bezier(.475, .425, 0, .995);

    transition: top .45s cubic-bezier(.475, .425, 0, .995)

}



@media (min-width:1600px) {

    .button-get-started {

        right: calc(((100% - 1600px)/ 2) + 100px)

    }

}



.button-get-started.on-up {

    top: 36px

}



.button-get-started.fixed {

    position: relative;

    top: unset;

    right: unset;

    -ms-flex-item-align: center;

    align-self: center;

    margin: 0 90px 0 70px

}



.button-get-started.disabled:not(.goto) {

    position: absolute

}



.button-get-started.disabled:not(.goto).active {

    top: -160px

}



.button-get-started.disabled:not(.goto).on-up {

    position: fixed;

    top: 36px

}



@media (max-width:1024px) {

    .button-get-started {

        display: none

    }

}



footer {

    background-color: #f6f6f7;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex

}



footer.compact {

    background-color: unset

}



footer.compact .info {

    -webkit-box-pack: unset;

    -ms-flex-pack: unset;

    justify-content: unset

}



footer.compact .info-explore {

    margin-right: 200px

}



@media (max-width:1024px) {

    footer {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



@media (max-width:1024px) {

    footer .logo-container {

        text-align: center;

        margin-bottom: 50px

    }

}



footer .logo-container svg {

    margin-right: 150px

}



@media (max-width:1024px) {

    footer .logo-container svg {

        margin-right: 0

    }

}



footer .info {

    -webkit-box-flex: 3;

    -ms-flex: 3;

    flex: 3;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between;

    max-width: 800px;

    margin-top: -5px

}



@media (max-width:1024px) {

    footer .info {

        max-width: 100%;

        text-align: center

    }

}



footer h1 {

    font-weight: 700;

    font-size: 14px;

    line-height: 24px;

    text-transform: uppercase;

    margin-bottom: 20px

}



footer li {

    font-weight: 400;

    font-size: 17px;

    line-height: 45px;

    color: #959595

}



@media (max-width:1024px) {

    footer .info-explore,

    footer .info-follow {

        display: none

    }

}



@media (max-width:1024px) {

    footer .info-contact {

        width: 100%

    }

}



footer .address {

    font-size: 17px;

    color: #c5c5c5;

    width: 250px

}



@media (max-width:1024px) {

    footer .address {

        width: 100%

    }

}



footer a {

    -webkit-transition: color .55s cubic-bezier(.475, .425, 0, .995);

    transition: color .55s cubic-bezier(.475, .425, 0, .995)

}



footer a:hover {

    color: #000

}



footer .font-link {

    display: inline-block;

    font-size: 17px;

    position: relative

}



footer .font-link:after {

    position: absolute;

    bottom: 0;

    content: "";

    display: block;

    width: 100%;

    height: 2px;

    background-color: #ba9095;

    -webkit-transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1), -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(0);

    transform: scaleX(0)

}



footer .font-link:hover {

    color: #ba9095

}



footer .font-link:hover:after {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1)

}



footer .font-link:first-of-type {

    margin-top: 7px;

    margin-bottom: 13px

}



@media (max-width:1024px) {

    footer .font-link:first-of-type {

        margin: 0

    }

}



.icon-arrow {

    position: relative;

    vertical-align: middle;

    display: inline-block;

    margin-left: 10px;

    width: 0;

    -webkit-transition: all .45s cubic-bezier(.475, .425, 0, .995);

    transition: all .45s cubic-bezier(.475, .425, 0, .995)

}



@media (max-width:767px) {

    .icon-arrow {

        margin: 0 0 3px 9px

    }

}



.icon-arrow:before {

    content: "";

    display: inline-block;

    width: 0;

    height: 2px;

    background-color: #000;

    -webkit-transition: width .45s cubic-bezier(.475, .425, 0, .995);

    transition: width .45s cubic-bezier(.475, .425, 0, .995);

    top: 50%;

    position: absolute

}



.icon-arrow:after {

    content: "";

    position: absolute;

    border-bottom: 2px solid #000;

    border-right: 2px solid #000;

    border-radius: 2px;

    width: 10px;

    height: 10px;

    -webkit-transform: rotate(-45deg);

    transform: rotate(-45deg);

    -webkit-transform-origin: center;

    transform-origin: center;

    top: calc(50% - 5px);

    right: 0

}



.icon-arrow.white:before {

    background-color: #fff

}



.icon-arrow.white:after {

    border-color: #fff

}



.icon-close {

    position: relative;

    width: 20px;

    height: 20px;

    padding: 0;

    margin: 0;

    vertical-align: middle;

    -webkit-transform: rotate(45deg);

    transform: rotate(45deg);

    cursor: pointer

}



.icon-close:after,

.icon-close:before {

    content: "";

    position: absolute;

    background-color: #b9b9b9

}



.icon-close:before {

    top: 0;

    left: 50%;

    width: 2px;

    height: 100%;

    margin-left: -1px

}



.icon-close:after {

    top: 50%;

    left: 0;

    width: 100%;

    height: 2px;

    margin-top: -1px

}



.work {

    display: inline-block;

    width: 50%;

    position: relative;

    color: #fff;

    cursor: pointer;

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    -webkit-transition: -webkit-transform .85s cubic-bezier(.475, .425, 0, .995);

    transition: -webkit-transform .85s cubic-bezier(.475, .425, 0, .995);

    transition: transform .85s cubic-bezier(.475, .425, 0, .995);

    transition: transform .85s cubic-bezier(.475, .425, 0, .995), -webkit-transform .85s cubic-bezier(.475, .425, 0, .995);

    -webkit-transform: perspective(0);

    transform: perspective(0)

}



@media (max-width:767px) {

    .work {

        width: 100%

    }

}



.work:hover {

    -webkit-transform: perspective(500px) translateZ(-50px);

    transform: perspective(500px) translateZ(-50px)

}



.work.large {

    display: inline-block;

    width: 100%;

    position: relative;

    color: #fff;

    cursor: pointer;

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat

}



.work.large:before {

    content: '';

    display: block;

    padding-top: 46.4%

}



@media (max-width:767px) {

    .work.large:before {

        padding-top: 92.9%

    }

}



.work:before {

    content: "";

    display: block;

    padding-top: 92.9%

}



.work .hover-layer-container {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

    right: 0;

    overflow: hidden

}



.work .hover-layer {

    content: '';

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    width: 100%;

    height: 100%;

    opacity: 0;

    -webkit-transition: all 1.05s cubic-bezier(.475, .425, 0, .995);

    transition: all 1.05s cubic-bezier(.475, .425, 0, .995)

}



@media (max-width:767px) {

    .work .hover-layer {

        opacity: 1

    }

}



.work .popout-layer {

    display: block;

    position: absolute;

    left: 0;

    right: 0;

    bottom: 0;

    pointer-events: none;

    width: 100%;

    height: 100%;

    opacity: 0;

    -webkit-transition: opacity .75s cubic-bezier(.475, .425, 0, .995);

    transition: opacity .75s cubic-bezier(.475, .425, 0, .995)

}



@media (max-width:767px) {

    .work .popout-layer {

        visibility: hidden

    }

}



.work .popout-layer img {

    height: 100%

}



.work .popout-layer.vertical {

    height: unset

}



.work .popout-layer.vertical img {

    width: 100%;

    display: block

}



.work .text-layer {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    position: absolute;

    width: 100%;

    height: 100%;

    padding: 60px 70px;

    -webkit-box-pack: end;

    -ms-flex-pack: end;

    justify-content: flex-end;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    -webkit-transition: opacity .55s cubic-bezier(.475, .425, 0, .995);

    transition: opacity .55s cubic-bezier(.475, .425, 0, .995);

    left: 0;

    top: 0

}



@media (max-width:1024px) {

    .work .text-layer {

        padding: 30px 30px

    }

}



@media (min-width:1025px) {

    .work:hover .hover-layer {

        opacity: 1

    }

}



.work:hover .popout-layer {

    opacity: 1

}



.work:hover .icon-arrow {

    width: 18px

}



.work:hover .icon-arrow:before {

    width: 18px

}



.blog-posts {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



@media (max-width:767px) {

    .blog-posts {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



.post {

    width: calc(33.33% - 21.33px);

    overflow: hidden

}



@media (max-width:767px) {

    .post {

        width: 100%

    }

}



.post.half {

    width: calc(50% - 16px)

}



@media (max-width:767px) {

    .post.half {

        width: 100%

    }

}



.post .thumbnail {

    width: 100%;

    padding-top: 67.3%;

    background-size: cover;

    background-position: center;

    overflow: hidden;

    -webkit-transition: -webkit-transform .85s cubic-bezier(.475, .425, 0, .995);

    transition: -webkit-transform .85s cubic-bezier(.475, .425, 0, .995);

    transition: transform .85s cubic-bezier(.475, .425, 0, .995);

    transition: transform .85s cubic-bezier(.475, .425, 0, .995), -webkit-transform .85s cubic-bezier(.475, .425, 0, .995);

    -webkit-transform: perspective(0);

    transform: perspective(0)

}



.post .info {

    padding: 50px

}



@media (min-width:768px) and (max-width:1024px) {

    .post .info {

        padding: 50px 0

    }

}



@media (max-width:767px) {

    .post .info {

        padding: 30px 25px 65px

    }

}



.post:hover .thumbnail {

    -webkit-transform: perspective(500px) translateZ(-50px);

    transform: perspective(500px) translateZ(-50px)

}



.list-red li {

    padding-left: 30px;

    position: relative;

    margin-bottom: 20px

}



.list-red li:before {

    content: '';

    width: 6px;

    height: 6px;

    border-radius: 50%;

    background-color: #ba9095;

    position: absolute;

    left: 0;

    top: 12px

}



.error {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between;

    padding: 10px;

}



@media (max-width:767px) {

    .error {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



.error span {

    font-weight: 700;

    font-size: 14px;

    text-transform: uppercase;

    color: #ba9095;

    width: calc(50% - 10px);

    margin-left: 20px;

    opacity: 0;

    -webkit-transition: all .55s cubic-bezier(.475, .425, 0, .995);

    transition: all .55s cubic-bezier(.475, .425, 0, .995)

}



@media (max-width:767px) {

    .error span {

        width: 100%;

        margin-left: 0

    }

}



.error span.show {

    margin-top: 20px;

    opacity: 1

}



@media (max-width:767px) {

    .error span.show {

        margin-top: 15px

    }

}



.collage {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



@media (max-width:767px) {

    .collage {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



.collage .left,

.collage .right {

    width: calc(50% - 23px)

}



@media (min-width:768px) and (max-width:1024px) {

    .collage .left,

    .collage .right {

        width: calc(50% - 15px)

    }

}



@media (max-width:767px) {

    .collage .left,

    .collage .right {

        width: 100%

    }

}



.collage img {

    display: block;

    width: 100%;

    height: auto;

    margin-bottom: 36px

}



@media (min-width:768px) and (max-width:1024px) {

    .collage img {

        margin-bottom: 30px

    }

}



@media (max-width:767px) {

    .collage img {

        margin-bottom: 20px

    }

}



.entry-body a {

    position: relative;

    -webkit-transition: color .45s cubic-bezier(.475, .425, 0, .995);

    transition: color .45s cubic-bezier(.475, .425, 0, .995)

}



.entry-body a:after {

    content: '';

    position: absolute;

    width: 100%;

    height: 1px;

    background-color: #000;

    bottom: -3px;

    left: 0;

    right: 0;

    -webkit-transition: background-color .45s cubic-bezier(.475, .425, 0, .995);

    transition: background-color .45s cubic-bezier(.475, .425, 0, .995)

}



.entry-body a:hover {

    color: #ba9095

}



.entry-body a:hover:after {

    background-color: #ba9095

}



.prevent-scroll {

    overflow: hidden

}



.input-default,

.textarea-default {

    font-weight: 300;

    font-size: 18px;

    display: block;

    background-color: #fff;

    border: 1px solid #e0e0e0;

    padding: 20px;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    border-radius: 0;

    -webkit-appearance: none;

    -moz-appearance: none;

    appearance: none;

    margin: 20px 0;

    border-radius: 5px

}



.input-default::-webkit-input-placeholder,

.textarea-default::-webkit-input-placeholder {

    color: #a9a9a9

}



.input-default::-ms-input-placeholder,

.textarea-default::-ms-input-placeholder {

    color: #a9a9a9

}



.input-default::placeholder,

.textarea-default::placeholder {

    color: #a9a9a9

}



.input-default {

    height: 65px

}



.input-half {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



@media (max-width:767px) {

    .input-half {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



.input-half input {

    width: calc(50% - 10px)

}



@media (max-width:767px) {

    .input-half input {

        width: 100%

    }

    .input-half input:first-of-type {

        margin-bottom: 15px

    }

}



.input-full {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex

}



.input-full>* {

    -webkit-box-flex: 1;

    -ms-flex: 1;

    flex: 1

}



aside {

    position: fixed;

    top: -100px;

    left: 50vw;

    right: 0;

    width: 0;

    height: 0;

    border-radius: 50%;

    background-color: #fff;

    -webkit-transition: all .85s cubic-bezier(.835, -.005, .06, 1);

    transition: all .85s cubic-bezier(.835, -.005, .06, 1);

    overflow: hidden;

    z-index: 20

}



@media (min-width:768px) and (max-width:1024px) {

    aside {

        top: -200px;

        -webkit-transition-duration: 1.25s;

        transition-duration: 1.25s

    }

}



aside nav {

    margin: 100px auto 0;

    text-align: center;

    overflow-y: scroll

}



@media (min-width:768px) and (max-width:1024px) {

    aside nav {

        margin-top: 200px

    }

}



aside ul {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    padding-top: 33px

}



aside li {

    margin-bottom: 35px

}



aside li:first-of-type {

    margin-bottom: 75px

}



aside .button-filled {

    margin-top: 40px

}



aside.compact {

    top: -400px;

    -webkit-transition-duration: 1.25s;

    transition-duration: 1.25s

}



aside.compact nav {

    margin-top: 400px

}



aside.compact .button-filled {

    background-color: #ba9095

}



aside.compact .button-filled:before {

    background-color: #000

}



aside.compact .font-link {

    color: #b9b9b9

}



aside.show {

    left: calc(50vw - 600px);

    width: 1200px;

    height: 1200px

}



@media (min-width:768px) and (max-width:1024px) {

    aside.show {

        left: calc(50vw - 750px);

        width: 1500px;

        height: 1500px

    }

}



aside.show.compact {

    left: calc(50vw - 1500px);

    width: 3000px;

    height: 3000px

}



@media (max-width:767px) {

    aside.show.compact {

        left: calc(50vw - 600px);

        width: 1200px;

        height: 1200px

    }

}



@media (min-width:768px) and (max-width:1024px) {

    aside.show.compact {

        left: calc(50vw - 750px);

        width: 1500px;

        height: 1500px

    }

}



.section-header {

    text-align: center;

    margin: 0 0 100px

}



@media (max-width:767px) {

    .section-header {

        margin: 0 0 50px

    }

}



.section-header h1 {

    margin: 30px auto 0

}



.section-more {

    text-align: center;

    margin: 100px 0 0

}



@media (max-width:767px) {

    .section-more {

        margin: 50px 0 0

    }

}



.page-head {

    padding-bottom: 80px

}



@media (max-width:767px) {

    .page-head {

        padding-bottom: 45px

    }

}



.page-head h1 {

    margin-top: 30px

}



.cta-get-started {

    text-align: center

}



.cta-get-started h1 {

    margin: 30px auto 50px;

    width: 500px

}



@media (max-width:767px) {

    .cta-get-started h1 {

        width: 300px

    }

}



.section-clients {

    text-align: center

}



.section-clients h1 {

    margin: 30px auto 80px;

    width: 650px

}



@media (max-width:767px) {

    .section-clients h1 {

        width: 100%

    }

}



.section-clients .list {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



.section-clients li {

    width: 25%;

    margin-bottom: 80px

}



@media (max-width:767px) {

    .section-clients li {

        width: 50%;

        margin-bottom: 50px

    }

    .section-clients li img {

        width: 80%;

        height: auto

    }

}



@media (min-width:768px) and (max-width:1024px) {

    .section-clients li {

        width: 50%

    }

}



.section-contact ul {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



@media (max-width:1024px) {

    .section-contact ul {

        -ms-flex-wrap: wrap;

        flex-wrap: wrap

    }

}



.section-contact li {

    width: 300px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column

}



@media (min-width:768px) and (max-width:1024px) {

    .section-contact li {

        width: 330px

    }

    .section-contact li:last-of-type {

        margin-top: 100px

    }

}



@media (max-width:767px) {

    .section-contact li {

        width: 100%

    }

    .section-contact li:not(:last-of-type) {

        margin-bottom: 45px

    }

}



.section-contact .top {

    -webkit-box-flex: 2;

    -ms-flex: 2;

    flex: 2;

    min-height: 120px

}



.section-contact h1 {

    font-weight: 700

}



.section-contact p {

    margin-top: 10px

}



.section-contact .font-link {

    display: inline-block;

    position: relative;

    -ms-flex-item-align: start;

    align-self: flex-start

}



.section-contact .font-link:after {

    position: absolute;

    bottom: 0;

    content: "";

    display: block;

    width: 100%;

    height: 2px;

    background-color: #ba9095;

    -webkit-transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1), -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(0);

    transform: scaleX(0)

}



.section-contact .font-link:hover {

    color: #ba9095

}



.section-contact .font-link:hover:after {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1)

}



.section-image {

    width: 100%;

    height: 700px;

    background-size: cover;

    background-position: center

}



@media (min-width:768px) and (max-width:1024px) {

    .section-image {

        height: 450px

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .section-image {

        height: 515px

    }

}



@media (max-width:767px) {

    .section-image {

        height: 155px

    }

}



.section-404 {

    height: 800px;

    text-align: center;

    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;

}



@media (max-width:767px) {

    .section-404 {

        height: unset;

        padding-top: 75px

    }

}



.section-404 h1 {

    margin: 30px auto 40px

}



.section-404 .button-filled {

    margin-top: 80px;

    -ms-flex-item-align: center;

    align-self: center

}



.page-index .hero {

    min-height: 700px;

    background-color: #f8edee;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    position: relative;

    overflow: hidden

}



@media (max-width:767px) {

    .page-index .hero {

        min-height: 625px

    }

}



.page-index .hero-background {

    position: absolute;

    width: 1500px;

    height: 100%;

    max-width: 1500px;

    min-width: 1500px;

    top: 30px;

    left: -200px;

    right: 0;

    z-index: 1;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    margin: 0 auto

}



@media (max-width:767px) {

    .page-index .hero-background {

        width: 1400px;

        min-width: 1400px;

        max-width: 1400px;

        left: 200px

    }

}



.page-index .hero-background .left {

    width: 40%

}



.page-index .hero-background .right {

    width: 60%

}



.page-index .hero-content {

    width: 560px;

    height: 100%;

    -ms-flex-item-align: end;

    align-self: flex-end;

    position: relative;

    z-index: 2;

}



@media (min-width:768px) and (max-width:1024px) {

    .page-index .hero-content {

        -webkit-box-sizing: border-box;

        box-sizing: border-box;

        width: 100%;

        padding-right: calc(100% - 590px - 50px)

    }

}



@media (max-width:767px) {

    .page-index .hero-content {

        width: 100%

    }

}



.page-index .hero h1 {

    margin: 30px 0

}



@media (max-width:767px) {

    .page-index .hero h1 {

        margin: 20px 0 16px

    }

}



.page-index .hero p {

    margin-bottom: 60px

}



@media (max-width:767px) {

    .page-index .hero p {

        margin-bottom: 46px

    }

    .page-index .hero {

        flex-direction: row;

        height: auto;

    }

    .left {

        width: 100%;

        display: block;

    }

    .right {

        width: 100%;

        display: block;

    }

}



.page-index .featured .section-header h1 {

    width: 600px

}



}



@media (max-width:767px) {

    .page-index .featured .section-header h1 {

        width: 300px

    }

}



.page-index .featured-works {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap

}



@media (max-width:767px) {

    .page-index .featured-works {

        -webkit-box-pack: column;

        -ms-flex-pack: column;

        justify-content: column

    }

}



.page-index .service {

    background-color: #f6f6f7;

    text-align: center

}



.page-index .service h1 {

    width: 800px

}



@media (min-width:768px) and (max-width:1024px) {

    .page-index .service h1 {

        width: 400px

    }

    .desktop {

        width: 100%;

    }

}



@media (max-width:767px) {

    .page-index .service h1 {

        width: 250px

    }

}



.page-index .service .illustration {

    width: 100%;

    min-height: 470px

}



.page-index .service .illustration svg {

    width: 100%;

    height: auto

}



.desktop svg {

    height: auto

}



@media (max-width:767px) {

    .desktop {

        margin-top: 0;

        display: none

    }

    .desktop svg {

        height: unset

    }

}



.mobile {

    display: none

}



@media (max-width:767px) {

    .mobile {

        display: block;

        margin: 50px auto 0;

        width: 100%;

    }

}



.page-index .process {

    background-color: #f8edee

}



.page-index .process-head h1 {

    margin: 30px 0 80px;

    width: 650px

}



@media (max-width:767px) {

    .page-index .process-head h1 {

        width: 100%;

        margin-bottom: 43px

    }

}



.page-index .process .process-item {

    margin-bottom: 10px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    cursor: pointer

}



.page-index .process-steps .title {

    width: 100%;

    height: 100px;

    background-color: #fff;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    padding: 0 30px;

    -webkit-box-sizing: border-box;

    box-sizing: border-box

}



@media (max-width:767px) {

    .page-index .process-steps .title {

        padding: 0;

        height: 63px

    }

}



.page-index .process-steps .icon-container {

    width: 95px;

    -ms-flex-item-align: center;

    align-self: center;

    text-align: center

}



.page-index .process-steps .icon-container img {

    vertical-align: middle

}



@media (max-width:767px) {

    .page-index .process-steps .icon-container {

        width: 65px

    }

    .page-index .process-steps .icon-container img {

        width: 70%;

        height: 70%

    }

}



.page-index .process-steps .name {

    -webkit-box-flex: 2;

    -ms-flex: 2;

    flex: 2;

    -ms-flex-item-align: center;

    align-self: center;

    font-size: 24px

}



@media (max-width:767px) {

    .page-index .process-steps .name {

        font-size: 20px

    }

}



.page-index .process-steps .button-container {

    width: 80px;

    -ms-flex-item-align: center;

    align-self: center;

    text-align: center

}



@media (max-width:767px) {

    .page-index .process-steps .button-container {

        width: 40px

    }

}



.page-index .process-steps .context {

    width: 100%;

    max-height: 0;

    background-color: #fff;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    -webkit-transition: max-height .85s cubic-bezier(.475, .425, 0, .995);

    transition: max-height .85s cubic-bezier(.475, .425, 0, .995);

    overflow: hidden

}



.page-index .process-steps .context.show {

    max-height: 500px

}



@media (max-width:767px) {

    .page-index .process-steps .context.show {

        max-height: 800px

    }

}



.page-index .process-steps .context p {

    padding: 0 155px 40px 125px

}



@media (max-width:767px) {

    .page-index .process-steps .context p {

        padding: 0 40px 35px 65px

    }

}



.page-index .blog .section-header h1 {

    width: 660px

}



@media (max-width:767px) {

    .page-index .blog .section-header h1 {

        width: 300px

    }

}



.page-index .rsvp {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100vh;

    background-color: rgba(0, 0, 0, .4);

    z-index: 10;

    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

}



.page-index .rsvp .image {

    max-width: 693px;

    max-height: 100vh;

    position: relative

}



.page-index .rsvp img {

    max-width: 100%

}



.page-index .rsvp .button-container {

    position: absolute;

    bottom: 15px;

    left: 0;

    right: 0;

    text-align: center

}



@media (max-width:767px) {

    .page-index .rsvp .button-container {

        bottom: 25px

    }

}



.page-index .rsvp.hidden {

    display: none;

    pointer-events: none

}



.page-work-landing .works {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap

}



@media (min-width:768px) and (max-width:1024px) {

    .page-work-landing .work {

        width: 100%

    }

}



.page-work-detail .description {

    background-color: #f6f6f7;

    background-position: center;

    background-repeat: no-repeat

}



@media (max-width:1024px) {

    .page-work-detail .description {

        background-image: unset !important

    }

}



.page-work-detail .description h1 {

    margin: 30px 0 90px;

    width: 700px

}



@media (max-width:767px) {

    .page-work-detail .description h1 {

        width: 100%;

        margin: 30px 0 25px

    }

}



.page-work-detail .description .detail-body {

    width: 700px

}



@media (max-width:767px) {

    .page-work-detail .description .detail-body {

        width: 100%

    }

}



.page-work-detail .body img {

    width: 100%;

    height: auto

}



.page-blog-landing .post {

    margin-bottom: 50px

}



@media (max-width:767px) {

    .page-blog-landing .post {

        margin-bottom: 0

    }

}



.page-blog-detail .head {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    min-height: 575px;

    background-color: #f8edee;

    position: relative

}



@media (max-width:1024px) {

    .page-blog-detail .head {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



.page-blog-detail .head-info {

    width: 50%;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    padding: 160px 0

}



@media (max-width:1024px) {

    .page-blog-detail .head-info {

        width: 100%

    }

}



@media (max-width:767px) {

    .page-blog-detail .head-info {

        padding: 75px 0

    }

}



.page-blog-detail .head-info h1 {

    margin: 30px 120px 60px 0

}



@media (max-width:767px) {

    .page-blog-detail .head-info h1 {

        margin: 30px 0 40px

    }

}



.page-blog-detail .head-image {

    width: 50%;

    height: 100%;

    position: absolute;

    right: 0;

    background-size: cover;

    background-position: center

}



@media (max-width:1024px) {

    .page-blog-detail .head-image {

        position: relative;

        width: 100vw;

        height: 400px;

        margin-left: -50px

    }

}



@media (max-width:767px) {

    .page-blog-detail .head-image {

        height: 360px;

        margin-left: -25px

    }

}



.page-blog-detail .share {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    font-size: 12px

}



.page-blog-detail .share>:not(last-child) {

    margin-right: 4px

}



.page-blog-detail .share i {

    font-size: 24px

}



@media (max-width:767px) {

    .page-blog-detail .share i {

        font-size: 15px

    }

}



.page-blog-detail .share .jssocials-share-link {

    padding: 10px 15px 10px 10px

}



.page-blog-detail .body:after {

    content: "";

    display: block;

    width: 100%;

    height: 2px;

    background-color: #e6eef2;

    margin-top: 150px

}



.page-blog-detail .body h1 {

    font-weight: 700;

    font-size: 30px;

    line-height: 40px

}



.page-blog-detail .body h2 {

    font-weight: 700;

    font-size: 24px;

    line-height: 40px

}



.page-blog-detail .body li {

    padding-left: 30px;

    position: relative;

    margin: 20px 0

}



.page-blog-detail .body li:before {

    content: '';

    width: 6px;

    height: 6px;

    border-radius: 50%;

    background-color: #ba9095;

    position: absolute;

    left: 0;

    top: 12px

}



.page-blog-detail .more-posts {

    padding-top: 0

}



.page-blog-detail .more-head {

    text-align: center

}



.page-blog-detail .more-head h1 {

    margin: 30px 0 90px

}



@media (max-width:767px) {

    .page-blog-detail .more-head h1 {

        margin-bottom: 45px

    }

}



.page-service-landing .page-head {

    background-color: #f6f6f7;

    padding-bottom: 160px

}



@media (max-width:767px) {

    .page-service-landing .page-head {

        padding-bottom: 65px

    }

}



.page-service-landing .page-head h1 {

    width: 830px

}



@media (min-width:768px) and (max-width:1024px) {

    .page-service-landing .page-head h1 {

        width: 600px

    }

}



@media (max-width:767px) {

    .page-service-landing .page-head h1 {

        width: 100%

    }

}



.page-service-landing .service-list-head {

    text-align: center

}



@media (max-width:767px) {

    .page-service-landing .service-list-head {

        text-align: left

    }

}



.page-service-landing .service-list-head h1 {

    margin: 30px auto 80px;

    width: 600px

}



@media (max-width:767px) {

    .page-service-landing .service-list-head h1 {

        width: 100%;

        margin-bottom: 43px

    }

}



.page-service-landing .service-list ul {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



@media (max-width:767px) {

    .page-service-landing .service-list ul {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



.page-service-landing .service-list li {

    width: calc(33.33% - 110px)

}



@media (min-width:768px) and (max-width:1024px) {

    .page-service-landing .service-list li {

        width: calc(50% - 110px)

    }

}



@media (max-width:767px) {

    .page-service-landing .service-list li {

        width: 100%

    }

}



.page-service-landing .service-list a {

    -webkit-transition: color .45s cubic-bezier(.475, .425, 0, .995);

    transition: color .45s cubic-bezier(.475, .425, 0, .995)

}



.page-service-landing .service-list a:hover {

    color: #ba9095

}



.page-service-landing .process {

    background-color: #f8edee

}



.page-service-landing .process-head h1 {

    margin: 30px 0 80px;

    width: 650px

}



@media (max-width:767px) {

    .page-service-landing .process-head h1 {

        width: 100%;

        margin-bottom: 43px

    }

}



.page-service-landing .process .process-item {

    margin-bottom: 10px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    cursor: pointer

}



.page-service-landing .process-steps .title {

    width: 100%;

    height: 100px;

    background-color: #fff;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    padding: 0 30px;

    -webkit-box-sizing: border-box;

    box-sizing: border-box

}



@media (max-width:767px) {

    .page-service-landing .process-steps .title {

        padding: 0;

        height: 63px

    }

}



.page-service-landing .process-steps .icon-container {

    width: 95px;

    -ms-flex-item-align: center;

    align-self: center;

    text-align: center

}



.page-service-landing .process-steps .icon-container img {

    vertical-align: middle

}



@media (max-width:767px) {

    .page-service-landing .process-steps .icon-container {

        width: 65px

    }

    .page-service-landing .process-steps .icon-container img {

        width: 70%;

        height: 70%

    }

}



.page-service-landing .process-steps .name {

    -webkit-box-flex: 2;

    -ms-flex: 2;

    flex: 2;

    -ms-flex-item-align: center;

    align-self: center;

    font-size: 24px

}



@media (max-width:767px) {

    .page-service-landing .process-steps .name {

        font-size: 20px

    }

}



.page-service-landing .process-steps .button-container {

    width: 80px;

    -ms-flex-item-align: center;

    align-self: center;

    text-align: center

}



@media (max-width:767px) {

    .page-service-landing .process-steps .button-container {

        width: 40px

    }

}



.page-service-landing .process-steps .context {

    width: 100%;

    max-height: 0;

    background-color: #fff;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    -webkit-transition: max-height .85s cubic-bezier(.475, .425, 0, .995);

    transition: max-height .85s cubic-bezier(.475, .425, 0, .995);

    overflow: hidden

}



.page-service-landing .process-steps .context.show {

    max-height: 500px

}



.page-service-landing .process-steps .context p {

    padding: 0 155px 40px 125px

}



@media (max-width:767px) {

    .page-service-landing .process-steps .context p {

        padding: 0 40px 35px 65px

    }

}



.page-service-landing .partner {

    background-color: #f6f6f7

}



.page-service-landing .partner-head {

    text-align: center

}



.page-service-landing .partner-head h1 {

    margin: 30px auto 80px;

    width: 800px

}



@media (min-width:768px) and (max-width:1024px) {

    .page-service-landing .partner-head h1 {

        width: 600px

    }

}



@media (max-width:767px) {

    .page-service-landing .partner-head h1 {

        width: 100%

    }

}



.page-service-landing .partner-body {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



@media (max-width:767px) {

    .page-service-landing .partner-body {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



.page-service-landing .partner-body li {

    width: calc(50% - 15px);

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column

}



@media (max-width:767px) {

    .page-service-landing .partner-body li {

        width: 100%

    }

}



.page-service-landing .partner-body .illustration {

    width: 70%;

    margin: 0 auto

}



.page-service-landing .partner-body .illustration img {

    width: 100%;

    height: auto;

    min-height: 1px

}



.page-service-landing .partner-body .context {

    padding: 50px;

    text-align: center

}



@media (min-width:768px) and (max-width:1024px) {

    .page-service-landing .partner-body .context {

        padding: 50px 0

    }

}



@media (max-width:767px) {

    .page-service-landing .partner-body .context {

        padding: 30px 25px 65px

    }

}



.page-service-detail .detail {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    background-color: #f6f6f7;

    position: relative

}



@media (max-width:1024px) {

    .page-service-detail .detail {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



.page-service-detail .context {

    width: calc(100% - 525px);

    padding: 160px 90px 160px 0

}



@media (max-width:1024px) {

    .page-service-detail .context {

        width: 100%

    }

}



@media (max-width:767px) {

    .page-service-detail .context {

        padding: 75px 90px 75px 0

    }

}



.page-service-detail .context h1 {

    margin: 30px 0 60px

}



@media (max-width:767px) {

    .page-service-detail .context h1 {

        margin-bottom: 20px

    }

}



.page-service-detail .context h2 {

    margin-bottom: 20px

}



@media (max-width:767px) {

    .page-service-detail .context h2 {

        margin-bottom: 15px

    }

}



.page-service-detail .image {

    width: 525px;

    height: 100%;

    position: absolute;

    top: 0;

    right: 0;

    background-position: left top;

    background-repeat: no-repeat;

    background-color: #f8edee

}



@media (max-width:1024px) {

    .page-service-detail .image {

        display: none

    }

}



.page-service-detail .list-red {

    border-top: 1px solid #d1d8dd;

    border-bottom: 1px solid #d1d8dd;

    padding: 50px 0 20px;

    margin-bottom: 50px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap

}



.page-service-detail .list-red li {

    width: calc(50% - 30px);

    margin-bottom: 30px

}



@media (max-width:767px) {

    .page-service-detail .list-red li {

        width: 100%

    }

}



.page-service-detail .font-link {

    display: inline-block;

    margin-bottom: 50px

}



.page-service-detail .font-link:after {

    display: none

}



.page-service-detail .font-link .icon-arrow {

    margin-left: 7px;

    margin-bottom: -1px

}



.page-service-detail .font-link .icon-arrow:before {

    background-color: #ba9095;

    top: calc(50% - 2px)

}



.page-service-detail .font-link .icon-arrow:after {

    width: 6px;

    height: 6px;

    border-bottom-color: #ba9095;

    border-right-color: #ba9095

}



.page-service-detail .font-link:hover .icon-arrow {

    width: 18px

}



.page-service-detail .font-link:hover .icon-arrow:before {

    width: 18px

}



.page-about .hero {

    min-height: 700px;

    background-color: #f8edee;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    position: relative;

    overflow: hidden

}



@media (max-width:767px) {

    .page-about .hero {

        min-height: 625px

    }

}



.page-about .hero-background {

    position: absolute;

    width: 1500px;

    height: 100%;

    max-width: 1500px;

    min-width: 1500px;

    top: 0;

    left: 0;

    right: 0;

    z-index: 1;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    margin: 0 auto

}



@media (max-width:767px) {

    .page-about .hero-background {

        width: 1200px;

        max-width: 1200px;

        min-width: 1200px;

        left: unset;

        right: -150px;

        opacity: .5

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .page-about .hero-background {

        left: -200px

    }

}



@media (min-width:768px) and (max-width:1024px) {

    .page-about .hero-background {

        left: unset;

        right: -100px

    }

}



.page-about .hero-background .illustration {

    width: 100%

}



.page-about .hero-content {

    width: 560px;

    height: 100%;

    z-index: 2

}



@media (max-width:767px) {

    .page-about .hero-content {

        width: 100%

    }

}



@media (min-width:768px) and (max-width:1024px) {

    .page-about .hero-content {

        -webkit-box-sizing: border-box;

        box-sizing: border-box;

        width: 100%;

        padding-right: calc(100% - 590px - 20px)

    }

}



.page-about .hero h1 {

    margin: 30px 0

}



@media (max-width:767px) {

    .page-about .hero h1 {

        margin: 20px 0 16px

    }

}



.page-about .hero p {

    margin-bottom: 60px

}



@media (max-width:767px) {

    .page-about .hero p {

        margin-bottom: 46px

    }

}



.page-about .factors-head {

    text-align: center

}



@media (max-width:767px) {

    .page-about .factors-head {

        text-align: left

    }

}



.page-about .factors-head h1 {

    margin: 30px auto 80px;

    width: 650px

}



@media (max-width:767px) {

    .page-about .factors-head h1 {

        width: 100%;

        margin-bottom: 43px

    }

}



.page-about .factors .list {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



.page-about .factors li {

    width: calc(50% - 135px);

    margin-bottom: 80px

}



@media (min-width:768px) and (max-width:1024px) {

    .page-about .factors li {

        width: calc(50% - 30px)

    }

}



@media (max-width:767px) {

    .page-about .factors li {

        width: 100%;

        margin-bottom: 45px

    }

    .page-about .factors li p {

        margin: 0;

        max-height: 0;

        overflow: hidden;

        -webkit-transition: all .55s cubic-bezier(.475, .425, 0, .995);

        transition: all .55s cubic-bezier(.475, .425, 0, .995)

    }

    .page-about .factors li p.show {

        max-height: 500px;

        margin-top: 30px

    }

}



.page-about .factors .title {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex

}



.page-about .factors .title h2 {

    -ms-flex-item-align: center;

    align-self: center

}



.page-about .factors .button-container {

    display: none;

    -webkit-box-flex: 3;

    -ms-flex: 3;

    flex: 3

}



@media (max-width:767px) {

    .page-about .factors .button-container {

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-pack: end;

        -ms-flex-pack: end;

        justify-content: flex-end

    }

}



@media (max-width:767px) {

    .page-about .factors .button-toggle {

        display: block

    }

}



.page-about .customers {

    background-color: #f6f6f7

}



.page-about .customers h1 {

    margin: 30px 0 80px;

    width: 660px

}



@media (max-width:767px) {

    .page-about .customers h1 {

        width: 100%;

        margin-bottom: 43px

    }

}



.page-about .customers li {

    width: 100%;

    padding: 50px 70px;

    background-color: #fff;

    -webkit-box-sizing: border-box;

    box-sizing: border-box

}



@media (min-width:768px) and (max-width:1024px) {

    .page-about .customers li {

        padding: 50px 40px

    }

}



@media (max-width:767px) {

    .page-about .customers li {

        padding: 40px 35px

    }

}



.page-about .customers li:not(:last-of-type) {

    margin-bottom: 10px

}



.page-about .customers li p {

    margin: 30px 0 26px

}



@media (max-width:767px) {

    .page-about .customers .author {

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex

    }

}



.page-about .customers .avatar {

    display: inline-block;

    width: 50px;

    height: 50px;

    border-radius: 50%;

    background-size: cover;

    background-position: center;

    margin-right: 27px;

    vertical-align: middle

}



@media (max-width:767px) {

    .page-about .customers .avatar {

        margin-right: 0

    }

}



.page-about .customers .name {

    font-weight: 700;

    font-size: 14px;

    line-height: 30px

}



@media (max-width:767px) {

    .page-about .customers .name {

        padding-left: 15px;

        -ms-flex-item-align: center;

        align-self: center;

        line-height: 20px;

        -webkit-box-flex: 2;

        -ms-flex: 2;

        flex: 2

    }

}



.page-about .awards {

    text-align: center;

    padding-bottom: 0

}



.page-about .awards h1 {

    margin: 30px auto 80px;

    width: 750px

}



@media (min-width:768px) and (max-width:1024px) {

    .page-about .awards h1 {

        width: 500px

    }

}



@media (max-width:767px) {

    .page-about .awards h1 {

        width: 100%

    }

}



.page-about .awards:after {

    content: "";

    display: block;

    width: 100%;

    height: 2px;

    background-color: #e6eef2

}



.page-about .awards ul {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    padding: 0 120px 60px

}



@media (max-width:1024px) {

    .page-about .awards ul {

        padding: 0 0 60px;

        -ms-flex-pack: distribute;

        justify-content: space-around

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .page-about .awards ul {

        padding: 0 0 60px

    }

}



.page-about .awards li {

    width: 20%;

    margin-bottom: 100px

}



@media (max-width:1024px) {

    .page-about .awards li {

        width: 33.33%;

        margin-bottom: 50px

    }

}



@media (max-width:767px) {

    .page-about .awards li {

        margin-bottom: 35px

    }

    .page-about .awards li img {

        width: 100%;

        height: auto

    }

}



.page-about .team {

    text-align: center;

    padding-bottom: 0

}



.page-about .team h1 {

    margin: 0 0 80px

}



.page-about .team .list {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap

}



.page-about .team li {

    width: 33.33%;

    overflow: hidden;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column

}



@media (max-width:1024px) {

    .page-about .team li {

        width: 50%

    }

}



.page-about .team li img {

    width: 100%;

    height: auto;

    min-height: 1px

}



.page-about .office {

    text-align: center;

    padding-bottom: 0

}



.page-about .office h1 {

    margin-bottom: 90px

}



@media (max-width:767px) {

    .page-about .office h1 {

        margin-bottom: 50px

    }

}



.page-career-landing .hero {

    min-height: 700px;

    background-color: #f8edee;

    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;

    position: relative;

    overflow: hidden

}



@media (max-width:767px) {

    .page-career-landing .hero {

        min-height: unset

    }

}



.page-career-landing .hero-background {

    position: absolute;

    width: 1500px;

    height: 100%;

    max-width: 1500px;

    min-width: 1500px;

    top: 0;

    left: -200px;

    right: 0;

    z-index: 1;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    margin: 0 auto

}



@media (max-width:767px) {

    .page-career-landing .hero-background {

        width: 1000px;

        min-width: 1000px;

        max-width: 1000px;

        left: unset;

        right: -50px

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .page-career-landing .hero-background {

        left: -300px

    }

}



@media (min-width:768px) and (max-width:1024px) {

    .page-career-landing .hero-background {

        left: unset;

        right: -100px

    }

}



.page-career-landing .hero-background .illustration {

    width: 100%

}



.page-career-landing .hero-content {

    width: 560px;

    height: 100%;

    z-index: 2

}



@media (max-width:767px) {

    .page-career-landing .hero-content {

        width: 100%

    }

}



.page-career-landing .hero h1 {

    margin: 30px 0

}



@media (max-width:767px) {

    .page-career-landing .hero h1 {

        margin: 20px 0 16px

    }

}



.page-career-landing .hero p {

    margin-bottom: 60px

}



@media (max-width:767px) {

    .page-career-landing .hero p {

        margin-bottom: 46px

    }

}



.page-career-landing .positions-head {

    text-align: center

}



.page-career-landing .positions-head h1 {

    margin: 30px auto 80px;

    width: 680px

}



@media (max-width:767px) {

    .page-career-landing .positions-head h1 {

        width: 100%;

        margin-bottom: 45px

    }

}



.page-career-landing .positions-body li {

    height: 100px;

    background-color: #f6f6f7;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between;

    padding: 0 70px;

    margin-bottom: 10px

}



@media (max-width:767px) {

    .page-career-landing .positions-body li {

        height: unset;

        min-height: 175px;

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column;

        -webkit-box-pack: unset;

        -ms-flex-pack: unset;

        justify-content: unset

    }

    .page-career-landing .positions-body li h2 {

        margin: 40px auto 25px;

        text-align: center

    }

    .page-career-landing .positions-body li .button-filled {

        display: block;

        margin-bottom: 25px

    }

}



.page-career-landing .positions-body li>* {

    -ms-flex-item-align: center;

    align-self: center

}



.page-career-landing .factors {

    background-color: #f6f6f7

}



.page-career-landing .factors-head {

    text-align: center

}



@media (max-width:767px) {

    .page-career-landing .factors-head {

        text-align: left

    }

}



.page-career-landing .factors-head h1 {

    margin: 30px auto 80px;

    width: 650px

}



@media (max-width:767px) {

    .page-career-landing .factors-head h1 {

        width: 100%;

        margin-bottom: 43px

    }

}



.page-career-landing .factors .list {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



.page-career-landing .factors li {

    width: calc(50% - 135px);

    margin-bottom: 80px

}



@media (min-width:768px) and (max-width:1024px) {

    .page-career-landing .factors li {

        width: calc(50% - 30px)

    }

}



@media (max-width:767px) {

    .page-career-landing .factors li {

        width: 100%;

        margin-bottom: 45px

    }

    .page-career-landing .factors li p {

        margin: 0;

        max-height: 0;

        overflow: hidden;

        -webkit-transition: all .55s cubic-bezier(.475, .425, 0, .995);

        transition: all .55s cubic-bezier(.475, .425, 0, .995)

    }

    .page-career-landing .factors li p.show {

        max-height: 500px;

        margin-top: 30px

    }

}



.page-career-landing .factors .title {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex

}



.page-career-landing .factors .title h2 {

    -ms-flex-item-align: center;

    align-self: center

}



.page-career-landing .factors .button-container {

    display: none;

    -webkit-box-flex: 3;

    -ms-flex: 3;

    flex: 3

}



@media (max-width:767px) {

    .page-career-landing .factors .button-container {

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-pack: end;

        -ms-flex-pack: end;

        justify-content: flex-end

    }

}



@media (max-width:767px) {

    .page-career-landing .factors .button-toggle {

        display: block

    }

}



.page-career-landing .office {

    text-align: center

}



.page-career-landing .office h1 {

    margin-bottom: 90px

}



@media (max-width:767px) {

    .page-career-landing .office h1 {

        margin-bottom: 45px

    }

}



.page-career-detail .page-head {

    background-color: #f6f6f7

}



.page-career-detail .department-image {

    width: 100%;

    height: 700px;

    background-size: cover;

    background-position: center

}



@media (min-width:768px) and (max-width:1024px) {

    .page-career-detail .department-image {

        height: 450px

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .page-career-detail .department-image {

        height: 515px

    }

}



@media (max-width:767px) {

    .page-career-detail .department-image {

        height: 155px

    }

}



.page-career-detail .opportunity {

    height: 215px;

    text-align: center;

    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;

    color: #c1c1c1

}



.page-career-detail .body h1 {

    font-weight: 700;

    font-size: 30px;

    line-height: 40px

}



.page-career-detail .body h2 {

    font-weight: 700;

    font-size: 24px;

    line-height: 40px

}



.page-career-detail .body li {

    padding-left: 30px;

    position: relative;

    margin: 20px 0

}



.page-career-detail .body li:before {

    content: '';

    width: 6px;

    height: 6px;

    border-radius: 50%;

    background-color: #ba9095;

    position: absolute;

    left: 0;

    top: 12px

}



.page-career-detail .application-form {

    background-color: #f6f6f7

}



.page-career-detail .application-form .form-submitted {

    visibility: hidden;

    opacity: 0;

    -webkit-transition: opacity .55s cubic-bezier(.475, .425, 0, .995) .2s;

    transition: opacity .55s cubic-bezier(.475, .425, 0, .995) .2s;

    position: absolute;

    left: 0;

    right: 0;

    text-align: center

}



@media (max-width:767px) {

    .page-career-detail .application-form .form-submitted {

        left: 0;

        right: 0;

        -webkit-box-sizing: border-box;

        box-sizing: border-box

    }

}



.page-career-detail .application-form .form-submitted.show {

    visibility: visible;

    opacity: 1

}



.page-career-detail .application-form .hide {

    opacity: 0;

    visibility: hidden

}



.page-career-detail .application-form .form {

    padding: 0 100px;

    -webkit-transition: opacity .55s cubic-bezier(.475, .425, 0, .995), visibility 10ms ease-out .55s;

    transition: opacity .55s cubic-bezier(.475, .425, 0, .995), visibility 10ms ease-out .55s

}



@media (max-width:1024px) {

    .page-career-detail .application-form .form {

        padding: 0

    }

}



.page-career-detail .application-form .head {

    text-align: center

}



.page-career-detail .application-form .head h1 {

    width: 680px

}



@media (max-width:767px) {

    .page-career-detail .application-form .head h1 {

        width: 100%

    }

}



.page-career-detail .application-form textarea {

    height: 300px;

    resize: none

}



.page-career-detail .application-form h1 {

    margin: 30px auto 70px

}



@media (max-width:767px) {

    .page-career-detail .application-form h1 {

        margin-bottom: 45px

    }

}



.page-career-detail .application-form h2 {

    margin: 60px 0 0

}



.page-career-detail .application-form div[class*=input-] {

    margin-top: 30px

}



@media (max-width:767px) {

    .page-career-detail .application-form div[class*=input-] {

        margin-top: 15px

    }

}



.page-career-detail .application-form .button-container {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center

}



.page-career-detail .application-form .button-submit {

    margin: 60px auto 20px auto

}



.page-career-detail .font-link {

    position: relative;

    display: inline-block

}



.page-career-detail .font-link:after {

    position: absolute;

    bottom: 0;

    content: "";

    display: block;

    width: 100%;

    height: 2px;

    background-color: #ba9095;

    -webkit-transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1), -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(0);

    transform: scaleX(0)

}



.page-career-detail .font-link:hover {

    color: #ba9095

}



.page-career-detail .font-link:hover:after {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1)

}



.page-contact .hero {

    min-height: 700px;

    background-color: #f8edee;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    position: relative;

    overflow: hidden

}



@media (max-width:767px) {

    .page-contact .hero {

        min-height: unset

    }

}



.page-contact .hero-background {

    position: absolute;

    width: 1500px;

    height: 100%;

    max-width: 1500px;

    min-width: 1500px;

    top: 0;

    left: 0;

    right: 0;

    z-index: 1;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    margin: 0 auto

}



@media (max-width:767px) {

    .page-contact .hero-background {

        width: 1100px;

        min-width: 1100px;

        max-width: 1100px;

        left: unset;

        right: -100px;

        opacity: .5

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .page-contact .hero-background {

        left: -100px

    }

}



@media (min-width:768px) and (max-width:1024px) {

    .page-contact .hero-background {

        left: unset;

        right: -100px

    }

}



.page-contact .hero-background .illustration {

    width: 100%

}



.page-contact .hero-content {

    width: 540px;

    height: 100%;

    z-index: 2

}



@media (max-width:767px) {

    .page-contact .hero-content {

        width: 100%

    }

}



.page-contact .hero h1 {

    margin: 30px 0

}



@media (max-width:767px) {

    .page-contact .hero h1 {

        margin: 20px 0 16px

    }

}



.page-contact .hero p {

    margin-bottom: 60px

}



@media (max-width:767px) {

    .page-contact .hero p {

        margin-bottom: 46px

    }

}



.page-inquiry .inquiry-form {

    background-color: #f6f6f7;

    position: relative;

    min-height: 750px

}



@media (max-width:1024px) {

    .page-inquiry .inquiry-form {

        min-height: unset

    }

}



.page-inquiry .inquiry-form .illustration-container {

    position: absolute;

    width: 525px;

    height: 100%;

    bottom: 0;

    right: 0;

    z-index: 1;

    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;

    background-color: #f9f2f2

}



@media (max-width:1024px) {

    .page-inquiry .inquiry-form .illustration-container {

        display: none

    }

}



.page-inquiry .inquiry-form .illustration-container .illustration {

    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: end;

    -ms-flex-pack: end;

    justify-content: flex-end;

    position: relative

}



.page-inquiry .inquiry-form .illustration-container .illustration .svg {

    -webkit-transition: all .55s cubic-bezier(.475, .425, 0, .995);

    transition: all .55s cubic-bezier(.475, .425, 0, .995);

    height: 100%

}



.page-inquiry .inquiry-form .illustration-container .illustration .svg.after {

    position: absolute;

    opacity: 0;

    top: 0;

    left: 0;

    right: 0

}



.page-inquiry .inquiry-form .illustration-container .illustration .svg.hide {

    opacity: 0

}



.page-inquiry .inquiry-form .illustration-container .illustration .svg.show {

    opacity: 1

}



.page-inquiry .inquiry-form .form,

.page-inquiry .inquiry-form .form-submitted {

    padding: 80px 60px 160px 0;

    width: calc(100% - 525px);

    z-index: 2

}



@media (max-width:1024px) {

    .page-inquiry .inquiry-form .form,

    .page-inquiry .inquiry-form .form-submitted {

        width: 100%;

        padding: 160px 0

    }

}



@media (max-width:767px) {

    .page-inquiry .inquiry-form .form,

    .page-inquiry .inquiry-form .form-submitted {

        padding: 75px 0

    }

}



.page-inquiry .inquiry-form .form {

    position: relative;

    -webkit-transition: opacity .55s cubic-bezier(.475, .425, 0, .995), visibility 10ms ease-out .55s;

    transition: opacity .55s cubic-bezier(.475, .425, 0, .995), visibility 10ms ease-out .55s

}



.page-inquiry .inquiry-form .hide {

    opacity: 0;

    visibility: hidden

}



.page-inquiry .inquiry-form .form-submitted {

    visibility: hidden;

    opacity: 0;

    -webkit-transition: opacity .55s cubic-bezier(.475, .425, 0, .995) .2s;

    transition: opacity .55s cubic-bezier(.475, .425, 0, .995) .2s;

    position: absolute

}



@media (min-width:768px) and (max-width:1024px) {

    .page-inquiry .inquiry-form .form-submitted {

        left: 0;

        right: 0;

        padding-left: 50px;

        -webkit-box-sizing: border-box;

        box-sizing: border-box

    }

}



@media (max-width:767px) {

    .page-inquiry .inquiry-form .form-submitted {

        left: 0;

        right: 0;

        -webkit-box-sizing: border-box;

        box-sizing: border-box

    }

}



.page-inquiry .inquiry-form .form-submitted.show {

    visibility: visible;

    opacity: 1

}



.page-inquiry .inquiry-form h1 {

    margin: 30px 0 50px

}



@media (max-width:767px) {

    .page-inquiry .inquiry-form h1 {

        margin-bottom: 27px

    }

}



.page-inquiry .inquiry-form .guide {

    margin-bottom: 40px

}



@media (max-width:767px) {

    .page-inquiry .inquiry-form .guide {

        margin-bottom: 40px

    }

}



.page-inquiry .inquiry-form textarea {

    height: 300px;

    resize: none

}



.page-inquiry .inquiry-form h2 {

    margin: 60px 0 0

}



.page-inquiry .inquiry-form div[class*=input-] {

    margin-top: 30px

}



@media (max-width:767px) {

    .page-inquiry .inquiry-form div[class*=input-] {

        margin-top: 15px

    }

}



.page-inquiry .inquiry-form .button-submit {

    margin-top: 60px

}



.page-inquiry .font-link {

    display: inline-block;

    position: relative

}



.page-inquiry .font-link:after {

    position: absolute;

    bottom: 0;

    content: "";

    display: block;

    width: 100%;

    height: 2px;

    background-color: #ba9095;

    -webkit-transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1), -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(0);

    transform: scaleX(0)

}



.page-inquiry .font-link:hover {

    color: #ba9095

}



.page-inquiry .font-link:hover:after {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1)

}



.page-thanks .inquiry-form {

    background-color: #f6f6f7;

    position: relative;

    min-height: 750px

}



@media (max-width:1024px) {

    .page-thanks .inquiry-form {

        min-height: unset

    }

}



.page-thanks .inquiry-form .illustration-container {

    position: absolute;

    width: 525px;

    height: 100%;

    bottom: 0;

    right: 0;

    z-index: 1;

    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;

    background-color: #f9f2f2

}



@media (max-width:1024px) {

    .page-thanks .inquiry-form .illustration-container {

        display: none

    }

}



.page-thanks .inquiry-form .illustration-container .illustration {

    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: end;

    -ms-flex-pack: end;

    justify-content: flex-end;

    position: relative

}



.page-thanks .inquiry-form .illustration-container .illustration .svg {

    -webkit-transition: all .55s cubic-bezier(.475, .425, 0, .995);

    transition: all .55s cubic-bezier(.475, .425, 0, .995);

    height: 100%

}



.page-thanks .inquiry-form .illustration-container .illustration .svg.hide {

    opacity: 0

}



.page-thanks .inquiry-form .illustration-container .illustration .svg.show {

    opacity: 1

}



.page-thanks .inquiry-form .form-submitted {

    padding: 160px 60px 160px 0;

    width: calc(100% - 525px);

    z-index: 2

}



@media (max-width:1024px) {

    .page-thanks .inquiry-form .form-submitted {

        width: 100%;

        padding: 160px 0

    }

}



@media (max-width:767px) {

    .page-thanks .inquiry-form .form-submitted {

        padding: 75px 0

    }

}



.page-thanks .inquiry-form .hide {

    opacity: 0;

    visibility: hidden

}



@media (min-width:768px) and (max-width:1024px) {

    .page-thanks .inquiry-form .form-submitted {

        left: 0;

        right: 0;

        padding-left: 50px;

        -webkit-box-sizing: border-box;

        box-sizing: border-box

    }

}



@media (max-width:767px) {

    .page-thanks .inquiry-form .form-submitted {

        left: 0;

        right: 0;

        -webkit-box-sizing: border-box;

        box-sizing: border-box

    }

}



.page-thanks .inquiry-form h1 {

    margin: 30px 0 50px

}



@media (max-width:767px) {

    .page-thanks .inquiry-form h1 {

        margin-bottom: 27px

    }

}



.page-thanks .inquiry-form .guide {

    margin-bottom: 80px

}



@media (max-width:767px) {

    .page-thanks .inquiry-form .guide {

        margin-bottom: 40px

    }

}



.page-thanks .inquiry-form textarea {

    height: 300px;

    resize: none

}



.page-thanks .inquiry-form h2 {

    margin: 60px 0 0

}



.page-thanks .inquiry-form div[class*=input-] {

    margin-top: 30px

}



@media (max-width:767px) {

    .page-thanks .inquiry-form div[class*=input-] {

        margin-top: 15px

    }

}



.page-thanks .inquiry-form .button-submit {

    margin-top: 60px

}



.page-thanks .font-link {

    display: inline-block;

    position: relative

}



.page-thanks .font-link:after {

    position: absolute;

    bottom: 0;

    content: "";

    display: block;

    width: 100%;

    height: 2px;

    background-color: #ba9095;

    -webkit-transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1);

    transition: transform .45s cubic-bezier(.835, -.005, .06, 1), -webkit-transform .45s cubic-bezier(.835, -.005, .06, 1);

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(0);

    transform: scaleX(0)

}



.page-thanks .font-link:hover {

    color: #ba9095

}



.page-thanks .font-link:hover:after {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1)

}



.page-landing .hero {

    min-height: 700px;

    background-color: #f8edee;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

    position: relative;

    overflow: hidden

}



@media (max-width:767px) {

    .page-landing .hero {

        min-height: 625px

    }

}



.page-landing .hero-background {

    position: absolute;

    width: 1500px;

    height: 100%;

    max-width: 1500px;

    min-width: 1500px;

    top: 30px;

    left: -200px;

    right: 0;

    z-index: 1;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    margin: 0 auto

}



@media (max-width:767px) {

    .page-landing .hero-background {

        width: 1400px;

        min-width: 1400px;

        max-width: 1400px;

        left: -200px

    }

}



.page-landing .hero-background .left {

    width: 50%

}



.page-landing .hero-background .right {

    width: 50%

}



.page-landing .hero-content {

    width: 560px;

    height: 100%;

    -ms-flex-item-align: end;

    align-self: flex-end;

    position: relative;

    z-index: 2

}



@media (min-width:768px) and (max-width:1024px) {

    .page-landing .hero-content {

        -webkit-box-sizing: border-box;

        box-sizing: border-box;

        width: 100%;

        padding-right: calc(100% - 590px - 50px)

    }

}



@media (max-width:767px) {

    .page-landing .hero-content {

        width: 100%

    }

}



.page-landing .hero h1 {

    margin: 30px 0

}



@media (max-width:767px) {

    .page-landing .hero h1 {

        margin: 20px 0 16px

    }

}



.page-landing .hero p {

    margin-bottom: 60px

}



@media (max-width:767px) {

    .page-landing .hero p {

        margin-bottom: 46px

    }

}



.page-landing .service-list-head {

    text-align: center

}



@media (max-width:767px) {

    .page-landing .service-list-head {

        text-align: left

    }

}



.page-landing .service-list-head h1 {

    margin: 30px auto 80px;

    width: 600px

}



@media (max-width:767px) {

    .page-landing .service-list-head h1 {

        width: 100%;

        margin-bottom: 43px

    }

}



.page-landing .service-list ul {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between

}



@media (max-width:767px) {

    .page-landing .service-list ul {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column

    }

}



.page-landing .service-list li {

    width: calc(33.33% - 110px)

}



@media (min-width:768px) and (max-width:1024px) {

    .page-landing .service-list li {

        width: calc(50% - 110px)

    }

}



@media (max-width:767px) {

    .page-landing .service-list li {

        width: 100%

    }

}



.page-landing .service-list a {

    -webkit-transition: color .45s cubic-bezier(.475, .425, 0, .995);

    transition: color .45s cubic-bezier(.475, .425, 0, .995)

}



.page-landing .service-list a:hover {

    color: #ba9095

}



.page-landing .works {

    background-color: #f6f6f7

}



.page-landing .works .logos {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: justify;

    -ms-flex-pack: justify;

    justify-content: space-between;

    width: 100%;

    padding: 0 240px;

    -webkit-box-sizing: border-box;

    box-sizing: border-box

}



@media (min-width:768px) and (max-width:1024px) {

    .page-landing .works .logos {

        padding: 0 20px

    }

}



@media (max-width:767px) {

    .page-landing .works .logos {

        padding: 0;

        overflow-x: scroll

    }

}



.page-landing .works .logos li {

    opacity: .15;

    -webkit-transition: opacity .45s cubic-bezier(.475, .425, 0, .995);

    transition: opacity .45s cubic-bezier(.475, .425, 0, .995);

    cursor: pointer

}



.page-landing .works .logos li.selected {

    opacity: 1

}



@media (max-width:767px) {

    .page-landing .works .logos li:first-of-type {

        margin-right: 20px

    }

    .page-landing .works .logos li img {

        width: 100px;

        height: auto

    }

}



.page-landing .works .pointer-container {

    width: 100%;

    position: relative

}



@media (max-width:767px) {

    .page-landing .works .pointer-container {

        display: none

    }

}



.page-landing .works .icon-pointer {

    bottom: 100%;

    left: 0;

    border: solid transparent;

    height: 0;

    width: 0;

    position: absolute;

    pointer-events: none;

    border-color: transparent;

    border-bottom-color: #ba9095;

    border-width: 10px;

    margin-left: -10px;

    -webkit-transition: -webkit-transform .55s cubic-bezier(.475, .425, 0, .995);

    transition: -webkit-transform .55s cubic-bezier(.475, .425, 0, .995);

    transition: transform .55s cubic-bezier(.475, .425, 0, .995);

    transition: transform .55s cubic-bezier(.475, .425, 0, .995), -webkit-transform .55s cubic-bezier(.475, .425, 0, .995)

}



.page-landing .works .preview {

    background-color: #fff;

    width: 100%;

    padding: 50px 120px 150px;

    border-top: 2px solid #ba9095;

    position: relative;

    -webkit-box-sizing: border-box;

    box-sizing: border-box

}



@media (min-width:768px) and (max-width:1024px) {

    .page-landing .works .preview {

        padding: 50px 0 100px

    }

}



@media (max-width:767px) {

    .page-landing .works .preview {

        padding: 0;

        height: 400px;

        overflow: hidden

    }

}



@media (max-width:767px) {

    .page-landing .works .swiper-slide img {

        height: auto;

        width: 100%

    }

}



.page-landing .works .swiper-container {

    display: none;

    position: unset

}



.page-landing .works .swiper-container.show {

    display: block

}



.page-landing .works .swiper-pagination {

    bottom: 90px

}



@media (min-width:768px) and (max-width:1024px) {

    .page-landing .works .swiper-pagination {

        bottom: 40px

    }

}



@media (max-width:767px) {

    .page-landing .works .swiper-pagination {

        bottom: 20px

    }

}



.page-landing .works .swiper-pagination-bullet {

    width: 10px;

    height: 10px;

    border: 1px solid #c5c5c5;

    background-color: transparent;

    opacity: 1;

    -webkit-transition: all .45s cubic-bezier(.475, .425, 0, .995);

    transition: all .45s cubic-bezier(.475, .425, 0, .995);

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    margin: 0 10px

}



@media (max-width:767px) {

    .page-landing .works .swiper-pagination-bullet {

        width: 6px;

        height: 6px

    }

}



.page-landing .works .swiper-pagination-bullet-active {

    background-color: #ba9095;

    border-color: #ba9095

}



.page-landing .works .swiper-button-next,

.page-landing .works .swiper-button-prev {

    background: #000;

    width: 50px;

    height: 130px;

    z-index: 2;

    top: calc(50% - 65px)

}



@media (max-width:767px) {

    .page-landing .works .swiper-button-next,

    .page-landing .works .swiper-button-prev {

        display: none

    }

}



.page-landing .works .swiper-button-next:after,

.page-landing .works .swiper-button-prev:after {

    content: "";

    position: absolute;

    border-bottom: 2px solid #fff;

    border-right: 2px solid #fff;

    border-radius: 2px;

    width: 12px;

    height: 12px;

    -webkit-transform: rotate(-45deg);

    transform: rotate(-45deg);

    -webkit-transform-origin: center;

    transform-origin: center;

    top: calc(50% - 6px);

    right: calc(50% - 6px)

}



.page-landing .works .swiper-button-prev {

    left: 0

}



.page-landing .works .swiper-button-prev:after {

    -webkit-transform: rotate(135deg);

    transform: rotate(135deg);

    right: calc(50% - 8px)

}



.page-landing .works .swiper-button-next {

    right: 0

}



.page-landing .works .swiper-button-disabled {

    opacity: 1;

    pointer-events: all

}



.page-landing .awards {

    text-align: center;

    padding-bottom: 0

}



.page-landing .awards h1 {

    margin: 30px auto 80px;

    width: 750px

}



@media (min-width:768px) and (max-width:1024px) {

    .page-landing .awards h1 {

        width: 500px

    }

}



@media (max-width:767px) {

    .page-landing .awards h1 {

        width: 100%

    }

}



.page-landing .awards ul {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    padding: 0 120px 60px

}



@media (max-width:1024px) {

    .page-landing .awards ul {

        padding: 0 0 60px;

        -ms-flex-pack: distribute;

        justify-content: space-around

    }

}



@media (min-width:1025px) and (max-width:1200px) {

    .page-landing .awards ul {

        padding: 0 0 60px

    }

}



.page-landing .awards li {

    width: 20%;

    margin-bottom: 100px

}



@media (max-width:1024px) {

    .page-landing .awards li {

        width: 33.33%;

        margin-bottom: 50px

    }

}



@media (max-width:767px) {

    .page-landing .awards li {

        margin-bottom: 35px

    }

    .page-landing .awards li img {

        width: 100%;

        height: auto

    }

}



.page-landing .customers {

    background-color: #f8edee

}



.page-landing .customers h1 {

    margin: 30px 0 80px;

    width: 660px

}



@media (max-width:767px) {

    .page-landing .customers h1 {

        width: 100%;

        margin-bottom: 43px

    }

}



.page-landing .customers li {

    width: 100%;

    padding: 50px 70px;

    background-color: #fff;

    -webkit-box-sizing: border-box;

    box-sizing: border-box

}



@media (min-width:768px) and (max-width:1024px) {

    .page-landing .customers li {

        padding: 50px 40px

    }

}



@media (max-width:767px) {

    .page-landing .customers li {

        padding: 40px 35px

    }

}



.page-landing .customers li:not(:last-of-type) {

    margin-bottom: 10px

}



.page-landing .customers li p {

    margin: 30px 0 26px

}



@media (max-width:767px) {

    .page-landing .customers .author {

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex

    }

}



.page-landing .customers .avatar {

    display: inline-block;

    width: 50px;

    height: 50px;

    border-radius: 50%;

    background-size: cover;

    background-position: center;

    margin-right: 27px;

    vertical-align: middle

}



@media (max-width:767px) {

    .page-landing .customers .avatar {

        margin-right: 0

    }

}



.page-landing .customers .name {

    font-weight: 700;

    font-size: 14px;

    line-height: 30px

}



@media (max-width:767px) {

    .page-landing .customers .name {

        padding-left: 15px;

        -ms-flex-item-align: center;

        align-self: center;

        line-height: 20px;

        -webkit-box-flex: 2;

        -ms-flex: 2;

        flex: 2

    }

}



.page-landing .office {

    text-align: center

}



.page-landing .office h1 {

    margin-bottom: 90px

}



@media (max-width:767px) {

    .page-landing .office h1 {

        margin-bottom: 50px

    }

}



.page-landing .inquiry-form {

    background-color: #f6f6f7;

    position: relative;

    min-height: 750px

}



@media (max-width:1024px) {

    .page-landing .inquiry-form {

        min-height: unset

    }

}



.page-landing .inquiry-form .illustration-container {

    position: absolute;

    width: 545px;

    height: 100%;

    bottom: 0;

    right: 0;

    z-index: 1;

    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;

    background-color: #f9f2f2

}



@media (max-width:1024px) {

    .page-landing .inquiry-form .illustration-container {

        display: none

    }

}



.page-landing .inquiry-form .illustration-container .illustration {

    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: end;

    -ms-flex-pack: end;

    justify-content: flex-end;

    position: relative

}



.page-landing .inquiry-form .illustration-container .illustration .svg {

    -webkit-transition: all .55s cubic-bezier(.475, .425, 0, .995);

    transition: all .55s cubic-bezier(.475, .425, 0, .995);

    height: 100%

}



.page-landing .inquiry-form .illustration-container .illustration .svg.after {

    position: absolute;

    opacity: 0;

    top: 0;

    left: 0;

    right: 0

}



.page-landing .inquiry-form .illustration-container .illustration .svg.hide {

    opacity: 0

}



.page-landing .inquiry-form .illustration-container .illustration .svg.show {

    opacity: 1

}



.page-landing .inquiry-form .form,

.page-landing .inquiry-form .form-submitted {

    padding: 160px 60px 160px 0;

    width: calc(100% - 545px);

    z-index: 2

}



@media (max-width:1024px) {

    .page-landing .inquiry-form .form,

    .page-landing .inquiry-form .form-submitted {

        width: 100%;

        padding: 160px 0

    }

}



@media (max-width:767px) {

    .page-landing .inquiry-form .form,

    .page-landing .inquiry-form .form-submitted {

        padding: 75px 0

    }

}



.page-landing .inquiry-form .form {

    position: relative;

    -webkit-transition: opacity .55s cubic-bezier(.475, .425, 0, .995), visibility 10ms ease-out .55s;

    transition: opacity .55s cubic-bezier(.475, .425, 0, .995), visibility 10ms ease-out .55s

}



.page-landing .inquiry-form .hide {

    opacity: 0;

    visibility: hidden

}



.page-landing .inquiry-form .form-submitted {

    visibility: hidden;

    opacity: 0;

    -webkit-transition: opacity .55s cubic-bezier(.475, .425, 0, .995) .2s;

    transition: opacity .55s cubic-bezier(.475, .425, 0, .995) .2s;

    position: absolute

}



@media (min-width:768px) and (max-width:1024px) {

    .page-landing .inquiry-form .form-submitted {

        left: 0;

        right: 0;

        padding-left: 50px;

        -webkit-box-sizing: border-box;

        box-sizing: border-box

    }

}



@media (max-width:767px) {

    .page-landing .inquiry-form .form-submitted {

        left: 0;

        right: 0;

        -webkit-box-sizing: border-box;

        box-sizing: border-box

    }

}



.page-landing .inquiry-form .form-submitted.show {

    visibility: visible;

    opacity: 1

}



.page-landing .inquiry-form h1 {

    margin: 30px 0 50px

}



@media (max-width:767px) {

    .page-landing .inquiry-form h1 {

        margin-bottom: 27px

    }

}



.page-landing .inquiry-form .guide {

    margin-bottom: 80px

}



@media (max-width:767px) {

    .page-landing .inquiry-form .guide {

        margin-bottom: 40px

    }

}



.page-landing .inquiry-form textarea {

    height: 300px;

    resize: none

}



.page-landing .inquiry-form h2 {

    margin: 60px 0 0

}



.page-landing .inquiry-form div[class*=input-] {

    margin-top: 30px

}



@media (max-width:767px) {

    .page-landing .inquiry-form div[class*=input-] {

        margin-top: 15px

    }

}



.page-landing .inquiry-form .button-submit {

    margin-top: 60px

}


 /* The Modal (background) */
 .modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  }
  
  /* Modal Content/Box */
  .modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
  }
  
  /* The Close Button */
  .close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
  }
  
  .close:hover,
  .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
  }