:root {
    --middle-grey:#dadada;
    --unchecked-color: #cdddeb;
    --main-color:#248ade;
    --main-hover:#14568c;
    --main-active:#248ade;
    --main-btn-active:#16588e;
    --main-padding: 2em;
}

.form-fit {
    max-width: 600px;
}

body {
    display: flex;
    flex-direction: column;
    height: 100vh;
}

@font-face {
  font-family: "AbrilFatFace";
  src: local('AbrilFatface-Regular'),
       url('../fonts/AbrilFatface-Regular.ttf') format("truetype");
}

.powered-by {
    font-size:0.7em;
    flex-basis:100%;
    text-align:center;
}

.card-header {
    display:flex;
    align-items: center;
    justify-content: space-between;
}

.card-footer {
    display:flex;
    justify-content: end;
    align-items: center;
    gap: 0.8em;
}

.card-arrow {
    margin:0 !important;
    border: 2px solid var(--middle-grey);
    background-color: var(--main-color);
    border-radius: 10px;
}

.card-arrow:hover {
    background-color: var(--main-hover);
}

.card-arrow > a > svg {
    fill: var(--middle-grey);
}

.content-container{
    max-width:1440px;
    align-self: center;
    padding-bottom:2em;
    flex:1; /* fill space */
}

.content-container > div {
    flex-direction:column
}

.main-container {
    display:flex;
    flex-direction:column;
    padding-top:var(--main-padding);
    flex:1;
}

.contain-all {
    display:flex;
    flex-direction:column;
    height: calc(100vh - var(--height-navbar));
    margin-top:var(--height-navbar)
}

.pointable {
    cursor: pointer;
}

list-group-item-action,.list-group-item-action.active {
    color: var(--dark-blue); /* remove changes */
}

.list-group-item-action.active {
    background-color: var(--middle-grey);
    border:none;
}

img:not(.cbsm-icon) {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    display:block;
}

h2 {
    margin-top: 1em;
}

h1,h2,h3,h4 {
    text-align:center;
}

.tab {
    align-self:center;
    margin-bottom:2em;
    font-size: 0.9em;

}

.tabcontent {
    text-align:inherit !important;
}

iframe {
    height: 80vh;
}

.nav.bg-dark,
.navbar-nav,
.dropdown-menu,
.module caption,
.module h2,
.breadcrumbs,
.object-tools a:link,
.object-tools a:visited {
    background-color: var(--main-color) !important;
}

.btn-info {
    border-color: var(--main-color) !important;
}

#bootstrap-overrides h3, #bootstrap-overrides h2, #bootstrap-overrides a:not(.btn,.a-step), .collab-picture + span, .icon-picture + span {
    color: var(--main-color) !important;
}

h3, h2, button, .btn {
    font-family: "AbrilFatFace";
}

h2 {
    font-weight:bold;
}

.section_title {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align:center
}

.section_bef, .section_af {
    content:url("/static/files/separator.svg");
    width: 30%;
}

.section_af {
    transform:rotateX(180deg)
}

#bootstrap-overrides .tab {
    border-radius: 15px;
}

#bootstrap-overrides .tab button:not(.close_alert,.tablinks.active), .btn-info, .btn-primary {
    color: #fff !important;
    background-color: var(--main-color) !important;
}

#bootstrap-overrides .tab button:not(.close_alert,.tablinks).active, .btn-info.active, .btn-primary.active, .btn-info:active, .btn-primary:active {
    background-color: var(--main-active) !important;
}

#bootstrap-overrides .tab button:not(.close_alert,.btn-checkbox).hover, button:not(.close_alert,.btn-checkbox):hover, .btn-info.hover, .btn-primary.hover, .btn-info:hover, .btn-primary:hover, button:not(.close_alert).disabled, .btn-info.disabled, .btn-primary.disabled, .btn-info:disabled, .btn-primary:disabled {
    background-color: var(--main-hover) !important;
}

.logo-div {
    display:flex;
    justify-content:space-around;
    flex-wrap:wrap;
    row-gap: 10px;
    margin-top: 1em;
}

.footer-div {
    margin-top: auto;
}

div:has(>.collab-picture, >.icon-picture) {
    display:flex;
    flex-direction:column;
}

div:has(>.collab-picture) {
    flex-basis: 33%;
}

div:has(>.icon-picture) {
    flex-basis: 15%;
}

.collab-picture {
    border:5px solid var(--main-color);
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    max-width: 200px;
}

.collab-picture + span, .icon-picture + span {
    font-weight:bold;
    text-align:center;
}

.partner-picture {
    max-width: 12% !important;
    max-height: 100px;
}

.navbar-img {
    max-height:var(--height-navbar)
}

@media (max-width:991px) {
    .navbar-img {
        max-height:calc(var(--height-navbar) - 20px);
    }
}

@media (max-width:768px) {
    .collab-picture {
        max-width:150px;
    }
    h2 {
        font-size:1.2rem;
    }
    h3 {
        font-size:1rem;
    }
}

.tab > .tablinks {
    color: #fff !important;
}

.tab > .tablinks.active {
    background-color: var(--main-btn-active) !important;
}