﻿
.widget-container {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    margin-right: auto;
    margin-left: auto;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.widget-image-widget img {
    width: 100%;
}

.widget-align-left {
    text-align: left;
}

.widget-align-center {
    text-align: center;
}

.widget-align-right {
    text-align: right;
}

.widget-align-justify {
    text-align: justify;
}

.widget-size-100, .widget-size-75, .widget .widget-size-75, .widget-size-66, .widget .widget-size-66, .widget-size-50, .widget .widget-size-50, .widget-size-33, .widget .widget-size-33, .widget-size-25, .widget .widget-size-25 {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    margin-top: var(--bs-gutter-y);
    flex: 0 0 auto;
    width: 100%;
}

@media (min-width: 576px) {
    .widget-size-25, .widget .widget-size-25 {
        flex: 0 0 auto;
        width: 25%;
    }
}

@media (min-width: 768px) {
    .widget .widget-size-25 {
        flex: 0 0 auto;
        width: 25%;
    }
}

@media (min-width: 576px) {
    .widget-size-33, .widget .widget-size-33 {
        flex: 0 0 auto;
        width: 33.33333333%;
    }
}

@media (min-width: 768px) {
    .widget .widget-size-33 {
        flex: 0 0 auto;
        width: 33.33333333%;
    }
}

@media (min-width: 576px) {
    .widget-size-50, .widget .widget-size-50 {
        flex: 0 0 auto;
        width: 50%;
    }
}

@media (min-width: 768px) {
    .widget .widget-size-50 {
        flex: 0 0 auto;
        width: 50%;
    }
}

@media (min-width: 576px) {
    .widget-size-66, .widget .widget-size-66 {
        flex: 0 0 auto;
        width: 66.66666667%;
    }
}

@media (min-width: 768px) {
    .widget .widget-size-66 {
        flex: 0 0 auto;
        width: 66.66666667%;
    }
}

@media (min-width: 576px) {
    .widget-size-75, .widget .widget-size-75 {
        flex: 0 0 auto;
        width: 75%;
    }
}

@media (min-width: 768px) {
    .widget .widget-size-75 {
        flex: 0 0 auto;
        width: 75%;
    }
}
