/* Default colors */
.color1 {
    color: #001a34;
}

.color2 {
    color: #3d5165;
}

.color3 {
    color: #808d9a;
}

.color4 {
    color: #fff;
}

/* Default font sizes */
.size1 {
    font-size: 12px;
    line-height: 16px;
}

.size2 {
    font-size: 14px;
    line-height: 18px;
}

.size3 {
    font-size: 16px;
    line-height: 20px;
}

.size4 {
    font-size: 20px;
    line-height: 26px;
}

.size5 {
    font-size: 24px;
    line-height: 30px;
}

.size6 {
    font-size: 30px;
    line-height: 38px;
}

.size7 {
    font-size: 38px;
    line-height: 46px;
}

/* Redefining Bootstrap classes without important */
.w25 {
    width: 25%;
}

.w33 {
    width: 33.33333%;
}

.w50 {
    width: 50%;
}

.w100 {
    width: 100%;
}

.mb16 {
    margin-bottom: 16px;
}

.mt16 {
    margin-top: 16px;
}

/* Component defaults */
.widget .text, .widget li {
    word-wrap: break-word;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

.widget .title {
    -ms-line-clamp: 2;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    display: -moz-box;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    margin-bottom: 16px;
}

.gap-s .title,
.li-content .title {
    margin-bottom: 8px;
}

.img-box {
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    margin: 0 auto 16px;
}

.image {
    height: 100%;
    max-width: 100%;
    width: 100%;
}

.img-text {
    border-radius: 12px;
    padding: 0;
}

/* Widget spacing */
.widget + .widget.desktop {
    margin-top: 48px;
}

.widget + .widget.mobile {
    margin-top: 32px;
}

/* Media queries */
.widget.mobile {
    display: none;
}

@media screen and (max-width: 640px) {
    .widget.mobile {
        display: block;
    }

    .widget.desktop {
        display: none;
    }
}

/* Image type: chess */
.fixed-height {
    overflow: hidden;
}

.widget.desktop .chess .tile + .tile {
    margin-top: 48px;
}

.widget.desktop .chess .tile {
    align-items: center;
    display: flex;
}

.widget.desktop .chess .tile.reverse {
    flex-direction: row-reverse;
}

.widget.desktop .chess .img-box {
    flex: 0 0 50%;
    max-width: 50%;
    margin-bottom: 0;
}

.widget.desktop .chess .img-text {
    box-sizing: border-box;
    display: flex;
    flex-flow: column;
    justify-content: center;
    padding-left: 16px;
}

.widget.desktop .chess .tile.reverse .img-text {
    padding-left: 0;
    padding-right: 16px;
}

.widget.mobile .tile + .tile {
    margin-top: 32px;
}

/* Image type: tileXL, tileL, tileM */
.widget.desktop .tiles {
    display: flex;
    flex-wrap: wrap;
    margin-left: -16px;
    margin-top: -48px;
}

.widget.desktop .tiles .tile {
    display: flex;
    flex-flow: column nowrap;
    margin-left: 16px;
    margin-top: 48px;
}

.tile-2 {
    flex: 0 0 calc(50% - 16px);
}

.tile-3 {
    flex: 0 0 calc(33.33333% - 16px);
}

.tile-4 {
    flex: 0 0 calc(25% - 16px);
}

.tile-4 .img-box {
    border-radius: 8px;
}

/* Image type: tileSecondary */
.widget.mobile .tiles.secondary {
    display: flex;
    flex-wrap: wrap;
    margin-left: -8px;
    margin-top: -8px;
}

.tiles.secondary .tile {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    background: #eff3f6;
    border-radius: 12px;
    flex: 0 0 calc(25% - 16px);
    max-width: calc(25% - 16px);
    padding: 16px 24px;
    text-align: center;
}

.widget.mobile .tiles.secondary .tile {
    flex: 0 0 calc(50% - 8px);
    margin-left: 8px;
    margin-top: 8px;
    max-width: calc(50% - 8px);
    padding: 24px 12px;
}

.tiles.secondary .img-box {
    border-radius: 6px;
    height: 50px;
    margin-bottom: 16px;
    width: 50px;
}

.widget.mobile .tiles.secondary .img-box {
    height: 40px;
    margin-bottom: 8px;
    width: 40px;
}

/* Image container */
.widget .img-container {
    display: flex;
}

.fixed-height .img-container {
    padding-top: 100%;
}

.fixed-height .img-box.show-bg::after {
    background-color: rgba(14, 50, 103, .04);
    bottom: 0;
    content: '';
    display: block;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
}

.fixed-height .image {
    left: 0;
    position: absolute;
    top: 0;
}

.img-box.edge .image {
    -o-object-fit: contain;
    object-fit: contain;
}

.img-box.fill .image {
    -o-object-fit: cover;
    object-fit: cover;
}

/* Video */
.video-box {
    border-radius: 12px;
    overflow: hidden;
    padding-top: 56.25%;
    position: relative;
    width: 100%;
}

.video {
    border: none;
    height: 100%;
    left: 0;
    max-width: 100%;
    position: absolute;
    top: 0;
    width: 100%;
}

/* TextBlock */
.text-block {
    border-radius: 12px;
}

.p-type1 {
    padding: 0;
}

.widget.desktop .p-type2 {
    padding: 40px;
}

.widget.mobile .p-type2 {
    padding: 24px 16px;
}

.text-block-color-primary {
    background-color: #005bff;
}

.text-block-color-secondary {
    background-color: transparent;
    border: 2px solid #005bff;
}

.text-block-color-tertiary {
    background-color: #eff3f6;
}

/* Lists */
.widget li {
    position: relative;
}

.widget li + li {
    margin-top: 24px;
}

.li-content {
    border-radius: 12px;
    padding: 0;
}

.widget .list {
    list-style: none;
    padding-left: 24px;
    margin: 16px 0;
}

/* -- Bullet list -- */
.list-bullet li::before {
    background: #001a34;
    border-radius: 50%;
    content: "";
    display: block;
    height: 8px;
    left: -20px;
    position: absolute;
    top: 8px;
    width: 8px;
}

/* -- Number list */
.widget .list-number {
    counter-reset: listCounter;
}

.list-number li {
    counter-increment: count;
}

.list-number li::before {
    display: block;
    left: -20px;
    position: absolute;
    
    background: hsla(0, 0%, 100%, 0);
    border-radius: 0;
    border-radius: initial;
    content: counter(count, decimal) ".";
    font-size: inherit;
    height: auto;
    top: 0;
    width: auto;
}

/* -- Image list -- */
.widget .list-image {
    padding-left: 0;
}

.list-image li {
    align-items: flex-start;
    display: flex;
    justify-content: flex-start;
    margin-left: 2px;
}

.list-image .img-box {
    flex-shrink: 0;
    height: 50px;
    margin: 0 22px 0 0;
    width: 50px;
    border-radius: 6px;
}

/* Table */
.table-block {
    overflow: auto;
}

.table {
    width: 100%;
    border-collapse: collapse;
}

.table thead,
.table tbody,
.table tfoot,
.table tr,
.table th,
.table td {
    border: none;
}

.table th {
    background-color: #ebf7ff;
    color: #001a34;
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
    min-width: 120px;
}

.table-head-cell-content {
    display: flex;
    flex-flow: column nowrap;
}

.table .img-box {
    height: 96px;
    margin: 0 auto;
    width: 96px;
    border-radius: 8px;
}

.table th:first-child {
    border-top-left-radius: 12px;
}

.table th:last-child {
    border-top-right-radius: 12px;
}

.table tr:last-child td:first-child {
    border-bottom-left-radius: 12px;
}

.table tr:last-child td:last-child {
    border-bottom-right-radius: 12px;
}

.table-row {
    background-color: #fff;
}

.table-row:nth-child(2n) {
    background-color: #f2f5f9;
}

.table-row.hover-row:hover {
    background-color: #ebf7ff;
}

.table .table-cell {
    min-width: 120px;
    padding: 11px 8px 11px 12px;
    position: relative;
    vertical-align: middle;
}

.table .table-cell.hover-column:hover::after {
    background-color: #ebf7ff;
    content: "";
    height: 30000vh;
    left: 0;
    mix-blend-mode: multiply;
    pointer-events: none;
    position: absolute;
    top: -10000vh;
    width: 100%;
    z-index: 1;
}