
:after, :before {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
html, body {height:100%;width:100%;}
body {font-family:'Noto Sans', sans-serif;font-weight:400;font-size:1rem;line-height:1.7em;margin:0;display:flex;flex-direction:column;justify-content:space-between;}
a {text-decoration:none;color:#454F5E;}
a:hover {text-decoration:underline;}
p {color:#454F5E;margin-bottom: 1.6em;}
p.justify {text-align:justify;}
h1, h2, h3, h4 {font-family:"Ropa Sans", Sans-serif;font-size:40px;line-height:1.4em;text-transform:uppercase;text-align:center;padding:0px 20px;
    margin-left:auto;margin-right:auto;}
h2 {font-size:30px;margin-top:50px;width:calc(100% - 40px);}
h3 {font-size:20px;text-transform:none;}
h4 {font-size:18px;text-transform:none;margin-bottom:10px;}
section.flex {flex:auto;}
.big {font-size:64px;}
.none {display:none;}
.left {text-align:left;}
.img-max {max-width:100%;height:auto;}
.img-responsive {width:100%;max-width:100%;height:auto;}
.img-teaser {width:50%;float:left;padding:50px 50px 50px 0px;}
.img-scale {transition:.4s;}
.img-scale:hover {transform:scale(1.1);}

@-webkit-keyframes swing {
    20% {-webkit-transform:rotate(15deg);transform:rotate(15deg);}
    40% {-webkit-transform:rotate(-10deg);transform:rotate(-10deg);}
    60% {-webkit-transform:rotate(5deg);transform:rotate(5deg);}
    80% {-webkit-transform:rotate(-5deg);transform:rotate(-5deg);}
    to {-webkit-transform: rotate(0deg);transform:rotate(0deg);}
}
@keyframes swing {
    20% {-webkit-transform:rotate(15deg);transform:rotate(15deg);}
    40% {-webkit-transform:rotate(-10deg);transform:rotate(-10deg);}
    60% {-webkit-transform:rotate(5deg);transform:rotate(5deg);}
    80% {-webkit-transform:rotate(-5deg);transform:rotate(-5deg);}
    to {-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@-webkit-keyframes heartBeat {
    0% {-webkit-transform:scale(1);transform:scale(1);}
    7% {-webkit-transform:scale(1.3);transform:scale(1.3);}
    14% {-webkit-transform:scale(1);transform:scale(1);}
    21% {-webkit-transform:scale(1.3);transform:scale(1.3);}
    35% {-webkit-transform:scale(1);transform:scale(1);}
}
@keyframes heartBeat {
    0% {-webkit-transform:scale(1);transform:scale(1);}
    7% {-webkit-transform:scale(1.3);transform:scale(1.3);}
    14% {-webkit-transform:scale(1);transform:scale(1);}
    21% {-webkit-transform:scale(1.3);transform:scale(1.3);}
    35% {-webkit-transform:scale(1);transform:scale(1);}
}

header {width:100%;display:flex;min-height:90px;flex-direction:row;font-family:"Ropa Sans", Sans-serif;}
.header {position:fixed;width:100%;background-color:#F8710BD4;display:flex;flex-wrap:nowrap;margin:auto;z-index:10001;}
.header-wrapper {width:1450px;max-width:100%;display:flex;flex-wrap:nowrap;margin:auto;}
header .logo {width:25%;text-align:center;padding:10px;}
header .logo a {display:inline-block;}
header .logo img {width:auto;max-width:98%;height:70px;display:inline-block;vertical-align: middle;}

header .nav {width:75%;display:flex;justify-content:space-around;align-items:center;}
header .nav ul {list-style-type:none;padding:0;position:relative;}
header .nav .nav-menu {display:flex;flex-wrap:wrap;}
header .nav a {font-size:22px;color:#fff;padding:13px 20px;display:flex;transition:.4s;text-decoration:none;}
header .nav svg {width:1em;height:1em;fill:#fff;transition:.4s;}
header .nav a:hover, header .nav a.active {color:#000;}
header .nav a:hover svg, header .nav a.active svg {fill:#000;}
header .nav .sub-menu {display:block;position:absolute;top:50px;right:0px;background-color:#000;transition:1s;max-height:0px;overflow:hidden;}
header .nav .sub-arrow {align-items:center;display:flex;line-height:1;margin-top:-10px;margin-bottom:-10px;padding:10px 0 10px 10px;}
header .nav .nav-menu > li {position:relative;}
header .nav .nav-menu > li:hover .sub-menu, header .nav .nav-menu > li .sub-menu.show,
header .nav .language > li:hover .sub-menu, header .nav .language > li .sub-menu.show {max-height:600px;}
header .nav .sub-menu li a {font-size:16px;padding:6px 20px;color:#fff;}
header .nav .sub-menu li:hover a {background-color:#333;}

header .hamburger-menu {display:none;flex-direction:column;justify-content:space-between;width:30px;height:22px;cursor:pointer;padding:10px;margin-right:20px;}
header .hamburger-menu span {background:#000;height:4px;border-radius:2px;transition:0.3s;}
.hamburger-menu.active span:nth-child(1) {transform:rotate(45deg) translate(6px, 6px);}
.hamburger-menu.active span:nth-child(2) {opacity:0;}
.hamburger-menu.active span:nth-child(3) {transform:rotate(-45deg) translate(6px, -6px);}

.language {display:none;}

footer {width:100%;flex-direction:row;background-color:#F8710B;color:#fff;display:flex;flex-wrap:wrap;}
.footer-wrapper {width:1450px;max-width:100%;display:flex;flex-wrap:wrap;margin:auto;justify-content:space-around;padding:20px 10px;}
footer .social-links {text-align:center;}
footer .social-links a {margin:15px;display:inline-block;}
footer .social-links a svg {width:25px;height:25px;fill:#fff;}
footer .contact {text-align:center;}
footer .contact a {color:#fff;}
footer .links {text-align:center;}
footer .links a {color:#fff;display:block;}
footer .copyright {display:block;margin-top:30px;}

.content {margin:-65px auto 0;padding:20px 10px;position:relative;background-color:#fff;}
.content-no-margin {margin-top:0px;}
.content-background-top {position:absolute;top:0px;left:0;width:100%;line-height:0;overflow:hidden;}
.content-background-top + .content-wrapper {background-color:#fff;max-width:80%;}
.content-background-bottom {position:absolute;bottom:0px;left:0;width:100%;line-height:0;overflow:hidden;transform:rotate(180deg);}
.content-background-top svg, .content-background-bottom svg {fill:#F8710B;}
.content-wrapper {width:1450px;max-width:100%;display:flex;justify-content:space-around;flex-wrap:wrap;margin:0 auto;overflow:hidden;
    position:relative;z-index:100;}
.content-wrapper-wrap {flex-wrap:wrap;}
.content-wrapper-center {align-items:center;}
.content-wrapper-lp {overflow:initial;}
.content-wrapper-first {}
.content-wrapper-first-double {}
.content-banner {position:relative;}

.content-image {margin-top:-190px;}
.content-image .content-wrapper {margin-top:170px;}
.content-gray {background-color:#eee;}
.content .content-wrapper > .item {flex:6;padding:20px;}
.content .content-wrapper > .item-img {display:flex;align-items:center;max-width:50%;justify-content:center;}
.content .content-wrapper > .item-img-full {display:flex;align-items:center;justify-content:center;position:relative;}
.content .content-wrapper > .item-text {flex:7;}
.item-img-position {position:absolute;top:55px;left:150px;width:350px;max-width:100%;background-color:rgba(255, 255, 255, 0.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(8px);
    border-radius:35px;box-shadow:0 0 40px 35px rgba(255, 255, 255, 0.6);}
.item-img-position h1 {text-align:left;margin:0px;}
.item-img-position h2 {text-align:left;margin:25px 0px 0px;font-size:22px;text-transform:none;}
.item-video {}

.item-text.item-padding {padding:20px 100px !important;}
.item-text.item-bottom {align-content:end;}
.item-text .text.center, .item-center {text-align:center;}
.item-text h1, .item-text h2, .item-text h3, .item-text h4 {padding:0px;margin-left:auto;margin-right:auto;}
.item-text h1.left, .item-text h2.left, .item-text h3.left, .item-text h4.left {margin-left:0px;margin-right:0px;}
.item-text h4 + .text p {margin-top:0px;}
.item-text .icon i {position:relative;width:1em;height:1em;display:block;font-size:50px;color:#F8710B;margin:auto;}
.item-text .icon-swing {-webkit-animation-name:swing;animation-name:swing;-webkit-transform-origin:center;transform-origin:center;
    -webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;
    -webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}
.item-text .icon-heartbeat {-webkit-animation-duration:2.3s;animation-duration:2.3s;-webkit-animation-name:heartBeat;animation-name:heartBeat;
    -webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;
    -webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}
.item-text .icon-title {display:flex;margin-left:20px;color:#F8710B;}
.item-text .icon-title i {margin-right:30px;width:auto;}
.item-text .icon-title h4 {margin:15px 0px;flex:auto;}
.item-text .icon-logo {text-align:center;}
.item-text .icon-logo img {opacity:0;transition:opacity 2s;}
.item-text .icon-logo img.fade-in {opacity:1;}
.item-text .text-justify {text-align:justify;}
.item-text .social-links {display:flex;flex-wrap:wrap;justify-content:center;margin:30px 0px;}
.item-text .social-links a {width:60px;height:60px;display:inline-block;}
.item-text .social-links svg {fill:#F8710B;}
.item-text .social-links-small {justify-content:flex-start;grid-row-gap:10px;grid-column-gap:10px;margin-top:5px;}
.item-text .social-links-small a {width:38px;height:38px;}
.item-text .social-links-big {grid-column-gap:20px;margin-top:5px;}
.item-project {width:100%;flex:auto !important;}
.item-project .count {font-size:93px;color:#454F5E;font-weight:600;line-height:1;}
.item-project .count-title {font-size:42px;line-height:2.5;margin:0;padding:0;font-weight:400;color:#454F5E;}
.item-projects {min-width:25%;max-width:25%;}
.item-article h3 a {color:#F8710B;}
.item-article .date {color:#999;}
.item-form {margin:0px;max-width:748px;}
.item-email {}
.item-email h2 {margin:0px 0px 20px;padding:0px;}
.item-question {border:5px solid #F8710B;color:#F8710B;padding:20px; margin-bottom:20px;}
.item-question h2 {color:#F8710B;margin:0px 0px 20px;}

.image {position:relative;height:280px;max-width:100%;overflow: hidden;}
.image-click {cursor:pointer;}
.image-bg {background-size:cover;z-index:1;bottom:0;left:0;position:absolute;right:0;top:0;transition:all 1s;}
.image-button {position:absolute;z-index:3;display:flex;width:100%;height:100%;justify-content:center;align-items:center;
    opacity:0;transform:translateY(500px);transition: .5s;}
.image-button a {border-radius:30px;padding:17px 40px;background-color:transparent;color:#fff;font-size:0.875rem;line-height:1;
    border:2px solid #fff;transition:.5s;}
.image-button a:hover {background-color:#fff;color:#000;}
.image:hover .image-bg {transform: scale(1.2);}
.image:hover .image-overlay {bottom:0;left:0;position:absolute;right:0;top:0;transition:all 1s;background-color:rgba(0, 0, 0, .5);z-index:2;}
.image:hover .image-button {opacity:1;transform:translateY(0) translateX(0);}

.item-box-wrapper {position:relative;overflow:hidden;}
.item-box-front {background-color:#ddd;border:1px solid #d0d0d0;display:flex;}
.item-box-front-wrapper, .item-box-back-wrapper {display:flex;flex-direction:column;align-items:center;text-align:center;padding:35px;
    min-height:270px;max-height:270px;}
.item-box-front-wrapper .icon svg {fill:#000;width:1em;height:1em;font-size:50px;}
.item-box-front .text, .item-box-back .text {font-size:14px;margin-bottom:20px;}
.item-box .text {color:#454F5E}
.item-box .text-justify {text-align:justify;}
.item-box-back {background-color:#F8710B;color:#fff;border:1px solid #F8710B55;position:absolute;top:0;left:0;width:100%;height:100%;
    transform:translateY(100%);transition:.4s ease-in-out;display:flex;justify-content:center;}
.item-box-back .text {color:#fff;}
.item-box-wrapper:hover .item-box-back, .item-box-back.show {transform:translateY(0%);}
.item-box-back-wrapper {justify-content:center;}

.content-button {text-align:center;padding-top:20px;}
.content-button-left {text-align:left;}
.content-button-link {display:inline-block;justify-content:center;border-radius:30px;padding:17px 40px;background-color:#F8710B;color:#fff;
    font-weight:700;line-height:1em;text-transform:uppercase;transition:.4s;border:0px;}
.content-button-wrapper {display:flex;flex-direction:row;gap:10px;}
.content-button .button-text {font-size:19px;}
.content-button .button-icon {align-items:center;display:flex;}
.content-button .button-icon svg {width:1em;height:1em;fill:#fff;}
.content-button-link:hover {transform:scale(1.1);text-decoration:none;}

.content-button-input {border-radius:30px;padding:10px 25px;margin-right:10px;}

.html h2, .html h3, .html h4 {text-align:left;}






/* Landing page */



/* Form */
.item-form .form-field {margin-bottom:30px;}
.item-form .control-label {cursor:default;display:block;line-height:20px;pointer-events:none;margin-bottom:5px;}
.item-form .form-control {width:calc(100% - 20px);display:block;outline:none;height:auto;line-height:1.3em;-webkit-transition:.2s ease;transition:.2s ease;
    margin:0px;padding:5px 0px 10px;border:0px;border-bottom:1px solid #ddd;font-size:16px;}
.item-form  textarea.form-control {resize:vertical;margin:0;min-height:140px;line-height:20px;-webkit-transition:.2s ease;transition:.2s ease;
    background-color:#fafafa;border:1px solid #ddd;padding:10px;width:calc(100% - 40px);}
.item-form .form-control:focus {border-bottom:1px solid #000;}
.item-form .field-validation-error {font-size:14px;color:#8c96a7;}
.item-form input[type=submit] {display:inline-block;justify-content:center;border-radius:30px;padding:17px 40px;background-color:#F8710B;color:#fff;
    font-weight:700;line-height:1em;text-transform:uppercase;transition:.4s;border:0px;}
.item-form input[type=submit]:hover {transform:scale(1.1);text-decoration:none;}

/* Button */
.button {border-radius:30px;padding:17px 40px;font-size:0.875rem;align-self:center;background:transparent;border:2px solid #fff;
    color:#fff;cursor:pointer;margin-left:auto;margin-right:auto;line-height:1;display:inline-block;transition:.4s;}
.button:hover {background-color:#fff;color:#F8710B;text-decoration:none;}

/* Arrow */
.arrow {position:relative;top:-100px;opacity:0;transition:top 1.6s ease-out, opacity 1s;}
.arrow.arrow-animate-down {top:0px;opacity:1;}

/* Scroll to top */
.scroll-to-top {display:flex;align-items:center;width:auto;height:50px;background:transparent;position:fixed;bottom:55px;right:-12px;z-index:1000;text-align:center;
    opacity:0;visibility:hidden;transform:rotate(-90deg);cursor:pointer;transition:all 0.2s ease;}
.scroll-to-top:hover {text-decoration:none;}
.scroll-to-top__text {display:inline;font-size:12px;text-transform:uppercase;letter-spacing:0.1em;font-weight:700;margin-right:8px;color:#bbb;}
.scroll-to-top__wrapper {display:inline-block;width:50px;height:50px;background-color:#ddd;position:relative;overflow:hidden;border:1px solid #ddd;}
.scroll-to-top__wrapper:before {content:'';border:solid #fff;border-width:0 6px 6px 0;display:inline-block;padding:6px;position:relative;left:-4px;top:16px;z-index:1;
                    transform:rotate(-45deg);-webkit-transform:rotate(-45deg);}
.scroll-to-top__inner {position:absolute;right:0;top:0;width:100%;height:100%;background-color:#F8710B;}
.scroll-to-top.showStt {opacity:1;visibility:visible;bottom:70px;}

/* jQuery - animated headline */
.ah-headline {text-align:center;min-height:86px;text-transform:none;margin-top:0px;padding:0;}
.ah-words-wrapper.selected::after,.ah-headline .item {visibility:hidden;}
.ah-words-wrapper {display:inline-block;position:relative;text-align:left;overflow:hidden;vertical-align:top;color:#F8710B;font-weight:bold;
    font-size:45px;line-height:1.3em;}
.ah-words-wrapper .item {display:inline-block;position:absolute;white-space:nowrap;left:0;top:0;}
.ah-words-wrapper .is-visible {position:relative;}
.ah-headline .item.is-visible {visibility:visible;}
.ah-headline i {position:absolute;visibility:hidden;font-style:normal;}
.ah-headline i.in {position:relative;visibility:visible;}

/* Media */
@media screen and (max-width: 1200px) {
    header .logo {width:20%;}
    header .nav a {font-size:20px;padding:13px 15px;}
    .content .content-wrapper > .item-desktop-hide {display:none;}
    .item-box-front-wrapper, .item-box-back-wrapper {min-height:300px;max-height:300px;}
    .content-background-top + .content-wrapper .item-padding {padding:20px 40px !important}
}

@media screen and (max-width: 992px) {
    h1, h2.big, .ah-words-wrapper {font-size:32px;}
    h2 {font-size:26px;}
    h3 {font-size:16px;}
    p {font-size:14px;}
    header .logo {width:100px;}
    header .nav {width:calc(100% - 100px);}
    header .nav a {padding:13px 10px;}
    header .nav-menu {justify-content:center;}
    header .nav .sub-arrow {padding:5px 0 5px 5px;}
    .content .content-wrapper > .item:not(.item-project) {min-width:auto;max-width:none;}
    .content .content-wrapper > .item.item-margin {min-width:45%;max-width:45%;}
    .content-background-top + .content-wrapper .item-padding {padding:20px !important}
    .footer-wrapper > div {width:100%;margin-top:30px;}
    .footer-wrapper .social-links {margin-top:0px;}
    .item-img-position {position:relative;top:0;left:0;width:100%;box-shadow:none;border-radius:0px;}
}

@media screen and (max-width: 768px) {
    header .hamburger-menu {display:flex;}
    header .nav {display:flex;justify-content:end;align-items:center;}
    header .nav .nav-menu {flex-direction:column;position:absolute;top:74px;left:0;width:100%;background-color:#000;display:none;}
    header .nav .nav-menu.show {display:flex;animation:slideDown 0.4s ease forwards;}  
    header .nav .nav-menu > li > a:hover {background-color:#333;}
    header .nav .sub-arrow {display:none;}
    header .nav a {padding:5px 20px;border-bottom:1px solid #222;font-size:18px;}
    header .nav a:hover, header .nav a.active, header .nav .sub-menu li a:hover, header .nav .sub-menu li a.active {color:#aaa;}
    header .nav .sub-menu {display:block;position:relative;max-height:none;top:0;right:0;}
    header .nav .sub-menu li a {padding-left:40px;font-size:14px;}
    header .language > li {position:absolute;right:0px;top:-18px;}
    header .language > li > a {justify-content:end;border:0px;}
    header .language > li > a:hover, header .language.active > li > a {color:#000;}
    header .language .sub-menu {max-height:0;border:1px solid #222;border-top:0px;border-bottom:0px;}
    .content .content-wrapper > .item:not(.item-project) {min-width:auto;max-width:none;}
    .content .content-wrapper > .item {max-width:100%;width:100%;flex:auto;}
    .content-background-top + .content-wrapper {max-width:90%;}
    .item-form {order:1000;margin-top:0px;}
    .image {max-width:430px;margin:auto;}
    .img-teaser {width:100%;float:none;padding:0px;}
}

@media screen and (max-width: 540px) {
    .image {max-width:100%;}
}
