/*font-families*/
.helvetica, header .navigation ul a, .sidebar .adress p, .sidebar .sidebarlinks p, .sidebar .logo p, .lead { font-family: 'Helvetica'; }
.arial, html, body { font-family: 'Arial', sans-serif; }

/*font-sizes*/
.size-11, .small { font-size: 11px; }
.size-13, html, body { font-size: 14px; }
.size-15, header .navigation ul a, .sidebar .adress p, .sidebar .sidebarlinks p, h2, h3 { font-size: 15px; }
.size-17, .imageDescription .occupation { font-size: 17px; }
.size-20, .imageDescription .name, h1 { font-size: 20px; }
.size-25, .lead { font-size: 25px; }

/*line-heights*/
.height-14, .small { line-height: 14px; }
.height-16, html, body { line-height: 16px; }
.height-18, header .navigation ul a { line-height: 18px; }
.height-20, h2, h3, .imageDescription .occupation { line-height: 20px; }
.height-24, .imageDescription .name { line-height: 24px; }
.height-30, .lead { line-height: 30px; }
.height-36, h1 { line-height: 36px; }

/*font-variants*/
.lead, .sidebar .imageDescription p, header .navigation ul a, .sidebar .sidebarlinks p, .sidebar .adress p, footer .sidebarlinks p, footer .adress p { font-variant: small-caps; }

/*font-weights*/
h1, h2, h3 { font-weight: 400; }
.bold { font-weight: 700; }

/*colors*/
.color.white, header .navigation ul a { color: #fff; }
.color.orange, header .navigation ul a:hover, header .navigation ul a.active, .sidebar a:hover, footer .sidebarlinks a:hover { color: #E97117; }
.color.blue, .lead, .sidebar .imageDescription p, .sidebar .sidebarlinks p, .sidebar a, .sidebar .adress p, footer .sidebarlinks p, footer .sidebarlinks a, footer .adress p { color: #006268; }

.main a { color: inherit; text-decoration: none; } 

.background.white, header .navigation ul a:hover, header .navigation ul a.active { background-color: #fff; }
.background.orange { background-color: #E97117; }
.background.blue { background-color: #006268; }

/*effects*/
header .navigation ul a, .sidebar a, footer .sidebarlinks a, header { transition: all .4s ease-out; }

/*grids*/
.grid > .row { display: flex; }
.grid_25_25_25_25 > .row > .col { flex-basis: 25%; max-width: 25%; }
.grid_30_30_30 > .row > .col { flex-basis: calc(100% / 3); max-width: calc(100% / 3); }
.grid_30_70 > .row > .col_30 { flex-basis: 30%; max-width: 30%; }
.grid_30_70 > .row > .col_70 { flex-basis: 70%; max-width: 70%; }
.grid_20_80 > .row > .col_20 { flex-basis: 20%; max-width: 20%; }
.grid_20_80 > .row > .col_80 { flex-basis: 80%; max-width: 80%; }
.grid_50_50 > .row > .col { flex-basis: 50%; max-width: 50%; }

.hallux .grid > .row { justify-content: space-between; align-items: flex-end; }
.hallux .col_30_1, .hallux .col_30_3 { display: flex; flex-direction: column; }
.hallux .col_30_1 img, .hallux .col_30_3 img { object-fit: contain; }
.hallux .col_30_2 img { object-fit: contain; width: 100%; height: auto; }

body { margin: 0; padding: 0; background-image: url("../images/iStock-589424456.jpg"); background-size: cover; background-repeat: no-repeat; background-attachment: fixed; position: relative; }
.main { margin: 240px 0 50px 18.5%; max-width: 875px; padding-right: calc(18.5vw + 300px); }
header { position: fixed; top: 0; left: 0; right: 0; display: flex; align-items: end; padding-top: 110px; padding-bottom: 20px; background-color: rgba(0, 157, 166, 0.9); z-index: 1; }
header.opaque { background-color: rgb(0, 157, 166); }
header .navigation { flex-basis: 100%; max-width: 100%; }
header .navigation ul { list-style-type: none; text-align: right; padding-right: calc(18vw + 300px); padding-left: 0; }
header .navigation ul li { display: inline-block; }
header .navigation ul a { text-decoration: none; padding: 15px 5px; margin: 0 5px; border-radius: 10px; }
.sidebar { background-color: rgba(255,255,255,0.5); position: fixed; top: 0; bottom: 0; right: 15%; width: 300px; padding: 15px 20px 0; z-index: 2; }
.sidebar .logo { display: flex; align-items: flex-end; }
.sidebar .logo img { border: 2px solid #E97117; }
.sidebar .sidebarlinks, footer .sidebarlinks { margin-bottom: 35px; }
.sidebar a, footer .sidebarlinks a { text-decoration: none; }
.sidebar .imageDescription p { margin: 0 0 0 20px; }
.gradientOverlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(180deg, transparent, white 75%); z-index: -1; }
.main ul { list-style-type: none; }
h2 { text-transform: uppercase; font-size: 17px;  font-weight: bold;}
h3 { position: relative; padding-left: 20px; text-transform: uppercase;  font-weight: bold; }
h3::after { content: ''; width: 5px; height: 5px; background-color: orange; display: block; position: absolute; left: 5px; top: 8px;  font-weight: bold; }

.home header { display: flex; align-items: end; padding-top: 20px; padding-bottom: 20px; background-color: rgba(0, 157, 166, 0.9); margin-bottom: 20px; position: fixed; top: 0; left: 0; right: 0; } */


.home .sidebar { background-color: rgba(255,255,255,0.5); position: fixed; top: 0; bottom: 0; right: 15%; width: 300px; padding: 45px 20px 0; }
.home .sidebar .logo { display: flex; align-items: flex-end; margin-bottom: 170px; }
.home .sidebar .logo img { border: 2px solid #E97117; }
.home .main { padding-right: calc(18.5vw + 300px); height: auto; border-top: 20px solid #fff; background-color: rgba(178,225,228,0.5); margin: 345px 0 0; max-width: none; padding-bottom: 50px; text-align: left; }
.home .main p:not(.lead) { padding-left: 15%; }

.office p + img { margin-bottom: 20px; width: 100%; }

footer, .small.mobile { display: none; }