/** Custom definitions **/

/*
COLORS:

Procountor pink: #D98AA7
Procountor turquoise: #CCE9E4
Transparent turquoise: rgba(149, 255, 232, 0.70);
Navbar white: rgb(242, 242, 242);

Finago branding:

Finago blue: #252442
Finago pink: #D98AA7
Finago purple: #3C3894
Finago light purple: #BEAFD1;
Finago extra light purple: #EBE3F6

*/

html {
    height: 100%;
    box-sizing: border-box;
}

body {
    position: relative;
    margin: 0;
    min-height: 100%;
    font-family: Figtree, "Roboto", "Helvetica Neue", Arial, sans-serif;
    background: url("../images/finago-background-3d.png") no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #0B0B14;
    padding-bottom: 60px;
}

h1, h2, h3, h4 {
    font-family: "Roboto Slab", Roboto, sans-serif;
}

h3 {
    color: inherit;
}

blockquote {
    font-size: inherit;
    border-color: #3C3894;
    margin-top: 1.5em;
}

a {
    color: #3C3894;
}

code {
    color: #252442;
    background-color: #F1EBF1;
}

.content-container p a, .content-container li a:not(.toc-href, .toggleOperation), .content-container td a, .frontpage-container p a {
    color: #3C3894;
    font-weight: bold;
}

:target:before {
    display: block;
    content: "";
    height: 80px; /* Give height of your fixed element */
    margin-top: -80px; /* Give negative margin of your fixed element */
    visibility: hidden;
}

.font-montserrat {
    font-family: Borna, Montserrat, Roboto, "Helvetica Neue", Arial, sans-serif;
}

.font-blue {
    color: #252442;
}

.font-purple {
    color: #703399;
}

.red {
    color: #D98AA7 !important;
}

a.red:hover {
    color: #3C3894 !important;
}

.turquoise {
    color: #CCE9E4;
}

.bg-turquoise {
    background-color: #CCE9E4;
}

.btn-large {
    padding: 10px 50px;
}

.btn-red {
    background-color: #D98AA7;
    color: white;
    border-radius: 0px;
    border-color: #D98AA7;
    font-weight: bold;
}

/* Hubspot forms submit buttons */
input.hs-button {
    padding: 10px 50px !important;
    background-color: #D98AA7 !important;
    background-image: none !important;
    color: white !important;
    border-radius: 0px !important;
    border-color: #D98AA7 !important;
    font-family: "Roboto", "Helvetica Neue", Arial, sans-serif !important;
    font-weight: bold !important;
    font-size: 14px !important;
    text-transform: uppercase;
    text-shadow: none !important;
    box-shadow: none !important;
    height: 1.5em !important;
    border: 0 !important;
}

input.hs-button:hover {
    background-color: #C9302C !important;
}

.top-margin {
    margin-top: 1em;
}

.bottom-margin {
    margin-bottom: 1em;
}

.xxl {
    font-size: xx-large;
    font-weight: 900;
}

.xl {
    font-size: x-large;
    font-weight: 800;
}

.bottom-block {
    padding-top: 4em;
}

.bold-link {
    color: #3C3894;
    font-weight: bold;
    font-size: medium;
    padding-top: 0.6em;
    display: inline-block;
}

.bold-link:hover {
    text-decoration: none;
}

.bold-link + .fa-chevron-right {
    color: #3C3894;
    font-size: medium;
    font-weight: bold;
}

.padding-bottom {
    padding-bottom: 0.6em;
}

footer.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 0;
    background-color: rgba(95, 95, 95, 0.45);
}

.footer li a {
    padding: 10px;
    margin: 1px 5px;
}

.footer a:not(:hover) {
    background-color: initial !important;
}

.footer .navbar {
    min-height: 25px;
    border-radius: 0px;
}

.footer .navbar-procountor-bottom i {
    font-size: x-large;
}

.row {
    margin: 0px;
}

.banner-intro {
    width: 100%;
    height: 60vh;
    position: relative;
    display: table;
    margin-bottom: 0;
}

.banner-intro h1 {
    font-weight: bold;
    margin-bottom: 0.6em;
}

.banner-intro, .banner-intro a {
    color: white;
}

.banner-intro p {
    margin-bottom: 50px;
}

.banner-intro .btn-red {
    margin-bottom: 0.5em;
}

.banner-intro .banner-inner {
    position: relative;
    width: 100%;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
    opacity: 1;
}

.jumbotron {
    background-color: rgba(95, 95, 95, 0.45);
    color: #F2F2F2;
    padding-top: 120px;
    padding-bottom: 80px;
    margin-bottom: 0;
}

.jumbotron a, .jumbotron h1, .jumbotron p {
    color: inherit;
}

table.table {
    margin-top: 1.5em;
}

div.table-responsive table.table {
    margin-top: 1.1em;
    margin-bottom: 1.1em;
}

#frontpage-section-first {
    padding-top: 20px;
}


#frontpage-section-first .showcase-content-wrapper {
    max-width: 55em;
}

#frontpage-carausel-container .frontpage-showcase {
    padding-bottom: 1em;
}

#frontpage-section-second .showcase-content-wrapper {
    max-width: 55em;
}

#frontpage-showcase-first h1 {
    font-weight: bold;
    font-size: 320%;
}

#frontpage-showcase-first .row:not(.last-row) {
    margin-bottom: 2.5em;
}

#frontpage-showcase-first .row .col-md-2 {
    padding-left: 1em;
}

#frontpage-showcase-first .row .col-md-10 {
    padding-left: 1.5em;
    padding-right: 1.5em;
}

#frontpage-showcase-second .showcase-content-wrapper {
    max-width: 55em;
    text-align: left;
    padding-left: 16px;
    padding-right: 16px;
}

#frontpage-showcase-second h1 {
    font-weight: bold;
    font-size: 320%;
}

#frontpage-showcase-second h3 {
    margin-top: 2em;
    margin-bottom: 1em;
}

#frontpage-showcase-second p {
    font-size: large;
}

.frontpage-row-white {
    background-color: #FCFCFD;
}

.frontpage-row-grey {
    background-color: rgba(95, 95, 95, 0.50);
}

.frontpage-row-grey .container {
    background-color: transparent;
    color: white;
}

.frontpage-showcase {
    padding: 3.5em 1em 3.5em 1em;
    background-color: #FCFCFD;
    font-size: medium;
    font-family: Roboto, "Helvetica Neue", Arial, sans-serif;
}

.showcase-content-wrapper > div.row {
    display: flex;
    align-items: center;
}

.frontpage-showcase .img-container {
    max-width: 90px;
}

.frontpage-showcase p {
    line-height: 160%;
}

.frontpage-greycontainer {
    background-color: rgb(244, 247, 249);
}

.frontpage-container {
    padding: 2.5em 0.5em 3em 0.5em;
    background-color: #FCFCFD;
}

.frontpage-container p {
    line-height: 160%;
}

.frontpage-container h2 {
    margin-bottom: 1em;
    font-weight: bold;
    text-align: center;
    font-size: 320%;
}

.frontpage-container h3 {
    margin-top: 1.3em;
    margin-bottom: 1em;
}

.content-container p {
    line-height: 153%;
}

.content-container h2 {
    margin-top: 1.5em;
}

.content-container h2 + p {
    margin-top: 1.5em;
}

.content-container h2 + h3 {
    margin-top: 1.0em;
}

.content-container h3 {
    margin-top: 1.4em;
}

.content-container h3 + p {
    margin-top: 1.3em;
}

.content-container h4 {
    margin-top: 1.4em;
}

.content-container h4 + p {
    margin-top: 1.2em;
}


.content-container.container-fluid {
    padding: 0;
}

.content-container .row, .frontpage-section .row {
    background-color: #FCFCFD;
}

.content-container > .row {
    padding: 2.5em 0.5em 3em 0.5em;
}

.text-content-wrapper {
    max-width: 82em;
    padding-left: 4%;
}

.header-wrapper {
    padding-left: 3.9%;
}

#toc {
    padding: 0 0 1.5em 0;
}

#toc ul {
    padding-left: 0.7em;
    list-style: none;
}

#toc > ul > li > a {
    display: none;
}

#toc > ul > li > ul > li > a {
    font-weight: bold;
}

#toc > ul > li > ul > li > a + ul {
    padding-top: 0.5em;
}

#toc > ul > li > ul > li {
    padding-bottom: 1em;
}

#toc > ul > li > ul > li > ul > li {
    padding-bottom: 0.3em;
}

#toc > ul > li > ul > li:last-of-type {
    padding-bottom: 0;
}

#toc ul a {
    color: #252442;
}

span.page-breadcrumb {
    display: inline-block;
    padding-bottom: 1.7em;
}

.content-container h2:first-of-type {
    margin-top: 0;
}

.navbar {
    padding: 5px 30px;
    margin: 0px;
}

.navbar a.navbar-brand {
    padding: 1px;
}

.logo {
    max-width: 230px;
}

.logo-small {
    max-height: 45px;
    height: 100%;
    width: auto;
}

.fa-middle {
    vertical-align: middle;
}

.navbar-procountor .navbar-toggle .icon-bar {
    background-color: #fff;
}

nav.navbar-procountor {
    background-color: #252442;
    color: #FFFFFF;
    border-radius: 0px;
    text-transform: uppercase;
    font-size: small;
    font-weight: bold;
}

nav.navbar-procountor a {
    color: inherit;
    padding: 15px 7px;
}

nav.navbar-procountor li.active {
    color: #BEAFD1;
    border-top: 4px solid #BEAFD1;
    margin-top: 5px;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

nav.navbar-procountor li.active a {
    padding-top: 6px;
}

nav.navbar-procountor a:hover,
nav.navbar-procountor button:hover,
nav.navbar-procountor a:focus {
    color: #BEAFD1;
    background-color: inherit;
    border-radius: 5px;
}

nav li.seperator {
    border-left: solid 1px gray;
    padding-bottom: 10px;
    margin-top: 11px;
}

.navbar-procountor-bottom {
    color: #F2F2F2;
}

.navbar-procountor-bottom a {
    color: inherit;
}

.navbar-procountor-bottom a:hover {
    color: #363636;
    border-radius: 5px;
}

.navbar-procountor li.open a.dropdown-toggle {
    background-color: #252442;
}

.navbar-procountor li.open ul.dropdown-menu {
    background-color: #252442;
}

.navbar-procountor li.open ul.dropdown-menu a {
    color: rgb(242, 242, 242);
    font-size: small;
}

.navbar-procountor li.open ul.dropdown-menu a:hover {
    color: #BEAFD1;
}

input[type=text]:focus {
    background-color: lightyellow;
}

.loading-mask {
    margin-top: 5em;
}

pre {
    margin: 10px 25px;
    color: lightgreen;
    background-color: #252442;
}

.thumbnail-image {
    width: 200px;
    margin: 1em 1em 1em 0em;
}

.no-backwards-compatibility {
    border-left: 3px solid #D98AA7;
    border-right: 3px solid #D98AA7;
    padding-left: 2px;
    padding-right: 2px;
    background-color: #f8e7ed;
    margin-bottom: 2px;
}

/* syntax-highlight */

div.highlight {
    margin-top: 1.4em;
    margin-bottom: 1.4em;
}

span.c {
    color: #408080;
    font-style: italic
}

/* Comment */
span.err {
    border: 1px solid #FF0000
}

/* Error */
span.k {
    color: #01ca01;
    font-weight: bold
}

/* Keyword #01ca01 */
span.o {
    color: #7ba2ff
}

/* Operator */
span.cm {
    color: #408080;
    font-style: italic
}

/* Comment.Multiline */
span.cp {
    color: #BC7A00
}

/* Comment.Preproc */
span.c1 {
    color: #408080;
    font-style: italic
}

/* Comment.Single */
span.cs {
    color: #408080;
    font-style: italic
}

/* Comment.Special */
span.gd {
    color: #A00000
}

/* Generic.Deleted */
span.ge {
    font-style: italic
}

/* Generic.Emph */
span.gr {
    color: #FF0000
}

/* Generic.Error */
span.gh {
    color: #000080;
    font-weight: bold
}

/* Generic.Heading */
span.gi {
    color: #00A000
}

/* Generic.Inserted */
span.go {
    color: #808080
}

/* Generic.Output */
span.gp {
    color: #000080;
    font-weight: bold
}

/* Generic.Prompt */
span.gs {
    font-weight: bold
}

/* Generic.Strong */
span.gu {
    color: #800080;
    font-weight: bold
}

/* Generic.Subheading */
span.gt {
    color: #0040D0
}

/* Generic.Traceback */
span.kc {
    color: #01ca01;
    font-weight: bold
}

/* Keyword.Constant */
span.kd {
    color: #01ca01;
    font-weight: bold
}

/* Keyword.Declaration */
span.kn {
    color: #01ca01;
    font-weight: bold
}

/* Keyword.Namespace */
span.kp {
    color: #01ca01
}

/* Keyword.Pseudo */
span.kr {
    color: #01ca01;
    font-weight: bold
}

/* Keyword.Reserved */
span.kt {
    color: #B00040
}

/* Keyword.Type */
span.m {
    color: #7ba2ff
}

/* Literal.Number */
span.s {
    color: #D98AA7
}

/* Literal.String */
span.na {
    color: #7D9029
}

/* Name.Attribute */
span.nb {
    color: #01ca01
}

/* Name.Builtin */
span.nc {
    color: #72A8FF;
    font-weight: bold
}

/* Name.Class */
span.no {
    color: #880000
}

/* Name.Constant */
span.nd {
    color: #AA22FF
}

/* Name.Decorator */
span.ni {
    color: #999999;
    font-weight: bold
}

/* Name.Entity */
span.ne {
    color: #D2413A;
    font-weight: bold
}

/* Name.Exception */
span.nf {
    color: #72A8FF
}

/* Name.Function */
span.nl {
    color: #A0A000
}

/* Name.Label */
span.nn {
    color: #72A8FF;
    font-weight: bold
}

/* Name.Namespace */
span.nt {
    color: #01ca01;
    font-weight: bold
}

/* Name.Tag */
span.nv {
    color: #8FBEEF
}

/* Name.Variable */
span.ow {
    color: #AA22FF;
    font-weight: bold
}

/* Operator.Word */
span.w {
    color: #bbbbbb
}

/* Text.Whitespace */
span.mf {
    color: #7ba2ff
}

/* Literal.Number.Float */
span.mh {
    color: #7ba2ff
}

/* Literal.Number.Hex */
span.mi {
    color: #7ba2ff
}

/* Literal.Number.Integer */
span.mo {
    color: #7ba2ff
}

/* Literal.Number.Oct */
span.sb {
    color: #D98AA7
}

/* Literal.String.Backtick */
span.sc {
    color: #D98AA7
}

/* Literal.String.Char */
span.sd {
    color: #D98AA7;
    font-style: italic
}

/* Literal.String.Doc */
span.s2 {
    color: #D98AA7
}

/* Literal.String.Double */
span.se {
    color: #BB6622;
    font-weight: bold
}

/* Literal.String.Escape */
span.sh {
    color: #D98AA7
}

/* Literal.String.Heredoc */
span.si {
    color: #BB6688;
    font-weight: bold
}

/* Literal.String.Interpol */
span.sx {
    color: #01ca01
}

/* Literal.String.Other */
span.sr {
    color: #BB6688
}

/* Literal.String.Regex */
span.s1 {
    color: #D98AA7
}

/* Literal.String.Single */
span.ss {
    color: #19177C
}

/* Literal.String.Symbol */
span.bp {
    color: #01ca01
}

/* Name.Builtin.Pseudo */
span.vc {
    color: #19177C
}

/* Name.Variable.Class */
span.vg {
    color: #19177C
}

/* Name.Variable.Global */
span.vi {
    color: #19177C
}

/* Name.Variable.Instance */
span.il {
    color: #7ba2ff
}

/* Literal.Number.Integer.Long */

/* TODO: Add swagger custom styles*/
/* Swagger-ui tweaks */


#errorCodeTable {
    max-width: 100% !important;

}

#errorCodeTable td.word-break {
    word-wrap: break-word;
    word-break: break-all;
}

#errorCodeTable tbody tr.group-start td::before {
    display: none;
}

#errorCodeTable_wrapper div.dt-buttons {
    margin-left: 1em;
}

#errorCodeTable_wrapper div.dt-buttons a {
    color: black;
}

/* Documentation generated in OpenAPI 3.0 */
.swagger-ui {
    margin: 0 0 0 0.5px;
}

.swagger-ui .information-container {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .15);
    padding: 20px 0 0 20px !important;
}

.swagger-ui .info {
    margin: 0 0 0 0 !important;
}

.swagger-ui .info a {
    color: #3C3894 !important;
    font-weight: bold !important;
}

.swagger-ui .info a:hover {
    color: #3C3894 !important;
}

.swagger-ui .info .description {
    display: none;
}

.swagger-ui .info .main {
    display: none;
}

.swagger-ui .info .title {
    display: none;
}

.swagger-ui .opblock-tag-section .opblock-tag small > .renderedMarkdown {
    display: none;
}

.swagger-ui .info .main .title small {
    display: none;
}

.swagger-ui .info hgroup.main .base-url {
    display: none;
}

.swagger-ui .info hgroup.main > a {
    display: none;
}

.swagger-ui .scheme-container {
    padding: 20px 0 !important;
}

.swagger-ui .scheme-container .schemes > label {
    display: none !important;
}

.swagger-ui .authorization__btn.unlocked {
    display: none;
}

.swagger-ui .authorization__btn.locked {
    display: none;
}

.swagger-ui .try-out {
    display: flex;
    -webkit-box-flex: 1;
    flex: 1;
    -webkit-box-pack: end;
    justify-content: flex-end;
}

.swagger-ui .invalid {
    border-color: #f93e3e;
    background: #feebeb;
    -webkit-animation: shake .4s 1;
    animation: shake .4s 1;
}

/* Custom splideJS styles */
.splide__slide img {
    max-height: 150px;
    max-width: 150px;
    display: block;
    object-fit: cover;
    margin: 15px;
}

.splide__slide {
    padding: 10px;
}

.splide {
    background: white;
    padding-left: 15%;
    padding-right: 15%;
}

.splide-header .h2 {
    margin: inherit;
}

.splide-header {
    background: white;
    text-align: center;
}

@-webkit-keyframes shake {
    10%, 90% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0)
    }
    20%, 80% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0)
    }
    30%, 50%, 70% {
        -webkit-transform: translate3d(-4px, 0, 0);
        transform: translate3d(-4px, 0, 0)
    }
    40%, 60% {
        -webkit-transform: translate3d(4px, 0, 0);
        transform: translate3d(4px, 0, 0)
    }
}

@keyframes shake {
    10%, 90% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0)
    }
    20%, 80% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0)
    }
    30%, 50%, 70% {
        -webkit-transform: translate3d(-4px, 0, 0);
        transform: translate3d(-4px, 0, 0)
    }
    40%, 60% {
        -webkit-transform: translate3d(4px, 0, 0);
        transform: translate3d(4px, 0, 0)
    }
}


/* small screens */
@media (max-width: 1200px) {

    .text-content-wrapper, .header-wrapper {
        padding-left: 0;
    }

    #toc {
        margin-left: -0.7em;
    }

    #splide {
        display: none;
    }
}

/* Style the example tabs */
.example-tab .tab {
    border-bottom: 1px solid #ccc;
}

.example-tab .tab button {
    padding: 10px 15px;
    font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
    background-color: #fff;
    margin-bottom: -1px;
    color: #3C3894;
    border-bottom: 1px solid #ccc;
    border-top: none;
    border-left: none;
    border-right: none;
}

.example-tab .tab button:hover {
    background-color: #eee;
}

.example-tab .tab button.active {
    border-bottom: 1px solid #fff;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

.example-tab .tab button.active:hover {
    background-color: #fff;
}

.example-tab .tab-content {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .15);
    padding: 1px 0 1px 0;
    margin-bottom: 20px;
    margin-left: 1px;
}