Viewing File: /usr/local/cpanel/base/frontend/jupiter/plugin_banners/koality/sqm-banner/banner-styles.css
#container {
container-type: inline-size;
container-name: bannercontainer;
display: flex;
justify-content: space-around;
}
aside {
width: 54.376rem;
background-color: white;
display: grid;
grid-template-columns: auto 1fr;
padding: 1.25rem;
border-radius: .5rem;
box-shadow: 0rem .5rem 1.25rem 0rem rgba(2, 2, 2, 0.04);
margin-bottom: 2.5rem;
figure {
-webkit-user-select: none; /* Safari */
user-select: none;
pointer-events: none;
align-content: start;
}
figcaption {
margin-left: 1.25rem;
display: grid;
font-family: "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
#heading {
font-size: 1.25rem;
font-weight: 500;
line-height: 120%;
list-style: none;
padding-bottom: .625rem;
#subtitle {
font-size: .875rem;
}
}
#description {
text-indent: .625rem;
font-size: 1rem;
font-weight: 400;
line-height: 150%;
list-style:disc;
li {
margin-left: 1.5rem;
span {
margin-left: -.625rem;
}
}
}
button {
outline: none;
display: flex;
align-items: center;
justify-content: center;
-webkit-user-select: none;
user-select: none;
position: relative;
cursor: pointer;
z-index: 2;
margin-top: 1.25rem;
justify-self: end;
padding: .25rem .5rem;
border-radius: .2rem;
border: .0625rem solid #003DA6;
background: #003DA6;
color: white;
font-size: .875rem;
font-weight: 400;
line-height: 150%;
&::before {
content: '';
position: absolute;
top: -1.25rem;
right: -1.25rem;
bottom: -1.25rem;
left: -1.25rem;
cursor: pointer;
z-index: 1;
}
.loading-animation {
display: inline-block;
border: .1875rem solid white;
border-top: .1875rem solid #003DA6;
border-radius: 50%;
width: .9375rem;
height: .9375rem;
animation: spin 2s linear infinite;
margin-right: .625rem;
}
}
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/* 620px breakpoint */
@container bannercontainer (width < 38.75rem) {
aside {
max-width: 23.125rem;
justify-items: center;
grid-template-columns: 1fr;
figure {
padding-bottom: 1.25rem;
}
figcaption {
margin-right: 1.25rem;
button {
justify-self: auto;
}
}
}
}
/* 546px breakpoint */
@container bannercontainer (width < 34.125rem) {
aside {
width: -moz-fit-content; /* firefox */
width: fit-content;
}
}
Back to Directory
File Manager