.portlet-contentbox {
    position: relative;
}
.portlet-contentbox[data-portlet] {
    border: 2px solid violet !important;
}
.portlet-contentbox-bg-light-gray {
    background-color: var(--light);
}
.portlet-contentbox-bg-primary {
    background-color: var(--primary);
}
.portlet-contentbox-bg-primary * {
    color: #fff;
}
.portlet-contentbox-bg-primary a:hover {
    color: #fff;
}
.portlet-contentbox-bg-secondary {
    background-color: var(--secondary);
}
.portlet-contentbox-bg-secondary a {
    color: #000;
}
.portlet-contentbox-bg-secondary a:hover {
    color: #000;
}
.portlet-contentbox.p-none {
    padding: 0;
}
.portlet-contentbox.p-default {
    padding: 1.5rem;
}

.portlet-contentbox-border-radius-none {
    border-radius: 0;
}

.portlet-contentbox-border-radius-4 {
    border-radius: 4px;
}

.portlet-contentbox-border-radius-8 {
    border-radius: 8px;
}

.portlet-contentbox-border-radius-12 {
    border-radius: 12px;
}

.portlet-contentbox.p-36 {
    padding: 2.25rem;
}
.portlet-contentbox.p-24 {
    padding: 1.5rem;
}
.portlet-contentbox.p-16 {
    padding: 1rem;
}
.portlet-contentbox .container>*+* {
    margin-top: 1rem;
}

@media(min-width: 768px) {
    .portlet-contentbox.p-default {
        padding: 2rem;
    }
}

@media(min-width: 1200px) {
    .portlet-contentbox.p-default {
        padding: 3rem;
    }

    .portlet-contentbox .container>*+* {
        margin-top: 1.5rem;
    }
}