5078 lines
82 KiB
CSS
5078 lines
82 KiB
CSS
/* Grid system */
|
|
/* Breakpoints */
|
|
/* Display types */
|
|
/* Color palette */
|
|
/* Spacing scale */
|
|
/* Shadows (soft shadows) */
|
|
/* Flex utilities */
|
|
/* Button component variables */
|
|
/* Typography */
|
|
@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap");
|
|
@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Orbitron:wght@400..900&display=swap");
|
|
@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Orbitron:wght@400..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");
|
|
/* Reset */
|
|
*,
|
|
*::before,
|
|
*::after {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* Typography utilities */
|
|
body {
|
|
font-family: "Nunito", sans-serif;
|
|
font-size: 1.1rem;
|
|
line-height: 1.3;
|
|
color: #212529;
|
|
background-color: #ffffff;
|
|
}
|
|
|
|
a {
|
|
all: inherit;
|
|
cursor: pointer;
|
|
}
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
font-weight: 300;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 2.5rem;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 2rem;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 1.75rem;
|
|
}
|
|
|
|
h4 {
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
h5 {
|
|
font-size: 1.25rem;
|
|
}
|
|
|
|
h6 {
|
|
font-size: 1rem;
|
|
}
|
|
|
|
p {
|
|
font-weight: 300;
|
|
line-height: 1.3;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.text-xs {
|
|
font-size: 0.75rem;
|
|
}
|
|
|
|
.text-sm {
|
|
font-size: 0.875rem;
|
|
}
|
|
|
|
.text-base {
|
|
font-size: 1.1rem;
|
|
}
|
|
|
|
.text-lg {
|
|
font-size: 1.35rem;
|
|
}
|
|
|
|
.text-xl {
|
|
font-size: 1.8rem;
|
|
}
|
|
|
|
.text-xxl {
|
|
font-size: 2.2rem;
|
|
}
|
|
|
|
.fw-light {
|
|
font-weight: 300;
|
|
}
|
|
|
|
.fw-normal {
|
|
font-weight: 400;
|
|
}
|
|
|
|
.fw-medium {
|
|
font-weight: 500;
|
|
}
|
|
|
|
.fw-semibold {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.fw-bold {
|
|
font-weight: 700;
|
|
}
|
|
|
|
.lh-tight {
|
|
line-height: 1;
|
|
}
|
|
|
|
.lh-normal {
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.lh-heading {
|
|
line-height: 1.5;
|
|
}
|
|
|
|
h1, .h1 {
|
|
font-size: 2.2rem;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
h2, .h2 {
|
|
font-size: 1.8rem;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
h3, .h3 {
|
|
font-size: 1.35rem;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
h4, .h4 {
|
|
font-size: 1.1rem;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
h5, .h5 {
|
|
font-size: 0.875rem;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
h6, .h6 {
|
|
font-size: 0.75rem;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
/* Container */
|
|
.container {
|
|
width: 100%;
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
@media (min-width: 576px) {
|
|
.container {
|
|
max-width: 540px;
|
|
}
|
|
}
|
|
@media (min-width: 768px) {
|
|
.container {
|
|
max-width: 720px;
|
|
}
|
|
}
|
|
@media (min-width: 992px) {
|
|
.container {
|
|
max-width: 960px;
|
|
}
|
|
}
|
|
@media (min-width: 1200px) {
|
|
.container {
|
|
max-width: 1140px;
|
|
}
|
|
}
|
|
@media (min-width: 1400px) {
|
|
.container {
|
|
max-width: 1320px;
|
|
}
|
|
}
|
|
@media (min-width: 1600px) {
|
|
.container {
|
|
max-width: 1520px;
|
|
}
|
|
}
|
|
|
|
/* Display utilities */
|
|
.d-block {
|
|
display: block;
|
|
}
|
|
|
|
.d-flex {
|
|
display: flex;
|
|
}
|
|
|
|
.d-inline {
|
|
display: inline;
|
|
}
|
|
|
|
.d-inline-block {
|
|
display: inline-block;
|
|
}
|
|
|
|
.d-inline-flex {
|
|
display: inline-flex;
|
|
}
|
|
|
|
.d-grid {
|
|
display: grid;
|
|
}
|
|
|
|
.d-none {
|
|
display: none;
|
|
}
|
|
|
|
/* Color utilities */
|
|
.text-primary {
|
|
color: #aa0b3d !important;
|
|
}
|
|
|
|
.bg-primary {
|
|
background-color: #aa0b3d !important;
|
|
}
|
|
|
|
.text-primary-alt {
|
|
color: rgba(170, 11, 61, 0.6588235294) !important;
|
|
}
|
|
|
|
.bg-primary-alt {
|
|
background-color: rgba(170, 11, 61, 0.6588235294) !important;
|
|
}
|
|
|
|
.text-alt {
|
|
color: rgba(181, 69, 24, 0.5882352941) !important;
|
|
}
|
|
|
|
.bg-alt {
|
|
background-color: rgba(181, 69, 24, 0.5882352941) !important;
|
|
}
|
|
|
|
.text-secondary {
|
|
color: #333 !important;
|
|
}
|
|
|
|
.bg-secondary {
|
|
background-color: #333 !important;
|
|
}
|
|
|
|
.text-success {
|
|
color: #34b97b !important;
|
|
}
|
|
|
|
.bg-success {
|
|
background-color: #34b97b !important;
|
|
}
|
|
|
|
.text-warning {
|
|
color: #ffc107 !important;
|
|
}
|
|
|
|
.bg-warning {
|
|
background-color: #ffc107 !important;
|
|
}
|
|
|
|
.text-danger {
|
|
color: #dc3545 !important;
|
|
}
|
|
|
|
.bg-danger {
|
|
background-color: #dc3545 !important;
|
|
}
|
|
|
|
.text-info {
|
|
color: #0dcaf0 !important;
|
|
}
|
|
|
|
.bg-info {
|
|
background-color: #0dcaf0 !important;
|
|
}
|
|
|
|
.text-light {
|
|
color: #e5e5e5 !important;
|
|
}
|
|
|
|
.bg-light {
|
|
background-color: #e5e5e5 !important;
|
|
}
|
|
|
|
.text-dark {
|
|
color: #212529 !important;
|
|
}
|
|
|
|
.bg-dark {
|
|
background-color: #212529 !important;
|
|
}
|
|
|
|
.text-white {
|
|
color: #ffffff !important;
|
|
}
|
|
|
|
.bg-white {
|
|
background-color: #ffffff !important;
|
|
}
|
|
|
|
.text-black {
|
|
color: #000000 !important;
|
|
}
|
|
|
|
.bg-black {
|
|
background-color: #000000 !important;
|
|
}
|
|
|
|
.text-muted {
|
|
color: #C7C7C7 !important;
|
|
}
|
|
|
|
.bg-muted {
|
|
background-color: #C7C7C7 !important;
|
|
}
|
|
|
|
.text-accent-white {
|
|
color: #f7f7f7 !important;
|
|
}
|
|
|
|
.bg-accent-white {
|
|
background-color: #f7f7f7 !important;
|
|
}
|
|
|
|
.text-accent {
|
|
color: #08bbbb !important;
|
|
}
|
|
|
|
.bg-accent {
|
|
background-color: #08bbbb !important;
|
|
}
|
|
|
|
.text-transparent {
|
|
color: transparent !important;
|
|
}
|
|
|
|
.bg-transparent {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
/* Margin and padding utilities */
|
|
.m-0 {
|
|
margin: 0 !important;
|
|
}
|
|
|
|
.p-0 {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.mt-0 {
|
|
margin-top: 0 !important;
|
|
}
|
|
|
|
.mb-0 {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
|
|
.ml-0 {
|
|
margin-left: 0 !important;
|
|
}
|
|
|
|
.mr-0 {
|
|
margin-right: 0 !important;
|
|
}
|
|
|
|
.pt-0 {
|
|
padding-top: 0 !important;
|
|
}
|
|
|
|
.pb-0 {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
|
|
.pl-0 {
|
|
padding-left: 0 !important;
|
|
}
|
|
|
|
.pr-0 {
|
|
padding-right: 0 !important;
|
|
}
|
|
|
|
.m-1 {
|
|
margin: 0.25rem !important;
|
|
}
|
|
|
|
.p-1 {
|
|
padding: 0.25rem !important;
|
|
}
|
|
|
|
.mt-1 {
|
|
margin-top: 0.25rem !important;
|
|
}
|
|
|
|
.mb-1 {
|
|
margin-bottom: 0.25rem !important;
|
|
}
|
|
|
|
.ml-1 {
|
|
margin-left: 0.25rem !important;
|
|
}
|
|
|
|
.mr-1 {
|
|
margin-right: 0.25rem !important;
|
|
}
|
|
|
|
.pt-1 {
|
|
padding-top: 0.25rem !important;
|
|
}
|
|
|
|
.pb-1 {
|
|
padding-bottom: 0.25rem !important;
|
|
}
|
|
|
|
.pl-1 {
|
|
padding-left: 0.25rem !important;
|
|
}
|
|
|
|
.pr-1 {
|
|
padding-right: 0.25rem !important;
|
|
}
|
|
|
|
.m-2 {
|
|
margin: 0.5rem !important;
|
|
}
|
|
|
|
.p-2 {
|
|
padding: 0.5rem !important;
|
|
}
|
|
|
|
.mt-2 {
|
|
margin-top: 0.5rem !important;
|
|
}
|
|
|
|
.mb-2 {
|
|
margin-bottom: 0.5rem !important;
|
|
}
|
|
|
|
.ml-2 {
|
|
margin-left: 0.5rem !important;
|
|
}
|
|
|
|
.mr-2 {
|
|
margin-right: 0.5rem !important;
|
|
}
|
|
|
|
.pt-2 {
|
|
padding-top: 0.5rem !important;
|
|
}
|
|
|
|
.pb-2 {
|
|
padding-bottom: 0.5rem !important;
|
|
}
|
|
|
|
.pl-2 {
|
|
padding-left: 0.5rem !important;
|
|
}
|
|
|
|
.pr-2 {
|
|
padding-right: 0.5rem !important;
|
|
}
|
|
|
|
.m-3 {
|
|
margin: 1rem !important;
|
|
}
|
|
|
|
.p-3 {
|
|
padding: 1rem !important;
|
|
}
|
|
|
|
.mt-3 {
|
|
margin-top: 1rem !important;
|
|
}
|
|
|
|
.mb-3 {
|
|
margin-bottom: 1rem !important;
|
|
}
|
|
|
|
.ml-3 {
|
|
margin-left: 1rem !important;
|
|
}
|
|
|
|
.mr-3 {
|
|
margin-right: 1rem !important;
|
|
}
|
|
|
|
.pt-3 {
|
|
padding-top: 1rem !important;
|
|
}
|
|
|
|
.pb-3 {
|
|
padding-bottom: 1rem !important;
|
|
}
|
|
|
|
.pl-3 {
|
|
padding-left: 1rem !important;
|
|
}
|
|
|
|
.pr-3 {
|
|
padding-right: 1rem !important;
|
|
}
|
|
|
|
.m-4 {
|
|
margin: 1.5rem !important;
|
|
}
|
|
|
|
.p-4 {
|
|
padding: 1.5rem !important;
|
|
}
|
|
|
|
.mt-4 {
|
|
margin-top: 1.5rem !important;
|
|
}
|
|
|
|
.mb-4 {
|
|
margin-bottom: 1.5rem !important;
|
|
}
|
|
|
|
.ml-4 {
|
|
margin-left: 1.5rem !important;
|
|
}
|
|
|
|
.mr-4 {
|
|
margin-right: 1.5rem !important;
|
|
}
|
|
|
|
.pt-4 {
|
|
padding-top: 1.5rem !important;
|
|
}
|
|
|
|
.pb-4 {
|
|
padding-bottom: 1.5rem !important;
|
|
}
|
|
|
|
.pl-4 {
|
|
padding-left: 1.5rem !important;
|
|
}
|
|
|
|
.pr-4 {
|
|
padding-right: 1.5rem !important;
|
|
}
|
|
|
|
.m-5 {
|
|
margin: 3rem !important;
|
|
}
|
|
|
|
.p-5 {
|
|
padding: 3rem !important;
|
|
}
|
|
|
|
.mt-5 {
|
|
margin-top: 3rem !important;
|
|
}
|
|
|
|
.mb-5 {
|
|
margin-bottom: 3rem !important;
|
|
}
|
|
|
|
.ml-5 {
|
|
margin-left: 3rem !important;
|
|
}
|
|
|
|
.mr-5 {
|
|
margin-right: 3rem !important;
|
|
}
|
|
|
|
.pt-5 {
|
|
padding-top: 3rem !important;
|
|
}
|
|
|
|
.pb-5 {
|
|
padding-bottom: 3rem !important;
|
|
}
|
|
|
|
.pl-5 {
|
|
padding-left: 3rem !important;
|
|
}
|
|
|
|
.pr-5 {
|
|
padding-right: 3rem !important;
|
|
}
|
|
|
|
/* Grid system */
|
|
.row {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
margin-right: -1rem;
|
|
margin-left: -1rem;
|
|
}
|
|
|
|
.col {
|
|
flex: 1 0 0%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-auto {
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-1 {
|
|
flex: 0 0 8.3333333333%;
|
|
max-width: 8.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-2 {
|
|
flex: 0 0 16.6666666667%;
|
|
max-width: 16.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-3 {
|
|
flex: 0 0 25%;
|
|
max-width: 25%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-4 {
|
|
flex: 0 0 33.3333333333%;
|
|
max-width: 33.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-5 {
|
|
flex: 0 0 41.6666666667%;
|
|
max-width: 41.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-6 {
|
|
flex: 0 0 50%;
|
|
max-width: 50%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-7 {
|
|
flex: 0 0 58.3333333333%;
|
|
max-width: 58.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-8 {
|
|
flex: 0 0 66.6666666667%;
|
|
max-width: 66.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-9 {
|
|
flex: 0 0 75%;
|
|
max-width: 75%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-10 {
|
|
flex: 0 0 83.3333333333%;
|
|
max-width: 83.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-11 {
|
|
flex: 0 0 91.6666666667%;
|
|
max-width: 91.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.col-12 {
|
|
flex: 0 0 100%;
|
|
max-width: 100%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
@media (min-width: 576px) {
|
|
.col-sm {
|
|
flex: 1 0 0%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-auto {
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-1 {
|
|
flex: 0 0 8.3333333333%;
|
|
max-width: 8.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-2 {
|
|
flex: 0 0 16.6666666667%;
|
|
max-width: 16.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-3 {
|
|
flex: 0 0 25%;
|
|
max-width: 25%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-4 {
|
|
flex: 0 0 33.3333333333%;
|
|
max-width: 33.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-5 {
|
|
flex: 0 0 41.6666666667%;
|
|
max-width: 41.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-6 {
|
|
flex: 0 0 50%;
|
|
max-width: 50%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-7 {
|
|
flex: 0 0 58.3333333333%;
|
|
max-width: 58.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-8 {
|
|
flex: 0 0 66.6666666667%;
|
|
max-width: 66.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-9 {
|
|
flex: 0 0 75%;
|
|
max-width: 75%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-10 {
|
|
flex: 0 0 83.3333333333%;
|
|
max-width: 83.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-11 {
|
|
flex: 0 0 91.6666666667%;
|
|
max-width: 91.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-sm-12 {
|
|
flex: 0 0 100%;
|
|
max-width: 100%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
}
|
|
@media (min-width: 768px) {
|
|
.col-md {
|
|
flex: 1 0 0%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-auto {
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-1 {
|
|
flex: 0 0 8.3333333333%;
|
|
max-width: 8.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-2 {
|
|
flex: 0 0 16.6666666667%;
|
|
max-width: 16.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-3 {
|
|
flex: 0 0 25%;
|
|
max-width: 25%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-4 {
|
|
flex: 0 0 33.3333333333%;
|
|
max-width: 33.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-5 {
|
|
flex: 0 0 41.6666666667%;
|
|
max-width: 41.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-6 {
|
|
flex: 0 0 50%;
|
|
max-width: 50%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-7 {
|
|
flex: 0 0 58.3333333333%;
|
|
max-width: 58.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-8 {
|
|
flex: 0 0 66.6666666667%;
|
|
max-width: 66.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-9 {
|
|
flex: 0 0 75%;
|
|
max-width: 75%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-10 {
|
|
flex: 0 0 83.3333333333%;
|
|
max-width: 83.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-11 {
|
|
flex: 0 0 91.6666666667%;
|
|
max-width: 91.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-md-12 {
|
|
flex: 0 0 100%;
|
|
max-width: 100%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
}
|
|
@media (min-width: 992px) {
|
|
.col-lg {
|
|
flex: 1 0 0%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-auto {
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-1 {
|
|
flex: 0 0 8.3333333333%;
|
|
max-width: 8.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-2 {
|
|
flex: 0 0 16.6666666667%;
|
|
max-width: 16.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-3 {
|
|
flex: 0 0 25%;
|
|
max-width: 25%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-4 {
|
|
flex: 0 0 33.3333333333%;
|
|
max-width: 33.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-5 {
|
|
flex: 0 0 41.6666666667%;
|
|
max-width: 41.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-6 {
|
|
flex: 0 0 50%;
|
|
max-width: 50%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-7 {
|
|
flex: 0 0 58.3333333333%;
|
|
max-width: 58.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-8 {
|
|
flex: 0 0 66.6666666667%;
|
|
max-width: 66.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-9 {
|
|
flex: 0 0 75%;
|
|
max-width: 75%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-10 {
|
|
flex: 0 0 83.3333333333%;
|
|
max-width: 83.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-11 {
|
|
flex: 0 0 91.6666666667%;
|
|
max-width: 91.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-lg-12 {
|
|
flex: 0 0 100%;
|
|
max-width: 100%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
}
|
|
@media (min-width: 1200px) {
|
|
.col-xl {
|
|
flex: 1 0 0%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-auto {
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-1 {
|
|
flex: 0 0 8.3333333333%;
|
|
max-width: 8.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-2 {
|
|
flex: 0 0 16.6666666667%;
|
|
max-width: 16.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-3 {
|
|
flex: 0 0 25%;
|
|
max-width: 25%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-4 {
|
|
flex: 0 0 33.3333333333%;
|
|
max-width: 33.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-5 {
|
|
flex: 0 0 41.6666666667%;
|
|
max-width: 41.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-6 {
|
|
flex: 0 0 50%;
|
|
max-width: 50%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-7 {
|
|
flex: 0 0 58.3333333333%;
|
|
max-width: 58.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-8 {
|
|
flex: 0 0 66.6666666667%;
|
|
max-width: 66.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-9 {
|
|
flex: 0 0 75%;
|
|
max-width: 75%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-10 {
|
|
flex: 0 0 83.3333333333%;
|
|
max-width: 83.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-11 {
|
|
flex: 0 0 91.6666666667%;
|
|
max-width: 91.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xl-12 {
|
|
flex: 0 0 100%;
|
|
max-width: 100%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
}
|
|
@media (min-width: 1400px) {
|
|
.col-xxl {
|
|
flex: 1 0 0%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-auto {
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-1 {
|
|
flex: 0 0 8.3333333333%;
|
|
max-width: 8.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-2 {
|
|
flex: 0 0 16.6666666667%;
|
|
max-width: 16.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-3 {
|
|
flex: 0 0 25%;
|
|
max-width: 25%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-4 {
|
|
flex: 0 0 33.3333333333%;
|
|
max-width: 33.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-5 {
|
|
flex: 0 0 41.6666666667%;
|
|
max-width: 41.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-6 {
|
|
flex: 0 0 50%;
|
|
max-width: 50%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-7 {
|
|
flex: 0 0 58.3333333333%;
|
|
max-width: 58.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-8 {
|
|
flex: 0 0 66.6666666667%;
|
|
max-width: 66.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-9 {
|
|
flex: 0 0 75%;
|
|
max-width: 75%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-10 {
|
|
flex: 0 0 83.3333333333%;
|
|
max-width: 83.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-11 {
|
|
flex: 0 0 91.6666666667%;
|
|
max-width: 91.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxl-12 {
|
|
flex: 0 0 100%;
|
|
max-width: 100%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
}
|
|
@media (min-width: 1600px) {
|
|
.col-xxxl {
|
|
flex: 1 0 0%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-auto {
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-1 {
|
|
flex: 0 0 8.3333333333%;
|
|
max-width: 8.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-2 {
|
|
flex: 0 0 16.6666666667%;
|
|
max-width: 16.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-3 {
|
|
flex: 0 0 25%;
|
|
max-width: 25%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-4 {
|
|
flex: 0 0 33.3333333333%;
|
|
max-width: 33.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-5 {
|
|
flex: 0 0 41.6666666667%;
|
|
max-width: 41.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-6 {
|
|
flex: 0 0 50%;
|
|
max-width: 50%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-7 {
|
|
flex: 0 0 58.3333333333%;
|
|
max-width: 58.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-8 {
|
|
flex: 0 0 66.6666666667%;
|
|
max-width: 66.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-9 {
|
|
flex: 0 0 75%;
|
|
max-width: 75%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-10 {
|
|
flex: 0 0 83.3333333333%;
|
|
max-width: 83.3333333333%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-11 {
|
|
flex: 0 0 91.6666666667%;
|
|
max-width: 91.6666666667%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
.col-xxxl-12 {
|
|
flex: 0 0 100%;
|
|
max-width: 100%;
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
}
|
|
}
|
|
/* Gutter utilities with .g-X */
|
|
.row {
|
|
margin-right: -1rem; /* Default 1rem gutter */
|
|
margin-left: -1rem;
|
|
margin-top: -1rem; /* Vertical gutter */
|
|
margin-bottom: -1rem;
|
|
}
|
|
|
|
.col {
|
|
padding-right: 1rem; /* Default 1rem padding */
|
|
padding-left: 1rem;
|
|
padding-top: 1rem; /* Vertical padding */
|
|
padding-bottom: 1rem;
|
|
}
|
|
|
|
/* Variable gutter classes */
|
|
.g-0 {
|
|
margin-right: 0;
|
|
margin-left: 0;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.col.g-0 {
|
|
padding-right: 0;
|
|
padding-left: 0;
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
.g-1 {
|
|
margin-right: -0.25rem;
|
|
margin-left: -0.25rem;
|
|
margin-top: -0.25rem;
|
|
margin-bottom: -0.25rem;
|
|
}
|
|
|
|
.col.g-1 {
|
|
padding-right: 0.25rem;
|
|
padding-left: 0.25rem;
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
|
|
.g-2 {
|
|
margin-right: -0.5rem;
|
|
margin-left: -0.5rem;
|
|
margin-top: -0.5rem;
|
|
margin-bottom: -0.5rem;
|
|
}
|
|
|
|
.col.g-2 {
|
|
padding-right: 0.5rem;
|
|
padding-left: 0.5rem;
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
|
|
.g-3 {
|
|
margin-right: -1rem;
|
|
margin-left: -1rem;
|
|
margin-top: -1rem;
|
|
margin-bottom: -1rem;
|
|
}
|
|
|
|
.col.g-3 {
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
|
|
.g-4 {
|
|
margin-right: -1.5rem;
|
|
margin-left: -1.5rem;
|
|
margin-top: -1.5rem;
|
|
margin-bottom: -1.5rem;
|
|
}
|
|
|
|
.col.g-4 {
|
|
padding-right: 1.5rem;
|
|
padding-left: 1.5rem;
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
|
|
.g-5 {
|
|
margin-right: -3rem;
|
|
margin-left: -3rem;
|
|
margin-top: -3rem;
|
|
margin-bottom: -3rem;
|
|
}
|
|
|
|
.col.g-5 {
|
|
padding-right: 3rem;
|
|
padding-left: 3rem;
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
|
|
/* Responsive gutter classes */
|
|
@media (min-width: 576px) {
|
|
.sm-g-0 {
|
|
margin-right: 0;
|
|
margin-left: 0;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.sm-col.g-0 {
|
|
padding-right: 0;
|
|
padding-left: 0;
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.sm-g-1 {
|
|
margin-right: -0.25rem;
|
|
margin-left: -0.25rem;
|
|
margin-top: -0.25rem;
|
|
margin-bottom: -0.25rem;
|
|
}
|
|
.sm-col.g-1 {
|
|
padding-right: 0.25rem;
|
|
padding-left: 0.25rem;
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.sm-g-2 {
|
|
margin-right: -0.5rem;
|
|
margin-left: -0.5rem;
|
|
margin-top: -0.5rem;
|
|
margin-bottom: -0.5rem;
|
|
}
|
|
.sm-col.g-2 {
|
|
padding-right: 0.5rem;
|
|
padding-left: 0.5rem;
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.sm-g-3 {
|
|
margin-right: -1rem;
|
|
margin-left: -1rem;
|
|
margin-top: -1rem;
|
|
margin-bottom: -1rem;
|
|
}
|
|
.sm-col.g-3 {
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.sm-g-4 {
|
|
margin-right: -1.5rem;
|
|
margin-left: -1.5rem;
|
|
margin-top: -1.5rem;
|
|
margin-bottom: -1.5rem;
|
|
}
|
|
.sm-col.g-4 {
|
|
padding-right: 1.5rem;
|
|
padding-left: 1.5rem;
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.sm-g-5 {
|
|
margin-right: -3rem;
|
|
margin-left: -3rem;
|
|
margin-top: -3rem;
|
|
margin-bottom: -3rem;
|
|
}
|
|
.sm-col.g-5 {
|
|
padding-right: 3rem;
|
|
padding-left: 3rem;
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 768px) {
|
|
.md-g-0 {
|
|
margin-right: 0;
|
|
margin-left: 0;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.md-col.g-0 {
|
|
padding-right: 0;
|
|
padding-left: 0;
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.md-g-1 {
|
|
margin-right: -0.25rem;
|
|
margin-left: -0.25rem;
|
|
margin-top: -0.25rem;
|
|
margin-bottom: -0.25rem;
|
|
}
|
|
.md-col.g-1 {
|
|
padding-right: 0.25rem;
|
|
padding-left: 0.25rem;
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.md-g-2 {
|
|
margin-right: -0.5rem;
|
|
margin-left: -0.5rem;
|
|
margin-top: -0.5rem;
|
|
margin-bottom: -0.5rem;
|
|
}
|
|
.md-col.g-2 {
|
|
padding-right: 0.5rem;
|
|
padding-left: 0.5rem;
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.md-g-3 {
|
|
margin-right: -1rem;
|
|
margin-left: -1rem;
|
|
margin-top: -1rem;
|
|
margin-bottom: -1rem;
|
|
}
|
|
.md-col.g-3 {
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.md-g-4 {
|
|
margin-right: -1.5rem;
|
|
margin-left: -1.5rem;
|
|
margin-top: -1.5rem;
|
|
margin-bottom: -1.5rem;
|
|
}
|
|
.md-col.g-4 {
|
|
padding-right: 1.5rem;
|
|
padding-left: 1.5rem;
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.md-g-5 {
|
|
margin-right: -3rem;
|
|
margin-left: -3rem;
|
|
margin-top: -3rem;
|
|
margin-bottom: -3rem;
|
|
}
|
|
.md-col.g-5 {
|
|
padding-right: 3rem;
|
|
padding-left: 3rem;
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 992px) {
|
|
.lg-g-0 {
|
|
margin-right: 0;
|
|
margin-left: 0;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.lg-col.g-0 {
|
|
padding-right: 0;
|
|
padding-left: 0;
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.lg-g-1 {
|
|
margin-right: -0.25rem;
|
|
margin-left: -0.25rem;
|
|
margin-top: -0.25rem;
|
|
margin-bottom: -0.25rem;
|
|
}
|
|
.lg-col.g-1 {
|
|
padding-right: 0.25rem;
|
|
padding-left: 0.25rem;
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.lg-g-2 {
|
|
margin-right: -0.5rem;
|
|
margin-left: -0.5rem;
|
|
margin-top: -0.5rem;
|
|
margin-bottom: -0.5rem;
|
|
}
|
|
.lg-col.g-2 {
|
|
padding-right: 0.5rem;
|
|
padding-left: 0.5rem;
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.lg-g-3 {
|
|
margin-right: -1rem;
|
|
margin-left: -1rem;
|
|
margin-top: -1rem;
|
|
margin-bottom: -1rem;
|
|
}
|
|
.lg-col.g-3 {
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.lg-g-4 {
|
|
margin-right: -1.5rem;
|
|
margin-left: -1.5rem;
|
|
margin-top: -1.5rem;
|
|
margin-bottom: -1.5rem;
|
|
}
|
|
.lg-col.g-4 {
|
|
padding-right: 1.5rem;
|
|
padding-left: 1.5rem;
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.lg-g-5 {
|
|
margin-right: -3rem;
|
|
margin-left: -3rem;
|
|
margin-top: -3rem;
|
|
margin-bottom: -3rem;
|
|
}
|
|
.lg-col.g-5 {
|
|
padding-right: 3rem;
|
|
padding-left: 3rem;
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 1200px) {
|
|
.xl-g-0 {
|
|
margin-right: 0;
|
|
margin-left: 0;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.xl-col.g-0 {
|
|
padding-right: 0;
|
|
padding-left: 0;
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.xl-g-1 {
|
|
margin-right: -0.25rem;
|
|
margin-left: -0.25rem;
|
|
margin-top: -0.25rem;
|
|
margin-bottom: -0.25rem;
|
|
}
|
|
.xl-col.g-1 {
|
|
padding-right: 0.25rem;
|
|
padding-left: 0.25rem;
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.xl-g-2 {
|
|
margin-right: -0.5rem;
|
|
margin-left: -0.5rem;
|
|
margin-top: -0.5rem;
|
|
margin-bottom: -0.5rem;
|
|
}
|
|
.xl-col.g-2 {
|
|
padding-right: 0.5rem;
|
|
padding-left: 0.5rem;
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.xl-g-3 {
|
|
margin-right: -1rem;
|
|
margin-left: -1rem;
|
|
margin-top: -1rem;
|
|
margin-bottom: -1rem;
|
|
}
|
|
.xl-col.g-3 {
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.xl-g-4 {
|
|
margin-right: -1.5rem;
|
|
margin-left: -1.5rem;
|
|
margin-top: -1.5rem;
|
|
margin-bottom: -1.5rem;
|
|
}
|
|
.xl-col.g-4 {
|
|
padding-right: 1.5rem;
|
|
padding-left: 1.5rem;
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.xl-g-5 {
|
|
margin-right: -3rem;
|
|
margin-left: -3rem;
|
|
margin-top: -3rem;
|
|
margin-bottom: -3rem;
|
|
}
|
|
.xl-col.g-5 {
|
|
padding-right: 3rem;
|
|
padding-left: 3rem;
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 1400px) {
|
|
.xxl-g-0 {
|
|
margin-right: 0;
|
|
margin-left: 0;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.xxl-col.g-0 {
|
|
padding-right: 0;
|
|
padding-left: 0;
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.xxl-g-1 {
|
|
margin-right: -0.25rem;
|
|
margin-left: -0.25rem;
|
|
margin-top: -0.25rem;
|
|
margin-bottom: -0.25rem;
|
|
}
|
|
.xxl-col.g-1 {
|
|
padding-right: 0.25rem;
|
|
padding-left: 0.25rem;
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.xxl-g-2 {
|
|
margin-right: -0.5rem;
|
|
margin-left: -0.5rem;
|
|
margin-top: -0.5rem;
|
|
margin-bottom: -0.5rem;
|
|
}
|
|
.xxl-col.g-2 {
|
|
padding-right: 0.5rem;
|
|
padding-left: 0.5rem;
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.xxl-g-3 {
|
|
margin-right: -1rem;
|
|
margin-left: -1rem;
|
|
margin-top: -1rem;
|
|
margin-bottom: -1rem;
|
|
}
|
|
.xxl-col.g-3 {
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.xxl-g-4 {
|
|
margin-right: -1.5rem;
|
|
margin-left: -1.5rem;
|
|
margin-top: -1.5rem;
|
|
margin-bottom: -1.5rem;
|
|
}
|
|
.xxl-col.g-4 {
|
|
padding-right: 1.5rem;
|
|
padding-left: 1.5rem;
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.xxl-g-5 {
|
|
margin-right: -3rem;
|
|
margin-left: -3rem;
|
|
margin-top: -3rem;
|
|
margin-bottom: -3rem;
|
|
}
|
|
.xxl-col.g-5 {
|
|
padding-right: 3rem;
|
|
padding-left: 3rem;
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 1600px) {
|
|
.xxxl-g-0 {
|
|
margin-right: 0;
|
|
margin-left: 0;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.xxxl-col.g-0 {
|
|
padding-right: 0;
|
|
padding-left: 0;
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.xxxl-g-1 {
|
|
margin-right: -0.25rem;
|
|
margin-left: -0.25rem;
|
|
margin-top: -0.25rem;
|
|
margin-bottom: -0.25rem;
|
|
}
|
|
.xxxl-col.g-1 {
|
|
padding-right: 0.25rem;
|
|
padding-left: 0.25rem;
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.xxxl-g-2 {
|
|
margin-right: -0.5rem;
|
|
margin-left: -0.5rem;
|
|
margin-top: -0.5rem;
|
|
margin-bottom: -0.5rem;
|
|
}
|
|
.xxxl-col.g-2 {
|
|
padding-right: 0.5rem;
|
|
padding-left: 0.5rem;
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.xxxl-g-3 {
|
|
margin-right: -1rem;
|
|
margin-left: -1rem;
|
|
margin-top: -1rem;
|
|
margin-bottom: -1rem;
|
|
}
|
|
.xxxl-col.g-3 {
|
|
padding-right: 1rem;
|
|
padding-left: 1rem;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.xxxl-g-4 {
|
|
margin-right: -1.5rem;
|
|
margin-left: -1.5rem;
|
|
margin-top: -1.5rem;
|
|
margin-bottom: -1.5rem;
|
|
}
|
|
.xxxl-col.g-4 {
|
|
padding-right: 1.5rem;
|
|
padding-left: 1.5rem;
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.xxxl-g-5 {
|
|
margin-right: -3rem;
|
|
margin-left: -3rem;
|
|
margin-top: -3rem;
|
|
margin-bottom: -3rem;
|
|
}
|
|
.xxxl-col.g-5 {
|
|
padding-right: 3rem;
|
|
padding-left: 3rem;
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
/* Shadow utilities */
|
|
.shadow-1 {
|
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12) !important;
|
|
}
|
|
|
|
.shadow-2 {
|
|
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16) !important;
|
|
}
|
|
|
|
.shadow-3 {
|
|
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18) !important;
|
|
}
|
|
|
|
.shadow-4 {
|
|
box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2) !important;
|
|
}
|
|
|
|
.shadow-5 {
|
|
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22) !important;
|
|
}
|
|
|
|
.drop-shadow-1 {
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.14);
|
|
}
|
|
|
|
.drop-shadow-2 {
|
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
|
|
}
|
|
|
|
.drop-shadow-3 {
|
|
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
|
|
}
|
|
|
|
.drop-shadow-4 {
|
|
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.22);
|
|
}
|
|
|
|
.drop-shadow-5 {
|
|
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.24);
|
|
}
|
|
|
|
/* Flex utilities */
|
|
.flex-row {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.flex-row-reverse {
|
|
display: flex;
|
|
flex-direction: row-reverse;
|
|
}
|
|
|
|
.flex-column {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.flex-column-reverse {
|
|
display: flex;
|
|
flex-direction: column-reverse;
|
|
}
|
|
|
|
.justify-start {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.justify-end {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.justify-center {
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.justify-between {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.justify-around {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
}
|
|
|
|
.justify-evenly {
|
|
display: flex;
|
|
justify-content: space-evenly;
|
|
}
|
|
|
|
.align-start {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.align-end {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
}
|
|
|
|
.align-center {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.align-baseline {
|
|
display: flex;
|
|
align-items: baseline;
|
|
}
|
|
|
|
.align-stretch {
|
|
display: flex;
|
|
align-items: stretch;
|
|
}
|
|
|
|
/* Card component */
|
|
.card {
|
|
background-color: #ffffff;
|
|
border-radius: 0.5rem;
|
|
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18);
|
|
transition: box-shadow 0.3s ease;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
.card .card-header {
|
|
padding: 0.4rem;
|
|
}
|
|
.card .card-header.theme-header {
|
|
background-color: #212529 !important;
|
|
color: rgba(170, 11, 61, 0.6588235294);
|
|
}
|
|
.card .card-body {
|
|
padding: 1rem;
|
|
}
|
|
.card.card-hover:hover {
|
|
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
|
|
}
|
|
|
|
/* Button base */
|
|
.btn {
|
|
all: unset;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 0.45rem 0.9rem;
|
|
font-size: 0.875rem;
|
|
font-weight: 600;
|
|
border-radius: 0.5rem;
|
|
cursor: pointer;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
user-select: none;
|
|
transition: background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease, transform 0.1s ease;
|
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
|
|
line-height: 1.2;
|
|
}
|
|
.btn:focus-visible {
|
|
outline: 2px solid transparent;
|
|
box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.4);
|
|
}
|
|
.btn:active {
|
|
transform: translateY(1px);
|
|
box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
|
|
}
|
|
.btn:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
.btn.flat {
|
|
box-shadow: none;
|
|
padding: 0.25rem 0.5rem;
|
|
}
|
|
.btn.primary {
|
|
background-color: #aa0b3d;
|
|
color: #ffffff;
|
|
}
|
|
.btn.primary:hover:not(:disabled) {
|
|
background-color: rgb(136.4696132597, 8.8303867403, 48.9685082873);
|
|
}
|
|
.btn.secondary {
|
|
background-color: #333;
|
|
color: #ffffff;
|
|
}
|
|
.btn.secondary:hover:not(:disabled) {
|
|
background-color: rgb(33.15, 33.15, 33.15);
|
|
}
|
|
.btn.danger {
|
|
background-color: #dc3545;
|
|
color: #ffffff;
|
|
}
|
|
.btn.danger:hover:not(:disabled) {
|
|
background-color: rgb(202.2556962025, 35.0443037975, 51.064556962);
|
|
}
|
|
|
|
/* Filled buttons */
|
|
.btn-primary {
|
|
background-color: #aa0b3d;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-primary:hover {
|
|
background-color: rgb(131.679558011, 8.520441989, 47.2497237569);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-primary:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(170, 11, 61, 0.4);
|
|
}
|
|
.btn-primary:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-primary-alt {
|
|
background-color: rgba(170, 11, 61, 0.6588235294);
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-primary-alt:hover {
|
|
background-color: rgba(131.679558011, 8.520441989, 47.2497237569, 0.6588235294);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-primary-alt:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(170, 11, 61, 0.4);
|
|
}
|
|
.btn-primary-alt:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-alt {
|
|
background-color: rgba(181, 69, 24, 0.5882352941);
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-alt:hover {
|
|
background-color: rgba(144.9765853659, 55.2673170732, 19.2234146341, 0.5882352941);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-alt:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(181, 69, 24, 0.4);
|
|
}
|
|
.btn-alt:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-secondary {
|
|
background-color: #333;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-secondary:hover {
|
|
background-color: rgb(30.6, 30.6, 30.6);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-secondary:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(51, 51, 51, 0.4);
|
|
}
|
|
.btn-secondary:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-success {
|
|
background-color: #34b97b;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-success:hover {
|
|
background-color: rgb(43.0481012658, 153.1518987342, 101.8253164557);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-success:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(52, 185, 123, 0.4);
|
|
}
|
|
.btn-success:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-warning {
|
|
background-color: #ffc107;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-warning:hover {
|
|
background-color: rgb(221.2, 165.9, 0);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-warning:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(255, 193, 7, 0.4);
|
|
}
|
|
.btn-warning:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-danger {
|
|
background-color: #dc3545;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-danger:hover {
|
|
background-color: rgb(197.9088607595, 34.2911392405, 49.9670886076);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-danger:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.4);
|
|
}
|
|
.btn-danger:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-info {
|
|
background-color: #0dcaf0;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-info:hover {
|
|
background-color: rgb(10.9035573123, 169.4245059289, 201.2964426877);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-info:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(13, 202, 240, 0.4);
|
|
}
|
|
.btn-info:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-light {
|
|
background-color: #e5e5e5;
|
|
color: #212529;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-light:hover {
|
|
background-color: rgb(208.6, 208.6, 208.6);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-light:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(229, 229, 229, 0.4);
|
|
}
|
|
.btn-light:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-dark {
|
|
background-color: #212529;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-dark:hover {
|
|
background-color: rgb(14.8054054054, 16.6, 18.3945945946);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-dark:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(33, 37, 41, 0.4);
|
|
}
|
|
.btn-dark:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-white {
|
|
background-color: #ffffff;
|
|
color: #212529;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-white:hover {
|
|
background-color: rgb(234.6, 234.6, 234.6);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-white:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.4);
|
|
}
|
|
.btn-white:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-black {
|
|
background-color: #000000;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-black:hover {
|
|
background-color: black;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-black:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.4);
|
|
}
|
|
.btn-black:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-muted {
|
|
background-color: #C7C7C7;
|
|
color: #212529;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-muted:hover {
|
|
background-color: rgb(178.6, 178.6, 178.6);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-muted:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(199, 199, 199, 0.4);
|
|
}
|
|
.btn-muted:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-accent-white {
|
|
background-color: #f7f7f7;
|
|
color: #212529;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-accent-white:hover {
|
|
background-color: rgb(226.6, 226.6, 226.6);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-accent-white:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(247, 247, 247, 0.4);
|
|
}
|
|
.btn-accent-white:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-accent {
|
|
background-color: #08bbbb;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-accent:hover {
|
|
background-color: rgb(6.3261538462, 147.8738461538, 147.8738461538);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-accent:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(8, 187, 187, 0.4);
|
|
}
|
|
.btn-accent:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-transparent {
|
|
background-color: transparent;
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.btn-transparent:hover {
|
|
background-color: rgba(0, 0, 0, 0);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-transparent:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.4);
|
|
}
|
|
.btn-transparent:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* Outline buttons */
|
|
.btn-outline-primary {
|
|
background-color: transparent;
|
|
border: 2px solid #aa0b3d;
|
|
color: #aa0b3d;
|
|
}
|
|
.btn-outline-primary:hover {
|
|
background-color: #aa0b3d;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-primary:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(170, 11, 61, 0.4);
|
|
}
|
|
.btn-outline-primary:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-primary-alt {
|
|
background-color: transparent;
|
|
border: 2px solid rgba(170, 11, 61, 0.6588235294);
|
|
color: rgba(170, 11, 61, 0.6588235294);
|
|
}
|
|
.btn-outline-primary-alt:hover {
|
|
background-color: rgba(170, 11, 61, 0.6588235294);
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-primary-alt:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(170, 11, 61, 0.4);
|
|
}
|
|
.btn-outline-primary-alt:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-alt {
|
|
background-color: transparent;
|
|
border: 2px solid rgba(181, 69, 24, 0.5882352941);
|
|
color: rgba(181, 69, 24, 0.5882352941);
|
|
}
|
|
.btn-outline-alt:hover {
|
|
background-color: rgba(181, 69, 24, 0.5882352941);
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-alt:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(181, 69, 24, 0.4);
|
|
}
|
|
.btn-outline-alt:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-secondary {
|
|
background-color: transparent;
|
|
border: 2px solid #333;
|
|
color: #333;
|
|
}
|
|
.btn-outline-secondary:hover {
|
|
background-color: #333;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-secondary:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(51, 51, 51, 0.4);
|
|
}
|
|
.btn-outline-secondary:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-success {
|
|
background-color: transparent;
|
|
border: 2px solid #34b97b;
|
|
color: #34b97b;
|
|
}
|
|
.btn-outline-success:hover {
|
|
background-color: #34b97b;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-success:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(52, 185, 123, 0.4);
|
|
}
|
|
.btn-outline-success:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-warning {
|
|
background-color: transparent;
|
|
border: 2px solid #ffc107;
|
|
color: #ffc107;
|
|
}
|
|
.btn-outline-warning:hover {
|
|
background-color: #ffc107;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-warning:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(255, 193, 7, 0.4);
|
|
}
|
|
.btn-outline-warning:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-danger {
|
|
background-color: transparent;
|
|
border: 2px solid #dc3545;
|
|
color: #dc3545;
|
|
}
|
|
.btn-outline-danger:hover {
|
|
background-color: #dc3545;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-danger:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.4);
|
|
}
|
|
.btn-outline-danger:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-info {
|
|
background-color: transparent;
|
|
border: 2px solid #0dcaf0;
|
|
color: #0dcaf0;
|
|
}
|
|
.btn-outline-info:hover {
|
|
background-color: #0dcaf0;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-info:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(13, 202, 240, 0.4);
|
|
}
|
|
.btn-outline-info:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-light {
|
|
background-color: transparent;
|
|
border: 2px solid #e5e5e5;
|
|
color: #e5e5e5;
|
|
}
|
|
.btn-outline-light:hover {
|
|
background-color: #e5e5e5;
|
|
color: #212529;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-light:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(229, 229, 229, 0.4);
|
|
}
|
|
.btn-outline-light:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-dark {
|
|
background-color: transparent;
|
|
border: 2px solid #212529;
|
|
color: #212529;
|
|
}
|
|
.btn-outline-dark:hover {
|
|
background-color: #212529;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-dark:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(33, 37, 41, 0.4);
|
|
}
|
|
.btn-outline-dark:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-white {
|
|
background-color: transparent;
|
|
border: 2px solid #ffffff;
|
|
color: #ffffff;
|
|
}
|
|
.btn-outline-white:hover {
|
|
background-color: #ffffff;
|
|
color: #212529;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-white:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.4);
|
|
}
|
|
.btn-outline-white:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-black {
|
|
background-color: transparent;
|
|
border: 2px solid #000000;
|
|
color: #000000;
|
|
}
|
|
.btn-outline-black:hover {
|
|
background-color: #000000;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-black:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.4);
|
|
}
|
|
.btn-outline-black:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-muted {
|
|
background-color: transparent;
|
|
border: 2px solid #C7C7C7;
|
|
color: #C7C7C7;
|
|
}
|
|
.btn-outline-muted:hover {
|
|
background-color: #C7C7C7;
|
|
color: #212529;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-muted:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(199, 199, 199, 0.4);
|
|
}
|
|
.btn-outline-muted:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-accent-white {
|
|
background-color: transparent;
|
|
border: 2px solid #f7f7f7;
|
|
color: #f7f7f7;
|
|
}
|
|
.btn-outline-accent-white:hover {
|
|
background-color: #f7f7f7;
|
|
color: #212529;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-accent-white:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(247, 247, 247, 0.4);
|
|
}
|
|
.btn-outline-accent-white:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-accent {
|
|
background-color: transparent;
|
|
border: 2px solid #08bbbb;
|
|
color: #08bbbb;
|
|
}
|
|
.btn-outline-accent:hover {
|
|
background-color: #08bbbb;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-accent:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(8, 187, 187, 0.4);
|
|
}
|
|
.btn-outline-accent:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-outline-transparent {
|
|
background-color: transparent;
|
|
border: 2px solid transparent;
|
|
color: transparent;
|
|
}
|
|
.btn-outline-transparent:hover {
|
|
background-color: transparent;
|
|
color: #fff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.btn-outline-transparent:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.4);
|
|
}
|
|
.btn-outline-transparent:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* Ghost buttons */
|
|
.btn-ghost-primary {
|
|
background-color: transparent;
|
|
color: #aa0b3d;
|
|
border: none;
|
|
}
|
|
.btn-ghost-primary:hover {
|
|
background-color: rgba(170, 11, 61, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-primary:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(170, 11, 61, 0.4);
|
|
}
|
|
.btn-ghost-primary:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-primary-alt {
|
|
background-color: transparent;
|
|
color: rgba(170, 11, 61, 0.6588235294);
|
|
border: none;
|
|
}
|
|
.btn-ghost-primary-alt:hover {
|
|
background-color: rgba(170, 11, 61, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-primary-alt:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(170, 11, 61, 0.4);
|
|
}
|
|
.btn-ghost-primary-alt:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-alt {
|
|
background-color: transparent;
|
|
color: rgba(181, 69, 24, 0.5882352941);
|
|
border: none;
|
|
}
|
|
.btn-ghost-alt:hover {
|
|
background-color: rgba(181, 69, 24, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-alt:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(181, 69, 24, 0.4);
|
|
}
|
|
.btn-ghost-alt:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-secondary {
|
|
background-color: transparent;
|
|
color: #333;
|
|
border: none;
|
|
}
|
|
.btn-ghost-secondary:hover {
|
|
background-color: rgba(51, 51, 51, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-secondary:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(51, 51, 51, 0.4);
|
|
}
|
|
.btn-ghost-secondary:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-success {
|
|
background-color: transparent;
|
|
color: #34b97b;
|
|
border: none;
|
|
}
|
|
.btn-ghost-success:hover {
|
|
background-color: rgba(52, 185, 123, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-success:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(52, 185, 123, 0.4);
|
|
}
|
|
.btn-ghost-success:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-warning {
|
|
background-color: transparent;
|
|
color: #ffc107;
|
|
border: none;
|
|
}
|
|
.btn-ghost-warning:hover {
|
|
background-color: rgba(255, 193, 7, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-warning:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(255, 193, 7, 0.4);
|
|
}
|
|
.btn-ghost-warning:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-danger {
|
|
background-color: transparent;
|
|
color: #dc3545;
|
|
border: none;
|
|
}
|
|
.btn-ghost-danger:hover {
|
|
background-color: rgba(220, 53, 69, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-danger:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.4);
|
|
}
|
|
.btn-ghost-danger:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-info {
|
|
background-color: transparent;
|
|
color: #0dcaf0;
|
|
border: none;
|
|
}
|
|
.btn-ghost-info:hover {
|
|
background-color: rgba(13, 202, 240, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-info:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(13, 202, 240, 0.4);
|
|
}
|
|
.btn-ghost-info:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-light {
|
|
background-color: transparent;
|
|
color: #e5e5e5;
|
|
border: none;
|
|
}
|
|
.btn-ghost-light:hover {
|
|
background-color: rgba(229, 229, 229, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-light:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(229, 229, 229, 0.4);
|
|
}
|
|
.btn-ghost-light:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-dark {
|
|
background-color: transparent;
|
|
color: #212529;
|
|
border: none;
|
|
}
|
|
.btn-ghost-dark:hover {
|
|
background-color: rgba(33, 37, 41, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-dark:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(33, 37, 41, 0.4);
|
|
}
|
|
.btn-ghost-dark:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-white {
|
|
background-color: transparent;
|
|
color: #ffffff;
|
|
border: none;
|
|
}
|
|
.btn-ghost-white:hover {
|
|
background-color: rgba(255, 255, 255, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-white:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.4);
|
|
}
|
|
.btn-ghost-white:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-black {
|
|
background-color: transparent;
|
|
color: #000000;
|
|
border: none;
|
|
}
|
|
.btn-ghost-black:hover {
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-black:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.4);
|
|
}
|
|
.btn-ghost-black:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-muted {
|
|
background-color: transparent;
|
|
color: #C7C7C7;
|
|
border: none;
|
|
}
|
|
.btn-ghost-muted:hover {
|
|
background-color: rgba(199, 199, 199, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-muted:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(199, 199, 199, 0.4);
|
|
}
|
|
.btn-ghost-muted:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-accent-white {
|
|
background-color: transparent;
|
|
color: #f7f7f7;
|
|
border: none;
|
|
}
|
|
.btn-ghost-accent-white:hover {
|
|
background-color: rgba(247, 247, 247, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-accent-white:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(247, 247, 247, 0.4);
|
|
}
|
|
.btn-ghost-accent-white:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-accent {
|
|
background-color: transparent;
|
|
color: #08bbbb;
|
|
border: none;
|
|
}
|
|
.btn-ghost-accent:hover {
|
|
background-color: rgba(8, 187, 187, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-accent:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(8, 187, 187, 0.4);
|
|
}
|
|
.btn-ghost-accent:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.btn-ghost-transparent {
|
|
background-color: transparent;
|
|
color: transparent;
|
|
border: none;
|
|
}
|
|
.btn-ghost-transparent:hover {
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|
box-shadow: none;
|
|
}
|
|
.btn-ghost-transparent:focus-visible {
|
|
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.4);
|
|
}
|
|
.btn-ghost-transparent:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.border-0 {
|
|
border: 0 solid currentColor;
|
|
}
|
|
|
|
.border-1 {
|
|
border: 1px solid currentColor;
|
|
}
|
|
|
|
.border-2 {
|
|
border: 2px solid currentColor;
|
|
}
|
|
|
|
.border-3 {
|
|
border: 3px solid currentColor;
|
|
}
|
|
|
|
.border {
|
|
border: 1px solid currentColor;
|
|
}
|
|
|
|
.border-top {
|
|
border-top: 1px solid currentColor;
|
|
}
|
|
|
|
.border-bottom {
|
|
border-bottom: 1px solid currentColor;
|
|
}
|
|
|
|
.border-left {
|
|
border-left: 1px solid currentColor;
|
|
}
|
|
|
|
.border-right {
|
|
border-right: 1px solid currentColor;
|
|
}
|
|
|
|
.rounded-none {
|
|
border-radius: 0;
|
|
}
|
|
|
|
.rounded-sm {
|
|
border-radius: 0.125rem;
|
|
}
|
|
|
|
.rounded-md {
|
|
border-radius: 0.25rem;
|
|
}
|
|
|
|
.rounded-lg {
|
|
border-radius: 0.5rem;
|
|
}
|
|
|
|
.rounded-xl {
|
|
border-radius: 1rem;
|
|
}
|
|
|
|
.rounded-full {
|
|
border-radius: 9999px;
|
|
}
|
|
|
|
.rounded {
|
|
border-radius: 0.25rem;
|
|
}
|
|
|
|
.rounded-top {
|
|
border-top-left-radius: 0.25rem;
|
|
border-top-right-radius: 0.25rem;
|
|
}
|
|
|
|
.rounded-bottom {
|
|
border-bottom-left-radius: 0.25rem;
|
|
border-bottom-right-radius: 0.25rem;
|
|
}
|
|
|
|
.rounded-left {
|
|
border-top-left-radius: 0.25rem;
|
|
border-bottom-left-radius: 0.25rem;
|
|
}
|
|
|
|
.rounded-right {
|
|
border-top-right-radius: 0.25rem;
|
|
border-bottom-right-radius: 0.25rem;
|
|
}
|
|
|
|
.ms-0 {
|
|
margin-left: 0;
|
|
}
|
|
|
|
.me-0 {
|
|
margin-right: 0;
|
|
}
|
|
|
|
.mt-0 {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.mb-0 {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.mx-0 {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
|
|
.my-0 {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.ms-1 {
|
|
margin-left: 0.25rem;
|
|
}
|
|
|
|
.me-1 {
|
|
margin-right: 0.25rem;
|
|
}
|
|
|
|
.mt-1 {
|
|
margin-top: 0.25rem;
|
|
}
|
|
|
|
.mb-1 {
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
|
|
.mx-1 {
|
|
margin-left: 0.25rem;
|
|
margin-right: 0.25rem;
|
|
}
|
|
|
|
.my-1 {
|
|
margin-top: 0.25rem;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
|
|
.ms-2 {
|
|
margin-left: 0.5rem;
|
|
}
|
|
|
|
.me-2 {
|
|
margin-right: 0.5rem;
|
|
}
|
|
|
|
.mt-2 {
|
|
margin-top: 0.5rem;
|
|
}
|
|
|
|
.mb-2 {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.mx-2 {
|
|
margin-left: 0.5rem;
|
|
margin-right: 0.5rem;
|
|
}
|
|
|
|
.my-2 {
|
|
margin-top: 0.5rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.ms-3 {
|
|
margin-left: 1rem;
|
|
}
|
|
|
|
.me-3 {
|
|
margin-right: 1rem;
|
|
}
|
|
|
|
.mt-3 {
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.mb-3 {
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.mx-3 {
|
|
margin-left: 1rem;
|
|
margin-right: 1rem;
|
|
}
|
|
|
|
.my-3 {
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.ms-4 {
|
|
margin-left: 1.5rem;
|
|
}
|
|
|
|
.me-4 {
|
|
margin-right: 1.5rem;
|
|
}
|
|
|
|
.mt-4 {
|
|
margin-top: 1.5rem;
|
|
}
|
|
|
|
.mb-4 {
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
|
|
.mx-4 {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
}
|
|
|
|
.my-4 {
|
|
margin-top: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
|
|
.ms-5 {
|
|
margin-left: 3rem;
|
|
}
|
|
|
|
.me-5 {
|
|
margin-right: 3rem;
|
|
}
|
|
|
|
.mt-5 {
|
|
margin-top: 3rem;
|
|
}
|
|
|
|
.mb-5 {
|
|
margin-bottom: 3rem;
|
|
}
|
|
|
|
.mx-5 {
|
|
margin-left: 3rem;
|
|
margin-right: 3rem;
|
|
}
|
|
|
|
.my-5 {
|
|
margin-top: 3rem;
|
|
margin-bottom: 3rem;
|
|
}
|
|
|
|
.ps-0 {
|
|
padding-left: 0;
|
|
}
|
|
|
|
.pe-0 {
|
|
padding-right: 0;
|
|
}
|
|
|
|
.pt-0 {
|
|
padding-top: 0;
|
|
}
|
|
|
|
.pb-0 {
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
.px-0 {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
|
|
.py-0 {
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
.ps-1 {
|
|
padding-left: 0.25rem;
|
|
}
|
|
|
|
.pe-1 {
|
|
padding-right: 0.25rem;
|
|
}
|
|
|
|
.pt-1 {
|
|
padding-top: 0.25rem;
|
|
}
|
|
|
|
.pb-1 {
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
|
|
.px-1 {
|
|
padding-left: 0.25rem;
|
|
padding-right: 0.25rem;
|
|
}
|
|
|
|
.py-1 {
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
|
|
.ps-2 {
|
|
padding-left: 0.5rem;
|
|
}
|
|
|
|
.pe-2 {
|
|
padding-right: 0.5rem;
|
|
}
|
|
|
|
.pt-2 {
|
|
padding-top: 0.5rem;
|
|
}
|
|
|
|
.pb-2 {
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
|
|
.px-2 {
|
|
padding-left: 0.5rem;
|
|
padding-right: 0.5rem;
|
|
}
|
|
|
|
.py-2 {
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
|
|
.ps-3 {
|
|
padding-left: 1rem;
|
|
}
|
|
|
|
.pe-3 {
|
|
padding-right: 1rem;
|
|
}
|
|
|
|
.pt-3 {
|
|
padding-top: 1rem;
|
|
}
|
|
|
|
.pb-3 {
|
|
padding-bottom: 1rem;
|
|
}
|
|
|
|
.px-3 {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
|
|
.py-3 {
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
|
|
.ps-4 {
|
|
padding-left: 1.5rem;
|
|
}
|
|
|
|
.pe-4 {
|
|
padding-right: 1.5rem;
|
|
}
|
|
|
|
.pt-4 {
|
|
padding-top: 1.5rem;
|
|
}
|
|
|
|
.pb-4 {
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
|
|
.px-4 {
|
|
padding-left: 1.5rem;
|
|
padding-right: 1.5rem;
|
|
}
|
|
|
|
.py-4 {
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
|
|
.ps-5 {
|
|
padding-left: 3rem;
|
|
}
|
|
|
|
.pe-5 {
|
|
padding-right: 3rem;
|
|
}
|
|
|
|
.pt-5 {
|
|
padding-top: 3rem;
|
|
}
|
|
|
|
.pb-5 {
|
|
padding-bottom: 3rem;
|
|
}
|
|
|
|
.px-5 {
|
|
padding-left: 3rem;
|
|
padding-right: 3rem;
|
|
}
|
|
|
|
.py-5 {
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
|
|
@media (min-width: 576px) {
|
|
.sm-ms-0 {
|
|
margin-left: 0;
|
|
}
|
|
.sm-me-0 {
|
|
margin-right: 0;
|
|
}
|
|
.sm-mt-0 {
|
|
margin-top: 0;
|
|
}
|
|
.sm-mb-0 {
|
|
margin-bottom: 0;
|
|
}
|
|
.sm-mx-0 {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
.sm-my-0 {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.sm-ps-0 {
|
|
padding-left: 0;
|
|
}
|
|
.sm-pe-0 {
|
|
padding-right: 0;
|
|
}
|
|
.sm-pt-0 {
|
|
padding-top: 0;
|
|
}
|
|
.sm-pb-0 {
|
|
padding-bottom: 0;
|
|
}
|
|
.sm-px-0 {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.sm-py-0 {
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.sm-ms-1 {
|
|
margin-left: 0.25rem;
|
|
}
|
|
.sm-me-1 {
|
|
margin-right: 0.25rem;
|
|
}
|
|
.sm-mt-1 {
|
|
margin-top: 0.25rem;
|
|
}
|
|
.sm-mb-1 {
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.sm-mx-1 {
|
|
margin-left: 0.25rem;
|
|
margin-right: 0.25rem;
|
|
}
|
|
.sm-my-1 {
|
|
margin-top: 0.25rem;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.sm-ps-1 {
|
|
padding-left: 0.25rem;
|
|
}
|
|
.sm-pe-1 {
|
|
padding-right: 0.25rem;
|
|
}
|
|
.sm-pt-1 {
|
|
padding-top: 0.25rem;
|
|
}
|
|
.sm-pb-1 {
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.sm-px-1 {
|
|
padding-left: 0.25rem;
|
|
padding-right: 0.25rem;
|
|
}
|
|
.sm-py-1 {
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.sm-ms-2 {
|
|
margin-left: 0.5rem;
|
|
}
|
|
.sm-me-2 {
|
|
margin-right: 0.5rem;
|
|
}
|
|
.sm-mt-2 {
|
|
margin-top: 0.5rem;
|
|
}
|
|
.sm-mb-2 {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.sm-mx-2 {
|
|
margin-left: 0.5rem;
|
|
margin-right: 0.5rem;
|
|
}
|
|
.sm-my-2 {
|
|
margin-top: 0.5rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.sm-ps-2 {
|
|
padding-left: 0.5rem;
|
|
}
|
|
.sm-pe-2 {
|
|
padding-right: 0.5rem;
|
|
}
|
|
.sm-pt-2 {
|
|
padding-top: 0.5rem;
|
|
}
|
|
.sm-pb-2 {
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.sm-px-2 {
|
|
padding-left: 0.5rem;
|
|
padding-right: 0.5rem;
|
|
}
|
|
.sm-py-2 {
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.sm-ms-3 {
|
|
margin-left: 1rem;
|
|
}
|
|
.sm-me-3 {
|
|
margin-right: 1rem;
|
|
}
|
|
.sm-mt-3 {
|
|
margin-top: 1rem;
|
|
}
|
|
.sm-mb-3 {
|
|
margin-bottom: 1rem;
|
|
}
|
|
.sm-mx-3 {
|
|
margin-left: 1rem;
|
|
margin-right: 1rem;
|
|
}
|
|
.sm-my-3 {
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
.sm-ps-3 {
|
|
padding-left: 1rem;
|
|
}
|
|
.sm-pe-3 {
|
|
padding-right: 1rem;
|
|
}
|
|
.sm-pt-3 {
|
|
padding-top: 1rem;
|
|
}
|
|
.sm-pb-3 {
|
|
padding-bottom: 1rem;
|
|
}
|
|
.sm-px-3 {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
.sm-py-3 {
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.sm-ms-4 {
|
|
margin-left: 1.5rem;
|
|
}
|
|
.sm-me-4 {
|
|
margin-right: 1.5rem;
|
|
}
|
|
.sm-mt-4 {
|
|
margin-top: 1.5rem;
|
|
}
|
|
.sm-mb-4 {
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.sm-mx-4 {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
}
|
|
.sm-my-4 {
|
|
margin-top: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.sm-ps-4 {
|
|
padding-left: 1.5rem;
|
|
}
|
|
.sm-pe-4 {
|
|
padding-right: 1.5rem;
|
|
}
|
|
.sm-pt-4 {
|
|
padding-top: 1.5rem;
|
|
}
|
|
.sm-pb-4 {
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.sm-px-4 {
|
|
padding-left: 1.5rem;
|
|
padding-right: 1.5rem;
|
|
}
|
|
.sm-py-4 {
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.sm-ms-5 {
|
|
margin-left: 3rem;
|
|
}
|
|
.sm-me-5 {
|
|
margin-right: 3rem;
|
|
}
|
|
.sm-mt-5 {
|
|
margin-top: 3rem;
|
|
}
|
|
.sm-mb-5 {
|
|
margin-bottom: 3rem;
|
|
}
|
|
.sm-mx-5 {
|
|
margin-left: 3rem;
|
|
margin-right: 3rem;
|
|
}
|
|
.sm-my-5 {
|
|
margin-top: 3rem;
|
|
margin-bottom: 3rem;
|
|
}
|
|
.sm-ps-5 {
|
|
padding-left: 3rem;
|
|
}
|
|
.sm-pe-5 {
|
|
padding-right: 3rem;
|
|
}
|
|
.sm-pt-5 {
|
|
padding-top: 3rem;
|
|
}
|
|
.sm-pb-5 {
|
|
padding-bottom: 3rem;
|
|
}
|
|
.sm-px-5 {
|
|
padding-left: 3rem;
|
|
padding-right: 3rem;
|
|
}
|
|
.sm-py-5 {
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 768px) {
|
|
.md-ms-0 {
|
|
margin-left: 0;
|
|
}
|
|
.md-me-0 {
|
|
margin-right: 0;
|
|
}
|
|
.md-mt-0 {
|
|
margin-top: 0;
|
|
}
|
|
.md-mb-0 {
|
|
margin-bottom: 0;
|
|
}
|
|
.md-mx-0 {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
.md-my-0 {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.md-ps-0 {
|
|
padding-left: 0;
|
|
}
|
|
.md-pe-0 {
|
|
padding-right: 0;
|
|
}
|
|
.md-pt-0 {
|
|
padding-top: 0;
|
|
}
|
|
.md-pb-0 {
|
|
padding-bottom: 0;
|
|
}
|
|
.md-px-0 {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.md-py-0 {
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.md-ms-1 {
|
|
margin-left: 0.25rem;
|
|
}
|
|
.md-me-1 {
|
|
margin-right: 0.25rem;
|
|
}
|
|
.md-mt-1 {
|
|
margin-top: 0.25rem;
|
|
}
|
|
.md-mb-1 {
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.md-mx-1 {
|
|
margin-left: 0.25rem;
|
|
margin-right: 0.25rem;
|
|
}
|
|
.md-my-1 {
|
|
margin-top: 0.25rem;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.md-ps-1 {
|
|
padding-left: 0.25rem;
|
|
}
|
|
.md-pe-1 {
|
|
padding-right: 0.25rem;
|
|
}
|
|
.md-pt-1 {
|
|
padding-top: 0.25rem;
|
|
}
|
|
.md-pb-1 {
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.md-px-1 {
|
|
padding-left: 0.25rem;
|
|
padding-right: 0.25rem;
|
|
}
|
|
.md-py-1 {
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.md-ms-2 {
|
|
margin-left: 0.5rem;
|
|
}
|
|
.md-me-2 {
|
|
margin-right: 0.5rem;
|
|
}
|
|
.md-mt-2 {
|
|
margin-top: 0.5rem;
|
|
}
|
|
.md-mb-2 {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.md-mx-2 {
|
|
margin-left: 0.5rem;
|
|
margin-right: 0.5rem;
|
|
}
|
|
.md-my-2 {
|
|
margin-top: 0.5rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.md-ps-2 {
|
|
padding-left: 0.5rem;
|
|
}
|
|
.md-pe-2 {
|
|
padding-right: 0.5rem;
|
|
}
|
|
.md-pt-2 {
|
|
padding-top: 0.5rem;
|
|
}
|
|
.md-pb-2 {
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.md-px-2 {
|
|
padding-left: 0.5rem;
|
|
padding-right: 0.5rem;
|
|
}
|
|
.md-py-2 {
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.md-ms-3 {
|
|
margin-left: 1rem;
|
|
}
|
|
.md-me-3 {
|
|
margin-right: 1rem;
|
|
}
|
|
.md-mt-3 {
|
|
margin-top: 1rem;
|
|
}
|
|
.md-mb-3 {
|
|
margin-bottom: 1rem;
|
|
}
|
|
.md-mx-3 {
|
|
margin-left: 1rem;
|
|
margin-right: 1rem;
|
|
}
|
|
.md-my-3 {
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
.md-ps-3 {
|
|
padding-left: 1rem;
|
|
}
|
|
.md-pe-3 {
|
|
padding-right: 1rem;
|
|
}
|
|
.md-pt-3 {
|
|
padding-top: 1rem;
|
|
}
|
|
.md-pb-3 {
|
|
padding-bottom: 1rem;
|
|
}
|
|
.md-px-3 {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
.md-py-3 {
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.md-ms-4 {
|
|
margin-left: 1.5rem;
|
|
}
|
|
.md-me-4 {
|
|
margin-right: 1.5rem;
|
|
}
|
|
.md-mt-4 {
|
|
margin-top: 1.5rem;
|
|
}
|
|
.md-mb-4 {
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.md-mx-4 {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
}
|
|
.md-my-4 {
|
|
margin-top: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.md-ps-4 {
|
|
padding-left: 1.5rem;
|
|
}
|
|
.md-pe-4 {
|
|
padding-right: 1.5rem;
|
|
}
|
|
.md-pt-4 {
|
|
padding-top: 1.5rem;
|
|
}
|
|
.md-pb-4 {
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.md-px-4 {
|
|
padding-left: 1.5rem;
|
|
padding-right: 1.5rem;
|
|
}
|
|
.md-py-4 {
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.md-ms-5 {
|
|
margin-left: 3rem;
|
|
}
|
|
.md-me-5 {
|
|
margin-right: 3rem;
|
|
}
|
|
.md-mt-5 {
|
|
margin-top: 3rem;
|
|
}
|
|
.md-mb-5 {
|
|
margin-bottom: 3rem;
|
|
}
|
|
.md-mx-5 {
|
|
margin-left: 3rem;
|
|
margin-right: 3rem;
|
|
}
|
|
.md-my-5 {
|
|
margin-top: 3rem;
|
|
margin-bottom: 3rem;
|
|
}
|
|
.md-ps-5 {
|
|
padding-left: 3rem;
|
|
}
|
|
.md-pe-5 {
|
|
padding-right: 3rem;
|
|
}
|
|
.md-pt-5 {
|
|
padding-top: 3rem;
|
|
}
|
|
.md-pb-5 {
|
|
padding-bottom: 3rem;
|
|
}
|
|
.md-px-5 {
|
|
padding-left: 3rem;
|
|
padding-right: 3rem;
|
|
}
|
|
.md-py-5 {
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 992px) {
|
|
.lg-ms-0 {
|
|
margin-left: 0;
|
|
}
|
|
.lg-me-0 {
|
|
margin-right: 0;
|
|
}
|
|
.lg-mt-0 {
|
|
margin-top: 0;
|
|
}
|
|
.lg-mb-0 {
|
|
margin-bottom: 0;
|
|
}
|
|
.lg-mx-0 {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
.lg-my-0 {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.lg-ps-0 {
|
|
padding-left: 0;
|
|
}
|
|
.lg-pe-0 {
|
|
padding-right: 0;
|
|
}
|
|
.lg-pt-0 {
|
|
padding-top: 0;
|
|
}
|
|
.lg-pb-0 {
|
|
padding-bottom: 0;
|
|
}
|
|
.lg-px-0 {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.lg-py-0 {
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.lg-ms-1 {
|
|
margin-left: 0.25rem;
|
|
}
|
|
.lg-me-1 {
|
|
margin-right: 0.25rem;
|
|
}
|
|
.lg-mt-1 {
|
|
margin-top: 0.25rem;
|
|
}
|
|
.lg-mb-1 {
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.lg-mx-1 {
|
|
margin-left: 0.25rem;
|
|
margin-right: 0.25rem;
|
|
}
|
|
.lg-my-1 {
|
|
margin-top: 0.25rem;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.lg-ps-1 {
|
|
padding-left: 0.25rem;
|
|
}
|
|
.lg-pe-1 {
|
|
padding-right: 0.25rem;
|
|
}
|
|
.lg-pt-1 {
|
|
padding-top: 0.25rem;
|
|
}
|
|
.lg-pb-1 {
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.lg-px-1 {
|
|
padding-left: 0.25rem;
|
|
padding-right: 0.25rem;
|
|
}
|
|
.lg-py-1 {
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.lg-ms-2 {
|
|
margin-left: 0.5rem;
|
|
}
|
|
.lg-me-2 {
|
|
margin-right: 0.5rem;
|
|
}
|
|
.lg-mt-2 {
|
|
margin-top: 0.5rem;
|
|
}
|
|
.lg-mb-2 {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.lg-mx-2 {
|
|
margin-left: 0.5rem;
|
|
margin-right: 0.5rem;
|
|
}
|
|
.lg-my-2 {
|
|
margin-top: 0.5rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.lg-ps-2 {
|
|
padding-left: 0.5rem;
|
|
}
|
|
.lg-pe-2 {
|
|
padding-right: 0.5rem;
|
|
}
|
|
.lg-pt-2 {
|
|
padding-top: 0.5rem;
|
|
}
|
|
.lg-pb-2 {
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.lg-px-2 {
|
|
padding-left: 0.5rem;
|
|
padding-right: 0.5rem;
|
|
}
|
|
.lg-py-2 {
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.lg-ms-3 {
|
|
margin-left: 1rem;
|
|
}
|
|
.lg-me-3 {
|
|
margin-right: 1rem;
|
|
}
|
|
.lg-mt-3 {
|
|
margin-top: 1rem;
|
|
}
|
|
.lg-mb-3 {
|
|
margin-bottom: 1rem;
|
|
}
|
|
.lg-mx-3 {
|
|
margin-left: 1rem;
|
|
margin-right: 1rem;
|
|
}
|
|
.lg-my-3 {
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
.lg-ps-3 {
|
|
padding-left: 1rem;
|
|
}
|
|
.lg-pe-3 {
|
|
padding-right: 1rem;
|
|
}
|
|
.lg-pt-3 {
|
|
padding-top: 1rem;
|
|
}
|
|
.lg-pb-3 {
|
|
padding-bottom: 1rem;
|
|
}
|
|
.lg-px-3 {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
.lg-py-3 {
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.lg-ms-4 {
|
|
margin-left: 1.5rem;
|
|
}
|
|
.lg-me-4 {
|
|
margin-right: 1.5rem;
|
|
}
|
|
.lg-mt-4 {
|
|
margin-top: 1.5rem;
|
|
}
|
|
.lg-mb-4 {
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.lg-mx-4 {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
}
|
|
.lg-my-4 {
|
|
margin-top: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.lg-ps-4 {
|
|
padding-left: 1.5rem;
|
|
}
|
|
.lg-pe-4 {
|
|
padding-right: 1.5rem;
|
|
}
|
|
.lg-pt-4 {
|
|
padding-top: 1.5rem;
|
|
}
|
|
.lg-pb-4 {
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.lg-px-4 {
|
|
padding-left: 1.5rem;
|
|
padding-right: 1.5rem;
|
|
}
|
|
.lg-py-4 {
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.lg-ms-5 {
|
|
margin-left: 3rem;
|
|
}
|
|
.lg-me-5 {
|
|
margin-right: 3rem;
|
|
}
|
|
.lg-mt-5 {
|
|
margin-top: 3rem;
|
|
}
|
|
.lg-mb-5 {
|
|
margin-bottom: 3rem;
|
|
}
|
|
.lg-mx-5 {
|
|
margin-left: 3rem;
|
|
margin-right: 3rem;
|
|
}
|
|
.lg-my-5 {
|
|
margin-top: 3rem;
|
|
margin-bottom: 3rem;
|
|
}
|
|
.lg-ps-5 {
|
|
padding-left: 3rem;
|
|
}
|
|
.lg-pe-5 {
|
|
padding-right: 3rem;
|
|
}
|
|
.lg-pt-5 {
|
|
padding-top: 3rem;
|
|
}
|
|
.lg-pb-5 {
|
|
padding-bottom: 3rem;
|
|
}
|
|
.lg-px-5 {
|
|
padding-left: 3rem;
|
|
padding-right: 3rem;
|
|
}
|
|
.lg-py-5 {
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 1200px) {
|
|
.xl-ms-0 {
|
|
margin-left: 0;
|
|
}
|
|
.xl-me-0 {
|
|
margin-right: 0;
|
|
}
|
|
.xl-mt-0 {
|
|
margin-top: 0;
|
|
}
|
|
.xl-mb-0 {
|
|
margin-bottom: 0;
|
|
}
|
|
.xl-mx-0 {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
.xl-my-0 {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.xl-ps-0 {
|
|
padding-left: 0;
|
|
}
|
|
.xl-pe-0 {
|
|
padding-right: 0;
|
|
}
|
|
.xl-pt-0 {
|
|
padding-top: 0;
|
|
}
|
|
.xl-pb-0 {
|
|
padding-bottom: 0;
|
|
}
|
|
.xl-px-0 {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.xl-py-0 {
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.xl-ms-1 {
|
|
margin-left: 0.25rem;
|
|
}
|
|
.xl-me-1 {
|
|
margin-right: 0.25rem;
|
|
}
|
|
.xl-mt-1 {
|
|
margin-top: 0.25rem;
|
|
}
|
|
.xl-mb-1 {
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.xl-mx-1 {
|
|
margin-left: 0.25rem;
|
|
margin-right: 0.25rem;
|
|
}
|
|
.xl-my-1 {
|
|
margin-top: 0.25rem;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.xl-ps-1 {
|
|
padding-left: 0.25rem;
|
|
}
|
|
.xl-pe-1 {
|
|
padding-right: 0.25rem;
|
|
}
|
|
.xl-pt-1 {
|
|
padding-top: 0.25rem;
|
|
}
|
|
.xl-pb-1 {
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.xl-px-1 {
|
|
padding-left: 0.25rem;
|
|
padding-right: 0.25rem;
|
|
}
|
|
.xl-py-1 {
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.xl-ms-2 {
|
|
margin-left: 0.5rem;
|
|
}
|
|
.xl-me-2 {
|
|
margin-right: 0.5rem;
|
|
}
|
|
.xl-mt-2 {
|
|
margin-top: 0.5rem;
|
|
}
|
|
.xl-mb-2 {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.xl-mx-2 {
|
|
margin-left: 0.5rem;
|
|
margin-right: 0.5rem;
|
|
}
|
|
.xl-my-2 {
|
|
margin-top: 0.5rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.xl-ps-2 {
|
|
padding-left: 0.5rem;
|
|
}
|
|
.xl-pe-2 {
|
|
padding-right: 0.5rem;
|
|
}
|
|
.xl-pt-2 {
|
|
padding-top: 0.5rem;
|
|
}
|
|
.xl-pb-2 {
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.xl-px-2 {
|
|
padding-left: 0.5rem;
|
|
padding-right: 0.5rem;
|
|
}
|
|
.xl-py-2 {
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.xl-ms-3 {
|
|
margin-left: 1rem;
|
|
}
|
|
.xl-me-3 {
|
|
margin-right: 1rem;
|
|
}
|
|
.xl-mt-3 {
|
|
margin-top: 1rem;
|
|
}
|
|
.xl-mb-3 {
|
|
margin-bottom: 1rem;
|
|
}
|
|
.xl-mx-3 {
|
|
margin-left: 1rem;
|
|
margin-right: 1rem;
|
|
}
|
|
.xl-my-3 {
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
.xl-ps-3 {
|
|
padding-left: 1rem;
|
|
}
|
|
.xl-pe-3 {
|
|
padding-right: 1rem;
|
|
}
|
|
.xl-pt-3 {
|
|
padding-top: 1rem;
|
|
}
|
|
.xl-pb-3 {
|
|
padding-bottom: 1rem;
|
|
}
|
|
.xl-px-3 {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
.xl-py-3 {
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.xl-ms-4 {
|
|
margin-left: 1.5rem;
|
|
}
|
|
.xl-me-4 {
|
|
margin-right: 1.5rem;
|
|
}
|
|
.xl-mt-4 {
|
|
margin-top: 1.5rem;
|
|
}
|
|
.xl-mb-4 {
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.xl-mx-4 {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
}
|
|
.xl-my-4 {
|
|
margin-top: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.xl-ps-4 {
|
|
padding-left: 1.5rem;
|
|
}
|
|
.xl-pe-4 {
|
|
padding-right: 1.5rem;
|
|
}
|
|
.xl-pt-4 {
|
|
padding-top: 1.5rem;
|
|
}
|
|
.xl-pb-4 {
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.xl-px-4 {
|
|
padding-left: 1.5rem;
|
|
padding-right: 1.5rem;
|
|
}
|
|
.xl-py-4 {
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.xl-ms-5 {
|
|
margin-left: 3rem;
|
|
}
|
|
.xl-me-5 {
|
|
margin-right: 3rem;
|
|
}
|
|
.xl-mt-5 {
|
|
margin-top: 3rem;
|
|
}
|
|
.xl-mb-5 {
|
|
margin-bottom: 3rem;
|
|
}
|
|
.xl-mx-5 {
|
|
margin-left: 3rem;
|
|
margin-right: 3rem;
|
|
}
|
|
.xl-my-5 {
|
|
margin-top: 3rem;
|
|
margin-bottom: 3rem;
|
|
}
|
|
.xl-ps-5 {
|
|
padding-left: 3rem;
|
|
}
|
|
.xl-pe-5 {
|
|
padding-right: 3rem;
|
|
}
|
|
.xl-pt-5 {
|
|
padding-top: 3rem;
|
|
}
|
|
.xl-pb-5 {
|
|
padding-bottom: 3rem;
|
|
}
|
|
.xl-px-5 {
|
|
padding-left: 3rem;
|
|
padding-right: 3rem;
|
|
}
|
|
.xl-py-5 {
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 1400px) {
|
|
.xxl-ms-0 {
|
|
margin-left: 0;
|
|
}
|
|
.xxl-me-0 {
|
|
margin-right: 0;
|
|
}
|
|
.xxl-mt-0 {
|
|
margin-top: 0;
|
|
}
|
|
.xxl-mb-0 {
|
|
margin-bottom: 0;
|
|
}
|
|
.xxl-mx-0 {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
.xxl-my-0 {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.xxl-ps-0 {
|
|
padding-left: 0;
|
|
}
|
|
.xxl-pe-0 {
|
|
padding-right: 0;
|
|
}
|
|
.xxl-pt-0 {
|
|
padding-top: 0;
|
|
}
|
|
.xxl-pb-0 {
|
|
padding-bottom: 0;
|
|
}
|
|
.xxl-px-0 {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.xxl-py-0 {
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.xxl-ms-1 {
|
|
margin-left: 0.25rem;
|
|
}
|
|
.xxl-me-1 {
|
|
margin-right: 0.25rem;
|
|
}
|
|
.xxl-mt-1 {
|
|
margin-top: 0.25rem;
|
|
}
|
|
.xxl-mb-1 {
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.xxl-mx-1 {
|
|
margin-left: 0.25rem;
|
|
margin-right: 0.25rem;
|
|
}
|
|
.xxl-my-1 {
|
|
margin-top: 0.25rem;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.xxl-ps-1 {
|
|
padding-left: 0.25rem;
|
|
}
|
|
.xxl-pe-1 {
|
|
padding-right: 0.25rem;
|
|
}
|
|
.xxl-pt-1 {
|
|
padding-top: 0.25rem;
|
|
}
|
|
.xxl-pb-1 {
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.xxl-px-1 {
|
|
padding-left: 0.25rem;
|
|
padding-right: 0.25rem;
|
|
}
|
|
.xxl-py-1 {
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.xxl-ms-2 {
|
|
margin-left: 0.5rem;
|
|
}
|
|
.xxl-me-2 {
|
|
margin-right: 0.5rem;
|
|
}
|
|
.xxl-mt-2 {
|
|
margin-top: 0.5rem;
|
|
}
|
|
.xxl-mb-2 {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.xxl-mx-2 {
|
|
margin-left: 0.5rem;
|
|
margin-right: 0.5rem;
|
|
}
|
|
.xxl-my-2 {
|
|
margin-top: 0.5rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.xxl-ps-2 {
|
|
padding-left: 0.5rem;
|
|
}
|
|
.xxl-pe-2 {
|
|
padding-right: 0.5rem;
|
|
}
|
|
.xxl-pt-2 {
|
|
padding-top: 0.5rem;
|
|
}
|
|
.xxl-pb-2 {
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.xxl-px-2 {
|
|
padding-left: 0.5rem;
|
|
padding-right: 0.5rem;
|
|
}
|
|
.xxl-py-2 {
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.xxl-ms-3 {
|
|
margin-left: 1rem;
|
|
}
|
|
.xxl-me-3 {
|
|
margin-right: 1rem;
|
|
}
|
|
.xxl-mt-3 {
|
|
margin-top: 1rem;
|
|
}
|
|
.xxl-mb-3 {
|
|
margin-bottom: 1rem;
|
|
}
|
|
.xxl-mx-3 {
|
|
margin-left: 1rem;
|
|
margin-right: 1rem;
|
|
}
|
|
.xxl-my-3 {
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
.xxl-ps-3 {
|
|
padding-left: 1rem;
|
|
}
|
|
.xxl-pe-3 {
|
|
padding-right: 1rem;
|
|
}
|
|
.xxl-pt-3 {
|
|
padding-top: 1rem;
|
|
}
|
|
.xxl-pb-3 {
|
|
padding-bottom: 1rem;
|
|
}
|
|
.xxl-px-3 {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
.xxl-py-3 {
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.xxl-ms-4 {
|
|
margin-left: 1.5rem;
|
|
}
|
|
.xxl-me-4 {
|
|
margin-right: 1.5rem;
|
|
}
|
|
.xxl-mt-4 {
|
|
margin-top: 1.5rem;
|
|
}
|
|
.xxl-mb-4 {
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.xxl-mx-4 {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
}
|
|
.xxl-my-4 {
|
|
margin-top: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.xxl-ps-4 {
|
|
padding-left: 1.5rem;
|
|
}
|
|
.xxl-pe-4 {
|
|
padding-right: 1.5rem;
|
|
}
|
|
.xxl-pt-4 {
|
|
padding-top: 1.5rem;
|
|
}
|
|
.xxl-pb-4 {
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.xxl-px-4 {
|
|
padding-left: 1.5rem;
|
|
padding-right: 1.5rem;
|
|
}
|
|
.xxl-py-4 {
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.xxl-ms-5 {
|
|
margin-left: 3rem;
|
|
}
|
|
.xxl-me-5 {
|
|
margin-right: 3rem;
|
|
}
|
|
.xxl-mt-5 {
|
|
margin-top: 3rem;
|
|
}
|
|
.xxl-mb-5 {
|
|
margin-bottom: 3rem;
|
|
}
|
|
.xxl-mx-5 {
|
|
margin-left: 3rem;
|
|
margin-right: 3rem;
|
|
}
|
|
.xxl-my-5 {
|
|
margin-top: 3rem;
|
|
margin-bottom: 3rem;
|
|
}
|
|
.xxl-ps-5 {
|
|
padding-left: 3rem;
|
|
}
|
|
.xxl-pe-5 {
|
|
padding-right: 3rem;
|
|
}
|
|
.xxl-pt-5 {
|
|
padding-top: 3rem;
|
|
}
|
|
.xxl-pb-5 {
|
|
padding-bottom: 3rem;
|
|
}
|
|
.xxl-px-5 {
|
|
padding-left: 3rem;
|
|
padding-right: 3rem;
|
|
}
|
|
.xxl-py-5 {
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
@media (min-width: 1600px) {
|
|
.xxxl-ms-0 {
|
|
margin-left: 0;
|
|
}
|
|
.xxxl-me-0 {
|
|
margin-right: 0;
|
|
}
|
|
.xxxl-mt-0 {
|
|
margin-top: 0;
|
|
}
|
|
.xxxl-mb-0 {
|
|
margin-bottom: 0;
|
|
}
|
|
.xxxl-mx-0 {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
.xxxl-my-0 {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
.xxxl-ps-0 {
|
|
padding-left: 0;
|
|
}
|
|
.xxxl-pe-0 {
|
|
padding-right: 0;
|
|
}
|
|
.xxxl-pt-0 {
|
|
padding-top: 0;
|
|
}
|
|
.xxxl-pb-0 {
|
|
padding-bottom: 0;
|
|
}
|
|
.xxxl-px-0 {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.xxxl-py-0 {
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.xxxl-ms-1 {
|
|
margin-left: 0.25rem;
|
|
}
|
|
.xxxl-me-1 {
|
|
margin-right: 0.25rem;
|
|
}
|
|
.xxxl-mt-1 {
|
|
margin-top: 0.25rem;
|
|
}
|
|
.xxxl-mb-1 {
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.xxxl-mx-1 {
|
|
margin-left: 0.25rem;
|
|
margin-right: 0.25rem;
|
|
}
|
|
.xxxl-my-1 {
|
|
margin-top: 0.25rem;
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
.xxxl-ps-1 {
|
|
padding-left: 0.25rem;
|
|
}
|
|
.xxxl-pe-1 {
|
|
padding-right: 0.25rem;
|
|
}
|
|
.xxxl-pt-1 {
|
|
padding-top: 0.25rem;
|
|
}
|
|
.xxxl-pb-1 {
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.xxxl-px-1 {
|
|
padding-left: 0.25rem;
|
|
padding-right: 0.25rem;
|
|
}
|
|
.xxxl-py-1 {
|
|
padding-top: 0.25rem;
|
|
padding-bottom: 0.25rem;
|
|
}
|
|
.xxxl-ms-2 {
|
|
margin-left: 0.5rem;
|
|
}
|
|
.xxxl-me-2 {
|
|
margin-right: 0.5rem;
|
|
}
|
|
.xxxl-mt-2 {
|
|
margin-top: 0.5rem;
|
|
}
|
|
.xxxl-mb-2 {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.xxxl-mx-2 {
|
|
margin-left: 0.5rem;
|
|
margin-right: 0.5rem;
|
|
}
|
|
.xxxl-my-2 {
|
|
margin-top: 0.5rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
.xxxl-ps-2 {
|
|
padding-left: 0.5rem;
|
|
}
|
|
.xxxl-pe-2 {
|
|
padding-right: 0.5rem;
|
|
}
|
|
.xxxl-pt-2 {
|
|
padding-top: 0.5rem;
|
|
}
|
|
.xxxl-pb-2 {
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.xxxl-px-2 {
|
|
padding-left: 0.5rem;
|
|
padding-right: 0.5rem;
|
|
}
|
|
.xxxl-py-2 {
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
.xxxl-ms-3 {
|
|
margin-left: 1rem;
|
|
}
|
|
.xxxl-me-3 {
|
|
margin-right: 1rem;
|
|
}
|
|
.xxxl-mt-3 {
|
|
margin-top: 1rem;
|
|
}
|
|
.xxxl-mb-3 {
|
|
margin-bottom: 1rem;
|
|
}
|
|
.xxxl-mx-3 {
|
|
margin-left: 1rem;
|
|
margin-right: 1rem;
|
|
}
|
|
.xxxl-my-3 {
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
.xxxl-ps-3 {
|
|
padding-left: 1rem;
|
|
}
|
|
.xxxl-pe-3 {
|
|
padding-right: 1rem;
|
|
}
|
|
.xxxl-pt-3 {
|
|
padding-top: 1rem;
|
|
}
|
|
.xxxl-pb-3 {
|
|
padding-bottom: 1rem;
|
|
}
|
|
.xxxl-px-3 {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
.xxxl-py-3 {
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.xxxl-ms-4 {
|
|
margin-left: 1.5rem;
|
|
}
|
|
.xxxl-me-4 {
|
|
margin-right: 1.5rem;
|
|
}
|
|
.xxxl-mt-4 {
|
|
margin-top: 1.5rem;
|
|
}
|
|
.xxxl-mb-4 {
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.xxxl-mx-4 {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
}
|
|
.xxxl-my-4 {
|
|
margin-top: 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.xxxl-ps-4 {
|
|
padding-left: 1.5rem;
|
|
}
|
|
.xxxl-pe-4 {
|
|
padding-right: 1.5rem;
|
|
}
|
|
.xxxl-pt-4 {
|
|
padding-top: 1.5rem;
|
|
}
|
|
.xxxl-pb-4 {
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.xxxl-px-4 {
|
|
padding-left: 1.5rem;
|
|
padding-right: 1.5rem;
|
|
}
|
|
.xxxl-py-4 {
|
|
padding-top: 1.5rem;
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.xxxl-ms-5 {
|
|
margin-left: 3rem;
|
|
}
|
|
.xxxl-me-5 {
|
|
margin-right: 3rem;
|
|
}
|
|
.xxxl-mt-5 {
|
|
margin-top: 3rem;
|
|
}
|
|
.xxxl-mb-5 {
|
|
margin-bottom: 3rem;
|
|
}
|
|
.xxxl-mx-5 {
|
|
margin-left: 3rem;
|
|
margin-right: 3rem;
|
|
}
|
|
.xxxl-my-5 {
|
|
margin-top: 3rem;
|
|
margin-bottom: 3rem;
|
|
}
|
|
.xxxl-ps-5 {
|
|
padding-left: 3rem;
|
|
}
|
|
.xxxl-pe-5 {
|
|
padding-right: 3rem;
|
|
}
|
|
.xxxl-pt-5 {
|
|
padding-top: 3rem;
|
|
}
|
|
.xxxl-pb-5 {
|
|
padding-bottom: 3rem;
|
|
}
|
|
.xxxl-px-5 {
|
|
padding-left: 3rem;
|
|
padding-right: 3rem;
|
|
}
|
|
.xxxl-py-5 {
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
}
|
|
}
|
|
.text-left {
|
|
text-align: left;
|
|
}
|
|
|
|
.text-center {
|
|
text-align: center;
|
|
}
|
|
|
|
.text-right {
|
|
text-align: right;
|
|
}
|
|
|
|
.text-uppercase {
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.text-lowercase {
|
|
text-transform: lowercase;
|
|
}
|
|
|
|
.text-capitalize {
|
|
text-transform: capitalize;
|
|
}
|
|
|
|
.font-weight-light {
|
|
font-weight: 300;
|
|
}
|
|
|
|
.font-weight-normal {
|
|
font-weight: 400;
|
|
}
|
|
|
|
.font-weight-bold {
|
|
font-weight: 700;
|
|
}
|
|
|
|
.font-weight-heavy {
|
|
font-weight: 900;
|
|
}
|
|
|
|
.text-underline {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.text-line-through {
|
|
text-decoration: line-through;
|
|
}
|
|
|
|
.text-no-decoration {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.img-w-100 {
|
|
width: 100%;
|
|
}
|
|
|
|
.img-w-auto {
|
|
width: auto;
|
|
}
|
|
|
|
.img-w-50 {
|
|
width: 50%;
|
|
}
|
|
|
|
.img-w-75 {
|
|
width: 75%;
|
|
}
|
|
|
|
.img-w-25 {
|
|
width: 25%;
|
|
}
|
|
|
|
.img-h-100 {
|
|
height: 100%;
|
|
}
|
|
|
|
.img-h-auto {
|
|
height: auto;
|
|
}
|
|
|
|
.img-h-50 {
|
|
height: 50%;
|
|
}
|
|
|
|
.img-h-75 {
|
|
height: 75%;
|
|
}
|
|
|
|
.img-max-w-100 {
|
|
max-width: 100%;
|
|
}
|
|
|
|
.img-max-w-50 {
|
|
max-width: 50%;
|
|
}
|
|
|
|
.img-max-h-100 {
|
|
max-height: 100%;
|
|
}
|
|
|
|
.img-max-h-50 {
|
|
max-height: 50%;
|
|
}
|
|
|
|
.image-container {
|
|
position: relative;
|
|
max-width: 100%;
|
|
width: 100%;
|
|
flex: 1;
|
|
}
|
|
.image-container img {
|
|
width: 100%;
|
|
max-height: 100%;
|
|
-o-object-fit: contain;
|
|
object-fit: contain;
|
|
}
|
|
|
|
.img-aspect-ratio-16-9 {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 0;
|
|
padding-bottom: 56.25%;
|
|
}
|
|
.img-aspect-ratio-16-9 img {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
-o-object-fit: cover;
|
|
object-fit: cover;
|
|
}
|
|
|
|
.img-aspect-ratio-4-3 {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 0;
|
|
padding-bottom: 75%;
|
|
}
|
|
.img-aspect-ratio-4-3 img {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
-o-object-fit: cover;
|
|
object-fit: cover;
|
|
}
|
|
|
|
.img-aspect-ratio-1-1 {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 0;
|
|
padding-bottom: 100%;
|
|
}
|
|
.img-aspect-ratio-1-1 img {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
-o-object-fit: cover;
|
|
object-fit: cover;
|
|
}
|
|
|
|
.img-rounded {
|
|
border-radius: 0.25rem;
|
|
}
|
|
|
|
.img-rounded-sm {
|
|
border-radius: 0.125rem;
|
|
}
|
|
|
|
.img-rounded-md {
|
|
border-radius: 0.375rem;
|
|
}
|
|
|
|
.img-rounded-lg {
|
|
border-radius: 2rem;
|
|
}
|
|
|
|
.img-rounded-full {
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.img-border {
|
|
border: 1px solid #ddd;
|
|
}
|
|
|
|
.img-border-2 {
|
|
border: 2px solid #ddd;
|
|
}
|
|
|
|
.img-border-3 {
|
|
border: 3px solid #ddd;
|
|
}
|
|
|
|
.img-border-0 {
|
|
border: none;
|
|
}
|
|
|
|
.img-filter-blur {
|
|
filter: blur(4px);
|
|
}
|
|
|
|
.img-filter-grayscale {
|
|
filter: grayscale(100%);
|
|
}
|
|
|
|
.img-filter-brightness {
|
|
filter: brightness(1.2);
|
|
}
|
|
|
|
.img-filter-contrast {
|
|
filter: contrast(1.5);
|
|
}
|
|
|
|
.img-filter-sepia {
|
|
filter: sepia(1);
|
|
}
|
|
|
|
.img-filter-invert {
|
|
filter: invert(1);
|
|
}
|
|
|
|
.img-filter-saturate {
|
|
filter: saturate(2);
|
|
}
|
|
|
|
.img-align-left {
|
|
display: block;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.img-align-right {
|
|
display: block;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.img-align-center {
|
|
display: block;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.img-align-start {
|
|
align-self: flex-start;
|
|
}
|
|
|
|
.img-align-end {
|
|
align-self: flex-end;
|
|
}
|
|
|
|
.img-align-center-flex {
|
|
align-self: center;
|
|
}
|
|
|
|
.img-responsive {
|
|
width: 100%;
|
|
height: auto;
|
|
max-width: 100%;
|
|
}
|
|
|
|
/* Form Inputs */
|
|
.form-group {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.25rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
label {
|
|
font-size: 1rem;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.form-input,
|
|
select,
|
|
textarea,
|
|
input[type=text],
|
|
input[type=email],
|
|
input[type=password],
|
|
input[type=number] {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
width: 100%;
|
|
padding: 0.35rem 0.75rem;
|
|
font-size: 1rem;
|
|
font-family: inherit;
|
|
border-radius: 0.375rem;
|
|
box-shadow: none;
|
|
transition: border-color 0.2s ease, box-shadow 0.2s ease;
|
|
border: 1px solid;
|
|
outline: none;
|
|
border-color: #C7C7C7;
|
|
color: #333;
|
|
background-color: #fdfdfd;
|
|
}
|
|
.form-input:focus,
|
|
select:focus,
|
|
textarea:focus,
|
|
input[type=text]:focus,
|
|
input[type=email]:focus,
|
|
input[type=password]:focus,
|
|
input[type=number]:focus {
|
|
outline: none;
|
|
border-color: #aa0b3d;
|
|
box-shadow: 0 0 0 3px rgba(170, 11, 61, 0.2);
|
|
background-color: #fff;
|
|
}
|
|
.form-input:disabled,
|
|
select:disabled,
|
|
textarea:disabled,
|
|
input[type=text]:disabled,
|
|
input[type=email]:disabled,
|
|
input[type=password]:disabled,
|
|
input[type=number]:disabled {
|
|
background-color: #e5e5e5;
|
|
cursor: not-allowed;
|
|
opacity: 0.6;
|
|
}
|
|
|
|
::-moz-placeholder {
|
|
opacity: 1;
|
|
}
|
|
|
|
::placeholder {
|
|
opacity: 1;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.sm-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
}
|
|
|
|
.rel {
|
|
position: relative;
|
|
}
|
|
|
|
.full-height {
|
|
height: calc(100vh - 52px);
|
|
}
|
|
|
|
.no-wrap {
|
|
flex-wrap: nowrap;
|
|
}
|
|
|
|
.no-click {
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* Alert */
|
|
.alert {
|
|
border-radius: 0.25rem;
|
|
padding: 0.5rem;
|
|
}
|
|
.alert.success {
|
|
background-color: rgb(141.4240506329, 223.0759493671, 185.0126582278);
|
|
color: #34b97b;
|
|
}
|
|
.alert.warning {
|
|
background-color: rgb(255, 224.875, 134.5);
|
|
color: #ffc107;
|
|
}
|
|
.alert.danger {
|
|
background-color: rgb(238.8291139241, 161.6708860759, 169.0632911392);
|
|
color: #dc3545;
|
|
}
|
|
.alert.info {
|
|
background-color: rgb(132.1541501976, 228.895256917, 248.3458498024);
|
|
color: #0dcaf0;
|
|
}
|
|
|
|
/* Misc tools */
|
|
.spinner {
|
|
height: 1rem;
|
|
width: 1rem;
|
|
border: 2px solid #212529;
|
|
border-left-color: transparent !important;
|
|
border-radius: 50%;
|
|
display: inline-block;
|
|
animation: 1s linear infinite spinner;
|
|
}
|
|
.spinner.primary {
|
|
border: 2px solid #aa0b3d;
|
|
}
|
|
.spinner.secondary {
|
|
border: 2px solid #333;
|
|
}
|
|
.spinner.accent {
|
|
border: 2px solid #08bbbb;
|
|
}/*# sourceMappingURL=main.css.map */ |