/*************** Global ***************/

* { box-sizing:border-box; }

html {
    font-size:0.625em; font-family: 'Poppins', sans-serif; line-height:1.3;
    color:#1b1a32; cursor:default; overflow:hidden; overflow-y: auto; min-width:320px; }
body { font-size:1.8rem; }

img { max-width:100%; height:auto; vertical-align: top; box-sizing: content-box; }

svg { height:auto; }
svg * { fill:currentColor; }

ul, ol, li { list-style: none; padding:0; margin:0; }
a { text-decoration: none; color:currentColor; }
p { margin:1.2em 0; }

blockquote { margin:10px 0; font-style: italic; font-weight: 400; }

section { position: relative; }

strong, b { font-weight: 600; }
h1, h2, h3, h4, h5, h6 { display: block; margin:0; padding:0; font-size: inherit; font-weight:600;  }


/* Forms */

label, select { cursor:pointer; display: block; font-weight: 400; font-size: 1.8rem; }
label { color:#fff; }
label i { color:#f46358; }
select { color:#1b1a32; }
input[type=radio]:checked ~ label { cursor:default; }
input, textarea, select, button { color:#fff; height:4.2rem; padding:1.3rem 2rem; font-size: 1.8rem; font-weight: 400; background:#1b1a32; border: 2px solid #f46358; width:100%; max-width: 100%;  transition: all 150ms ease-out; }
input[type=checkbox], input[type=radio] { padding:inherit; height:auto; }
textarea { min-height: 18rem; min-width: 100%; width: 100% !important; display: block; }
input:focus, textarea:focus { background-color:#25243d; outline: none; }

input[type=checkbox] ~ label,
input[type=radio] ~ label { position: relative; padding-right:2.4em; font-size: 1.4rem; }
input[type=checkbox] ~ label { padding-left:1.5em; padding-right: 0; }
input[type=checkbox], input[type=radio] { left:-100vw; position:absolute; opacity: 0; }
input[type=checkbox] ~ label:before,
input[type=radio] ~ label:before,
input[type=checkbox] ~ label:after,
input[type=radio] ~ label:after { content:' '; display:block; font-size:1em; width:1em; height:1em; border-radius: 1em; background:#fff; position:absolute; right:0; top:50%; margin:0; transform: translateY(-50%); }
input[type=checkbox] ~ label:before,
input[type=checkbox] ~ label:after { border-radius: 0; left:0; right:auto; }
input[type=checkbox] ~ label:after,
input[type=radio] ~ label:after { width:0.4em; height:0.4em; right:0.3em; background:currentColor; transform: scale(0) translateY(-50%); transition:all 0.2s ease-in-out; }
input[type=checkbox] ~ label:after { left:0.3em; }
input[type=checkbox]:checked ~ label:after,
input[type=radio]:checked ~ label:after {  transform: scale(1) translateY(-50%); }

button { width:auto; font-weight:400; padding:2rem 6rem; height:auto; border:0; display: inline-block; text-transform: uppercase; background: none; transition:all 150ms ease-out; }


form ::-webkit-input-placeholder { color:#1b1a32; opacity:0.8; }
form ::-moz-placeholder { color:#1b1a32; opacity:0.8; }
form :-ms-input-placeholder { color:rgba(99,49,138,0.8); opacity:1; }
form ::placeholder { color:#1b1a32; opacity:0.8; }

form .element { position: relative; margin-bottom: 1.6rem; }
form .field-button { text-align: right; }
form .field--optional { text-align: right; font-size: 1.4rem; margin: 0; position: relative; top: -0.6em; }
form .field--optional .element { margin: 0; }

form .is-field-error label,
form .is-field-error label > * {
    color: #E41023;
}


input ~ label, textarea ~ label { pointer-events: none; position: absolute; left: 2rem; top: 0.9rem; padding-right: 2rem; }
.is-filled input ~ label, input:focus ~ label,
.is-filled textarea ~ label, textarea:focus ~ label { display: none; }


.responsive-embed { position: relative; padding-bottom: 56.25%; height:0; overflow: hidden; }
.responsive-embed .embeded,
.responsive-embed iframe,
.responsive-embed object,
.responsive-embed embed,
.responsive-embed video { position:absolute; top: 0; left: 0; width: 100%; height: 100%; margin:0; padding:0; }

/***** General *****/
#wrapper { overflow:hidden; }

.wrapper, .wrapper-large { max-width:1380px; padding:0 25px; margin:0 auto; position: relative; }
.wrapper-large { max-width: 1560px; padding: 0; }
.wrapper-inner { position: relative; padding:0 25px; }

.offset-left { margin-left: -116px; }
.offset-left > * { padding-left: 116px; }
.offset-right { margin-right: -116px; }
.offset-right > * { padding-right: 116px; }


.part { margin: 8rem 0; }

/*.wrapper:after, .inner:after { content:''; display:table; clear:both; }*/

.wrap-btn { text-align: center; }
.btn { display:inline-block; cursor:pointer; background: #1b1a32; color:#f46358; border:2px solid currentColor; text-transform: uppercase; text-align: center; font-size: 1.8rem; font-weight: 400; padding:1.2rem 4.8rem; transition: all 150ms ease-out; }
.btn:hover { border-color: #fff; color:#fff; }

.colored { color:#f46358; }
.size-medium { font-size: 2.2rem; }

.title { font-size: 3.6rem; font-weight: 600; line-height:1.2em; padding:0; color:#f46358; }

.bg-main-dots {
    background:#FFF url(../img/svg/bg_dots.svg) repeat;
    background-size: 1536px 1500px; /*1920px 1876px;*/
    background-attachment: fixed;
}
.bg-main-dots.dots--blue {
    background-image:url(../img/svg/bg_dots_blue.svg);
    background-color: #f46358;
}

.arrow-handwrite { display: block; width: 95px; height: 70px;
    background: url(../img/svg/arrow_handwrite.svg) no-repeat;
    background-size: contain;
}


.content-editor { line-height:1.3; }
/*.content-editor > :last-child { margin-bottom:0 !important; }*/
.content-editor p { margin:3rem 0; line-height:1.6em; }
.content-editor ul, .content-editor ol { margin:1.5rem 0; padding:0; }
.content-editor ol { counter-reset:ols; }
.content-editor p + ul,
.content-editor p + ol { margin-top: -1.5rem; }
.content-editor li { margin:1.2rem 0 1.2rem 3.3rem; position:relative; }
.content-editor a { color:#1b1a32; }
.content-editor a:hover { opacity:0.95; }
.content-editor img { height:auto !important; }
/*.content-editor ul li:before { content:''; position:absolute; left:-1.6rem; top:0.9rem; width:0.6rem; height:0.6rem; border-radius:9rem; background:currentColor;  }*/
.content-editor ul li:before { content:''; position:absolute; left:-1.8em; top:0.1em; width:1em; height:1em;
    background: url(../img/svg/tick.svg) no-repeat 50% 50%; background-size: contain;  }
.content-editor ol li:before { counter-increment: ols; content: counter(ols)'.'; position:absolute; right:100%; margin:0 3px 0 0; color:currentColor; font-weight: 600; }

.content-editor blockquote { position: relative; text-align: right; font-style: italic; padding-right: 2rem; }
.content-editor blockquote:before { content:''; position: absolute; right: -1rem; top: 0; height: 100%; width: 15px; background: url(../img/svg/dash_quote.svg) no-repeat 0 0; background-size: cover; }

.content-editor .title { margin: 3rem 0; font-size: 2.8rem; }

/* Links with text-decoration underline style */
/*
#header nav li.active a { position: relative; text-decoration: none; }
#header nav li.active a:after { content:''; position:absolute; left: 0; width: 100%; bottom: 0; height: 0; box-shadow: 0 0 0 0.02em currentColor; }
*/
.u,
u,
.link a,
a.link:hover,
.content-editor a,
#header nav li.active a span { text-decoration: none; position: relative;
    background-image: linear-gradient(to top,
        rgba(255, 255, 255, 0) 0.05em,
        currentColor 0.05em,
        currentColor 0.1em,
        rgba(255, 255, 255, 0) 0.10em
    );
    background-repeat: repeat-y;
}


/***** Header *****/
#header { padding:0; position:fixed; left:0; width:100%; background:#fff; z-index: 200; }
#header.opened { z-index: 300; }

#header .wrapper-default { max-width: 1450px; }
#header .wrapper-default .inner { padding:30px 0 0; height:80px; }
#header-push { height:80px; }

#header .logo { width:230px; height:100%; display:block; float:left; position:relative; z-index:100; overflow:hidden; }
#header .logo img { display:block; transition: all 150ms ease-out; }
#header .logo:active img { transform:scale(0.98); }

#header .wrap-head { margin:0; position: absolute; z-index:99; left:0; height:0; overflow: hidden; /*transform:translateY(-100px);*/ top:0; right:0; opacity:0; transition:opacity 200ms ease-out, transform 350ms ease-out; }
#header.opened .wrap-head { opacity:1; /*transform:translateY(0);*/ height:100vh; padding-top: 80px; }
#header .wrap-head .wrapper { max-width: 940px; height: 100%; display: flex; align-items: center; overflow: hidden; overflow-y:auto; }
#header .wrap-head .inner { display: flex; width: 100%; color:#f46358; }

#header nav { display:block; margin:0; }
#header nav ul { display: block; }
#header nav li a { font-weight:400; font-size: 8rem; display: block; line-height: 1; padding:0.45em 0; white-space: nowrap; transition: all 250ms ease-out; }
#header nav li a:hover { color:#1b1a32; }

#header .right { width: 270px; margin-left: auto; padding-top: 40px; display: flex; flex-direction: column; }

#header .right .intro { font-weight: 600; font-size: 1.8rem; line-height: 1.5; }

#header .right .bottom { margin-top: auto; }

#header .right .switch-language { margin: 30px 0; }
#header .right .switch-language li { font-size:2.8rem; position: relative; display: block; z-index: 2; }
#header .right .switch-language li span { position: relative; }
#header .right .switch-language li.active { z-index: 1; }
#header .right .switch-language li.active span:before { content:''; background: url("../img/svg/select_lang.svg") no-repeat 50% 50%; background-size: contain; width: 100%; height: 100%; position: absolute; left: 8%; top: -7%; transform: scale(2.5); }
#header .right .switch-language li a { display:block; position: relative; padding: 12px 0; line-height: 1; transition: all 250ms ease-out; }
#header .right .switch-language li a:hover { color:#1b1a32; }

#header .right .social { font-size: 1.6rem; }
#header .right .social li { display: block; }
#header .right .social li a { display: block; padding: 10px 0; line-height: 1; transition: all 250ms ease-out; }
#header .right .social li a:hover { color:#1b1a32; }

#header .ham-nav { position:absolute; z-index:100; top:0; right:0; margin:22px 0 0; display:block; cursor:pointer; height:5px; border:20px solid transparent; width:35px; color:#1b1a32; background:currentColor; background-clip: content-box; box-sizing: content-box; -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }
#header .ham-nav:before,
#header .ham-nav:after { content:' '; display: block; position: absolute; width:100%; height:100%; background:currentColor; transition:top 150ms ease-out 100ms, transform 150ms ease-out; }
#header .ham-nav:before { top:-11px;  }
#header .ham-nav:after { top:11px; }
#header .ham-nav:hover:before { top:-13px;  }
#header .ham-nav:hover:after { top:13px; }
#header.opened .ham-nav { background-color:transparent; color:#f46358; }
#header.opened .ham-nav:before,
#header.opened .ham-nav:after { top:0; transform:rotate(-45deg); transition:top 150ms ease-out, transform 150ms ease-out 100ms; }
#header.opened .ham-nav:after { transform:rotate(45deg); }

#header .ham-nav { visibility: hidden; opacity:0; transform:translateY(-20px); transition:opacity 550ms ease-out 300ms, transform 550ms ease-out 300ms; }
.lets-start #header .ham-nav { visibility:visible; opacity:1; transform:translateY(0); }


/***** Footer *****/
#footer { color:#fff; margin-top: 15rem; }
#footer .wrapper-large { padding-left: 240px; }
#footer .wrapper-inner { background-color:#1b1a32; padding-left: 225px; padding-top: 5rem; padding-bottom: 5.5rem; min-height: 79rem; }
#footer .inner { max-width: 900px; position: relative; }
#footer .img { position: absolute; left: -240px; bottom: 0; z-index: 1; }
#footer .img:before {
    content:''; display: block; background: #f46358; font-size: 460px; width: 1em; height: 1em; border-radius: 1em;
    position: absolute; top: 48px; left: -95px; z-index: -1;
}

#footer .top .title { color:#fff; font-size: 36px; margin-bottom: 0.8em; }
#footer .top .description,
#footer .top .form { display: flex; }
#footer .top .prefix { width: 250px; padding-right: 3.6rem; font-size: 26px; font-weight: 600; margin-top: 1.2rem; }
#footer .top .prefix ~ * { flex:1; max-width: 610px; margin-left: auto; }
#footer .top .description .prefix {  }
#footer .top .description .content { color:#fff; font-size: 18px; font-weight: 600; }
#footer .top .form { margin-top: 1.2rem; }
#footer .top .form .msg { font-size: 3.6rem; display: flex; min-height: 450px; text-align: center; }
#footer .top .form .msg > div { margin: auto; }
#footer .top .form .msg > div div { display: block; font-size: 5.6rem; margin-bottom: 20px; }
#footer .top .title + .form { margin-top: 6.2rem; }

#footer .top form .field--btn .msg { font-size: 1.6rem; }
#footer .top form .btn[disabled] { opacity: 0.8; cursor:wait; transform: none; }



#footer .bottom { position: absolute; left: 0; bottom:1.6rem; font-size: 1.4rem; line-height: 1.7em; }
#footer .bottom .name { color:#fff; }
#footer .bottom .legals { margin-top: 1.6rem; }
#footer .bottom a { transition: all 250ms ease-out; }
#footer .bottom a:hover { opacity: 0.8; }


/***** Partials ******/

.catchwords { background-color: #1b1a32; padding: 4rem 0 7rem; max-width: 820px; }
.catchwords.offset-right {  }
.catchwords .word { font-size: 10rem; font-weight: 600; line-height: 1; position: relative; }
.catchwords .word.on .label { color: #fff; display: inline-block; position: relative; }
.catchwords .word.on .circle { position: absolute;  width: 106%;  height: 124%;  left: -0.1em;  top: -0.15em; }
.catchwords .word.on .circle svg { width: 100%; height: 100%; }

.part--services {}
.part--services .title { color:#1b1a32; }
.part--services .items { margin-top: 2rem; display: flex; flex-wrap: wrap; justify-content: center; }
.part--services .items > * { flex: 1 0 330px;  padding: 0 3rem; max-width: 360px; }
.part--services.more-than-4 .items > * { flex: 1 0 340px;  max-width: 440px; }
.part--services .items .item { text-align: center; }
.part--services .items .item .icon { height: 190px; margin: 5rem 0 3rem 0; display: flex; }
.part--services .items .item .icon img { margin: auto; max-width: 200px; max-height: 200px; }
.part--services .items .item .label { color:#f46358; font-size: 2.8rem; font-weight: 600; }
.part--services .items .item .content { color:#1b1a32; font-size: 1.8rem; font-weight: 600; }
.part--services .items .item .content > :first-child { margin-top: 0; }
.part--services .items .item .content > :last-child { margin-bottom: 0; }

.part--customers { margin: 13rem 0 5rem; position: relative; z-index: 1; }
.part--customers .items { margin: 4rem 0 0; display: flex; flex-wrap: wrap; justify-content: center; }
.part--customers .items .item {  padding: 4rem 0; position: relative; flex: 1 0 25%; max-width: 320px; cursor: pointer; user-select: none;  transition: all 150ms ease-out; }
.part--customers .items .item .picture { margin: auto; display: flex; height: 100%;
    filter: grayscale(1);  transition: all 150ms ease-out; }
.part--customers .items .item .picture img { margin: auto; max-width: 130px; max-height: 94px; }
.part--customers .items .item .detail { position: absolute; z-index: 99; width: 200%; max-width: 46vw; top: 0; left: 100%; background: #fff; padding: 7rem 5rem; border: 1px solid #f46358; transition: all 150ms ease-out; }
.part--customers .items .item .detail .name { font-size: 2.6rem; color:#f46358;font-weight: 600; }
.part--customers .items .item .detail .content > * { margin: 1rem 0; }
.part--customers .items .item:nth-child(4n+3) .detail,
.part--customers .items .item:nth-child(4n+4) .detail { right: 100%; left: auto; }
.part--customers .items .item:not(.active) .detail { pointer-events: none; opacity: 0; visibility: hidden; }
.part--customers .items .item.active .picture,
.part--customers .items .item:hover .picture { filter: none; opacity: 1 !important; }
.part--customers.on-active .items .item:not(.active) .picture { opacity: 0.4; }

.part--testimonials { margin: 5rem 0; }
.part--testimonials .inner { background: #f46358; padding:5rem 0; margin-left: 110px; }
.part--testimonials .inner-inner { position: relative; margin: 0 8.5rem 0 240px; }
.part--testimonials .title { margin: 0 0 1.4em; color:#fff; }
.part--testimonials .slider { position: relative; z-index: 5; }
.part--testimonials .slider .controls {  }
.part--testimonials .slider .controls .control { outline:none; padding:0; cursor: pointer; position: absolute; z-index: 10; width: 32px; height: 50px; top: 2.6rem; }
.part--testimonials .slider .controls .control:before { content:''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../img/svg/arrow_white.svg) no-repeat 50% 50%; background-size: contain; }
.part--testimonials .slider .controls .control:after { content:''; position: absolute; left: -100%; top: -50%; width: 200%; height: 100%; transform: translate(25%, 50%) scale(2);  }
.part--testimonials .slider .controls .control:hover { transform: scale(1.2);  }
.part--testimonials .slider .controls .control:active { transform: scale(0.9);  }
.part--testimonials .slider .controls .control.prev {  left: -87px; }
.part--testimonials .slider .controls .control.next { right: -87px; }
.part--testimonials .slider .controls .control.next:before { transform: rotate(180deg); }
.part--testimonials .slider .items { position: relative; display: flex; flex-wrap: wrap; z-index: 1; }
.part--testimonials .slider .items .item { transition: opacity 580ms ease-out; width: 100%; }
.part--testimonials .slider .items .item .picture { position: absolute; left: -240px; top: -5rem; font-size: 21.6rem; height: 1em; width: 1em; margin-left: -108px; overflow: hidden; border-radius: 1em; transition: all 250ms ease-in-out;  }
.part--testimonials .slider .items .item .content { transition: all 450ms ease-in-out; }
.part--testimonials .slider .items .item .content > * { margin: 1rem 0; }
.part--testimonials .slider .items .item .name {  color:#fff; font-weight: 600;  transition: all 450ms ease-out; }
.part--testimonials .slider .items .item .role { color:#fff; transition: all 450ms ease-out;  }
.part--testimonials .slider .items .item.active { order:-1; }
.part--testimonials .slider .items .item:not(.active) { opacity: 0; height: 0; overflow: hidden; }
.part--testimonials .slider .items .item:not(.active) .picture { transform: scale3d(1, 0.5, 1.5) /*scale(0.3)*/;  }
.part--testimonials .slider .items .item:not(.active) .content {   }
.part--testimonials .slider .items .item:not(.active) .name { transform: translateY(1em);  }
.part--testimonials .slider .items .item:not(.active) .role { transform: translateY(2em);  }


.part--content { }
.part--content .title-page { padding-top: 0.3em; margin-bottom:1.2em; font-size: 10.6rem; }
.part--content .main { position: relative; }
.part--content .content { background: #fff; padding: 1px 0; padding-right: 8rem; margin-right: 415px; position: relative; z-index: 2; }
.part--content .content-side { position: absolute; right: 0; top: -6rem; width: 400px; z-index: 5; }
.part--content .content-side .img { font-size:70rem; width: 1em; height: 1em; position: relative; min-width: 300px; min-height: 300px; }
.part--content .content-side .img img { position: relative; }
.part--content .content-side .img .img-out { position: relative; z-index: 2; overflow: hidden; height: 30%; }
.part--content .content-side .img .img-in { position: absolute; z-index: 1; left: 0; top:0; width: 100%; height: 100%; border-radius: 1em; overflow: hidden; }
.part--content .content-side .img .img-in:before,
.part--content .content-side .img .img-in:after { content: ''; position: absolute; z-index: -1; left: 0; top:0; width: 100%; height: 100%; background: #f46358; }
.part--content .content-side .img .img-in:after { z-index: 2; width: 15%; left: 55rem; background: linear-gradient(to right, transparent, #f46358 5rem); }
.part--content .content-side .img .img-out,
.part--content .content-side .img .img-in img { top: -2%; }
.part--content .content-side .img .arrow-handwrite { position: absolute; z-index: 10;  bottom: -3rem; left: 23%; transform: rotateX(180deg) rotate(-100deg); }
.part--content .content-side .detail { max-width: 340px; margin:6rem 0 0 2rem; }
.part--content .catchwords { position: absolute; right: 0; top: -4.2rem; padding-left: 15rem; z-index: 0; min-width: 620px; }

.part--steps {}
.part--steps .wrapper-title .wrapper-large {  overflow: hidden; z-index: 1; }
.part--steps .wrapper-title .wrapper-large .bg { z-index: -1; background: url(../img/svg/numbers_steps.svg) no-repeat 50% 100%; background-size: 18% auto; background-attachment: fixed; position: absolute; left: 0; top: 0; right: 0; bottom: 0; }
.part--steps .wrapper-title .title { color: #fff; font-size: 6.5rem; padding: 3em 1em 4em; text-align: center; }
.part--steps .inner { position: relative; z-index: 1; margin-top: -65px; text-align: center; }
.part--steps .inner .wrapper { background: #fff; padding-top: 64px; padding-bottom: 50px; }
.part--steps .inner .desc { font-weight: 600; font-size: 2.6rem; max-width: 950px; margin: 0 auto 4em; }
.part--steps .inner .desc > * { margin:0;  }
.part--steps .inner .items { position: relative; z-index: 1; }
.part--steps .inner .items:before { content:''; position: absolute; left: 50%; z-index: -1; top: 0; bottom:0; height: 100%;  width: 3px;  background:url('../img/line_dashed.png') repeat-y 50% 0; background-size: 100% auto; margin-left: -2px; }
.part--steps .inner .items .item { position: relative; display: flex; justify-content: center; padding-bottom: 97px; }
.part--steps .inner .items .col { width: 50%; display: flex; flex-wrap: wrap; padding: 0 55px; max-width: 430px; }
.part--steps .inner .items .item:nth-child(2n+1) .col.col-1st,
.part--steps .inner .items .item:nth-child(2n+2) .col.col-2nd { justify-content: flex-end; text-align: right; padding-left: 0; }
.part--steps .inner .items .item:nth-child(2n+2) .col.col-1st,
.part--steps .inner .items .item:nth-child(2n+1) .col.col-2nd { justify-content: left; text-align: left; padding-right: 0; order: 1; }
.part--steps .inner .items .item:last-child { background: #fff; }
.part--steps .inner .items .col .icon { height: 95px; width: 105px; position: relative; top: -1em; }
.part--steps .inner .items .col .icon img { max-width: 105px; max-height: 95px; height: 100%; }
.part--steps .inner .items .col .title { font-size: 2.6rem; width: 100%; }
.part--steps .inner .items .col .content { width: 100%; }
.part--steps .inner .items .col .content > :first-child { margin-top: 0; }
.part--steps .inner .items .col .content > :last-child { margin-bottom: 0; }
.part--steps .inner .items .col .title + .content { margin-top: 1em; }
.part--steps .inner .items .middle { position: absolute; left:50%; top: -0.18em; transform: translate(-50%,0); display: flex;  align-items:center; background:url('../img/svg/circle_step.svg') no-repeat 50% 50%; background-size: contain; font-size:4.5rem; width:1em; height:1em; border-radius:1em; }
.part--steps .inner .items .middle span { display: block; margin:auto; font-size: 2.2rem; font-weight: 600; line-height: 1; position: relative; top: 0.05em; }

.part--steps.style--about {}
.part--steps.style--about .wrapper-title .wrapper-large { background-color: #1b1a32;  }
.part--steps.style--about .wrapper-title .wrapper-large .bg { background-image: url(../img/svg/numbers_steps_julie.svg); background-size: 38% auto; }
.part--steps.style--about .inner .items .item { padding-bottom: 65px; }
.part--steps.style--about .inner .items .middle:before { content:''; margin: auto; width: 1em; height: 1em; font-size: 1.8rem; background:url('../img/svg/arrow_dark.svg') no-repeat 50% 50%; background-size: contain; }
.part--steps.style--about .inner .items .item:nth-child(2n+1) .middle:before { transform: rotate(180deg); }

/***** Pages *****/

#section-home {  }
#section-home .part--intro { margin-top: 0; }
#section-home .part--intro .cloud { position: absolute; right: 3rem; top: 0; font-size: 1rem; }
#section-home .part--intro .cloud a { font-weight: 600; line-height: 1; position: absolute; right: 0; top: 0; transition: all 250ms ease-out; }
#section-home .part--intro .cloud a:hover { transform: scale(1.1);  }
#section-home .part--intro .cloud span { display: block; transition: transform 200ms ease-out; }
#section-home .part--intro .cloud .word--seo { font-size: 15em; right: 4.5em; top: 0.43em; }
#section-home .part--intro .cloud .word--content { font-size: 12.5em; right: 4.44em; top: 1.8em; }
#section-home .part--intro .cloud .word--ux { font-size: 16em; right: 1.87em; top: 2.15em; z-index: 215; }
#section-home .part--intro .cloud .word--about-me { font-size: 10.8em; top: 0.58em; right: 3.5em; }
#section-home .part--intro .img { text-align: right; padding-right: 3rem; position: relative; top: -40px; z-index: 210; pointer-events: none; min-height: 837px; }
#section-home .part--intro .content { margin-top: -310px; margin-right: 520px; background: #fff; padding:20px 20px 20px 0; }
#section-home .part--intro .arrow-handwrite {    position: absolute; right: 295px; top: 50px;  transform: rotate(30deg); }

#section-home .part--secondary {  margin-bottom: 6rem; }
#section-home .part--secondary .content { background: #fff; padding:3.5rem; display: flex; margin: -420px -3.5rem 0 484px; }
#section-home .part--secondary .col { position: relative; flex: 1; min-width: 50%; }
#section-home .part--secondary .col:first-child .title { padding-right: 100px; }
#section-home .part--secondary .col + .col { padding-left: 4rem; }
#section-home .part--secondary .col .arrow-handwrite { position: absolute; right: 100%; top: 12px; transform: rotate(6deg) translateX(1rem); }
#section-home .part--secondary .col > *:first-child { margin-top: 0; }



#section-404 { text-align: center; margin: 11rem 0; }
#section-404 .content { font-size: 3.6rem; text-align: center; font-weight: 600; padding:4rem 0; }
#section-404 .title { font-size: 10rem; margin:0 0 5.3rem 0; }
#section-404 .desc { margin: 2rem 0 3rem; }
#section-404 .link { margin: 4rem 0; }
#section-404 .img { max-width: 387px; margin: 0 auto; }



/***** Pages transitions  *****/

body .loader { z-index: 1999;
    position: fixed; left: -120vw; top: 0; width: 100vw; height: 100vh;
    background: #f46358; opacity: 0; transform: skewX(-10deg); pointer-events: none; user-select: none;
    transition: left 400ms ease-in-out, opacity 400ms ease-out, width 400ms ease-in-out;
}
body .loader:before,
body .loader:after { content: ''; position: absolute; top: 0; height: 100%; width: 10vw; }
body .loader:before { background: linear-gradient(to right, transparent, #f46358); right: 100%; }
body .loader:after { background: linear-gradient(to right, #f46358, transparent); left: 100%; }

body.page-transition--out .loader { left:-20vw; opacity: 1; width: 140vw;
    transition: left 700ms ease-in-out, opacity 400ms ease-out, width 700ms ease-in-out; }




/* ****** RESPONSIVE ****** */


@media screen and (max-height:620px) {


    /***** Header *****/

    #header .wrap-head .wrapper { align-items: inherit; }



}


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

    /***** Pages *****/

    #section-home .part--intro .cloud .word--content { right: 3.45em; }

}


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

    textarea {
        min-height: 13rem;
    }


    #footer { margin-top: 10rem; }
    #footer .wrapper-inner { padding-left: 175px; }
    #footer .wrapper-large { padding-left: 150px; }

    #footer .top .prefix { width: auto; padding: 0; margin: 3rem 0; }
    #footer .top .prefix ~ * { max-width: inherit; }
    #footer .top .description, #footer .top .form { display: block; }

    #footer .bottom { position: relative; bottom: 0; left: 0; margin-top: 3rem; }
    #footer .bottom .links,
    #footer .bottom .links .social,
    #footer .bottom .legals { display: flex; }
    #footer .bottom .links .social li,
    #footer .bottom .legals .copyright { margin-left: 1rem; }

    /***** Partials *****/

    .catchwords { max-width: inherit; padding: 4rem 0; }
    .catchwords .inner { display: flex; flex-wrap: wrap; }
    .catchwords .word { margin-right: 5rem; font-size: 8rem; }

    .part--services .items > * { max-width: inherit !important; flex: 1 0 330px !important; }


    .part--customers .items .item .detail { padding: 3rem; }

    .part--content .title-page {  font-size: 8rem; }
    .part--content .content { margin-right: 0; padding-right: 0; }
    .part--content .content-side { position: relative; right: 0; top: 0; margin: 3rem 0; width: auto; display: flex; }
    .part--content .content-side .img { font-size: 40vw; }
    .part--content .content-side .detail { margin-left: 4rem; margin-top: 2rem; max-width: 40rem; }
    .part--content .content-side .img .arrow-handwrite { display: none; }

    .part--content .catchwords { position: relative; top: 0; padding-left: 3rem; min-width: inherit; }



    /***** Pages *****/

    #section-home .part--intro .img { top: 0; min-height: 484px; }
    #section-home .part--intro .img img { width: 270px; }
    #section-home .part--intro .content { margin: 0; padding-right: 0; }
    #section-home .part--intro .arrow-handwrite { right: 205px; top:30px; }
    #section-home .part--intro .cloud { right: 10vw; transform: scale(0.73); }

    #section-home .part--secondary .content { margin: 0; }




}

@media screen and (max-width:800px) {

    /***** Header *****/

    #header .wrap-head .inner { display: block; }
    #header .right .intro { display: none; }

    #header .wrap-head .wrapper {
        align-items: inherit;
        text-align: center;
    }

    #header nav li a { font-size: 4rem; }

    #header .right { width: auto; margin-left: 0; padding-top: 0; }
    #header .right .switch-language,
    #header .right .social { display: flex; justify-content: center; margin: 30px 0; }
    #header .right .switch-language li { margin-right: 4rem; }
    #header .right .social li { margin-right: 2rem; }
    #header .right li:last-child { margin-right: 0; }


    /***** Partials *****/

    .part--customers .items .item { flex: 1 0 50%; }
    .part--customers .items .item:nth-child(2n+2) .detail { right: 100%; left: auto; }
    .part--customers .items .item:nth-child(2n+1) .detail { right: auto; left: 100%; }
    .part--customers .items .item .detail {  }

    .part--testimonials .inner { margin-left: 4rem; }
    .part--testimonials .inner-inner { margin-left: 5rem; margin-right: 5rem; }
    .part--testimonials .inner-inner .slider { margin-left: 19rem; }
    .part--testimonials .slider .items .item .picture { font-size: 18rem; top: 0; left: -92px; }
    .part--testimonials .slider .controls .control { top: 5.6rem; }
    .part--testimonials .inner-inner .slider { margin-left: 8rem; }
    .part--testimonials .slider .controls .control { top:19.6rem; }
    .part--testimonials .slider .controls .control.prev { left: -56px; }
    .part--testimonials .slider .controls .control.next { right: -56px; }

    .part--content .title-page {  font-size: 7rem; }

    /***** Pages *****/

    #section-home { padding-top: 30px; }
    #section-home .part--intro .arrow-handwrite { right: 25vw; top:5vw; width: 10vw; }
    #section-home .part--intro .img {  padding-right: 0; min-height: 455px; }
    #section-home .part--intro .img img {  width: 40vw; }
    #section-home .part--intro .cloud { right: 0; font-size: 1.3vw; }
    #section-home .part--intro .cloud .word--ux { right: 3em; }



}


@media screen and (max-width:640px) {

    html { font-size:0.6em }

    .responsive-embed { padding-bottom: 65%; }

    .title { font-size: 3rem; }

    .wrapper, .wrapper-inner { padding:0 15px; }

    .part { margin: 6rem 0; }



    /***** Header *****/

    #header .wrapper-default .inner { padding:18px 0 0; height:60px; }
    #header-push { height:60px; }

    #header .logo { width:200px; }


    #header .ham-nav { top:-15px; }

    /***** Footer *****/

    #footer .wrapper-large { padding-left: 0; }
    #footer .wrapper-inner { padding-left: 15px; }
    #footer .bottom { padding-bottom: 10rem; padding-left: 135px; margin-top: 6rem; }
    #footer .img { width: 120px; bottom: 0; left: -12px; }
    #footer .img:before { font-size: 220px; }
    #footer .top .title + .form { margin-top: 5rem; }
    #footer .top .form .msg { font-size: 2.8rem; min-height: 380px; }
    #footer .top .form .msg span { font-size: 2.8rem; }


    /***** Partials *****/

    .catchwords .word { font-size: 7rem; }

    .part--content .title-page {  font-size: 4rem; }
    .part--content .content-side { flex-wrap: wrap; justify-content: center; }
    .part--content .content-side .detail { margin-left: 0; }
    .part--content .content-side .img { font-size: 30rem; }

    .part--steps .wrapper-title .title { font-size: 3rem; }
    .part--steps .inner { margin-top: 0; }
    .part--steps .inner .desc { font-size: 1.8rem; }
    .part--steps .inner .items .col { padding: 0 39px; }
    .part--steps .inner .items .col .title { font-size: 2rem; }


    /***** Pages *****/

    #section-home .part--intro .img { min-height: 320px; }

    #section-home .part--secondary .col .arrow-handwrite { display: none; }
    #section-home .part--secondary .content { display: block; padding: 4rem 0 2rem; }
    #section-home .part--secondary .col + .col { padding-left: 0; }



}


@media screen and (max-width:450px) {

    /***** Footer *****/

    #footer .bottom { padding-bottom: 4rem; }
    #footer .bottom .links,
    #footer .bottom .legals { display: block; }
    #footer .bottom .links .social li:first-child,
    #footer .bottom .legals .copyright { margin-left: 0; }
    #footer .top .title { font-size: 3rem; }


    /***** Pages *****/

    #section-home .part--intro .img { min-height: 230px; }


    /***** Partials *****/

    .part--customers .items .item:nth-child(2n+2) .detail { right: 0; left: auto; }
    .part--customers .items .item:nth-child(2n+1) .detail { right: auto; left: 0; }
    .part--customers .items .item .detail { max-width: inherit; }

    .part--testimonials .wrapper { padding: 0; margin: 0; }
    .part--testimonials .inner { margin: 0; }
    .part--testimonials .inner-inner { margin: 0 2rem; padding: 0; }
    .part--testimonials .inner-inner .slider {  margin: 0; }
    .part--testimonials .title { margin-bottom: 1em; }
    .part--testimonials .slider .items .item { display: flex; flex-wrap: wrap; }
    .part--testimonials .slider .items .item .content { margin: 1.5rem 2.5rem 0; order: 2; }
    .part--testimonials .slider .items .item .picture { position: relative; font-size: 12rem; top: 0; left: 0; margin: 0 2rem 0 -10px; }
    .part--testimonials .slider .items .item .name { margin-top: 1rem; }
    .part--testimonials .slider .items .item .bottom { flex: 1 0 0; }
    .part--testimonials .slider .controls .control { width: 20px; top:15rem; }
    .part--testimonials .slider .controls .control.prev { left: -11px; }
    .part--testimonials .slider .controls .control.next { right: -11px; }



}