/* ---------------------------
   CSS Reset - http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   --------------------------- */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}*,*:after,*:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}

section.breadcrumb { border-bottom: 1px solid #DDD }
section.breadcrumb ul { display: block; width: 1380px; margin: 0 auto }
section.breadcrumb ul::after { content: ""; display: table; clear: both }
section.breadcrumb ul li { float: left }


@media (max-width: 1380px) {
    section.breadcrumb ul { width: 100%; padding-left: 40px; padding-right: 40px }
}
@media (max-width: 768px) {
    section.breadcrumb ul { padding-left: 15px; padding-right: 15px }
}

/* Universal */
body {
    font-family: 'Quire Sans W04', sans-serif;
    font-weight: 300;
    font-size: 12.5px;
    font-feature-settings: "liga" 1, "lnum" 1;
    -webkit-font-smoothing: subpixel-antialiased;
}

body.no-scroll { overflow: hidden }
.clearfix::after { content: ""; display: table; clear: both }

a { color: inherit; text-decoration: none }
button { font-family: 'Quire Sans W04', sans-serif; font-weight: 600 }

h2 {
    font-size: 2.1rem;
    line-height: 1.1em;
    letter-spacing: -0.01rem;
}

h3 {
    font-size: 1.7rem;
    line-height: 1.4em;
}

h4 {
    font-size: 1.15rem;
    font-weight: 600;
}

p {
    color: #333;
    font-family: 'Maison Neue', sans-serif;
    font-size: 1rem;
    font-feature-settings: "liga" 1, "clig" 1, "calt" 1;
    line-height: 1.6em
}

b { font-weight: 700 }

.btn {
    display: inline-block;
    font-weight: 400;
    transition: all .5s;
}

.btn.link-white a { border-bottom: 1px solid #FFF; color: #FFF }

.btn a { display: block; position: relative; font-size: 20px; padding: 7px 0 6px 0; margin-bottom: 4px; transition: all .3s }
.btn a:after { content: ''; position: absolute; top: 11px; right: -24px; width: 16px; height: 16px; background-size: contain; background-repeat: no-repeat; transition: all .3s }
.btn.link-white a:after { background-image: url('../img/ui_icons/link_in_white.svg') }
.btn.link-white.out a:after { background-image: url('../img/ui_icons/link_out_white.svg') }

.btn.link-black a { border-bottom: 1px solid #000 }
.btn.link-black a:after { background-image: url('../img/ui_icons/link_in_white.svg'); filter: invert(100%) }
.btn.link-black.out a:after { background-image: url('../img/ui_icons/link_out_white.svg'); filter: invert(100%) }

.btn:hover a { padding: 7px 0 10px 0; margin-bottom: 0 }
.btn:hover a:after { right: -32px }

.btn-big {
    display: table;
    border-radius: 7px;
    background: #273894;
    color: #FFF;
    font-size: .95rem;
    line-height: 1.9em;
    letter-spacing: 0.4px;
    text-shadow: 0 0 .5px rgba(255, 255, 255, 0.7);
    padding: 9px 18px 10px 18px;
    transition: all .2s ease-out;
}

.btn-big:hover { background: #1C296C; box-shadow: 0 0 3pt 2pt cornflowerblue }

.anim_slidein { opacity: 0; transform: translateY(30px) }
.anim_slidein.visible { opacity: 1; transform: translateY(0px); transition: all 1s ease-in-out }

/* Components */
.action-card {
    display: flex;
    position: relative;
    width: 100%;
    height: 270px;
    border-radius: 8px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 30px 30px 20px 30px;
    flex-direction: column;
}

.action-card::after {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background: linear-gradient(45deg, #000, rgba(0, 0, 0, 0) 75%);
    z-index: 0; 
}

.action-card > * { z-index: 1 }
.action-card h3 { color: #FFF }
.action-card h3.half { width: 60% }
.action-card .link-btm { color: #007bff; text-decoration: none; align-self: flex-start; margin-top: auto }

.mini-action-cards {
    display: block;
    border-radius: 5px;
    border: 1px solid #DDD;
    background: #FFF;
    padding: 35px 30px 27px 30px;
}

.mini-action-cards:hover { border-color: #999 }

.mini-action-cards span {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    height: 4.5em;
    line-height: 1.6em;
    color: #333;
    font-family: 'Maison Neue', sans-serif;
    font-size: .85rem;
    -webkit-line-clamp: 3;
    margin-top: 10px;
    overflow: hidden;
}

.mini-action-cards i {
    display: block;
    position: relative;
    width: 28px;
    height: 28px;
    border-radius: 100%;
    border: 1.5px solid #ED7D31;
    margin-top: 20px;
}

.mini-action-cards i::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: url('../img/ui_icons/link_in_white.svg') no-repeat center center / 70%;
    filter: invert(100%) invert(62%) sepia(82%) saturate(2253%) hue-rotate(346deg) brightness(97%) contrast(95%);
}

.mini-action-cards:hover i { border-color: #273894; background: #273894 }
.mini-action-cards:hover i::after { filter: unset }

/* Breadcrumbs */
section.breadcrumb { width: 100%; border-bottom: 1px solid #DDD }
section.breadcrumb.top-padded { margin-top: 58px }
section.breadcrumb ul { position: relative; width: 1280px; margin: 0 auto }
section.breadcrumb ul::after { content: ""; display: table; clear: both }
section.breadcrumb ul li {
    font-family: 'Maison Neue', sans-serif;
    line-height: 3.3em;
    font-size: 0.88rem;
    font-weight: 600;
    margin-top: 3px;
    float: left;
}
section.breadcrumb ul li + li::before {
    content: '';
    position: relative;
    display: inline-block;
    top: -.5px;
    width: 8px;
    height: 8px;
    border-top: 1px solid currentColor;
    border-right: 1px solid currentColor;
    transform: rotate(45deg);
    margin: 0 17px 0 12px;
}
section.breadcrumb ul li a { font-weight: 300 }

@media (max-width: 1380px) {
    section.breadcrumb { overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none }
    section.breadcrumb ul { width: 100%; padding-left: 40px; padding-right: 40px; white-space: nowrap }
    section.breadcrumb ul li { display: inline-block; line-height: 3.2em; font-size: 0.8rem; float: none }
    section.breadcrumb ul li:last-child { padding-right: 45px }
}

@media (max-width: 768px) {
    section.breadcrumb ul { padding-left: 15px; padding-right: 15px }
    section.breadcrumb ul li:last-child { padding-right: 15px }
}

/* Navigation */
nav {
    display: block;
    position: fixed;
    top: 0; left: 0; right: 0;
    width: 100%;
    height: 58px;
    border-bottom: 1px solid #D4D4D4;
    background: #FFF;
    padding: 0 30px;
    z-index: 9999;
}
nav.static { position: relative }
nav .invert_logo { display: none; position: absolute; top: 15px; left: 50%; transform: translateX(-50%) }
nav img { display: block; width: auto; height: 32px; float: left; margin: 13px 0 0 0 }

nav .right-align { float: right; z-index: 9979 }
nav li { display: block; float: left; padding: 10px 0 8px 0 }
nav li + li { margin-left: 25px }

nav li a {
    cursor: pointer;
    display: block;
    border-bottom: 2px solid transparent;
    color: #222;
    font-size: 1.05rem;
    padding: 10px 0;
    transition: border-color 300ms;
    backface-visibility: hidden;
    transform: translate3d(0, 0, 0);
}

nav li:hover a { border-bottom: 2px solid #273894; color: #273894 }
nav li:last-child { border-radius: 6px; border: 1px solid #AAA; padding: 0; margin-top: 10px; transition: all 300ms; overflow: hidden }
nav li:last-child a { color: #555; padding: 9px 15px 8px 15px; transition: all 300ms }
nav li:last-child:hover a { border-bottom: 2px solid transparent; background: #273894; color: #FFF }
nav li:last-child:hover { border: 1px solid #273894 }

/* Submenu */
#submenu-overlay {
    position: fixed;
    top: 0; left: 0; bottom: 0; right: 0;
    background: rgba(22, 22, 22, 0.2);
    opacity: 0;
    visibility: hidden;
    transition: all .4s ease-out;
    transition-delay: .15s;
    z-index: 9969;
}

#submenu-overlay.active { opacity: 1; backdrop-filter: blur(3px); visibility: visible }

nav li span.title {
    display: block;
    font-size: 13px;
    font-family: 'Maison Neue', sans-serif;
    text-align: left;
    margin-bottom: 15px;
}

nav li .submenu {
    position: absolute;
    top: 58px; left: 0; right: 0;
    width: 100%;
    max-height: 0;
    background: white;
    padding: 0;
    transition: all .4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
    opacity: 0;
    visibility: hidden;
    z-index: 9989
}

nav li .submenu.active { max-height: 500px; opacity: 1; visibility: visible }

nav li .submenu .m-column { width: 40%; border-right: 1px solid #CCC; float: left; padding: 30px 0 30px 25% }
nav li .submenu ul li { display: table; float: none; padding: 0; margin: 5px 0 }
nav li .submenu ul li + li { margin-left: 0 }

nav li .submenu ul li:hover a { color: #ED7D31 }
nav li .submenu ul li a { display: inline-block; border: 0 none; color: inherit; transition: all .2s }
nav li .submenu ul li a span::before,
nav li .submenu ul li a span { color: #555; font-family: 'Maison Neue', sans-serif; font-size: .85rem }
nav li .submenu ul li a span::before { content: "|"; margin-right: 5px }
nav li .submenu ul li a span { margin-left: 6px }
nav li .submenu ul li .arrow { display: inline-block; border: solid #222; border-width: 0 1px 1px 0; vertical-align: 14%; padding: 3.5px; margin-left: 5px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transition: all .2s }
nav li .submenu ul li:hover .arrow { border-color: #ED7D31 }

nav li .submenu ul li:last-child { border: 0 none }
nav li .submenu ul li:last-child a { padding: 10px 0 }
nav li .submenu ul li:last-child:hover a { border: 0 none; background: none; color: #ED7D31 }

nav li .submenu div[class^="subpage-"] {
    position: absolute;
    top: 0; left: 40%; right: 0;
    width: 60%;
    height: 100%;
    background: #FFF;
    opacity: 0;
    visibility: hidden;
    transform: translateX(20px);
    transition: all .2s cubic-bezier(0.215, 0.610, 0.355, 1.000);
    padding: 30px;
}

nav li .submenu div[class^="subpage-"].active { opacity: 1; visibility: visible; transform: translateX(0px); transition: all .4s cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-delay: .2s }
nav li .submenu .mobile-backbtn { cursor: pointer; display: none; color: #FFF; font-family: 'Maison Neue', sans-serif; font-size: 17px; padding: 16px 4% 15px 4% }
nav li .submenu .mobile-backbtn .arrow { display: inline-block; border: solid #FFF; border-width: 0 1.5px 1.5px 0; vertical-align: -4%; padding: 6px; margin-left: 6px; transform: rotate(135deg); -webkit-transform: rotate(135deg) }

/* Navigation Button */
nav .nav_btn {
    display: none;
    cursor: pointer;
    position: absolute;
    top: 13px; right: 3%;
    width: 30px;
    height: 30px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

nav .nav_btn span {
    display: block;
    position: absolute;
    left: 5%;
    width: 90%;
    height: 1px;
    background: #000;
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

nav .nav_btn span:nth-child(1) { top: 6px }
nav .nav_btn span:nth-child(2),
nav .nav_btn span:nth-child(3) { top: 14px }
nav .nav_btn span:nth-child(4) { top: 22px }

nav .nav_btn.open span:nth-child(1) { top: 18px; left: 50%; width: 0% }
nav .nav_btn.open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg) }
nav .nav_btn.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg) }
nav .nav_btn.open span:nth-child(4) { top: 19px; left: 50%; width: 0% }

/* Layout */
.container { width: 1280px; margin: 0 auto }
@media (max-width: 1380px) {
    .container { width: 100%; padding-left: 40px; padding-right: 40px }
}
@media (max-width: 768px) {
    .container { padding-left: 15px; padding-right: 15px }
}

/* Header */
header {
    position: relative;
    width: 100%;
    height: auto;
    background-image: url("../img/W3_03.18.22_BIApplications.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    color: #FFF;
    text-shadow: 0 0 7px rgba(0, 0, 0, 0.5);
    padding: 110px 0 200px 0;
    margin-top: 58px;
}
header.secondary { padding-bottom: 130px; margin-top: 0 }
header.reduced { padding: 120px 0 140px 0 }
header.blank { background-image: none }
header .image {
    position: absolute;
    top: 50%; right: 10%;
    width: 50%;
    height: 300px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transform: translateY(-50%)
}

header .image.half-full {
    top: 0; right: 0;
    height: 100%;
    background-position: right;
    transform: none;
}

header.blank h1,
header.blank p { color: #333; text-shadow: none }

header .logo { position: absolute; top: 20px; left: 2% }
header .logo img { width: auto; height: 40px }

header h1 {
    width: 40%;
    line-height: 1.2em;
    font-size: 42px;
    font-weight: 600;
    margin-bottom: 20px;
}

header p {
    width: 40%;
    color: #FFF;
    font-size: 1.1rem;
    margin-bottom: 60px;
}

/* Content */
section { position: relative; width: 100% }

section.tinted { background: #FFFCF5 }

section.padded { padding: 80px 0 120px 0 }
section.bottom-padded { padding: 0 0 80px 0 }

section h2.down-padded { margin-bottom: 30px }

div.top-padded { padding-top: 60px }

/* Header mod buttons */
#header-tab-mod-wrap { position: relative; top: -65px }
#header-tab-mod { display: flex; width: 100%; align-items: center }

#header-tab-mod button {
    cursor: pointer;
    border: 0;
    background: #333;
    height: 65px;
    color: #FFF;
    font-size: 1.2rem;
    font-weight: 300;
    text-align: left;
    padding: 10px 20px;
    flex-grow: 1;
    flex-basis: auto;
}

#header-tab-mod button:first-child { border-top-left-radius: 7px }
#header-tab-mod button:last-child { border-top-right-radius: 7px }
#header-tab-mod button:hover { background: #111 }

#header-tab-mod button span {
    display: block;
    font-size: 0.75rem;
    font-family: 'Maison Neue', sans-serif;
    margin-top: 3px;
    margin-bottom: 1px;
}

#header-tab-mod button.active { background: #FFFCF5; color: #0C122F }
#header-tab-mod button.active i { filter: invert(100%) }

#header-tab-mod button i {
    display: inline-block;
    width: 37px;
    height: 37px;
    background-size: contain;
    background-position: right;
    background-repeat: no-repeat;
    vertical-align: -50%;
    margin-right: 5px;
}

#header-tab-mod button i.saker { background-image: url('../img/brand_logos/saker.svg') }
#header-tab-mod button i.ce { background-image: url('../img/brand_logos/coreengine.svg') }
#header-tab-mod button i.megadata { background-image: url('../img/brand_logos/datasphere.svg'); background-size: 75%; background-position: center; vertical-align: -51% }
#header-tab-mod button i.qs { background-image: url('../img/brand_logos/cybersec.svg'); background-size: 75%; background-position: center; vertical-align: -51% }
#header-tab-mod-wrap ~ .tab-content { margin-top: -20px }

section#main .buttons-row { font-size: 0; margin-top: 20px }
section#main .buttons-row button {
    border: 0 none;
    border-bottom: 3px solid transparent;
    background: none;
    color: #333;
    font-family: 'Maison Neue', sans-serif;
    font-size: 1rem;
    padding: 10px 0 8px 0;
    margin: 0;
}

section#main .buttons-row button:hover { cursor: pointer; border-bottom: 3px solid #ED7D31 }
section#main .buttons-row button + button { margin-left: 25px }
section#main .buttons-row button.active { border-bottom: 3px solid #ED7D31; color: #ED7D31 }

section#main .tab-content { margin-bottom: 80px }
section#main .image-text-table { display: none; width: 100%; table-layout: fixed }
section#main .image-text-table.active { display: table }
section#main .image-text-table .column { display: table-cell; vertical-align: middle }
section#main .image-text-table .column.left { width: 55%; padding-right: 10% }
section#main .image-text-table .column.right { width: 45%; padding: 1% 4% 1% 0 }
section#main .image-text-table .column.right img { width: 100% }

section .flex-wrapper { display: flex; margin-top: 50px }
section .flex-wrapper.vertical { gap: 50px; align-items: center }
section .flex-wrapper.s50-50 > .flex-left,
section .flex-wrapper.s50-50 > .flex-right { flex: 50% }
section .flex-wrapper > .flex-left { flex: 60% }
section .flex-wrapper > .flex-right { flex: 40%; align-items: stretch }
section .flex-wrapper > .flex-right > div { height: calc(90% / 3) }
section .flex-wrapper > .flex-right > div + div { margin-top: 5% }

section .flex-wrapper > .flex-left .item-highlight {
    position: relative;
    width: 95%;
    border-radius: 10px;
    background: url(../img/featured/ai.jpg) no-repeat;
    background-size: cover;
    padding-bottom: 65%;
}

section .flex-wrapper > .flex-left .item-highlight .title-wrap { position: absolute; top: 15%; left: 5%; width: 55% }
section .flex-wrapper > .flex-left .item-highlight .title-wrap h2,
section .flex-wrapper > .flex-left .item-highlight .title-wrap p { color: #FFF }

section .flex-wrapper > .flex-left .item-highlight .title-wrap h2 { line-height: 1.2em }
section .flex-wrapper > .flex-left .item-highlight .title-wrap p { margin-top: 5% }
section .flex-wrapper > .flex-left .item-highlight .title-wrap .btn { margin-top: 10% }

section .top-padded { margin-top: 20px }
.showcase-2row div[class^="col-"] { padding: 20px 0 }
.showcase-2row h3 { font-size: 1.5rem; letter-spacing: -0.03rem; margin-bottom: 10px }

section.full-image {
    background: url('../img/featured/a350f542a47f178e7ce0bc0fdd7.jpg') no-repeat;
    background-size: cover;
    background-position: center right;
    color: #FFF;
    padding: 130px 0;
    margin: 0;
}

section.full-image:before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; right: 50%; background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,255,255,0) 100%) }
section.full-image .half-width { width: 40% }
section.full-image h2,
section.full-image p { color: #FFF }

/* Footer */
footer {
    position: relative;
    width: 100%;
    background-color: #0C122F;
    background-image: url("../img/footer_bg.png");
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: top right;
    color: #FFF;
    padding: 60px 0 30px 0;
}
footer::after { content: ""; display: table; clear: both }

footer .table-o12 { margin-bottom: 40px }
footer h4 { color: #e7eaf8; font-size: 1.1rem; font-family: 'Maison Neue', sans-serif; margin-bottom: 20px }
footer ul li { margin: 20px 0 }
footer ul li a { color: #e7eaf8; font-size: 15px; letter-spacing: 0.4px }
footer ul li a:hover { color: #ED7D31; text-decoration: underline }

footer .wrap-match-nav { padding: 0 30px }
footer ul.sub-links { margin: 15px 0 }
footer ul.sub-links li { display: inline-block; margin: 0 }
footer ul.sub-links li + li { margin-left: 15px }

footer hr { display: block; border: 0; border-top: 1px solid #595d76; margin-bottom: 15px }
footer span { font-size: 14px; letter-spacing: 0.4px }

@media only screen and (max-width: 1024px) {
    #header-tab-mod-wrap { top: -52px; left: -40px; width: calc(100% + 80px) }
    #header-tab-mod-wrap::before,
    #header-tab-mod-wrap::after {
        content: '';
        display: none;
        position: absolute;
        top: 0; bottom: 0;
        height: 100%;
        width: 40px;
        z-index: 3;
        pointer-events: none;
        flex-shrink: 0;
    }
    #header-tab-mod-wrap::before { left: 0; background: linear-gradient(90deg, #000, rgba(0, 0, 0, 0)) }
    #header-tab-mod-wrap::after { right: 0; background: linear-gradient(-90deg, #000, rgba(0, 0, 0, 0)) }
    #header-tab-mod-wrap.show-left::before { display: block }
    #header-tab-mod-wrap.show-right::after { display: block }

    #header-tab-mod { overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch; scrollbar-width: none }

    #header-tab-mod button {
        height: 52px;
        font-size: 1rem;
        padding: 0 15px 0 10px;
        flex-shrink: 0;
        flex-basis: auto;
        white-space: nowrap;
    }
    #header-tab-mod button:first-child { padding-left: 15px }
    
    #header-tab-mod button:first-child i { margin-right: 7px }
    #header-tab-mod button i { width: 27px; height: 27px; vertical-align: -43% !important; margin-right: 5px }

    section#main .image-text-table { margin-top: 40px }
    section#main .image-text-table .column.left { width: 55%; padding-right: 5% }
    section#main .image-text-table .column.right { width: 45%; padding: 0 }
}

@media only screen and (max-width: 768px) {
    h2 { font-size: 28px; line-height: 1.3em }
    h3 { font-size: 22px; line-height: 1.3em }
    p { font-size: 15px }

    section.breadcrumb.top-padded { margin-top: 50px }
    section.padded { padding: 40px 0 70px 0 }
    section.bottom-padded { padding: 0 0 60px 0 }

    .btn a { font-size: 16px; letter-spacing: 0.2px; padding: 6px 0 5px 0; margin-bottom: 4px }
    .btn:hover a { padding: 6px 0 9px 0; margin-bottom: 0 }
    .btn a:after { top: 9px; right: -20px; width: 13px; height: 13px }
    .btn:hover a:after { right: -27px }
    .btn-big { font-size: 15px; letter-spacing: 0.7px; padding: 8px 15px 9px 15px }

    nav {
        display: block;
        position: fixed;
        top: 0; left: 0; right: 0;
        width: 100%;
        height: 50px;
        border-bottom: 1px solid #E4E4E4;
        padding: 11px 15px 12px 15px;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        -webkit-tap-highlight-color: transparent;
    }
    nav img { width: auto; height: 29px; margin-top: -1px }

    nav .right-align {
        position: fixed;
        top: 50px; left: 0; bottom: 0; right: 0;
        background: #FFF;
        float: unset;
        padding: 10px 4%;
        transition: all .5s cubic-bezier(0.215, 0.610, 0.355, 1.000);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-20px);
    }

    nav .right-align.open { opacity: 1; backdrop-filter: blur(1px); visibility: visible; transform: translateY(0px) }
    nav li { display: table; float: unset; padding: 10px 0 8px 0 }
    nav li + li { margin-left: 0 }
    nav li span.title { font-size: 15px; padding: 0 4%; margin: 25px 0 15px 0 }

    nav li .submenu,
    nav li .submenu .m-column,
    nav li .submenu div[class^="subpage-"] { position: fixed; top: 0px; left: 0; bottom: 0; right: 0; transition: all .3s ease-out }

    nav li .submenu .m-column { width: 100%; border: 0 none; background: #FFF; padding: 0 0 30px 0 }
    nav li .submenu ul li .arrow { vertical-align: 0%; padding: 5px; margin-left: 15px }
    nav li .submenu .m-column .title { display: none }
    nav li .submenu div[class^="subpage-"] { width: 100%; padding: 0 0 30px 0 }
    nav li .submenu div[class^="subpage-"].active { transition: all .3s ease-out; transition-delay: 0 }
    nav li .submenu .mobile-backbtn { display: block; background: #0C122F }
    nav li .submenu ul li { display: block; padding: 8px 4% 5px 4% }
    nav li .submenu ul li:last-child { border-radius: 0; border-top: 1px solid #DDD }
    nav li .submenu ul li + li { border-top: 1px solid #DDD }
    nav li .submenu ul li a span::before { vertical-align: .1rem }
    nav li .submenu ul li a span::before,
    nav li .submenu ul li a span { font-size: .8rem }

    nav .nav_btn { display: block; top: 10px; right: 15px }

    header { position: relative; background-position: left; margin-top: 50px }
    header.reduced { padding: 80px 0 300px 0 }
    header .image.half-full { top: unset; bottom: 0; width: 100%; height: 50% }

    header h1 { width: 100%; height: 3.2em; font-size: 32px; margin-bottom: 0 }
    header p { width: 100%; font-size: 15px; line-height: 1.6em; margin-bottom: 40px }

    #header-tab-mod-wrap { top: -50px; left: -15px; width: calc(100% + 30px) }

    section#main .buttons-row { margin: 8px 0 12px 0 }
    section#main .buttons-row button { font-size: 13px; padding-bottom: 5px }
    section#main .buttons-row button + button { margin-left: 15px }

    section#main .image-text-table.active { display: flex; flex-flow: column }
    section#main .image-text-table .column.left,
    section#main .image-text-table .column.right { display: unset; width: 100%; margin-top: 10px }
    section#main .image-text-table .column.left { order: 2; padding: 0; margin-top: 20px }
    section#main .image-text-table .column.right { width: 100%; order: 1 }

    section .flex-wrapper.mobile-flipped { flex-direction: column-reverse }
    section .flex-wrapper { flex-direction: column; gap: 30px }
    section .flex-wrapper > .flex-left,
    section .flex-wrapper > .flex-right { flex: 0 0 100% }

    section.full-image .half-width { width: 100% }

    footer { background-size: 70%; padding: 60px 0 20px 0 }
    footer ul li { margin: 15px 0 }
    footer ul li a { font-size: 14px; letter-spacing: 0.3px }
    footer .wrap-match-nav { padding: 0 15px }
    footer span { font-size: 0.8rem; line-height: 1.4em; letter-spacing: 0.3px }
}

/*
 * Responsive Grid (Non-flex)
 */
.table-o12 { position: relative; width: 100% }
.table-o12::after { content: ""; display: table; clear: both }

.table-o12 [class^="col-"] { float: left }
.table-o12 [class^="col-"] + [class^="col-"] { margin-left: 2.5% }
.table-o12 .col-3e12 { width: calc((100% - 7.5%) / 4) }
.table-o12 .col-4e12 { width: calc((100% - 5%) / 3) }
.table-o12 .col-6e12 { width: calc((100% - 2.5%) / 2) }

.table-o12 .col-4o12 { width: calc(33.3333333333%) }
.table-o12 .col-8o12 { width: calc(66.6666666666%) }

@media only screen and (max-width: 768px) {
    .table-o12 + .table-o12 { margin-top: 30px }
    .table-o12 [class^="col-"] + [class^="col-"] { margin-top: 30px; margin-left: 0 }
    .table-o12 .col-3e12 { width: 100% }
    .table-o12 .col-4e12 { width: 100% }
    .table-o12 .col-6e12 { width: 100% }
}

/*
 * Splide JS
 */
@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide__track--draggable{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide__track--fade>.splide__list>.splide__slide{margin:0!important;opacity:0;z-index:0}.splide__track--fade>.splide__list>.splide__slide.is-active{opacity:1;z-index:1}.splide--rtl{direction:rtl}.splide__track--ttb>.splide__list{display:block}.splide__container{box-sizing:border-box;position:relative}.splide__list{backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide:not(.is-overflow) .splide__pagination{display:none}.splide__progress__bar{width:0}.splide{position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;position:relative}.splide__slide img{vertical-align:bottom}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;bottom:0;contain:strict;display:inline-block;height:20px;left:0;margin:auto;position:absolute;right:0;top:0;width:20px}.splide__sr{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause{display:none}.splide__toggle.is-active .splide__toggle__pause{display:inline}.splide__track{overflow:hidden;position:relative;z-index:0}