/*#region General Layout*/
.dropdown-toggle::after {
    display: none;
}

body {
    padding-top: 3.1rem;
    padding-bottom: 1.3rem;
    padding-bottom: 0;
    background: #fdfeff;
}

.container {
    max-width: 84em;
}

@media(max-width: 991px){
    .navbar-topright-fixed > a {
        font-size: 0.9rem;
    }
}

@media (max-width: 424px) {
    .navbar-topright-fixed {
        width: 100% !important;
        margin: 0 !important;
    }

    .navbar-topright-fixed > a {
        font-size: 0.8rem;
    }
}

@media (max-width: 354px) {
    .navbar-topright-fixed > a {
        font-size: 0.6rem;
    }
}

@media (max-width: 320px) {
    .footerCTA > .container > a {
        font-size: 1.05rem;
    }
}

b {
    font-weight: 600;
}

/* Set padding to keep content from hitting the edges */

.body-content {
    padding-left: 0rem;
    padding-right: 0rem;
}

@media (min-width: 767px) {
    .body-content {
        padding-left: 0.9rem;
        padding-right: 0.9rem;
    }
}

.navbar {
    background: #fff;
    border-bottom: 0.06rem solid lightgray;
}

a {
    color: #23527C;
}

.nav-link {
    font-family: 'DiavloLight-Regular';
    font-size: 1.15rem;
}

.nav-item{
    padding: 0.44rem;
}

.Flag{
    margin-bottom: 0.18rem;
}

@media (max-width: 767px) {
    .body-content {
        padding-top: 0.9rem;
    }

    .navbar-brand {
        padding: 0;
    }

    .navbar-topright-fixed {
        padding-right: 0.6rem;
        text-align: right;
    }
}

@media (max-width: 767px) {
    .navbar-header {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

@media (min-width: 767px) {
    .nav > li > a {
        padding-top: 2.1rem;
        padding-bottom: 1.8rem;
    }

    .navbar-header .navbar-toggle {
        margin-top: 1.9rem;
    }

    .navbar-topright-fixed {
        position: absolute;
        top: 0.2rem;
        right: 1%;
    }
}

@media (min-width: 767px) {
    .navbar.navBarScrolled {
        box-shadow: 0 0 1.9rem rgba(93,93,93, 0.3);
    }

    .nav > li > a {
        transition: padding-top 0.5s;
    }

    .navBarScrolled .nav > li > a {
        padding-top: 1.3rem;
        padding-bottom: 1.3rem;
    }

    .navbar-brand {
        transition: padding-top 0.5s;
    }

    .navBarScrolled .navbar-brand {
        padding-top: 0.3rem;
    }
}

html, footer {
    background: #dddddd;
}

footer {
    margin-top: 4.38em;
}

footer .footerCTA {
    clear: both;
    padding: 1.53em 0;
    background: #242D60;
    color:#DDDDDD;
    font-size:1.53em;
}

@media (max-width: 767px) {
    footer .footerCTA {
        text-align:center;
        font-size: 1.31em;
    }

    footer .footerCTA a {
        clear:both;
        margin:auto !important;
        display:inline-block;
    }
}

footer .footerCTA a {
    color: inherit;
    text-decoration: none;
}

footer .footerCTA a:hover {
    text-decoration: underline;
}

footer .footerFold {
    clear: both;
    color: #5d5d5d;
    padding: 0.6rem 0;
    box-shadow: inset 0 0.5rem 0.5rem -0.5rem #5d5d5d;
}

#topScrollBtn {
    cursor: pointer;
    width: 3.1rem;
    height: 3.1rem;
    position: fixed;
    right: 1.9rem;
    bottom: 1.9rem;
    background: #666;
    color: #fff;
    font-size: 1.9rem;
    border-radius: 50%;
    text-align: center;
}

#topScrollBtn > .bi-chevron-up {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
/*#endregion General Layout*/

/*#region Shared styles*/
h1{
    font-weight: 400;
}

h2 {
    font-size: 2.2em;
    font-weight: 400;
}
h3 {
    font-size: 1.8em;
    font-weight: 400;
}

h4 {
    font-size: 1.5em;
    font-weight: 400;
}

@media (max-width: 767px) {
    h2 {
        font-size: 1.58em;
    }

    h3 {
        font-size: 1.4em;
    }
}

hr {
    border: 0;
    height: 0.06rem;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.spacer {
    height: 2.2rem;
    clear: both
}

.rounded {
    border-radius: 0.9rem;
}

.no-margin {
    margin: 0 !important;
}

.no-padding {
    padding: 0;
}

.no-border {
    border: 0;
}

.rounded5 {
    border-radius: 0.3rem;
}

.well {
    background-color: #e9e9e9;
}

a:hover > img {
    opacity: 0.7;
}

img {
    max-width: 100%;
}

p {
    text-align: justify;
}

.clear{
    clear:both;
}

.bold{
    font-weight:bold;
}

/*#region Animation*/

@keyframes widthSlide {
    0% {
        width:0;
    }
    100% {

        width:100%;
    }
}

.animate-v-in {
    opacity: 0.4;
}

.come-in {
    opacity: 0.4;
    transform: translateY(6.3rem);
    animation: come-in 0.8s ease forwards;
}

.come-in:nth-child(odd) {
    animation-duration: 0.6s; /* So they look staggered */
}

@keyframes come-in {
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/*#endregion Animation*/

/*#region Quicklinks*/

.quickLinks a.card {
    text-decoration: none;
}

.quickLinks a.card:hover {
    opacity: 0.9;
    color: #FFFFFF;
}

.quickLink {
    border: none;
    padding: 4%;
    min-height: 14.4rem;
    text-align: center;
}

.quickLink.card img, 
.quickLink.card svg, 
.quickLink.card {
    margin-top: 1.1rem;
    height: 6.3rem;
    font-size: 6.3rem;
}

.quickLink.card > h4 {
    margin-top: 1.9rem;
    text-align: center;
    font-size: 1.4rem;
}

/*#endregion Quicklinks*/

/*#region Bullet Points*/

@media (min-width: 767px) {
    ul.ulInline {
        width: 100%;
        text-align: center;
    }

    ul.ulInline > li {
        display: inline-block;
        text-align: center;
        margin-right: 2.63em;
    }
}

ul.ulBullet, 
ul.ulArrow, 
ul.ulTick, 
ul.ulCog {
    list-style-type: none;
    padding-left: 1.3em;
    line-height: 1.5;
}

ul.ulBullet li:before {
    content: "●";
    position: absolute;
    margin-left: -1.05em;
    margin-top: -0.05rem;
}

ul.ulArrow li:before, 
ul.ulTick li:before, 
ul.ulCog li:before {
    position: absolute;
    margin-left: -1.225em;
    margin-top: 0.08rem;
}

ul.ulTick > li, 
ul.ulArrow > li, 
ul.ulBullet > li {
    margin-bottom: 0.3rem;
}

ul.ulArrow li:before {
    display: inline-block;
    content: "";
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-chevron-right' viewBox='0 0 16 16'> <path fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/> </svg>");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 0.9rem 0.9rem;
    width: 1.25rem;
    height: 1.25rem;
}

ul.ulTick li:before {
    display: inline-block;
    content: "";
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-check' viewBox='0 0 16 16'> <path d='M10.97 4.97a.75.75 0 0 1 1.07 1.05l-3.99 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.267.267 0 0 1 .02-.022z'/> </svg>");
    background-repeat: no-repeat;
    background-position: 90% 40%;
    background-size: 1.75rem 1.75rem;
    width: 1.25rem;
    height: 1.25rem;
}

ul.ulCog li:before {
    content: "\e019";
}

ul.ulNumber {
    list-style-type: decimal;
}

/*#endregion Bullet Points*/

/*#endregion Shared styles*/

/*#region Page Header*/

@font-face {
    font-family: 'DiavloLight-Regular';
    src: url('/fonts/DiavloLight-Regular.woff') format('woff'), url('/fonts/DiavloLight-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

.logoFont {
    font-family: 'DiavloLight-Regular';
}

.pageColorSpacer {
    font-family: 'DiavloLight-Regular';
    padding: 2% 1%;
    margin: 1% 0;
    box-shadow: inset 0 0.5rem 0.5rem -0.5rem #696868, inset 0 -0.5rem 0.5rem -0.5rem #696868;
    background: #ecf5ff;
}
.pageColorSpacer .container {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-align:left;
}

.pageColorSpacer, 
.pageHeaderContainer {
    margin-left: -0.9rem;
    margin-right: -0.9rem;
    text-align: center;
}

@media (max-width: 767px) {
    .pageColorSpacer, 
    .pageHeaderContainer {
        margin-left: 0;
        margin-right: 0;
    }
}

.pageHeaderContainer {
    color: #21386D;
    margin-bottom: 1.1rem;
    padding-bottom: 0.75rem;
}

.pageHeader {
    font-size: 2.625em !important;
    font-family: 'DiavloLight-Regular';
    font-weight: bold;
    position: relative;
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
}

.pageHeader:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 0.1rem;
    bottom: 0;
    left: 0;
    transition: all 0.3s ease-in-out 0s;
    animation: 1s cubic-bezier(0.215, 0.61, 0.355, 1) widthSlide forwards;
    animation-delay: 0.2s;
    background-image: linear-gradient(to right, rgba(33,56,109, 0.5), rgba(0, 0, 0, 0));
}

.pageSubHeader {
    font-size: 1.3em;
    position: relative;
    color: #21386D;
}

h1.pageSubHeader{
    margin-top:auto;
    margin-bottom:auto;
}
/*Blue

        .pageHeaderContainer {
            background: #0064bc;
            color: #ecf5ff;
        }

        .pageHeader:before {
            background-image: linear-gradient(to right, rgba(255,255,255, 0.8), rgba(0, 0, 0, 0));
        }

        .pageSubHeader {
            color: #dbedff;
        }*/
/*Dark

        .pageHeaderContainer {
            background: #45505F;
            color: #d4d9e0;
        }

        .pageHeader:before {
            background-image: linear-gradient(to right, rgba(255,255,255, 0.8), rgba(0, 0, 0, 0));
        }

        .pageSubHeader {
            color: #cad0d9;
        }*/
/*Dark Blue Accent

        .pageHeaderContainer {
            background: #45505F;
            color: #d4d9e0;
        }

        .pageHeader:before {
            background-image: linear-gradient(to right, rgba(63,211,232, 0.8), rgba(0, 0, 0, 0));
        }

        .pageSubHeader {
            color: #cad0d9;
        }*/
/*Double Dark Blue Accent

        body {
            background: #f3f3f3;
        }

        .navbar a {
            color: #b9d4ec
        }

        .navbar, .navbar-default .navbar-nav > li > a {
            background: #303741;
            border-color: #138c9d;
            color: #d2d2d2;
        }

        .pageHeaderContainer {
            background: #45505F;
            color: #d4d9e0;
        }

        .pageHeader:before {
            background-image: linear-gradient(to right, rgba(63,211,232, 0.8), rgba(0, 0, 0, 0));
        }

        .pageSubHeader {
            color: #cad0d9;
        }*/
/*#endregion Page Header*/

/*#region Colour Schemes*/
.lightBlue {
    background: #05c0dd;
    border-color: #05c0dd;
    color: #e6f6fa;
}

.mediumBlue {
    background: #0092CC;
    border-color: #0092CC;
    color: #deedfa;
}

.darkBlue {
    background: #31708f;
    border-color: #31708f;
    color: #bce8f1;
}

.darkPurple {
    background: #6f5499;
    border-color: #6f5499;
    color: #dfd7ed;
}

.darkGreen {
    background: #4d974f;
    border-color: #4d974f;
    color: #d5ebcc;
}

.lightGreen {
    background: #d5ebcc;
    border-color: #d5ebcc;
    color: #428143;
}

.graphite {
    background: #909090;
    border-color: #909090;
    color: #e9e9e9;
}

.clean {
    background: #d8d8d8;
    border-color: #333;
    color: #333;
}

.darkYellow {
    background: #a28708;
    border-color: #a28708;
    color: #faea9e;
}

.lightYellow {
    background: #f7dc5d;
    border-color: #f7dc5d;
    color: #a28708;
}

/*#endregion Colour Schemes*/

/*#region shared between only some pages*/

.logoList{
    padding-bottom: 2em;
}

.logoList > div {
    height: 6.6rem;
    width: 9.75rem;
    padding: 3.2em 2%;
    margin: -1% 0;
    text-align: center;
    position: relative;
    display: inline-block;
}

@media(max-width: 1025px){
    .logoList > div {
        padding: 2em 2%;
    }
}

@media(max-width: 1024px) {
    .logoList > div {
        vertical-align: middle;
    }
}

.logoList > div img {
    max-height: 4em;
}

/*#endregion shared between only some pages*/

/*Hide images that will be turned into SVGs*/
img.convertSVG {
    opacity: 0;
}

/*#region Additional stylings*/
.navbar-brand {
    font-size: 2.8rem;
    padding: 0 !important;
    text-align: start;
}

.navbar-brand > .inlineSVG {
    margin-top: -0.9rem;
}

@media (max-width: 767px) {
    .navbar-brand {
        font-size: 2.4rem !important;
    }
}

.inlineSVG {
    height: 1em;
    width: auto;
    min-width: 1em;
    display: inline-block;
    vertical-align: middle;
}

.strataDropdownLogo {
    font-size: 1.1rem;
}

.fadeInRow {
    opacity: 0.3;
}
/*#endregion*/

/*#region Modal and cookie popup*/

.privacy-policy-link {
    cursor: pointer;
    color: #337ab7;
}

.privacy-body {
    overflow-y: scroll;
    height: calc(100vh - 15rem);
    max-height: 40rem;
    font-size: 0.79rem;
}

.privacy-container > p {
    width: 100%;
}

.privacy-body::-webkit-scrollbar {
    width: 0.4rem;
}

.privacy-body::-webkit-scrollbar-thumb {
    background: #D3D3D3;
    border-radius: 0.6rem;
    width: 0.3rem;
    height: 0.3rem;
}

.modal-header {
    padding: 0.7rem 1.75rem;
    padding-right: 0.44rem;
    align-items: center;
}

.modal-header > .inlineSVG {
    font-size: 3rem;
    margin-left: auto;
}

.modal-header > button {
    font-size: 1.7rem;
}

.modal {
    z-index: 10000;
}

@media(max-width: 400px){
    .modal-fullscreen {
        max-width: 100%;
        margin: 0;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100vh;
        display: flex;
    }

    .modal {
        vertical-align: middle;
        z-index: 1000000;
    }

    .privacy-body {
        max-height: 100vh;
    }
}

#consent-popup {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0.9rem;
    background-color: #ECF5FF;
    min-height: 8vh;
    z-index: 10005;
    -webkit-box-shadow: 0 -0.25rem 0.2rem rgba(50, 50, 50, 0.25);
    -moz-box-shadow: 0 -0.25rem 0.2rem rgba(50, 50, 50, 0.25);
    box-shadow: 0 -0.25rem 0.2rem rgba(50, 50, 50, 0.25);
}

.cookie-consent-hidden {
    display: none !important;
}

button {
    outline: none !important;
    box-shadow: none !important;
}

.btn-primary {
    margin: 0.44rem;
    background-color: #337ab7;
    border: none;
}

.btn-primary:hover, 
.btn-primary:active, 
.btn-primary:focus {
    background-color: #337ab7;
}

#consent-popup p {
    padding-top: 0.9rem;
}

#cookie-overlay {
    position: fixed;
    display: block;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 10000;
}

.no-display {
    transform: scale(0);
}

.btn-container{
    width: 30%;
}

.btn-container > button{
    width: 40%;
}

@media (max-width: 1050px) {
    #consent-popup {
        padding: 0.9rem;
    }

    #consent-popup p {
        width: 70%;
        margin-right: 0.44rem;
    }

    .btn-container {
        display: flex;
        flex-direction: column;
    }

    .btn-container > button {
        width: 95%;
    }
}

@media (max-width: 320px){
    #consent-popup p {
        font-size: 0.7rem;
        padding: 0;
        margin: 0;
    }

    .btn-container > button {
        font-size: 0.7rem;
    }
}
/*#endregion*/

/*#region fixes dropdown and navbar in IE, scroll snapping*/
@media (min-width: 992px){
    .softwareDropdown {
        width: 4.4rem;
    }
}

@media (max-width: 992px){
    .strataDropdownLogo > .inlineSVG {
        width: 4.4rem;
    }
}

@media (max-width: 800px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .navbar-brand {
        width: 8.75rem;
    }
}

html {
    -webkit-overflow-scrolling: touch;
    /*scroll-behavior: smooth;
    scroll-snap-type: block;
    scroll-padding-top: 0rem;
    scroll-padding-bottom: 17rem;*/
}

/*.media-left > .inlineSVG, 
.card-title > .inlineSVG {
    scroll-snap-align: start;
    scroll-margin: 6rem;
}*/
/*#endregion*/