@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&display=swap");
@import url("w2default.css");
* { color: #8A7165; font-family: "Lexend", sans-serif; font-weight: 300; font-size: 18px; }

html, body { background-color: #FDF2F3; height: 100%; }

h1, h1 * { font-size: 60px; line-height: 65px; }

h2 { margin-bottom: 40px; }

h2, h2 * { font-size: 50px; line-height: 56px; }

h3 { margin-bottom: 40px; }

h3, h3 * { font-size: 50px; line-height: 55px; margin-bottom: 20px; }

input[type="text"], input[type="email"], input[type="password"] { background-color: transparent; border-radius: 5px; border-color: #a6a6a6; height: 50px; }

input[type="submit"] { background: transparent url("../images/arrow-right-red.svg") no-repeat right 15px center; background-size: 10px 10px; color: #D9001B; font-size: 14px; white-space: nowrap; text-align: left; border-radius: 25px; padding: 0 20px; font-weight: bold; height: 50px; transition: all 0.3s ease; }

input[type="submit"]:hover { background: #D9001B url("../images/arrow-right-white.svg") no-repeat right 15px center; background-size: 10px 10px; color: #fff !important; }

textarea { background-color: transparent; border-radius: 5px; border-color: #a6a6a6; }

select { cursor: pointer; }

.wrapper { width: 1170px; }

.general-section { padding: 100px 0; }

.cover { background-position: center center; background-size: cover; background-repeat: no-repeat; }

.columns-2 { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 40px; -moz-column-gap: 40px; column-gap: 40px; }

.columns-2 .image { margin-bottom: 20px; padding-top: 5px; }

.columns-2 img { width: 100%; }

/*.db-content, .db-content * {color: $grey;font-size: 16px;line-height: 20px;}
.db-content em,
.db-content em * {}
.db-content strong,
.db-content strong * {font-weight: bold;}
.db-content a {color: $colorA;}
.db-content a:hover {text-decoration: underline;}
.db-content ol,
.db-content ul,
.db-content p,
.db-content blockquote {-webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid;}
.db-content ol,
.db-content ul {margin-bottom: 10px;}
.db-content ul li,
.db-content ol li {margin: 0 0 10px 15px;}
.db-content ul li {list-style: disc;}
.db-content ol li {list-style: decimal;}
.db-content h3,
.db-content h3 * {color: $colorA;font-size: 21px;line-height: 15px; font-family: $fontB; font-weight: bold; margin-bottom: 10px;}
.db-content sup {vertical-align: super;font-size: 0.8em;margin-left: 3px;}
.db-content sub {vertical-align: sub;font-size: 0.8em;margin-left: 3px;}
.db-content blockquote {padding: 50px 80px;border: solid 1px $grey;margin: 45px 0 30px;position: relative;}
.db-content blockquote:before {content: "";position: absolute;top: -15px;left: 30px;width: 40px;height: 30px;background:url(../images/icon-blockquote.svg) no-repeat 0 0; background-size: 40px 30px;display: block;}
.db-content blockquote,
.db-content blockquote * {color:$grey; font-family: $fontB;font-weight: 300; font-size: 30px; line-height: 30px; }*/
.db-content blockquote { padding: 30px 0 40px 20px; position: relative; display: flex; }

.db-content blockquote:before { background-color: #D9001B; content: ""; display: block; width: 30px; height: 30px; border-radius: 20px; flex-shrink: 0; margin-right: 20px; margin-top: 3px; }

.db-content blockquote, .db-content blockquote * { font-family: "Lexend", sans-serif; font-weight: 700; font-size: 30px; line-height: 35px; }

.checkbox { border-radius: 5px; }

.mandatory { position: relative; display: inline-flex; align-items: flex-end; }

.mandatory:before { content: "*"; color: #D9001B; font-size: 20px; }

.box .label { color: #404040; display: flex; align-items: flex-start; justify-content: space-between; font-size: 10px; line-height: 15px; text-transform: uppercase; margin-bottom: 3px; }

.btn { height: 50px; padding: 0 20px; border-radius: 50px; font-weight: bold; text-transform: uppercase; font-size: 14px; white-space: nowrap; border: solid 2px #D9001B; min-width: 240px; color: #D9001B !important; justify-content: space-between; }

.btn:after { background: url("../images/icons.svg") no-repeat -40px 0px; background-size: 200px; content: ""; display: block; height: 10px; width: 10px; }

.btn:hover { background-color: #D9001B; color: #fff !important; }

.btn:hover:after { background-position: -40px -10px; }

h2.title-a { text-align: center; margin-bottom: 40px; position: relative; display: flex; align-items: center; justify-content: center; white-space: nowrap; overflow: hidden; }

h2.title-a, h2.title-a * { color: #8A7165; }

h2.title-a:before, h2.title-a:after { background-color: rgba(200, 0, 0, 0.2); content: ""; display: inline-flex; width: 219px; height: 30px; flex-shrink: 0; }

h2.title-a:before { background: url("../images/title-a-left.svg") no-repeat 0 0; margin-right: 40px; }

h2.title-a:after { background: url("../images/title-a-right.svg") no-repeat 0 0; margin-left: 40px; }

/* ###########################################
			   MAGNIFIC POPUP
########################################### */
.mfp-fade.mfp-bg { opacity: 0; -webkit-transition: all 0.15s ease-out; -moz-transition: all 0.15s ease-out; transition: all 0.15s ease-out; }

.mfp-fade.mfp-bg.mfp-ready { opacity: 0.8; }

.mfp-fade.mfp-bg.mfp-removing { opacity: 0; }

.mfp-fade.mfp-wrap .mfp-content { opacity: 0; -webkit-transition: all 0.15s ease-out; -moz-transition: all 0.15s ease-out; transition: all 0.15s ease-out; }

.mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1; }

.mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0; }

header { background-color: transparent; position: fixed; width: 100%; height: 100px; left: 0; top: 0; z-index: 100; box-shadow: 0 0 10px rgba(0, 0, 0, 0); transition: all 0.3s ease; }
header * { color: #fff; }
header .wrapper { height: 100%; display: flex; align-items: center; justify-content: space-between; position: relative; }
header .left { display: flex; align-items: center; height: 100%; }
header .left a { display: block; position: relative; width: 214px; height: 50px; }
header .left a img { height: 100%; font-size: 30px; white-space: nowrap; }
header .left a:before { background: url("../images/header-logo-truncated.svg") no-repeat center center; content: ""; width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0; opacity: 0; transition: opacity 0.3s ease; }
header .right nav ul { display: flex; align-items: center; }
header .right nav li:not(:last-child) { margin-right: 20px; }
header .right nav li a { font-size: 18px; white-space: nowrap; font-weight: bold; position: relative; display: block; padding: 5px 0 10px; overflow: hidden; }
header .right nav li a:after { content: ""; position: absolute; bottom: -5px; left: 0; width: 100%; height: 5px; border-radius: 5px; background-color: #fff; transition: all 0.3s ease; }
header .right nav li a:hover:after { bottom: 0; }
header .right nav li.active a { overflow: inherit; }
header .right nav li.active a:after { bottom: 0; }

body.truncated header { background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); }
body.truncated header * { color: #8A7165; }
body.truncated header .left a img { display: none; }
body.truncated header .left a:before { opacity: 1; }
body.truncated header .right nav a:after { background-color: #8A7165; }

footer { position: relative; z-index: 20pz; }
footer * { color: #fff; }
footer .top { background-color: #8A7165; }
footer .top .wrapper { display: flex; align-items: top; justify-content: space-between; padding: 30px 0; position: relative; }
footer .top .left a { display: block; }
footer .top .left img { font-size: 30px; max-height: 80px; }
footer .top .mid { display: inline-flex; padding: 0 40px; flex-wrap: wrap; }
footer .top .mid p { width: 100%; margin-bottom: 20px; font-size: 14px; }
footer .top .mid a { display: block; height: 30px; margin: 0 20px 20px 0; position: relative; }
footer .top .mid a img { height: 100%; }
footer .top .right { position: relative; }
footer .top .right .box-social { display: flex; align-items: center; }
footer .top .right .box-social ul { display: flex; align-items: center; margin-left: 10px; }
footer .top .right .box-social ul li:not(:last-child) { margin-right: 10px; }
footer .top .right .box-social ul a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 40px; border: solid 2px #fff; transition: all 0.3s ease; }
footer .top .right .box-social span { white-space: nowrap; }
footer .top .right .box-social a:hover { background: #fff; }
footer .top .right .box-social a:hover:before { color: #8A7165; }
footer .top .right .box-social a:before { font-family: FontAwesome; color: #fff; font-size: 17px; }
footer .top .right .box-social .facebook:before { content: ""; }
footer .top .right .box-social .twitter:before { content: ""; }
footer .top .right .box-social .instagram:before { content: ""; }
footer .top .right .box-social .googleplus:before { content: ""; }
footer .top .right .box-social .linkedin:before { content: ""; }
footer .top .right .box-social .pinterest:before { content: ""; }
footer .top .right .box-social .vimeo:before { content: ""; }
footer .top .right .box-social .youtube:before { content: ""; }
footer .top .right .box-social .behance:before { content: ""; }
footer .top .btn-jumptop { position: absolute; top: -20px; right: 0; display: flex; align-items: center; justify-content: center; color: #fff; background-color: #8A7165; border: solid 2px #fff; border-radius: 40px; width: 40px; height: 40px; transition: background 0.3s ease, border 0.3s ease; }
footer .top .btn-jumptop:before { background: url("../images/icons.svg") no-repeat -60px -10px; background-size: 200px; content: ""; display: inline-flex; width: 10px; height: 10px; }
footer .top .btn-jumptop:hover { background: #D9001B; border-color: #D9001B; }
footer .bot { background-color: #404040; }
footer .bot .wrapper { display: flex; align-items: center; justify-content: space-between; padding: 17px 0; }
footer .bot * { font-size: 12px; line-height: 16px; }

/* ###########################################
			   mobile menu
########################################### */
#mobile-menu-switch { background-color: transparent; flex-direction: column; justify-content: space-between; position: fixed; top: 30px; right: 20px; width: 40px; height: 40px; z-index: 102; cursor: pointer; padding: 10px 5px; transition: all 0.1s ease; }

#mobile-menu-switch span { background-color: #fff; display: block; width: 25px; height: 2px; border-radius: 2px; transition: all 0.1s ease; pointer-events: none; }

.truncated #mobile-menu-switch span { background-color: #D9001B; }

#mobile-menu-switch.active { justify-content: center; }

#mobile-menu-switch.active span:nth-child(1) { background-color: #D9001B; transform: rotate(45deg); margin-top: 2px; }

#mobile-menu-switch.active span:nth-child(2) { opacity: 0; height: 0; width: 0; }

#mobile-menu-switch.active span:nth-child(3) { background-color: #D9001B; transform: rotate(-45deg); margin-top: -2px; }

#mobile-menu { background-color: #fff; width: 280px; height: 100%; position: fixed; top: 0; right: -290px; padding-top: 130px; z-index: 101; transition: all 0.3s ease; }

#mobile-menu.active { right: 0; box-shadow: -10px -10px 30px rgba(0, 0, 0, 0.2); }

#mobile-menu .container { height: 100%; overflow-y: auto; }

#mobile-menu a { font-size: 16px; color: #8A7165; text-transform: uppercase; text-align: center; font-weight: 200; padding: 20px; display: block; position: relative; transition: background-color 0.3s ease; }

#mobile-menu .right a { width: 80%; padding: 0; margin: 30px auto 0; display: flex; justify-content: center; }

#home-banner { background: #D9001B url("../images/home-banner.jpg") no-repeat center center; background-size: cover; min-height: 100vh; height: 100vh; width: 100%; position: relative; overflow: hidden; }
#home-banner * { color: #fff; }
#home-banner .wrapper { display: flex; align-items: center; height: 100%; padding-top: 100px; }
#home-banner .animation-banner { position: absolute; display: block; width: 100%; height: 0; padding-bottom: 148%; left: 50%; transform: translateX(-50%); top: -50%; overflow: hidden; z-index: 10; pointer-events: none; }
#home-banner .animation-banner .camada-1, #home-banner .animation-banner .camada-2, #home-banner .animation-banner .camada-3, #home-banner .animation-banner .camada-4, #home-banner .animation-banner .camada-5 { display: block; position: absolute; width: 1880px; height: 1880px; left: calc(50% - 940px); top: 0; animation-name: layer-1-anim; animation-direction: normal; animation-iteration-count: infinite; animation-fill-mode: none; animation-play-state: running; will-change: transform; transform-style: initial; }
#home-banner .animation-banner .camada-1 { animation-duration: 200s; }
#home-banner .animation-banner .camada-2 { animation-duration: 150s; }
#home-banner .animation-banner .camada-3 { animation-duration: 370s; }
#home-banner .animation-banner .camada-4 { animation-duration: 280s; }
#home-banner .animation-banner .camada-5 { animation-duration: 480s; }
#home-banner .animation-banner img { width: 100%; height: 100%; }
#home-banner .presentation { background-color: #D9001B; height: 400px; }
@keyframes layer-1-anim { 0% { transform: rotate(0deg); animation-timing-function: linear; }
  100% { transform: rotate(360deg); animation-timing-function: linear; } }
#home-banner:before { background: url("../images/home-banner-bot.png") repeat-x center center; content: ""; display: block; width: 100%; height: 200px; position: absolute; left: 0; bottom: 0; }

#secbanner { padding-top: 100px; }
#secbanner .secbanner-animation { background: #D9001B url("../images/secbanner/sec-banner-about.jpg") no-repeat center center; background-size: cover; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; height: 400px; }
#secbanner .animation-banner { position: absolute; display: block; width: 100%; height: 1880px; left: 0; top: -1480px; overflow: hidden; z-index: 10; pointer-events: none; }
#secbanner .animation-banner .camada-1, #secbanner .animation-banner .camada-2, #secbanner .animation-banner .camada-3, #secbanner .animation-banner .camada-4, #secbanner .animation-banner .camada-5 { display: block; position: absolute; width: 1880px; height: 1880px; left: calc(50% - 940px); top: 0; animation-name: layer-1-anim; animation-direction: normal; animation-iteration-count: infinite; animation-fill-mode: none; animation-play-state: running; will-change: transform; transform-style: initial; }
#secbanner .animation-banner .camada-1 { animation-duration: 200s; }
#secbanner .animation-banner .camada-2 { animation-duration: 150s; }
#secbanner .animation-banner .camada-3 { animation-duration: 370s; }
#secbanner .animation-banner .camada-4 { animation-duration: 280s; }
#secbanner .animation-banner .camada-5 { animation-duration: 480s; }
#secbanner .animation-banner img { width: 100%; height: 100%; }
#secbanner .section { background-color: #FDF2F3; height: 400px; }
#secbanner .secbanner-animation:before { background: url("../images/secbanner/bot-secbanner.png") repeat-x center center; content: ""; display: block; width: 100%; height: 100px; position: absolute; left: 0; bottom: -100px; }
@keyframes layer-1-anim { 0% { transform: rotate(0deg); animation-timing-function: linear; }
  100% { transform: rotate(360deg); animation-timing-function: linear; } }
#secbanner * { color: #fff; }
#secbanner .other-contents { position: relative; z-index: 20; min-height: 450px; }
#secbanner .other-contents .box-back { margin-bottom: 40px; width: fit-content; }
#secbanner .other-contents .box-back .btn-back { background: transparent !important; border: none; padding: 0; display: flex; align-items: center; border-radius: 0; min-width: 0; position: relative; left: 0; transition: left 0.3s ease; }
#secbanner .other-contents .box-back .btn-back, #secbanner .other-contents .box-back .btn-back * { font-size: 18px; color: #fff !important; text-transform: none !important; }
#secbanner .other-contents .box-back .btn-back:after { display: none; }
#secbanner .other-contents .box-back .btn-back:before { content: ""; background: url("../images/knowmore-arrow.svg") no-repeat 0 center; background-size: contain; transform: rotate(180deg); display: inline-flex; width: 36px; height: 20px; margin-right: 10px; }
#secbanner .other-contents .box-back .btn-back:hover { left: 10px; }
#secbanner .other-contents .image img { width: 100%; border-radius: 20px; }
#secbanner .wrapper-contents { height: 300px; display: flex; align-items: center; }
#secbanner .contents { display: flex; align-items: center; width: 100%; position: relative; z-index: 20; }
#secbanner .contents .left { width: 60%; padding-right: 30px; }
#secbanner .contents .right { width: 40%; padding-left: 30px; border-left: dotted 2px #fff; }
#secbanner .contents .right:empty { display: none; }
#secbanner .contents h1, #secbanner .contents h1 * { font-size: 50px; line-height: 55px; }

.no-image #secbanne { padding-bottom: 400px; }

.about #secbanner .secbanner-animation { background: #D9001B url("../images/secbanner/sec-banner-about.jpg") no-repeat center center; }

.publications #secbanner .secbanner-animation { background: #D9001B url("../images/secbanner/sec-banner-publications.jpg") no-repeat center center; }

.open-positions #secbanner .secbanner-animation { background: #D9001B url("../images/secbanner/sec-banner-open-positions.jpg") no-repeat center center; }

.outreach-activities #secbanner .secbanner-animation { background: #D9001B url("../images/secbanner/sec-banner-outreach-activities.jpg") no-repeat center center; }

.contacts #secbanner .secbanner-animation { background: #D9001B url("../images/secbanner/sec-banner-contactos.jpg") no-repeat center center; }

#home-presentation { background-color: #D9001B; }
#home-presentation * { color: #fff; }
#home-presentation .wrapper { display: flex; align-items: flex-start; }
#home-presentation .wrapper .left { width: 300px; position: relative; flex-shrink: 0; padding-right: 20px; }
#home-presentation .wrapper .left img { width: 100%; }
#home-presentation .wrapper .mid { width: 100%; padding: 0 20px; border-right: dotted 1px #fff; align-self: normal; }
#home-presentation .wrapper .mid h2 { margin-bottom: 10px; }
#home-presentation .wrapper .mid .description { font-size: 20px; line-height: 25px; font-weight: 200; }
#home-presentation .wrapper .mid p, #home-presentation .wrapper .mid p * { font-size: 20px; line-height: 25px; font-weight: 200; }
#home-presentation .wrapper .right { width: 270px; flex-shrink: 0; display: flex; align-self: flex-end; padding-left: 20px; }
#home-presentation .wrapper .right .sidetext, #home-presentation .wrapper .right .sidetext * { font-size: 16px; line-height: 20px; }
#home-presentation .wrapper .right .box-knowmore { padding-top: 40px; }
#home-presentation .wrapper .right .box-knowmore .btn { color: #fff !important; border: solid 2px #fff; justify-content: space-between; transition: background 0.3s ease, color 0.3s ease, border 0.3s ease; }
#home-presentation .wrapper .right .box-knowmore .btn:after { background: url("../images/icons.svg") no-repeat -40px -10px; background-size: 200px; content: ""; display: block; height: 10px; width: 10px; }
#home-presentation .wrapper .right .box-knowmore .btn:hover { background-color: #FDF2F3; color: #D9001B !important; border-color: #FDF2F3; }
#home-presentation .wrapper .right .box-knowmore .btn:hover:after { background-position: -40px 0; }

#home-publications * { color: #8A7165; }
#home-publications .wrapper { display: flex; }
#home-publications .wrapper .left { width: 40%; position: relative; padding-right: 40px; }
#home-publications .wrapper .left .box-knowmore { padding-top: 40px; }
#home-publications .wrapper .right { width: 60%; position: relative; }
#home-publications .wrapper .right .swiper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#home-publications .wrapper .right .swiper a { background-color: #8A7165; display: flex; align-items: flex-end; border-radius: 20px; height: 100%; }
#home-publications .wrapper .right .swiper a * { color: #fff; }
#home-publications .wrapper .right .swiper a span { display: block; }
#home-publications .wrapper .right .swiper a .contents { display: flex; align-items: flex-end; width: 100%; height: 100%; padding: 40px; position: relative; z-index: 3; }
#home-publications .wrapper .right .swiper a .title { font-size: 30px; line-height: 35px; max-height: 70px; overflow: hidden; font-weight: bold; }
#home-publications .wrapper .right .swiper a .desc { font-size: 18px; line-height: 22; max-height: 66px; overflow: hidden; font-weight: 300; }
#home-publications .wrapper .right .swiper a .knowmore { margin-left: 40px; white-space: nowrap; font-size: 14px; line-height: 14px; font-weight: bold; display: flex; align-items: center; text-transform: uppercase; position: relative; right: 10px; transition: right 0.3s ease; }
#home-publications .wrapper .right .swiper a .knowmore:after { content: ""; width: 36px; height: 20px; background: url("../images/knowmore-arrow.svg") no-repeat 0 center; background-size: contain; margin-left: 5px; }
#home-publications .wrapper .right .swiper a .mask { background: url("../images/gradient-publication-home.png") no-repeat center center; background-size: 100% 100%; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; border-radius: 20px; }
#home-publications .wrapper .right .swiper a:hover .knowmore { right: -10px; }
#home-publications .wrapper .right .swiper .swiper-pagination { bottom: 0; }
#home-publications .wrapper .right:before { content: ""; display: block; position: relative; top: 0; left: 0; width: 100%; height: 0; padding-bottom: 56.25%; }

#home-activities { background-color: #EEEAE8; }
#home-activities * { color: #8A7165; }
#home-activities .wrapper { display: flex; }
#home-activities .wrapper .left { width: 70%; position: relative; padding-right: 20px; }
#home-activities .wrapper .left .grid { display: grid; grid-gap: 30px; grid-template-columns: repeat(2, 1fr); }
#home-activities .wrapper .left .grid .grid-item { min-width: 0; position: relative; }
#home-activities .wrapper .left .grid a { background-color: #fff; display: flex; border-radius: 20px; overflow: hidden; position: relative; transition: all 0.3s ease; }
#home-activities .wrapper .left .grid a span { display: block; width: 100%; }
#home-activities .wrapper .left .grid a .image { background-color: #8A7165; width: 136px; height: 136px; position: relative; z-index: 2; display: inline-flex; flex-shrink: 0; border-radius: 20px; }
#home-activities .wrapper .left .grid a .contents { background-color: #fff; padding: 15px 20px; }
#home-activities .wrapper .left .grid a .mask { background-color: rgba(217, 0, 27, 0.8); position: absolute; top: 100%; left: 0; width: 100%; height: 100%; z-index: 3; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; }
#home-activities .wrapper .left .grid a .knowmore { color: #fff; font-size: 22px; line-height: 14px; font-weight: 300; text-transform: uppercase; width: auto; display: flex; align-items: center; justify-content: center; }
#home-activities .wrapper .left .grid a .knowmore:after { background: url("../images/icons.svg") no-repeat -420px -35px; background-size: 700px; content: ""; width: 35px; height: 35px; margin-left: 15px; }
#home-activities .wrapper .left .grid a .title { font-size: 20px; line-height: 23px; font-weight: bold; display: -webkit-box; max-height: 46px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; margin-bottom: 5px; }
#home-activities .wrapper .left .grid a .desc { font-size: 14px; line-height: 17px; font-weight: 300; max-height: 51px; overflow: hidden; }
#home-activities .wrapper .left .grid a:hover .mask { top: 0; }
#home-activities .wrapper .right { width: 30%; padding-left: 20px; border-left: dotted 1px #8A7165; }
#home-activities .wrapper .right .box-knowmore { padding-top: 40px; }

.back-even { background-color: #EEEAE8; }

.general-presentation .wrapper { padding-top: 70px; }
.general-presentation h2 { text-align: center; margin-bottom: 40px; }
.general-presentation h2, .general-presentation h2 * { color: #8A7165; }
.general-presentation .description { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 30px; -moz-column-gap: 30px; column-gap: 30px; }

.grid-a { display: grid; grid-gap: 30px; grid-template-columns: repeat(3, 1fr); }
.grid-a .grid-item { min-width: 0; position: relative; }
.grid-a .grid-item a { background-color: #fff; display: block; border-radius: 20px; overflow: hidden; position: relative; transition: all 0.3s ease; }
.grid-a .grid-item a * { color: #8A7165; }
.grid-a .grid-item a span { display: block; width: 100%; }
.grid-a .grid-item a .image { background-color: #f2f2f2; width: 100%; height: 0; padding-bottom: 56.25%; border-radius: 15px; z-index: 1; }
.grid-a .grid-item a .contents { height: 340px; padding: 40px; overflow: hidden; z-index: 2; position: relative; }
.grid-a .grid-item a .contents:after { content: ""; background: linear-gradient(0deg, white 0%, white 30%, rgba(255, 255, 255, 0) 100%); position: absolute; bottom: 0; left: 0; width: 100%; height: 40px; z-index: 2; }
.grid-a .grid-item a .date { font-size: 14px; font-weight: 300; margin-bottom: 10px; position: relative; white-space: nowrap; display: flex; align-items: center; }
.grid-a .grid-item a .date:after { content: ""; margin-left: 10px; width: 100%; height: 0; border-top: dotted 1px #D5D5D5; }
.grid-a .grid-item a .title { font-size: 22px; font-weight: bold; display: -webkit-box; max-height: 140px; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; margin-bottom: 10px; }
.grid-a .grid-item a .desc { font-size: 18px; line-height: 23px; font-weight: 300; }
.grid-a .grid-item a .mask { background: linear-gradient(0deg, #d9001b 0%, rgba(217, 0, 27, 0) 100%); position: absolute; bottom: -50%; left: 0; width: 100%; height: 50%; z-index: 3; display: flex; align-items: flex-end; justify-content: flex-end; transition: all 0.3s ease; }
.grid-a .grid-item a .mask .knowmore { display: inline-flex; align-items: center; height: 20px; width: auto; color: #fff; font-size: 14px; line-height: 20px; font-weight: bold; text-transform: uppercase; white-space: nowrap; position: relative; margin: 0 40px 40px 0; }
.grid-a .grid-item a .mask .knowmore:after { content: ""; display: inline-flex; width: 36px; height: 20px; background: url("../images/knowmore-arrow.svg") no-repeat 0 center; background-size: contain; margin-left: 5px; }
.grid-a .grid-item a:hover { transform: scale(1.05); }
.grid-a .grid-item a:hover .mask { bottom: 0; }

.grid-c { display: grid; grid-gap: 30px; grid-template-columns: repeat(2, 1fr); }
.grid-c .grid-item { min-width: 0; position: relative; }
.grid-c .grid-item a { display: flex; border-radius: 20px; position: relative; transition: all 0.3s ease; }
.grid-c .grid-item a span { display: block; width: 100%; }
.grid-c .grid-item a .left { width: 160px; flex-shrink: 0; position: relative; z-index: 2; }
.grid-c .grid-item a .right { width: 100%; position: relative; z-index: 1; }
.grid-c .grid-item a .image { background: url("../images/avatar.svg") no-repeat center center; display: inline-flex; width: 160px; height: 160px; border: solid 5px #8A7165; border-radius: 160px; }
.grid-c .grid-item a .image img { background-color: #8A7165; width: 100%; border-radius: 160px; }
.grid-c .grid-item a .image:before { content: ""; background: url("../images/avatar-mask.svg") no-repeat center center; background-size: contain; position: absolute; top: -5px; left: -5px; width: calc(160px + 10px); height: calc(160px + 10px); z-index: 2; }
.grid-c .grid-item a .right { width: 100%; padding-top: 10px; }
.grid-c .grid-item a .contents { background-color: #fff; height: 140px; position: relative; display: flex; align-items: center; border-radius: 0 20px 20px 0; }
.grid-c .grid-item a .contents:before { content: ""; background-color: #fff; position: absolute; top: 0; left: -80px; width: 80px; height: 100%; }
.grid-c .grid-item a .text { padding: 20px 40px; }
.grid-c .grid-item a .name { font-size: 22px; line-height: 25px; font-weight: bold; max-height: 50px; margin-bottom: 5px; }
.grid-c .grid-item a .role { font-size: 18px; line-height: 22px; font-weight: 300; max-height: 44px; }
.grid-c .grid-item a .box-knowmore { display: flex; width: 70px; height: 100%; flex-shrink: 0; border-left: solid 2px #EEEAE8; border-radius: 0 20px 20px 0; overflow: hidden; position: relative; }
.grid-c .grid-item a .box-knowmore .in1, .grid-c .grid-item a .box-knowmore .in2 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: inline-flex; align-items: center; justify-content: center; }
.grid-c .grid-item a .box-knowmore .in2 { background-color: #D9001B; margin-left: -70px; border-radius: 0 20px 20px 0; transition: all 0.3s ease; }
.grid-c .grid-item a .box-knowmore .in1:before, .grid-c .grid-item a .box-knowmore .in2:before { background: url("../images/icons.svg") no-repeat 0 0; background-size: 300px; content: ""; display: inline-flex; width: 15px; height: 15px; }
.grid-c .grid-item a .box-knowmore .in1:before { background-position: -180px -45px; }
.grid-c .grid-item a .box-knowmore .in2:before { background-position: -120px -15px; }
.grid-c .grid-item a:hover .box-knowmore .in2 { margin-left: 0; }
.grid-c .grid-item a[href="javascript:void(0);"] { cursor: default; }
.grid-c .grid-item a[href="javascript:void(0);"] .box-knowmore { display: none; }

.general-detail { position: relative; z-index: 20; padding: 50px 0; }
.general-detail * { color: #8A7165; }
.general-detail .image { margin-bottom: 40px; }
.general-detail h1 { margin-bottom: 40px; }
.general-detail h1, .general-detail h1 * { font-size: 50px; line-height: 55px; }
.general-detail .date { margin-bottom: 20px; display: flex; align-items: center; white-space: nowrap; }
.general-detail .date, .general-detail .date * { font-size: 20px; font-weight: 300; }
.general-detail .date:after { content: ""; margin-left: 10px; width: 100%; height: 0; border-top: dotted 1px #D5D5D5; }
.general-detail .description { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 40px; -moz-column-gap: 40px; column-gap: 40px; }

#activities-container, #positions-container, #contacts-container { padding-top: 170px; }

#publicationsdetail-others .wrapper, #activitiesdetail-others .wrapper { display: flex; }
#publicationsdetail-others .left, #activitiesdetail-others .left { width: 33.33%; padding-right: 20px; }
#publicationsdetail-others .right, #activitiesdetail-others .right { width: 66.66%; padding-left: 20px; border-left: dotted 2px #8A7165; }
#publicationsdetail-others .grid-b, #activitiesdetail-others .grid-b { display: grid; grid-gap: 20px; grid-template-columns: repeat(2, 1fr); }
#publicationsdetail-others .grid-b .grid-item, #activitiesdetail-others .grid-b .grid-item { min-width: 0; position: relative; }
#publicationsdetail-others .grid-b .grid-item *, #activitiesdetail-others .grid-b .grid-item * { color: #fff; }
#publicationsdetail-others .grid-b .grid-item a, #activitiesdetail-others .grid-b .grid-item a { background-color: #8A7165; display: block; height: 174px; overflow: hidden; border-radius: 15px; display: flex; align-items: flex-end; padding: 20px; position: relative; transition: all 0.3s ease; }
#publicationsdetail-others .grid-b .grid-item a:before, #activitiesdetail-others .grid-b .grid-item a:before { background: url("../images/gradient-publication-home.png") no-repeat 0 0; background-size: 100% 100%; content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
#publicationsdetail-others .grid-b .grid-item span, #activitiesdetail-others .grid-b .grid-item span { display: block; width: 100%; }
#publicationsdetail-others .grid-b .grid-item .contents, #activitiesdetail-others .grid-b .grid-item .contents { position: relative; z-index: 2; }
#publicationsdetail-others .grid-b .grid-item .date, #activitiesdetail-others .grid-b .grid-item .date { font-size: 14px; line-height: 14px; font-weight: 300px; margin-bottom: 10px; }
#publicationsdetail-others .grid-b .grid-item .title, #activitiesdetail-others .grid-b .grid-item .title { font-size: 22px; line-height: 25px; max-height: 75px; font-weight: bold; }
#publicationsdetail-others .grid-b .grid-item .mask, #activitiesdetail-others .grid-b .grid-item .mask { background-color: rgba(217, 0, 27, 0.8); position: absolute; top: 100%; left: 0; width: 100%; height: 100%; z-index: 3; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; }
#publicationsdetail-others .grid-b .grid-item .mask .knowmore, #activitiesdetail-others .grid-b .grid-item .mask .knowmore { display: inline-flex; align-items: center; width: auto; height: 22px; width: auto; color: #fff; font-size: 22px; line-height: 22px; font-weight: 300; text-transform: uppercase; white-space: nowrap; position: relative; }
#publicationsdetail-others .grid-b .grid-item .mask .knowmore:after, #activitiesdetail-others .grid-b .grid-item .mask .knowmore:after { content: ""; display: inline-flex; width: 44px; height: 44px; background: url("../images/knowmore-crosshair.svg") no-repeat center center; background-size: contain; margin-left: 20px; }
#publicationsdetail-others .grid-b .grid-item a:hover, #activitiesdetail-others .grid-b .grid-item a:hover { transform: scale(1.05); }
#publicationsdetail-others .grid-b .grid-item a:hover .mask, #activitiesdetail-others .grid-b .grid-item a:hover .mask { top: 0; }

#positions-container .grid { display: grid; grid-gap: 30px; grid-template-columns: repeat(2, 1fr); }
#positions-container .grid .grid-item { min-width: 0; position: relative; }
#positions-container .grid .grid-item a { background-color: #fff; display: flex; border-radius: 20px; overflow: hidden; position: relative; transition: all 0.3s ease; }
#positions-container .grid .grid-item a span { display: block; width: 100%; }
#positions-container .grid .grid-item a .contents { padding: 40px; min-height: 194px; position: relative; }
#positions-container .grid .grid-item a .contents:before { content: ""; background-color: #fff; position: absolute; top: 0; left: -80px; width: 80px; height: 100%; }
#positions-container .grid .grid-item a .title { font-size: 20px; line-height: 23px; font-weight: bold; display: -webkit-box; max-height: 50px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; margin-bottom: 5px; }
#positions-container .grid .grid-item a .desc { font-size: 18px; line-height: 21px; max-height: 63px; font-weight: 300; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
#positions-container .grid .grid-item a .mask { background-color: rgba(217, 0, 27, 0.8); position: absolute; top: 100%; left: 0; width: 100%; height: 100%; z-index: 3; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; }
#positions-container .grid .grid-item a .mask .knowmore { display: inline-flex; align-items: center; width: auto; height: 22px; width: auto; color: #fff; font-size: 22px; line-height: 22px; font-weight: 300; text-transform: uppercase; white-space: nowrap; position: relative; }
#positions-container .grid .grid-item a .mask .knowmore:after { content: ""; display: inline-flex; width: 44px; height: 44px; background: url("../images/knowmore-crosshair.svg") no-repeat center center; background-size: contain; margin-left: 20px; }
#positions-container .grid .grid-item a:hover { transform: scale(1.05); }
#positions-container .grid .grid-item a:hover .mask { top: 0; }

#positionsdetail-container { padding-top: 120px; }
#positionsdetail-container h1, #positionsdetail-container h1 * { font-size: 50px; line-height: 55px; }
#positionsdetail-container .box-back { margin-bottom: 20px; width: fit-content; }
#positionsdetail-container .box-back .btn-back { background: transparent !important; border: none; padding: 0; display: flex; align-items: center; border-radius: 0; min-width: 0; position: relative; left: 0; transition: left 0.3s ease; }
#positionsdetail-container .box-back .btn-back, #positionsdetail-container .box-back .btn-back * { font-size: 18px; color: #8A7165 !important; text-transform: none !important; }
#positionsdetail-container .box-back .btn-back:after { display: none; }
#positionsdetail-container .box-back .btn-back:before { content: ""; background: url("../images/icons.svg") no-repeat 0 0; background-size: 720px; transform: rotate(180deg); display: inline-flex; width: 36px; height: 36px; margin-right: 10px; }
#positionsdetail-container .box-back .btn-back:hover { left: 10px; }
#positionsdetail-container .bot { display: flex; padding-top: 60px; }
#positionsdetail-container .bot .left { width: 30%; padding-right: 40px; }
#positionsdetail-container .bot .left h4 { display: flex; white-space: nowrap; align-items: center; }
#positionsdetail-container .bot .left h4:after { content: ""; margin-left: 10px; width: 100%; height: 0; border-top: dotted 1px #D5D5D5; }
#positionsdetail-container .bot .left li:not(:last-child) { margin-bottom: 10px; }
#positionsdetail-container .bot .left li .label { color: #8A7165; font-weight: bold; }
#positionsdetail-container .bot .left li .text { font-size: 16px; font-weight: 200; }
#positionsdetail-container .bot .left .pdf-contents { padding-top: 30px; }
#positionsdetail-container .bot .left .pdf-contents a:after { margin-left: 10px; width: 20px; height: 20px; background-size: 400px; background-position: -260px 0; }
#positionsdetail-container .bot .left .pdf-contents a:hover:after { background-position: -260px -20px; }
#positionsdetail-container .bot .right { width: 70%; }

#contacts-container form input[type="text"], #contacts-container form input[type="email"], #contacts-container form textarea { background-color: #fff; border-color: #D5D5D5; height: 50px; }
#contacts-container form .top { display: flex; margin-bottom: 40px; }
#contacts-container form .top .left { width: 50%; padding-right: 15px; }
#contacts-container form .top .left .box:not(:last-child) { margin-bottom: 20px; }
#contacts-container form .top .right { width: 50%; padding-left: 15px; }
#contacts-container form .top .right textarea { height: 205px; }
#contacts-container form .top .box .label { margin: 0 0 -7px 10px; position: relative; text-transform: inherit; font-size: 12px; color: #8A7165; white-space: nowrap; font-weight: bold; z-index: 2; }
#contacts-container form .bot .box-rgpd { margin-bottom: 40px; }
#contacts-container form .bot .box-submit { padding-top: 40px; display: flex; justify-content: center; }
#contacts-container form .bot input[type="submit"] { width: auto; }
#contacts-container form .bot .mandatory { color: #D9001B; font-size: 12px; line-height: 15px; }
#contacts-container form .bot .mandatory:before { margin-right: 5px; }
#contacts-container form .bot .label-checkbox span.checkbox { background-color: transparent; width: 20px; height: 20px; border-radius: 20px; display: flex; align-items: center; justify-content: center; border-color: #8A7165; transition: background 0.3s ease, border 0.3s ease; }
#contacts-container form .bot .label-checkbox span.checkbox:before { background: url("../images/icons.svg") no-repeat 0 -60px; background-size: 200px; content: ""; display: block; width: 10px; height: 10px; opacity: 0; transition: opacity 0.3s ease; }
#contacts-container form .bot .label-checkbox input[type="checkbox"]:checked ~ .checkbox { background: #D9001B; border-color: #D9001B; }
#contacts-container form .bot .label-checkbox input[type="checkbox"]:checked ~ .checkbox:before { opacity: 1; }
#contacts-container form .bot .label-checkbox p { padding-left: 5px; }
#contacts-container form .bot .label-checkbox p, #contacts-container form .bot .label-checkbox p * { font-size: 14px; line-height: 17px; font-weight: 200; }
