@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=ABeeZee&Kumbh+Sans:wght@100&family=Roboto:wght@100&display=swap");
* { padding: 0px; margin: 0px; box-sizing: content-box; }

*, *::before, *::after { box-sizing: border-box; }

html, body { width: 100% !important; overflow-x: hidden !important; }

body { height: 100vh; overflow: scroll; -webkit-overflow-scrolling: touch; }

h1 { color: black; font-family: "ABeeZee"; font-size: 2em; }

.inside h1 { text-align: center; min-height: 3em; display: flex; align-items: center; justify-content: center; }

article { max-width: 1440px; margin: auto; display: block; }

.inside { max-width: 1024px; margin: auto; margin-top: 2em; }

p, h3, h4, h5, h6, a { font-family: "Avenir"; font-size: 1em; }

h2 { font-family: "ABeeZee"; text-align: center; margin-bottom: 1.5em; }

ul { list-style: none; }

ul li { width: auto; }

ul li img { width: 100%; }

a { text-decoration: none; color: black; }

.shadow { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); }

.grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 15px; }

.grid-4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 15px; }

#blog-list li { padding: 2em 2em; border-radius: 3px; }

.date { font-size: 0.8em; color: grey; }

.tag { border: solid 1px; display: inline-block; border-radius: 15px; padding: 5px 10px; font-size: 0.8em; color: white; font-weight: bold; }

.tag.data { background-color: #DEBC44; }

.tag.GTM { background-color: #4285F4; }

.tag.seo { background-color: #1AC185; }

.banner { background-size: cover; background-position: center; padding: 20vh 0; background-repeat: no-repeat; margin: auto; display: flex; justify-content: flex-start; flex-direction: column; }

.banner .banner-text { font-family: "ABeeZee"; max-width: 1024px; width: 100%; margin: auto; text-align: left; }

.banner .banner-text h1 { letter-spacing: 5px; font-size: 2.5em; font-family: "Avenir"; font-weight: 200; line-height: 0.8; }

.banner .banner-text h1 span { font-size: 0.5em; margin-left: 3.5em; }

.banner .presta-banner { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 10px; margin-top: 5em !important; max-width: 1024px; width: 100%; margin: auto; overflow-x: scroll; overflow-y: hidden; padding-left: 1em; padding-right: 1em; }

.banner .presta-banner div { border: solid 1px; border-radius: 3px; color: white; width: 100%; padding: 1em; opacity: 0.6; display: flex; justify-content: center; flex-direction: column; align-items: center; }

.banner .presta-banner div:hover { opacity: 1; cursor: pointer; }

.banner .presta-banner h2 { font-size: 1em; margin-bottom: 0; }

.banner h1 { margin: 0; color: white; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2); font-size: 32px; font-weight: bold; }

.banner p { font-size: 20px; color: white; opacity: .7; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2); }

header { position: relative; }

header nav { position: absolute; top: 0px; }

nav { font-family: "ABeeZee"; width: 100%; display: flex; margin: auto; margin-top: 1em; }

nav div { width: 1024px; margin: auto; }

nav a { text-decoration: none; color: white; padding: 2px 15px; font-size: 1em; }

nav a:first-of-type { font-size: 1.5em; color: white; }

nav .current { color: blue; }

#menuToggle { display: flex; flex-direction: column; position: relative; top: 25px; left: 25px; z-index: 1; -webkit-user-select: none; user-select: none; position: fixed; }

#menuToggle input { display: flex; width: 40px; height: 32px; position: absolute; cursor: pointer; opacity: 0; z-index: 2; }

#menuToggle span { display: flex; width: 29px; height: 2px; margin-bottom: 5px; position: relative; background: #ffffff; border-radius: 3px; z-index: 1; transform-origin: 5px 0px; transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease; }

#menuToggle span:first-child { transform-origin: 0% 0%; }

#menuToggle span:nth-last-child(2) { transform-origin: 0% 100%; }

#menuToggle input:checked ~ span { opacity: 1; transform: rotate(45deg) translate(-3px, -1px); background: #36383F; }

#menuToggle input:checked ~ span:nth-last-child(3) { opacity: 0; transform: rotate(0deg) scale(0.2, 0.2); }

#menuToggle input:checked ~ span:nth-last-child(2) { transform: rotate(-45deg) translate(0, -1px); }

#menu { position: absolute; width: 60%; height: 400px; box-shadow: 0 0 10px #85888C; margin: -50px 0 0 -50px; padding: 50px; padding-top: 125px; background-color: #F5F6FA; -webkit-font-smoothing: antialiased; transform-origin: 0% 0%; transform: translate(-100%, 0); transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1); height: 100vh; position: fixed; }

#menu li { padding: 10px 0; transition-delay: 2s; }

#menu li a { color: black !important; }

#menuToggle input:checked ~ ul { transform: none; }

/*------------------------------------------ Responsive Grid Media Queries - 1280, 1024, 768, 480 1280-1024   - desktop (default grid) 1024-768    - tablet landscape 768-480     - tablet 480-less    - phone landscape & smaller --------------------------------------------*/
@media all and (min-width: 1280px) { #menuToggle, #menu { display: none; } }

@media all and (min-width: 1024px) and (max-width: 1280px) { #menuToggle, #menu { display: none; } }

@media all and (max-width: 480px) { .banner { padding: 15vh 0; } .nav-link { display: none; } #logo { display: none; } .inside { padding-left: 10px; padding-right: 10px; } .grid-3 { grid-template-columns: 1fr; } .grid-4 { grid-template-columns: 1fr; } .banner-text { padding-left: 1em; } #post header { padding-left: 10px; padding-right: 10px; } #post .author-share { padding-top: 10px; } #post .social-share { justify-content: space-between; display: flex; width: 100%; } .realisations-home div { flex-direction: column; } .realisations-home div img { width: 100% !important; margin: 0 !important; width: 80px; } }

/*------------------------------------------ Foundation Media Queries http://foundation.zurb.com/docs/media-queries.html --------------------------------------------*/
/* Small screens - MOBILE */
/* Define mobile styles - Mobile First */
/* max-width 640px, mobile-only styles, use when QAing mobile issues */
/* Medium screens - TABLET */
/* min-width 641px, medium screens */
/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
/* Large screens - DESKTOP */
/* min-width 1025px, large screens */
/* min-width 1024px and max-width 1440px, use when QAing large screen-only issues */
/* XLarge screens */
/* min-width 1441px, xlarge screens */
/* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */
/* XXLarge screens */
/* min-width 1921px, xlarge screens */
/*------------------------------------------*/
/* Portrait */
@media screen and (orientation: portrait) { /* Portrait styles here */ }

/* Landscape */
@media screen and (orientation: landscape) { /* Landscape styles here */ }

/* CSS for iPhone, iPad, and Retina Displays */
/* Non-Retina */
/* Retina */
/* iPhone Portrait */
/* iPhone Landscape */
/* iPad Portrait */
/* iPad Landscape */
footer { background-color: black; color: white; height: auto; min-height: 5em; margin-top: 2em; height: 10em; padding-top: 1em; padding-bottom: 1em; }

footer h2, footer h3, footer h4, footer p, footer a { color: white; }

footer .inside { margin-top: 0; margin-bottom: 0; padding: 0; }

footer div.inside > div { display: flex; flex-direction: column; }

.btn { background-color: #DEBC44; color: white; border-radius: 2px; padding: 0.2em 1.5em; text-decoration: none; margin-top: 1.5em; margin-bottom: 0.5em; display: inline-block; }

.btn.black { background-color: black; }

form { font-family: "Avenir"; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

form div { margin-bottom: 0.5em; }

form input, form textarea, form select { font-size: 1em; line-height: 2em; padding-left: 0.5em; padding-right: 0.5em; border: solid 1px lightgrey; border-radius: 3px; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

form label { display: block; }

form .full { display: flex; justify-content: space-between; width: 100%; }

form .full .half { width: 48%; }

form .half, form input, form label, form textarea, form select { width: 100%; font-family: "Avenir"; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

form .checkbox { -webkit-appearance: auto; -moz-appearance: auto; appearance: auto; }

form .checkbox label { display: flex; align-items: baseline; }

form .checkbox label input { width: auto; margin-right: 1em; -webkit-appearance: auto; -moz-appearance: auto; appearance: auto; }

form input[type="submit"] { cursor: pointer; }

#post #nav-menu, #post #menuToggle, #post nav { color: black; }

#post #nav-menu a, #post #menuToggle a, #post nav a { color: black; }

#post #menuToggle span { background: black; }

#post #menuToggle input:checked ~ span { background: black; }

#post header { height: auto; display: flex; padding-top: 8em; flex-direction: column; justify-content: flex-end; align-items: center; }

#post header .header-post { height: auto; display: flex; flex-direction: column; justify-content: space-between; width: 100%; max-width: 940px; }

#post header h1 { margin: 0; padding: 0; text-align: center; width: 100%; max-width: 940px; margin-bottom: 1em; padding: 10px; }

#post header .author-share { font-family: "ABeeZee" !important; height: auto; padding-top: 1em; border-top: solid 5px #DEBC44; width: 100%; max-width: 940px; display: flex; justify-content: space-between; flex-wrap: wrap; }

#post header .author-share div { font-family: "ABeeZee" !important; display: flex; align-items: center; }

#post header .author-share div p span { color: grey; }

#post header .author-share div .avatar { width: 50px; height: 50px; border-radius: 50px; margin-right: 0.8em; }

#post header .author-share div .function { font-size: 0.8em; }

#post header .author-share .social-share .icon { margin-left: 0.8em; width: 32px; height: 32px; }

#post header .author-share .social-share .icon img { cursor: pointer; }

#post header .author-share .social-share p { color: grey; }

#post header .author-share p { font-family: "ABeeZee" !important; }

#post article { max-width: 940px; }

#post article h1 { padding: 1em 0 1em; }

#post article h2:before { content: "•"; margin-right: 5px; color: #DEBC44; font-size: 2em; }

#post h1, #post h2, #post h3, #post h4, #post h5, #post h6 { font-family: "ABeeZee"; }

#post h2, #post h3, #post h4, #post h5, #post h6 { text-align: left; margin: 0; padding: 0; margin: 0.5em 0; display: flex; align-items: center; }

#post h3 { margin-top: 1em; font-size: 1.2em; }

#post p, #post ol, #post ul, #post div { font-family: "Avenir"; list-style-position: inside; }

#post pre { border: solid 1px whitesmoke; border-radius: 3px; padding: 5px; background-color: #FBFBFB; }

#post .author { margin-top: 1em; border: solid 2px #DEBC44; border-radius: 3px; width: 100%; padding: 1em; display: flex; align-items: center; }

#post .author div:first-of-type { margin-left: 0.5em; }

#post .author p { font-family: "ABeeZee"; }

#post .author .avatar { width: 70px; border-radius: 50%; }

#post .author .social { display: flex; align-items: center; margin: 0 !important; }

#post .author .social a { display: flex; margin-right: 5px; }

.posts .card { font-family: "ABeeZee"; background-color: white; padding: 10px; padding-bottom: 15px; border-radius: 5px; filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25)); }

.posts .card h2 { margin-bottom: 0; min-height: 5.5em; display: flex; align-items: center; font-weight: 100; }

.posts .card .date-published { font-size: 0.8em; color: grey; margin-bottom: 0.2em; }

.posts .card .card-text { padding-top: 1em; margin-bottom: 1em; border-top: solid 3px #DEBC44; font-family: "Avenir"; font-weight: 100; min-height: 7em; }

.posts .card div { display: flex; justify-content: space-between; align-items: center; font-family: "ABeeZee"; font-weight: 100; }

.posts .card div img { width: 15px; margin-left: 1em; }

.posts .card div a { display: flex; align-items: center; }

.posts .card div a:hover { text-decoration: underline; }

.avatar { filter: grayscale(100%); }

#prestas { max-width: 940px; margin: auto; }

#prestas h1 { font-family: "ABeeZee"; text-align: center; }

.prestas { display: flex; justify-content: space-between; margin-top: 3em; }

.prestas div { width: 60%; }

.prestas div p, .prestas div h2 { text-align: left; }

.prestas img { width: 200px; height: auto; object-fit: contain; }

.prestas img.internation-map { width: 350px; }

.prestas:nth-child(even) { flex-direction: row-reverse; }

.realisations-home div { display: flex; height: auto; }

.realisations-home div img { width: 70%; margin-right: 2em; }

.realisations-home div p { width: 100%; }