/* Generated by tools/make-src.py — do not edit.
   Hand-written CSS belongs in styles/overrides.css. */

/* --- theme header (799 -> 799 bytes) --- */
/*!
Theme Name: Dosmax
Theme URI: /
Author: Jenish Mandalia
Author URI: /
Description: A Custom theme for the Dosmax
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: dosmax
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

dosmax is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/* --- theme (34,099 -> 32,769 bytes) --- */
@font-face{font-family:'FuturaPTWebBook';src:url("../fonts/futura-pt_book.woff2") format("woff2");font-weight:normal;font-style:normal;}
@font-face{font-family:'FuturaPTWebMedium';src:url("../fonts/futura-pt_medium.woff2") format("woff2");font-weight:normal;font-style:normal;}
@font-face{font-family:'FuturaPTWebBold';src:url("../fonts/FuturaPT-Bold.woff2") format("woff2");font-weight:normal;font-style:normal;}
@font-face {
font-family: 'FuturaPTWebDemi';
src: url("../fonts/futura-pt_demi.woff2") format("woff2");
font-weight: normal;
font-style: normal;
} *{-webkit-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:none;}
html{padding:0;margin:0;color:#000000;font-family:'FuturaPTWebBook';font-weight:normal;font-style:normal;font-weight:normal;overflow-x:hidden;font-size:12px;}
@media(min-width:480px){
html{font-size:13px;}
}
@media(min-width:640px){
html{font-size:16px;}
}
@media(min-width:768px){
html{font-size:16px;}
}
@media(min-width:1024px){
html{font-size:13px;}
}
@media(min-width:1280px){
html{font-size:16px;}
}
body{margin:0px;font-size:1rem;line-height:1.18em;overflow-x:hidden;color:#000000;font-family:'FuturaPTWebBook';font-weight:normal;font-style:normal;font-weight:normal;background-color:#ffffff;}
@media(min-width:480px){
body{font-size:1.25rem;line-height:1.12em;}
}
@media(min-width:1024px){
body{line-height:1.5em;font-size:1rem;}
}
img {
max-width: 100%;
display: inline-block;
vertical-align: top;
border: 0;
outline: none;
height: auto;
} a{text-decoration:none;color:#000000;-webkit-transition:all 0.3s ease-in-out 0s;transition:all 0.3s ease-in-out 0s;}
.btn, .menu-btn > a, .ff_submit_btn_wrapper .ff-btn{text-decoration:none;display:inline-block;text-align:center;padding:1rem 1.3rem;border:0.06rem solid #000000;background-color:#000000;color:#ffffff;font-family:'FuturaPTWebBook';font-weight:normal;font-style:normal;font-size:1rem;border-radius:0;text-transform:uppercase;}
.btn:hover, .menu-btn > a:hover, .ff_submit_btn_wrapper .ff-btn:hover{background-color:#ffffff;border-color:#000000;color:#000000;}
@media(min-width:768px){
.btn, .menu-btn > a, .ff_submit_btn_wrapper .ff-btn{font-size:1.25rem;}
}
@media(min-width:1024px){
.btn, .menu-btn > a, .ff_submit_btn_wrapper .ff-btn{padding:1.1rem 1.8rem;font-size:1.3rem;}
}
h1, h2, h3, h4, h5, h6{font-family:'FuturaPTWebBold';font-weight:normal;font-style:normal;margin:0 0 0.93rem 0;line-height:1.2em;font-weight:normal;color:#000000;}
@media(min-width:1024px){
h1, h2, h3, h4, h5, h6{line-height:1.1em;}
}
h1, .h1, .has-heading-1-font-size{font-size:1.35rem;letter-spacing:0.06em;font-family:'FuturaPTWebBook';font-weight:normal;font-style:normal;}
@media(min-width:1024px){
h1, .h1, .has-heading-1-font-size{font-size:2.5rem;}
}
h2, .h2, .has-heading-2-font-size{font-size:1.875rem;font-family:'FuturaPTWebBook';font-weight:normal;font-style:normal;line-height:1.3em;letter-spacing:0.018em;}
h3, .h3, .has-heading-3-font-size{font-size:2.1rem;}
@media(min-width:640px){
h3, .h3, .has-heading-3-font-size{font-size:2.5rem;}
}
@media(min-width:1024px){
h3, .h3, .has-heading-3-font-size{font-size:1.875rem;}
}
h4, .h4, .has-heading-4-font-size{font-size:1.25rem;}
h5, .h5, .has-heading-4-font-size{font-size:1.25rem;}
h6, .h6, .has-heading-6-font-size {
font-size: 1rem;
} p{margin:0 0 1.25rem;}
sup{font-size:0.6em;}
.overlay-link{position:absolute;top:0;bottom:0;left:0;right:0;z-index:1;display:block;font-size:0;}
.alignleft{float:left;margin:0 1.25rem 1.25rem 0;}
.alignright{float:right;margin:0 0 1.25rem 1.25rem;}
.alignnone{float:none;margin:0 0 0.93rem 0px;display:block;}
.aligncenter{float:none;margin:0 auto 0.93rem auto;display:list-item;}
sup{font-size:0.6em;}
b, strong{font-family:'FuturaPTWebBold';font-weight:normal;font-style:normal;}
table{empty-cells:show;border-collapse:collapse;border-spacing:0;margin-bottom:0.93rem;border:0.06rem solid #000000;}
table td{padding:0.5em 1em;border-width:0 0 0 0.06rem;font-size:inherit;margin:0;overflow:visible;border-left:0.06rem solid #000000;border-bottom:0.06rem solid #000000;}
table td:first-child{border-left-width:0;}
table th{padding:0.5em 1em;border-width:0 0 0 0.06rem;font-size:inherit;margin:0;overflow:visible;border-left:0.06rem solid #000000;border-bottom:0.06rem solid #000000;}
table th:first-child{border-left-width:0;}
thead{text-align:left;vertical-align:bottom;background-color:#000000;color:#000000;}
ul{margin:0px;padding:0px 0 0.93rem 1.87rem;}
ul li{margin:0px;padding:0 0 0.42rem;list-style-type:disc;list-style-position:outside;}
ol{margin:0px;padding:0px 0 0.56rem 2rem;}
ol li{margin:0px;padding:0 0 0.62rem;list-style-position:outside;list-style:decimal;}
input{-webkit-appearance:none;-moz-appearance:none;appearance:none;}
input:focus{outline:none;}
textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;}
textarea:focus{outline:none;}
input[type="text"], input[type="email"], input[type="password"], input[type="url"], input[type="tel"], input[type="search"], input[type="search"], select, textarea, .ff-el-form-control{width:100%;border:0;background-color:#000000;padding:0.68rem 1.2rem;font-size:0.6rem;color:#ffffff;font-family:'FuturaPTWebBook';font-weight:normal;font-style:normal;-webkit-box-shadow:inset 0px 0.14rem 0.625rem 0px rgba(0, 0, 0, 0.8);box-shadow:inset 0px 0.14rem 0.625rem 0px rgba(0, 0, 0, 0.8);border-radius:0.5rem;}
@media(min-width:1024px){
input[type="text"], input[type="email"], input[type="password"], input[type="url"], input[type="tel"], input[type="search"], input[type="search"], select, textarea, .ff-el-form-control{border-radius:0.62rem;font-size:1.12rem;padding:1.65rem 1.5rem;}
}
::-webkit-input-placeholder{color:#ffffff;}::-moz-placeholder{color:#ffffff;}:-ms-input-placeholder{color:#ffffff;}:-moz-placeholder{color:#ffffff;}
.container, .alignwide, .grid-container{width:28rem;max-width:100%;margin:0 auto;padding:0 1.12rem;}
@media(min-width:480px){
.container, .alignwide, .grid-container{width:32rem;}
}
@media(min-width:640px){
.container, .alignwide, .grid-container{width:35.5rem;}
}
@media(min-width:768px){
.container, .alignwide, .grid-container{width:47rem;}
}
@media(min-width:1024px){
.container, .alignwide, .grid-container{width:76rem;}
}
@media(min-width:1280px){
.container, .alignwide, .grid-container{width:80rem;}
}
.container .container, .alignwide .container, .grid-container .container{width:100%;padding:0;}
.no-js #loader{display:none;}
.js #loader{display:block;position:absolute;left:6.25rem;top:0;}
.section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;vertical-align:top;width:100%;position:relative;}
.text-left{text-align:left;}
.text-center{text-align:center;}
.text-right{text-align:right;}
.align-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
.align-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;}
.align-end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;}
.justify-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;}
.justify-start{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;}
.justify-end{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;}
.justify-space-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;}
.row{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-1.25rem;margin-right:-1.25rem;}
@media(min-width:768px){
.row{margin-left:-1.6rem;margin-right:-1.6rem;}
}
.row > div{padding-left:1.25rem;padding-right:1.25rem;}
@media(min-width:768px){
.row > div{padding-left:1.6rem;padding-right:1.6rem;}
}
.col-3{width:100%;}
@media(min-width:768px){
.col-3{width:50%;}
}
@media(min-width:1024px){
.col-3{width:25%;}
}
.col-4{width:100%;}
@media(min-width:768px){
.col-4{width:50%;}
}
@media(min-width:1024px){
.col-4{width:33.33%;}
}
.col-6{width:100%;}
@media(min-width:1024px){
.col-6{width:50%;}
}
.col-8{width:66.66%;}
.remove-padding{padding:0 !important;}
.remove-top-padding{padding-top:0 !important;}
.remove-bottom-padding{padding-bottom:0 !important;}
.section_title{padding-bottom:2.6rem;}
.section_title h2 br{display:block;}
@media(min-width:1024px){
.section_title h2 br{display:none;}
}
.dafualt-content a{text-decoration:underline;}
.site-header{width:100%;padding:3.3rem 0;}
@media(min-width:1024px){
.site-header{padding:4rem 0;}
}
.site-header .container{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;}
@media(min-width:1024px){
.site-header .container{-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
}
.site-header .btn{display:none;}
@media(min-width:1024px){
.site-header .btn{display:inline-block;}
}
.site-header .logo{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;width:16.5rem;}
@media(min-width:480px){
.site-header .logo{width:20rem;}
}
@media(min-width:640px){
.site-header .logo{width:22rem;}
}
@media(min-width:768px){
.site-header .logo{width:28rem;}
}
@media(min-width:1024px){
.site-header .logo{width:36rem;position:relative;right:-5.6rem;}
}
.site-header .logo .tagline{font-family:'FuturaPTWebBold';font-weight:normal;font-style:normal;width:7rem;text-transform:uppercase;font-size:1.1rem;margin:0;}
@media(min-width:480px){
.site-header .logo .tagline{width:7.6rem;font-size:1.21rem;}
}
@media(min-width:640px){
.site-header .logo .tagline{width:8.4rem;font-size:1.35rem;}
}
@media(min-width:1024px){
.site-header .logo .tagline{width:24rem;font-size:2.5rem;}
}
.site-header .logo > a{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;}
.site-header .logo > a img{width:7rem;position:relative;left:0.25rem;height:auto;}
@media(min-width:480px){
.site-header .logo > a img{width:9rem;}
}
@media(min-width:640px){
.site-header .logo > a img{width:10.2rem;}
}
@media(min-width:1024px){
.site-header .logo > a img{width:10.2rem;}
}
.site-header .logo > a:hover::after{-webkit-transform:scale(1.1);transform:scale(1.1);}
.site-header .logo > a::after{content:"";position:absolute;left:0;right:0;bottom:0;top:0;background:url(../img/logo-bracket.svg) no-repeat center;-webkit-transition:all 0.2s;transition:all 0.2s;background-size:100% 100%;}
.hamburger-menu{padding:0;background-color:transparent;border:0;width:2.6rem;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-top:0.6rem;cursor:pointer;}
@media(min-width:1024px){
.hamburger-menu{margin-top:0;}
}
.hamburger-menu span{display:inline-block;width:100%;height:0.188rem;background-color:#000000;border-radius:1rem;}
.hamburger-menu span:nth-child(2){margin:0.6rem 0;}
.site-menu{width:100%;position:fixed;top:-150%;left:0;height:100vh;overflow:auto;background-color:#ffffff;text-align:center;-webkit-transition:all 0.5s;transition:all 0.5s;z-index:9;}
.site-menu .container{position:relative;}
.site-menu .close-menu{position:absolute;top:4.2rem;left:0;display:inline-block;}
.site-menu .close-menu img{width:2rem;height:auto;}
.site-menu nav{width:100%;padding:9rem 0 0;}
@media(min-width:1024px){
.site-menu nav{width:37rem;margin:0 auto;}
}
.site-menu nav ul{width:100%;padding:0;}
.site-menu nav ul li{display:inline-block;width:100%;padding:0;margin:0;list-style-type:none;border-bottom:0.188rem solid transparent;text-transform:uppercase;}
.site-menu nav ul li a{display:inline-block;width:100%;font-family:'FuturaPTWebBold';font-weight:normal;font-style:normal;font-size:2rem;padding:1.41rem 0;line-height:normal;}
.site-menu nav ul li.menu-item-language{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:space-evenly;-ms-flex-pack:space-evenly;justify-content:space-evenly;}
.site-menu nav ul li.menu-item-language a{width:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
.site-menu nav ul li.menu-item-language a img{width:2.4rem;height:1.6rem;margin-right:0.5rem;vertical-align:middle;display:none;}
.site-menu nav ul li.language-menu a{display:inline-block;width:auto;padding:1.41rem 0.8rem;}
.site-menu nav ul li.language-menu.violet-red-theme:hover a{color:inherit;}
.site-menu nav ul li.language-menu.violet-red-theme > a:hover{color:#BD0054;}
.site-menu nav ul li.violet-red-theme{border-color:#BD0054;}
.site-menu nav ul li.violet-red-theme:hover a{color:#BD0054;}
.site-menu nav ul li.eastern-blue-theme{border-color:#339BAE;}
.site-menu nav ul li.eastern-blue-theme:hover a{color:#339BAE;}
.site-menu nav ul li.grey-blue-theme{border-color:#6C91AA;}
.site-menu nav ul li.grey-blue-theme:hover a{color:#6C91AA;}
.site-menu nav ul li.fade-blue-theme{border-color:#6B89AD;}
.site-menu nav ul li.fade-blue-theme:hover a{color:#6B89AD;}
.open-menu .site-menu{top:0;}
.site-footer{width:100%;background-color:#000000;color:#ffffff;padding:5.6rem 0;}
@media(min-width:1024px){
.site-footer{padding:2.8rem 0;font-size:1.25rem;}
}
.site-footer .container{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;}
@media(min-width:1024px){
.site-footer .container{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;width:73rem;}
}
.site-footer a{color:#ffffff;}
.site-footer a:hover{color:#339BAE;}
.site-footer__logo{width:9rem;}
@media(min-width:480px){
.site-footer__logo{width:10rem;}
}
@media(min-width:640px){
.site-footer__logo{width:13rem;}
}
@media(min-width:768px){
.site-footer__logo{width:14rem;}
}
@media(min-width:1024px){
.site-footer__logo{width:7.8rem;}
}
.site-footer__logo img{width:100%;height:auto;}
.site-footer__logo > a{position:relative;display:inline-block;}
.site-footer__logo > a:hover::after{-webkit-transform:scale(1.1);transform:scale(1.1);}
.site-footer__logo > a::after{content:"";position:absolute;left:0;right:0;bottom:0;top:0;background:url(../img/logo-bracket-footer.svg) no-repeat center;-webkit-transition:all 0.2s;transition:all 0.2s;background-size:100% 100%;}
.site-footer__center{width:15rem;padding-left:3rem;}
@media(min-width:480px){
.site-footer__center{width:18rem;padding-left:4rem;}
}
@media(min-width:640px){
.site-footer__center{width:20rem;padding-left:4.9rem;}
}
@media(min-width:1024px){
.site-footer__center{width:39rem;padding-left:0;padding-top:0.9rem;display:-webkit-box;display:-ms-flexbox;display:flex;}
}
.site-footer__center .address{display:block;}
@media(min-width:1024px){
.site-footer__center .address{display:inline-block;width:13rem;line-height:1.3em;}
}
.site-footer__center .contact-info{width:100%;padding:0.7rem 0 0;}
@media(min-width:1024px){
.site-footer__center .contact-info{width:22rem;padding:0 0 0 5.9rem;}
}
.site-footer__center .contact-info li{display:inline-block;background-position:center left;background-repeat:no-repeat;background-size:1.3rem;padding:0.6rem 0 0.6rem 2rem;}
@media(min-width:480px){
.site-footer__center .contact-info li{background-size:1.6rem;padding:1rem 0 1rem 2.5rem;}
}
@media(min-width:640px){
.site-footer__center .contact-info li{background-size:1.9rem;padding:1.1rem 0 1.1rem 3rem;}
}
@media(min-width:1024px){
.site-footer__center .contact-info li{padding:0.6rem 0 1.2rem 3.8rem;background-position:0px 0.3rem;}
}
.site-footer__center .contact-info li.mail-info{background-image:url(../img/contact-mail.svg);}
.site-footer__center .contact-info li.tel-info{background-image:url(../img/contact-phone.svg);}
.site-footer__menu{width:100%;padding:2rem 0 0;}
@media(min-width:480px){
.site-footer__menu{padding:4rem 0 0;}
}
@media(min-width:640px){
.site-footer__menu{padding:6.2rem 0 0;}
}
@media(min-width:1024px){
.site-footer__menu{width:16rem;padding:1rem 0 0 2.2rem;text-align:left;}
}
.site-footer__menu ul{padding:0;width:100%;text-align:center;}
@media(min-width:1024px){
.site-footer__menu ul{text-align:left;}
}
.site-footer__menu ul li{display:inline-block;padding:0 1rem 0;}
@media(min-width:480px){
.site-footer__menu ul li{padding:0 2rem 0;}
}
@media(min-width:640px){
.site-footer__menu ul li{padding:0 3.34rem 0;}
}
@media(min-width:1024px){
.site-footer__menu ul li{padding:0;width:100%;padding:0 0 0.8rem;}
}
.site-footer__menu ul li:first-child{padding:0;}
@media(min-width:1024px){
.site-footer__menu ul li:first-child{padding:0 0 0.8rem;}
}
.site-footer__menu ul li:last-child{padding:0;}
@media(min-width:1024px){
.site-footer__menu ul li:last-child{padding:0 0 0.8rem;}
}
.card_section{padding:2.5rem 0;}
.card_section__inner{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;}
@media(min-width:1024px){
.card_section__inner{margin:0 -1.25rem;}
}
.card_section__inner .card_Cl{width:100%;margin-bottom:2.37rem;}
@media(min-width:1024px){
.card_section__inner .card_Cl{padding:0 1.25rem;width:33.33%;}
}
.card_section__inner .card_Cl__inner{padding:1.438rem 1.813rem;border-width:0.188rem;border-style:solid;height:100%;min-height:auto;display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;}
@media(min-width:1024px){
.card_section__inner .card_Cl__inner{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:14.563rem;}
.card_section__inner .card_Cl__inner:hover h3{opacity:0;visibility:hidden;}
.card_section__inner .card_Cl__inner:hover .hover_text{opacity:1;visibility:visible;color:#ffffff !important;}
.card_section__inner .card_Cl__inner:hover.cyan_blue_theme{background:#12427C;}
.card_section__inner .card_Cl__inner:hover.eastern_blue_theme{background:#339BAE;}
.card_section__inner .card_Cl__inner:hover.grey_blue_theme{background:#6C91AA;}
.card_section__inner .card_Cl__inner:hover.violet_red_theme{background:#BD0054;}
.card_section__inner .card_Cl__inner:hover.velvet_theme{background:#740E42;}
.card_section__inner .card_Cl__inner:hover.pink_theme{background:#DD5E98;}
}
.card_section__inner .card_Cl__inner h3{text-transform:uppercase;}
@media(min-width:1024px){
.card_section__inner .card_Cl__inner h3{margin:0;-webkit-transition:all 0.3s;transition:all 0.3s;}
}
.card_section__inner .card_Cl__inner .hover_text{text-transform:uppercase;font-family:'FuturaPTWebBold';font-weight:normal;font-style:normal;font-size:1.87rem;line-height:1.32em;position:relative;}
@media(min-width:1024px){
.card_section__inner .card_Cl__inner .hover_text{position:absolute;left:1.625rem;right:1.625rem;opacity:0;visibility:hidden;-webkit-transition:all 0.3s;transition:all 0.3s;}
}
.card_section__inner .card_Cl__inner.cyan_blue_theme .hover_text{color:#12427C;}
.card_section__inner .card_Cl__inner.eastern_blue_theme .hover_text{color:#339BAE;}
.card_section__inner .card_Cl__inner.grey_blue_theme .hover_text{color:#6C91AA;}
.card_section__inner .card_Cl__inner.violet_red_theme .hover_text{color:#BD0054;}
.card_section__inner .card_Cl__inner.velvet_theme .hover_text{color:#740E42;}
.card_section__inner .card_Cl__inner.pink_theme .hover_text{color:#DD5E98;}
.cyan_blue_theme{border-color:#12427C;}
.eastern_blue_theme{border-color:#339BAE;}
.grey_blue_theme{border-color:#6C91AA;}
.violet_red_theme{border-color:#BD0054;}
.velvet_theme{border-color:#740E42;}
.pink_theme{border-color:#DD5E98;}
.service_section__inner{padding:1.813rem 0 0 0;}
@media(min-width:1024px){
.service_section__inner{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:0 5rem;}
}
.service_section .service_Cl{margin:0 0 5.2rem;width:100%;}
@media(min-width:1024px){
.service_section .service_Cl{width:16.9rem;margin:0;}
}
.service_section .service_Cl:nth-child(1) .sC_top_img{width:4.875rem;}
@media(min-width:1024px){
.service_section .service_Cl:nth-child(1) .sC_top_img{width:auto;}
}
.service_section .service_Cl:nth-child(1) h3{width:calc(100% - 4.875rem);}
@media(min-width:1024px){
.service_section .service_Cl:nth-child(1) h3{width:calc(100% - 0rem);}
}
.service_section .service_Cl:nth-child(2) .sC_top_img{width:7.75rem;}
@media(min-width:1024px){
.service_section .service_Cl:nth-child(2) .sC_top_img{width:auto;}
}
.service_section .service_Cl:nth-child(2) h3{width:calc(100% - 7.75rem);}
@media(min-width:1024px){
.service_section .service_Cl:nth-child(2) h3{width:calc(100% - 0rem);}
}
.service_section .service_Cl:nth-child(3) .sC_top_img{width:9.764rem;}
@media(min-width:1024px){
.service_section .service_Cl:nth-child(3) .sC_top_img{width:auto;}
}
.service_section .service_Cl:nth-child(3) h3{width:calc(100% - 9.764rem);}
@media(min-width:1024px){
.service_section .service_Cl:nth-child(3) h3{width:calc(100% - 0rem);}
}
.service_section .service_Cl .sC_top{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;padding:0 0 2.7rem;}
@media(min-width:1024px){
.service_section .service_Cl .sC_top{-ms-flex-wrap:wrap;flex-wrap:wrap;}
}
@media(min-width:1024px){
.service_section .service_Cl .sC_top .sC_top_img{margin:0 0 2.813rem;min-height:10.2rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;width:100%;}
}
.service_section .service_Cl .sC_top .sC_top_img img{width:100%;}
@media(min-width:1024px){
.service_section .service_Cl .sC_top .sC_top_img img{width:auto;}
}
.service_section .service_Cl .sC_top h3{padding:0 0 0 2.2rem;text-transform:uppercase;margin:0 0 -0.34em;}
@media(min-width:1024px){
.service_section .service_Cl .sC_top h3{padding:0;margin:0;}
}
.expert_service_section{padding:3.75rem 0 0 0;}
.expert_service_section .section_title h2{margin-bottom:2.938rem;}
@media(min-width:1024px){
.expert_service_section .section_title h2{margin-bottom:1.83rem;}
}
.expert_service_section .section_title p{text-align:left;}
@media(min-width:1024px){
.expert_service_section .section_title p{text-align:center;line-height:1.55em;}
}
.expert_service_section .section_title p br{display:none;}
@media(min-width:1024px){
.expert_service_section .section_title p br{display:block;}
}
.expert_service_block{padding:0.75rem 0 0 0;}
@media(min-width:1024px){
.expert_service_block{padding:2.2rem 1rem 0;}
}
.expert_service_block .expert_service_row{border-style:solid;border-width:0.188rem;padding:3.34rem 2.938rem 1.3rem;margin-bottom:4.18rem;position:relative;}
@media(min-width:1024px){
.expert_service_block .expert_service_row{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:3.34rem 2.938rem 3rem;margin-bottom:5rem;}
}
.expert_service_block .expert_service_row:last-child .s_icon{right:17.9rem;}
.expert_service_block .expert_service_row.violet_red_theme .s_icon{right:auto;left:6.4rem;}
@media(min-width:1024px){
.expert_service_block .expert_service_row.violet_red_theme .s_icon{left:17.4rem;}
}
.expert_service_block .expert_service_row.eastern_blue_theme .s_icon{right:11.3rem;}
@media(min-width:1024px){
.expert_service_block .expert_service_row.eastern_blue_theme .s_icon{right:28.7rem;}
}
.expert_service_block .expert_service_row h3{text-transform:uppercase;line-height:1.2em;margin:0 0 3.45rem;}
@media(min-width:1024px){
.expert_service_block .expert_service_row h3{margin:0;}
}
.expert_service_block .expert_service_row .s_icon{position:absolute;right:2.6rem;top:-1.6rem;padding:0 1.3rem;background:#fff;}
@media(min-width:1024px){
.expert_service_block .expert_service_row .s_icon{right:1.3rem;}
}
@media(min-width:1024px){
.expert_service_block .expert_service_row .es_col{width:12.5rem;}
}
@media(min-width:1024px){
.expert_service_block .expert_service_row .es_col.es_col_heading{width:17rem;}
}
.expert_service_block .expert_service_row .es_col p{margin:0 0 3.5rem;}
@media(min-width:1024px){
.expert_service_block .expert_service_row .es_col p{margin:0;line-height:1.55em;}
}
.get-in-touch{padding:1.6rem 0 5.5rem;}
@media(min-width:1024px){
.get-in-touch{text-align:center;padding:0 0 5.5rem;}
}
.get-in-touch h2{margin:0 0 3.2rem;}
@media(min-width:1024px){
.get-in-touch p{margin:0;}
}
.get-in-touch .text-center{padding:5.2rem 0 0;}
@media(min-width:1024px){
.get-in-touch .text-center{padding:5.5rem 0 0;}
}
.get-in-touch .text-center .btn{font-size:1.2rem;padding:0.9rem 2.2rem;}
.get__section{width:100%;padding:0 0 3rem;}
@media(min-width:1024px){
.get__section{padding:0 0 8rem;}
}
@media(min-width:1024px){
.get__section .section_title{padding-bottom:3.9rem;}
}
@media(min-width:1024px){
.get__section .container{width:84.5rem;position:relative;right:-21px;}
}
@media(min-width:1024px){
.get__section .row{margin-left:-1.875rem;margin-right:-1.875rem;}
}
.get__section .row > div{padding-bottom:3.75rem;}
@media(min-width:1024px){
.get__section .row > div{padding-left:1.875rem;padding-right:1.875rem;padding-bottom:0;}
}
.get__box{width:100%;border:0.188rem solid transparent;line-height:1.55em;height:100%;padding:2.7rem 2.7rem;}
@media(min-width:1024px){
.get__box{padding:3.15rem 2.9rem;}
}
.get__box.violet-red-theme{border-color:#BD0054;}
.get__box.eastern-blue-theme{border-color:#339BAE;}
.get__box.grey-blue-theme{border-color:#6C91AA;}
.get__box.fade-blue-theme{border-color:#6B89AD;}
.get__box.cyan-blue-theme{border-color:#12427C;}
.get__box h3{text-transform:uppercase;margin:0 0 2.8rem;}
.get__box p{margin:0 0 2.1rem;}
@media(min-width:1024px){
.get__box .btn{padding:1.1rem 1.3rem;font-size:1.25rem;}
}
.get__box .contact-info{width:100%;padding:0;}
.get__box .contact-info li{display:inline-block;background-position:center left;background-repeat:no-repeat;background-size:1.3rem;padding:0.6rem 0 0.6rem 2rem;font-size:1.6rem;line-height:normal;width:100%;}
@media(min-width:480px){
.get__box .contact-info li{background-size:1.6rem;padding:1rem 0 1rem 2.5rem;}
}
@media(min-width:640px){
.get__box .contact-info li{background-size:1.9rem;padding:1.1rem 0 1.1rem 3rem;}
}
@media(min-width:1024px){
.get__box .contact-info li{padding:0.8rem 0 1.4rem 3.8rem;background-position:0px 1rem;}
}
.get__box .contact-info li.mail-info{background-image:url(../img/contact-mail-dark.svg);}
.get__box .contact-info li.tel-info{background-image:url(../img/contact-phone-dark.svg);}
.get__box .contact-info li.location-info{background-image:url(../img/contact-address-dark.svg);font-size:1rem;}
.get__box .contact-info li a:hover{color:#339BAE;}
.cookie-policy__section{width:100%;padding:0 0 5rem;}
@media(min-width:1024px){
.cookie-policy__section .container{width:49.5rem;}
}
.cookie-policy__section .section_title{padding-bottom:2rem;}
@media(min-width:1024px){
.cookie-policy__section .section_title{padding-bottom:3.5rem;}
}
.cookie-policy__box{width:100%;padding:1.6rem 0 0rem 4rem;position:relative;}
@media(min-width:1024px){
.cookie-policy__box{padding:1.6rem 0 0rem 5.8rem;}
}
.cookie-policy__box::before{position:absolute;content:'';width:2.25rem;height:2.25rem;background-color:#339BAE;left:0;top:2rem;}
@media(min-width:1024px){
.cookie-policy__box::before{top:1.8rem;}
}
.cookie-policy__box.eastern-blue-theme::before{background-color:#339BAE;}
.cookie-policy__box.violet-red-theme::before{background-color:#BD0054;}
.cookie-policy__box.cyan-blue-theme::before{background-color:#12427C;}
.cookie-policy__box.pink-theme::before{background-color:#DD5E98;}
.cookie-policy__box.velvet-theme::before{background-color:#740E42;}
.cookie-policy__box.fade-blue-theme::before{background-color:#6B89AD;}
.cookie-policy__box.grey-blue-theme::before{background-color:#6C91AA;}
.cookie-policy__box h2{font-family:'FuturaPTWebBold';font-weight:normal;font-style:normal;text-transform:uppercase;margin:0 0 2.6rem;}
.key-note__section{padding:0 0 2rem 0;}
@media(min-width:1024px){
.key-note__section{padding:0 0 9rem 0;}
}
.key-note-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;}
.key-note-flex .key-note-rp{width:100%;position:relative;padding-left:2.188rem;padding-right:0;margin-bottom:4rem;max-width:100%;margin-left:0rem;}
@media(min-width:1024px){
.key-note-flex .key-note-rp{max-width:22.75rem;}
}
@media(min-width:1280px){
.key-note-flex .key-note-rp{margin-left:2.81rem;}
}
.key-note-flex .key-note-rp:nth-child(2){margin-top:0;}
@media(min-width:1024px){
.key-note-flex .key-note-rp:nth-child(2){margin-top:2.5rem;}
}
.key-note-flex .key-note-rp:nth-child(even){margin-left:3rem;}
.key-note-flex .key-note-rp:before{content:"";position:absolute;left:0;top:0;background:#12427C;width:3px;height:100%;}
.key-note-flex .key-note-rp__violet-red:before{background-color:#BD0054;}
.key-note-flex .key-note-rp__eastern-blue:before{background-color:#339BAE;}
.key-note-flex .key-note-rp__pink:before{background-color:#DD5E98;}
.key-note-flex .key-note-rp__grey-blue:before{background-color:#6C91AA;}
.key-note-flex .key-note-rp h2{font-size:1.8rem;color:#000;text-transform:uppercase;margin:0 0 1.7rem 0;font-family:'FuturaPTWebBold';font-weight:normal;font-style:normal;width:90%;}
.key-note-flex .key-note-rp p{margin-bottom:0;line-height:1.5;max-width:98%;}
@media(min-width:1024px){
.key-note-flex .key-note-rp p{max-width:16.93rem;}
}
.team-section{margin-bottom:5rem;}
.team-section .section_title{max-width:54.12rem;margin:0 auto;}
.team-section .section_title h2{margin-bottom:2.81rem;}
.team-section .team-listing{padding-top:2.18rem;}
.team-section .team-listing h2{text-align:center;margin-bottom:4.06rem;}
.team-section .team-row{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;}
.team-section .team-row .team-column{width:100%;max-width:100%;border:3px solid #12427C;padding:2rem;margin:0 0 35px 0;}
@media(min-width:768px){
.team-section .team-row .team-column{width:48%;margin:0 1%;}
}
@media(min-width:1024px){
.team-section .team-row .team-column{margin:0 2rem;max-width:32.18rem;width:100%;padding:3rem;}
}
.team-section .team-row .team-column .team-photo{margin-bottom:3rem;}
@media(min-width:1024px){
.team-section .team-row .team-column .team-photo{margin-bottom:3.6rem;}
}
.team-section .team-row .team-column h2{font-family:'FuturaPTWebBold';font-weight:normal;font-style:normal;text-align:left;font-size:2.2rem;text-transform:uppercase;margin:0 0 7px 0;width:90%;line-height:1.2;min-height:6rem;}
@media(min-width:1024px){
.team-section .team-row .team-column h2{font-size:2.5rem;min-height:6.06rem;}
}
.get-in-touch{text-align:center;margin-top:0;}
@media(min-width:1024px){
.get-in-touch{margin-top:4rem;}
}
@media(min-width:1024px){
}
@media(min-width:480px){
}
@media(min-width:1024px){
}
.error-404{min-height:calc(100vh - 45.18rem);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:7rem 0 10rem;text-align:center;}
@media(min-width:1024px){
.error-404{min-height:calc(100vh - 30.18rem);}
}
.error-404 .container{width:36rem;}
.error-404 h2{text-transform:uppercase;font-family:'FuturaPTWebBold';font-weight:normal;font-style:normal;margin:0 0 1.5rem;}
@media(min-width:1024px){
.error-404 h2{font-size:2.4rem;}
}
.error-404 p{margin:0 0 2rem;}
.wp-block-details{width:100%;margin:0 0 1.5rem;padding:0 1.25rem 0px;background:#f5f5f5;border:1px solid #e5e5e5;}
.wp-block-details summary{width:auto;padding:1.125rem;list-style:none;margin:0 -1.25rem 0;position:relative;font-family:'FuturaPTWebMedium';font-weight:normal;font-style:normal;font-size:1.125rem;}
@media(min-width:768px){
.wp-block-details summary{font-size:1.25rem;}
}
.wp-block-details summary::before, .wp-block-details summary::after{position:absolute;content:'';background-color:#12427C;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-transition:all 0.5s;transition:all 0.5s;}
.wp-block-details summary::before{width:0.75rem;height:0.125rem;right:1.25rem;}
.wp-block-details summary::after{width:0.125rem;height:0.75rem;right:1.563rem;}
.wp-block-details[open] summary{margin-bottom:0.625rem;}
.wp-block-details[open] summary::after {
height: 0px;
}


/* Hand-written. Not generated, never wiped by tools/make-src.py.
   Appended to the theme stylesheet by build.py. */

/* --- the menu, without JavaScript -------------------------------------
   The theme parked .site-menu at top:-150% and let a script bring it back.
   A checkbox does the same thing, works with the keyboard, and needs no
   script at all. The checkbox is the first element in <body>, so the
   general sibling selector reaches the menu. */

.menu-toggle { position: absolute; opacity: 0; pointer-events: none; }
.menu-toggle:checked ~ .site-menu { top: 0; }
.menu-toggle:focus-visible ~ .site-header .hamburger-menu {
  outline: 3px solid #BD0054;
  outline-offset: 4px;
}
.hamburger-menu, .site-menu .close-menu { cursor: pointer; }

/* Stop the page behind the overlay from scrolling while it is open. */
.menu-toggle:checked ~ .site-menu { overscroll-behavior: contain; }

/* --- the tagline ------------------------------------------------------
   It used to be an <h1> in the header, which meant all 34 pages shared one
   heading and the real subject of each page sat in an <h2>. It is a
   tagline, so it is marked up as one; the page heading is now the H1.

   tools/make-src.py moves the theme's own .site-header .logo h1 rules onto
   .site-header .logo .tagline, so all four breakpoints follow the element.

   One rule has to be restated. The theme sets line-height on the heading
   elements, and body carries line-height:1.18em — an em value, which children
   inherit as a computed length rather than as a ratio. A <p> at 2.5rem would
   therefore inherit roughly 19px of leading and the lines would overlap. */

.site-header .logo .tagline { line-height: 1.1em; }

/* --- skip link -------------------------------------------------------- */

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  padding: 0.75rem 1.25rem;
  background: #fff;
  color: #000;
}
.skip-link:focus { left: 0; }

/* --- prose: the disclaimer, privacy statement and email disclaimer ---- */

.dafualt-content .prose {
  max-width: 46rem;
  margin: 0 auto;
  padding: 3rem 0 5rem;
}
.dafualt-content .prose h1 { margin: 0 0 2rem; }
.dafualt-content .prose h2 { margin: 2.5rem 0 0.75rem; }
.dafualt-content .prose h3 { margin: 1.75rem 0 0.5rem; }
.dafualt-content .prose p  { margin: 0 0 1rem; line-height: 1.6; }
.dafualt-content .prose li { margin: 0 0 0.5rem; line-height: 1.6; }

/* Long words — URLs, German compounds — must not push the box open. */
.dafualt-content .prose { overflow-wrap: break-word; }
html[lang="de"] .dafualt-content .prose { hyphens: auto; }

/* --- long words must not leave their box ------------------------------
   The theme was laid out around English headings. Dutch, German and Czech
   compounds are longer — "TOEKOMSTBESTENDIGE SOFTWAREONTWIKKELING" runs
   straight over the column beside it.

   Headings get hyphens:auto as well. It only takes effect on a word that
   does not fit, and a hyphenated break reads far better than the mid-word
   cut break-word gives on its own — "TOEKOMSTBESTEN / DIGE". This is for
   headings in narrow columns only; running text is left alone. */

/* Nothing here hyphenates. hyphens:auto does not wait for an overflow — it
   splits words whenever that balances a line better, so headings came out as
   TOEKOMSTBESTEN-DIGE and DEVELOP-MENT on pages where every word fitted.
   A heading is words that matter; the type has to fit the box instead.

   The row is 1212px wide and used 978 of it: icon 106, heading 272, three
   columns of 200. The heading column was simply too narrow for the longest
   word in any language — "softwareontwikkeling" needs 384px at 30px — while
   234px sat unused beside it. Widening it costs nothing and breaks no word. */

/* This rule spent its life losing. The theme says

       .expert_service_block .expert_service_row .es_col.es_col_heading

   which is four classes, and it was answered with two — so the column stayed
   at 17rem and "softwareontwikkeling" ran over the text beside it at every
   width from 1024px up. Specificity is not decided by which rule comes last.
   Matching the theme's selector exactly is what makes it apply. */

@media (min-width: 1024px) {
  .expert_service_block .expert_service_row .es_col.es_col_heading {
    width: 25rem;
  }
}

/* hyphens:manual, not none. Automatic hyphenation stays off for the reason
   above; manual keeps the soft hyphens SOFT_BREAK puts in the five compounds
   that cannot be made to fit. A word without one still never breaks. */

.es_col_heading h3,
.key-note-rp h2,
.service_Cl h3,
.card_Cl__inner h3,
.section_title h1,
.section_title h2 {
  hyphens: manual;
  overflow-wrap: normal;
}

/* Names are not words. "Oorthuizen" must never come back as "Oorthui-zen",
   in any language and at any width, so the team headings are excluded from
   the rule above and say so explicitly rather than relying on not matching. */

.team-column h2 {
  hyphens: none;
  overflow-wrap: normal;
  word-break: keep-all;
}

/* The two photographs are 404x256 and 404x253. Three pixels is enough to push
   one column below the other, so both are given the same shape and the taller
   one is cropped rather than letting the layout drift. */

.team-photo img {
  width: 100%;
  height: auto;
  aspect-ratio: 404 / 253;
  object-fit: cover;
}

/* The quote sits between the job title and the biography. The two quotes are
   different lengths, so without a floor the biographies below them start a
   line apart. Two lines of room keeps the columns level. */

.team-column h3 + p { min-height: 2.6em; }

/* --- addresses -------------------------------------------------------- */

address { font-style: normal; }

/* --- language switch -------------------------------------------------- */

.site-menu .menu-item-language a.current-language {
  font-family: 'FuturaPTWebBold', sans-serif;
  font-weight: normal;
}

/* --- images ----------------------------------------------------------- */

img { max-width: 100%; height: auto; }

/* --- the email disclaimer ---------------------------------------------
   Four languages on one page, because the reader did not choose the
   language — an email signature did. The jump list is the first thing they
   see, and each language is separated so nobody reads past their own. */

.lang-jump {
  margin: 0 0 2.5rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid #d8d8d8;
  font-family: 'FuturaPTWebBold', sans-serif;
  letter-spacing: 0.04em;
}

.prose section[lang] + section[lang] {
  margin-top: 3.5rem;
  padding-top: 2.5rem;
  border-top: 1px solid #d8d8d8;
}

.prose section[lang] h2 { margin-bottom: 1.5rem; }

/* --- 404 and 410 ------------------------------------------------------
   The old WordPress site had one page whose design was right, and it was
   the error page: a heading in the display face, one sentence saying what
   happened, and a single black button out. The static site's first attempt
   was the bare word "404" over a link, which reads as a broken page rather
   than a designed one.

   This borrows the geometry the homepage already uses — .section_title
   .text-center for the heading, .btn for the way out — so an error looks
   like part of the site instead of an escape from it. */

.error_section {
  width: 100%;
  padding: 4rem 0 5rem;
}
@media (min-width: 1024px) {
  .error_section { padding: 7rem 0 9rem; }
}
.error_section .section_title { padding-bottom: 1.8rem; }

.error_body {
  max-width: 40rem;
  margin: 0 auto;
}
.error_body p { margin: 0 0 1rem; line-height: 1.6; }
.error_body .error_cta { margin: 2.6rem 0 0; }

/* --- colour on the prose pages ----------------------------------------
   The homepage states the palette in six card borders; the legal pages
   used none of it, so the site read as two designs sharing a footer. Each
   section heading gets a rule in one of the six, cycling in the order the
   cards use. It is the same idea the old cookie policy had with its
   coloured squares, minus the arbitrariness — here the colour marks where
   a section starts and nothing else.

   The bar is drawn with a border rather than a pseudo-element so it never
   affects the text's position, and it sits on h2 only: h3 is a subheading
   within a section, not a new one. */

.dafualt-content .prose h2 {
  padding-left: 1rem;
  border-left: 0.25rem solid #6C91AA;
}
.dafualt-content .prose h2:nth-of-type(6n+1) { border-left-color: #12427C; }
.dafualt-content .prose h2:nth-of-type(6n+2) { border-left-color: #339BAE; }
.dafualt-content .prose h2:nth-of-type(6n+3) { border-left-color: #6C91AA; }
.dafualt-content .prose h2:nth-of-type(6n+4) { border-left-color: #BD0054; }
.dafualt-content .prose h2:nth-of-type(6n+5) { border-left-color: #740E42; }
.dafualt-content .prose h2:nth-of-type(6n+6) { border-left-color: #DD5E98; }

/* The email disclaimer is four languages stacked, not one argument in six
   parts. Its h2 is a language name, so a colour bar there would mark a
   boundary the horizontal rule already marks. */
.prose section[lang] h2 { padding-left: 0; border-left: 0; }

/* --- the footer had a third of the screen under it ----------------------
   Measured on an iPad Pro in portrait, 1024x1366: the black footer ended at
   1005px and the white body showed through for the remaining 361. Five pages
   are shorter than that screen — the two homepages, get-in-touch and both
   disclaimers — and every one of them ended in a white band.

   The fix is the ordinary one: the body is a column at least as tall as the
   viewport, and main takes the slack, so the footer sits on the bottom edge
   when a page is short and flows normally when it is long. The menu is
   position:fixed and the skip link and the menu checkbox are absolute, so
   none of the three is in the flow this touches.

   100dvh as well as 100vh: on iOS Safari, vh is the height with the address
   bar hidden, which is not the height you are looking at. */

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
}
body > main { flex: 1 0 auto; }
body > .site-footer { flex-shrink: 0; }

/* --- the cards said half of what they had -------------------------------
   Each card carries a heading and a second line: "Big Data solutions" over
   "Turn YOUR Data into Decisions". The heading names the category; the line
   underneath says what it does for the reader. The theme swapped them on
   hover — and hover does not exist on a touch screen, so eighteen lines of
   copy across three languages never reached a phone or an iPad.

   The checkbox is the same device as the menu: no script, works with the
   keyboard, and the label makes the whole card the target.

   Two conditions, and the second was missing at first. A pointer that cannot
   hover, so a mouse keeps the behaviour it had and a stray click does not
   latch a card open — and 1024px and up, because that is where the theme
   hides the second line. Below 1024 it shows both at once, so the swap has
   nothing to reveal: tapping only took the heading away and left the reader
   with less than they started with. Thierry saw it on a phone; rendered
   side by side with the tablet, both did the same wrong thing. */

@media (hover: none) and (min-width: 1024px) {
  .card_section__inner .card-toggle:checked + .card_Cl__inner h3 {
    opacity: 0;
    visibility: hidden;
  }
  .card_section__inner .card-toggle:checked + .card_Cl__inner .hover_text {
    opacity: 1;
    visibility: visible;
    color: #ffffff !important;
  }
  .card-toggle:checked + .card_Cl__inner.cyan_blue_theme   { background: #12427C; }
  .card-toggle:checked + .card_Cl__inner.eastern_blue_theme { background: #339BAE; }
  .card-toggle:checked + .card_Cl__inner.grey_blue_theme   { background: #6C91AA; }
  .card-toggle:checked + .card_Cl__inner.violet_red_theme  { background: #BD0054; }
  .card-toggle:checked + .card_Cl__inner.velvet_theme      { background: #740E42; }
  .card-toggle:checked + .card_Cl__inner.pink_theme        { background: #DD5E98; }
}

/* A label is not a button, so say that it can be pressed. */
.card_Cl__inner { cursor: pointer; }
.card-toggle:focus-visible + .card_Cl__inner {
  outline: 3px solid #BD0054;
  outline-offset: 4px;
}

/* --- the dip at 1024 ---------------------------------------------------
   Every size in this stylesheet is a rem, so the root decides all of them at
   once. The theme sets it per breakpoint, and measured it runs:

       phone  12px    640  16px    1024  13px    1280  16px

   1024 is exactly an iPad Pro held upright, and there the whole page drops to
   13px to squeeze a layout drawn for 1200 into 1024. Everything shrinks by a
   fifth — so a card heading that was 40px at 768 lands at 24, and the text
   beside it with it. That is what makes the page read as top-heavy on a
   tablet: not headings that are too large, but everything after them that is
   too small, and then large again at 1280.

   16px through that range instead. Measured at 1024, 1100, 1180 and 1279:
   nothing overflows at 13, 14, 15 or 16, so the dip was never buying width.
   An earlier attempt set the root everywhere and did cause two pixels of
   overflow — that came from flattening 640 and 768, which the theme already
   had right, not from this range. */

@media (min-width: 1024px) and (max-width: 1279px) {
  html { font-size: 16px; }
}

/* --- the footer on a phone ---------------------------------------------
   The address, the email address and the telephone number came out at 12px:
   the three things somebody opens this site on a phone to find. Stated in
   pixels rather than rem, because the root is 12px here and a rem would have
   to be read against a number that changes at every breakpoint. */

@media (max-width: 639px) {
  .site-footer,
  .site-footer address,
  .site-footer .contact-info a,
  .site-footer__menu a { font-size: 15px; }
}

/* --- the card heading between 640 and 1024 ------------------------------
   The theme sets h3 to 2.5rem from 640px up, and to 1.875rem from 1024. At
   root 16 that is 40px and then 30px — but between 640 and 1023 the cards
   are one per row, full width, so a 40px heading sits alone across the whole
   screen with a 22px paragraph above it. Measured on a 768px tablet that is
   what reads as a heading shouting.

   From 1024 the same cards are three abreast and 30px is right, so the
   number that works is already in the theme; it just starts too late. This
   moves it down to 640, which makes the whole scale monotonic:

       phone 25   ·   640-1023 30   ·   1024+ 30

   Four classes deep, to answer the theme's own generic h3 rule. */

@media (min-width: 640px) and (max-width: 1023px) {
  .card_section__inner .card_Cl .card_Cl__inner h3 { font-size: 1.875rem; }
  .card_section__inner .card_Cl .card_Cl__inner .hover_text { font-size: 1.375rem; }
}

/* --- the body text on a phone -------------------------------------------
   Measured at 393px on every page: headings between 23 and 26px, and the
   text under them 12. On a desktop the same paragraphs are 16. So the copy
   is a quarter smaller on the device held closest to the eye, which is
   backwards, and the ratio of heading to paragraph runs to 2.17 on the team
   page — a heading twice the size of what it introduces.

   The cause is the theme's 12px root at this width, and raising the root was
   tried and rejected: at 16 the paragraphs come right but the headings go to
   34, which is the fault this is meant to fix. So the copy is lifted on its
   own and the headings stay where they are. 25 over 16 is 1.56, which reads.

   In pixels, deliberately. The root here is 12 and every rem would have to be
   read against a number that changes at the next breakpoint.

   The tagline is excluded: it is a <p> by markup but a heading by meaning,
   set beside the logo where 16px would crowd the mark. */

@media (max-width: 639px) {
  .dafualt-content .prose p,
  .dafualt-content .prose li,
  .es_col p,
  .team-column p,
  .section_title p,
  .key-note-rp p,
  main p:not(.tagline),
  main li { font-size: 16px; line-height: 1.55; }
}

/* --- the card's second line on a phone ----------------------------------
   The heading and the line under it came out 25 and 22 below 640px: a ratio
   of 1.14, which is no hierarchy at all. The two read as one block of shouting
   capitals, and on a phone both are shown at once — the theme only hides the
   second line from 1024 up.

   The tablet range was already put right at 30 over 22, a ratio of 1.36. This
   gives the phone the same relationship from the other side: the heading stays
   where it is and the line under it comes down. */

@media (max-width: 639px) {
  .card_section__inner .card_Cl .card_Cl__inner .hover_text { font-size: 18px; }
}