655 lines
18 KiB
CSS
655 lines
18 KiB
CSS
|
/*! Blowfish | MIT License | https://github.com/nunocoracao/blowfish */
|
||
|
|
|
||
|
|
@import 'components/zen-mode.css';
|
||
|
|
|
||
|
|
@tailwind base;
|
||
|
|
@tailwind components;
|
||
|
|
@tailwind utilities;
|
||
|
|
|
||
|
|
body a,
|
||
|
|
body button {
|
||
|
|
@apply transition-colors;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Scale SVG icons to text size */
|
||
|
|
.icon svg {
|
||
|
|
@apply h-[1em] w-[1em];
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Search */
|
||
|
|
#search-query::-webkit-search-cancel-button,
|
||
|
|
#search-query::-webkit-search-decoration,
|
||
|
|
#search-query::-webkit-search-results-button,
|
||
|
|
#search-query::-webkit-search-results-decoration {
|
||
|
|
@apply hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Hamburger menu */
|
||
|
|
body:has(#menu-controller:checked) {
|
||
|
|
@apply overflow-y-hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
#menu-button:has(#menu-controller:checked) {
|
||
|
|
@apply invisible;
|
||
|
|
}
|
||
|
|
|
||
|
|
#menu-controller:checked~#menu-wrapper {
|
||
|
|
@apply visible opacity-100;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* RTL support */
|
||
|
|
.prose blockquote {
|
||
|
|
@apply rtl:pr-4 rtl:border-l-0 rtl:border-r-4;
|
||
|
|
}
|
||
|
|
|
||
|
|
.prose ul>li,
|
||
|
|
.prose ol>li {
|
||
|
|
@apply rtl:pl-0 rtl:pr-2 rtl:mr-7;
|
||
|
|
}
|
||
|
|
|
||
|
|
.prose ol>li:before,
|
||
|
|
.prose ul>li:before {
|
||
|
|
@apply rtl:left-auto rtl:right-1;
|
||
|
|
}
|
||
|
|
|
||
|
|
.prose thead td:first-child,
|
||
|
|
.prose thead th:first-child {
|
||
|
|
@apply rtl:pr-0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.prose thead td:last-child,
|
||
|
|
.prose thead th:last-child {
|
||
|
|
@apply rtl:pl-0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Adjust first child within prose */
|
||
|
|
.prose div.min-w-0.max-w-prose>*:first-child {
|
||
|
|
@apply mt-3;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Table of Contents */
|
||
|
|
.toc ul,
|
||
|
|
.toc li {
|
||
|
|
@apply px-0 leading-snug list-none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.toc ul ul {
|
||
|
|
@apply ltr:pl-4 rtl:pr-4;
|
||
|
|
}
|
||
|
|
|
||
|
|
.toc a {
|
||
|
|
@apply font-normal text-neutral-700 dark:text-neutral-400;
|
||
|
|
}
|
||
|
|
|
||
|
|
.toc ul>li {
|
||
|
|
@apply rtl:mr-0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Code Copy */
|
||
|
|
.highlight-wrapper {
|
||
|
|
@apply block;
|
||
|
|
}
|
||
|
|
|
||
|
|
.highlight {
|
||
|
|
@apply relative z-0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.highlight:hover>.copy-button {
|
||
|
|
@apply visible;
|
||
|
|
}
|
||
|
|
|
||
|
|
.copy-button {
|
||
|
|
@apply absolute top-0 right-0 z-10 invisible w-20 py-1 font-mono text-sm cursor-pointer opacity-90 bg-neutral-200 whitespace-nowrap rounded-bl-md rounded-tr-md text-neutral-700 dark:bg-neutral-600 dark:text-neutral-200;
|
||
|
|
}
|
||
|
|
|
||
|
|
.copy-button:hover,
|
||
|
|
.copy-button:focus,
|
||
|
|
.copy-button:active,
|
||
|
|
.copy-button:active:hover {
|
||
|
|
@apply bg-primary-100 dark:bg-primary-600;
|
||
|
|
}
|
||
|
|
|
||
|
|
.copy-textarea {
|
||
|
|
@apply absolute opacity-5 -z-10;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Fix long KaTeX equations on mobile (see https://katex.org/docs/issues.html#css-customization) */
|
||
|
|
.katex-display { overflow: auto hidden }
|
||
|
|
|
||
|
|
/* Fix long tables breaking out of article on mobile */
|
||
|
|
table {
|
||
|
|
display: block;
|
||
|
|
overflow: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Fix long inline code sections breaking out of article on mobile */
|
||
|
|
code {
|
||
|
|
word-wrap: break-word; /* All browsers since IE 5.5+ */
|
||
|
|
overflow-wrap: break-word; /* Renamed property in CSS3 draft spec */
|
||
|
|
}
|
||
|
|
|
||
|
|
/* -- Chroma Highlight -- */
|
||
|
|
/* Background */
|
||
|
|
.prose .chroma {
|
||
|
|
@apply static rounded-md text-neutral-700 bg-neutral-50 dark:bg-neutral-700 dark:text-neutral-200;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* LineTableTD */
|
||
|
|
.chroma .lntd,
|
||
|
|
.chroma .lntd pre {
|
||
|
|
@apply p-0 m-0 align-top border-none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* LineTable */
|
||
|
|
.chroma .lntable {
|
||
|
|
@apply block w-auto px-4 py-3 overflow-hidden text-base;
|
||
|
|
border-spacing: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* LineHighlight */
|
||
|
|
.chroma .hl {
|
||
|
|
@apply block w-auto px-4 -mx-4 bg-primary-100 dark:bg-primary-900;
|
||
|
|
}
|
||
|
|
|
||
|
|
.chroma .lntd .hl {
|
||
|
|
@apply p-0 m-0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* LineNumbersTable */
|
||
|
|
/* LineNumbers */
|
||
|
|
.chroma .lnt,
|
||
|
|
.chroma .ln {
|
||
|
|
@apply text-neutral-600 dark:text-neutral-300 mr-[0.4em] px-[0.4em] py-0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Keyword */
|
||
|
|
/* KeywordDeclaration */
|
||
|
|
/* KeywordNamespace */
|
||
|
|
/* KeywordPseudo */
|
||
|
|
/* KeywordReserved */
|
||
|
|
/* NameClass */
|
||
|
|
/* NameFunctionMagic */
|
||
|
|
/* NameNamespace */
|
||
|
|
/* NameVariableClass */
|
||
|
|
/* Operator */
|
||
|
|
.chroma .k,
|
||
|
|
.chroma .kd,
|
||
|
|
.chroma .kn,
|
||
|
|
.chroma .kp,
|
||
|
|
.chroma .kr,
|
||
|
|
.chroma .nc,
|
||
|
|
.chroma .fm,
|
||
|
|
.chroma .nn,
|
||
|
|
.chroma .vc,
|
||
|
|
.chroma .o {
|
||
|
|
@apply text-primary-600 dark:text-primary-300;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* KeywordConstant */
|
||
|
|
.chroma .kc {
|
||
|
|
@apply font-semibold text-secondary-400 dark:text-secondary-500;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* KeywordType */
|
||
|
|
/* NameVariable */
|
||
|
|
/* NameVariableInstance */
|
||
|
|
/* NameVariableMagic */
|
||
|
|
/* LiteralNumber */
|
||
|
|
/* LiteralNumberBin */
|
||
|
|
/* LiteralNumberFloat */
|
||
|
|
/* LiteralNumberHex */
|
||
|
|
/* LiteralNumberInteger */
|
||
|
|
/* LiteralNumberIntegerLong */
|
||
|
|
/* LiteralNumberOct */
|
||
|
|
.chroma .kt,
|
||
|
|
.chroma .nv,
|
||
|
|
.chroma .vi,
|
||
|
|
.chroma .vm,
|
||
|
|
.chroma .m,
|
||
|
|
.chroma .mb,
|
||
|
|
.chroma .mf,
|
||
|
|
.chroma .mh,
|
||
|
|
.chroma .mi,
|
||
|
|
.chroma .il,
|
||
|
|
.chroma .mo {
|
||
|
|
@apply text-secondary-400 dark:text-secondary-600;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Name */
|
||
|
|
/* NameDecorator */
|
||
|
|
/* NameEntity */
|
||
|
|
/* NameLabel */
|
||
|
|
.chroma .n,
|
||
|
|
.chroma .nd,
|
||
|
|
.chroma .ni,
|
||
|
|
.chroma .nl {
|
||
|
|
@apply text-secondary-900 dark:text-secondary-200;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* NameAttribute */
|
||
|
|
/* NameBuiltin */
|
||
|
|
/* NameBuiltinPseudo */
|
||
|
|
/* NameOther */
|
||
|
|
/* NameProperty */
|
||
|
|
/* NameTag */
|
||
|
|
.chroma .na,
|
||
|
|
.chroma .nb,
|
||
|
|
.chroma .bp,
|
||
|
|
.chroma .nx,
|
||
|
|
.chroma .py,
|
||
|
|
.chroma .nt {
|
||
|
|
@apply text-secondary-800 dark:text-secondary-300;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* NameConstant */
|
||
|
|
/* NameException */
|
||
|
|
/* NameVariableGlobal */
|
||
|
|
.chroma .no,
|
||
|
|
.chroma .ne,
|
||
|
|
.chroma .vg {
|
||
|
|
@apply font-semibold text-secondary-400 dark:text-secondary-500;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* NameFunction */
|
||
|
|
.chroma .nf {
|
||
|
|
@apply text-secondary-600 dark:text-secondary-500;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Literal */
|
||
|
|
/* LiteralDate */
|
||
|
|
/* LiteralString */
|
||
|
|
/* LiteralStringAffix */
|
||
|
|
/* LiteralStringBacktick */
|
||
|
|
/* LiteralStringChar */
|
||
|
|
/* LiteralStringDelimiter */
|
||
|
|
/* LiteralStringDoc */
|
||
|
|
/* LiteralStringDouble */
|
||
|
|
/* LiteralStringHeredoc */
|
||
|
|
/* LiteralStringInterpol */
|
||
|
|
/* LiteralStringOther */
|
||
|
|
/* LiteralStringSingle */
|
||
|
|
/* GenericInserted */
|
||
|
|
/* GenericOutput */
|
||
|
|
/* GenericPrompt */
|
||
|
|
.chroma .l,
|
||
|
|
.chroma .ld,
|
||
|
|
.chroma .s,
|
||
|
|
.chroma .sa,
|
||
|
|
.chroma .sb,
|
||
|
|
.chroma .sc,
|
||
|
|
.chroma .dl,
|
||
|
|
.chroma .sd,
|
||
|
|
.chroma .s2,
|
||
|
|
.chroma .sh,
|
||
|
|
.chroma .si,
|
||
|
|
.chroma .sx,
|
||
|
|
.chroma .s1,
|
||
|
|
.chroma .gi,
|
||
|
|
.chroma .go,
|
||
|
|
.chroma .gp {
|
||
|
|
@apply text-primary-800 dark:text-primary-400;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* LiteralStringEscape */
|
||
|
|
.chroma .se {
|
||
|
|
@apply font-semibold text-secondary-400 dark:text-secondary-500;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* LiteralStringRegex */
|
||
|
|
/* LiteralStringSymbol */
|
||
|
|
.chroma .sr,
|
||
|
|
.chroma .ss {
|
||
|
|
@apply font-semibold text-primary-800 dark:text-primary-400;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* OperatorWord */
|
||
|
|
.chroma .ow {
|
||
|
|
@apply font-semibold text-primary-400 dark:text-primary-600;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Comment */
|
||
|
|
/* CommentMultiline */
|
||
|
|
/* CommentSingle */
|
||
|
|
/* CommentSpecial */
|
||
|
|
/* CommentPreproc */
|
||
|
|
/* CommentPreprocFile */
|
||
|
|
.chroma .c,
|
||
|
|
.chroma .cm,
|
||
|
|
.chroma .c1,
|
||
|
|
.chroma .cs,
|
||
|
|
.chroma .cp,
|
||
|
|
.chroma .cpf {
|
||
|
|
@apply italic text-neutral-500 dark:text-neutral-400;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* CommentHashbang */
|
||
|
|
.chroma .ch {
|
||
|
|
@apply italic font-semibold text-neutral-500 dark:text-neutral-400;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* GenericEmph */
|
||
|
|
.chroma .ge {
|
||
|
|
@apply italic;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* GenericHeading */
|
||
|
|
.chroma .gh {
|
||
|
|
@apply font-semibold text-neutral-500;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* GenericStrong */
|
||
|
|
.chroma .gs {
|
||
|
|
@apply font-semibold;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* GenericSubheading */
|
||
|
|
/* GenericTraceback */
|
||
|
|
.chroma .gu,
|
||
|
|
.chroma .gt {
|
||
|
|
@apply text-neutral-500;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* GenericUnderline */
|
||
|
|
.chroma .gl {
|
||
|
|
@apply underline;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Custom */
|
||
|
|
|
||
|
|
pre {
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
|
||
|
|
.thumbnail {
|
||
|
|
min-width: 300px;
|
||
|
|
height: 180px;
|
||
|
|
background-repeat:no-repeat;
|
||
|
|
background-size:cover;
|
||
|
|
background-position:center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.thumbnail_card {
|
||
|
|
height: 200px;
|
||
|
|
background-repeat:no-repeat;
|
||
|
|
background-size:cover;
|
||
|
|
background-position:center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.thumbnail_card_related {
|
||
|
|
height: 150px;
|
||
|
|
background-repeat:no-repeat;
|
||
|
|
background-size:cover;
|
||
|
|
background-position:center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.thumbnail_card_term {
|
||
|
|
height: 150px;
|
||
|
|
background-repeat:no-repeat;
|
||
|
|
background-size:cover;
|
||
|
|
background-position:center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.single_hero_basic {
|
||
|
|
background-repeat:no-repeat;
|
||
|
|
background-size:cover;
|
||
|
|
background-position:center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.single_hero_round {
|
||
|
|
max-height: 50vh;
|
||
|
|
object-fit: cover;
|
||
|
|
}
|
||
|
|
|
||
|
|
.single_hero_background {
|
||
|
|
background-repeat:no-repeat;
|
||
|
|
background-size:cover;
|
||
|
|
background-position:center;
|
||
|
|
width: calc(100% + 40px);
|
||
|
|
z-index: -10;
|
||
|
|
margin-left: -20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.hero_gradient {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.thumbnailshadow {
|
||
|
|
box-shadow: 5px 5px 20px 1px rgba(0, 0, 0, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.anchor {
|
||
|
|
display: block;
|
||
|
|
position: relative;
|
||
|
|
top: -150px;
|
||
|
|
height: 0px;
|
||
|
|
visibility: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen sm {
|
||
|
|
.thumbnail {
|
||
|
|
min-width: 100%;
|
||
|
|
height: 180px;
|
||
|
|
}
|
||
|
|
.article {
|
||
|
|
flex-wrap: wrap;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen md {
|
||
|
|
.thumbnail {
|
||
|
|
min-width: 300px;
|
||
|
|
min-height: 180px;
|
||
|
|
height: auto;
|
||
|
|
}
|
||
|
|
.article {
|
||
|
|
flex-wrap: nowrap;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.medium-zoom-image--opened {
|
||
|
|
z-index: 100;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nested-menu:hover + .menuhide {
|
||
|
|
visibility: visible;
|
||
|
|
opacity: 1;
|
||
|
|
transition: visibility 0.3s, opacity 0.3s ease-in-out ;
|
||
|
|
}
|
||
|
|
|
||
|
|
.menuhide:hover {
|
||
|
|
visibility: visible;
|
||
|
|
opacity: 1;
|
||
|
|
transition: visibility 0.3s, opacity 0.3s ease-in-out ;
|
||
|
|
}
|
||
|
|
|
||
|
|
.menuhide {
|
||
|
|
visibility: hidden;
|
||
|
|
opacity: 0;
|
||
|
|
transition: visibility 0.3s, opacity 0.3s ease-in-out ;
|
||
|
|
z-index: 1000;
|
||
|
|
}
|
||
|
|
|
||
|
|
.active {
|
||
|
|
text-decoration-line: underline;
|
||
|
|
text-decoration-thickness: 3px;
|
||
|
|
text-underline-offset: 4px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Gallery Specific Styles */
|
||
|
|
.grid-w10 { width: calc(10% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w15 { width: calc(15% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w20 { width: calc(20% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w25 { width: calc(25% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w30 { width: calc(30% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w33 { width: calc(33% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w35 { width: calc(35% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w40 { width: calc(40% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w45 { width: calc(45% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w50 { width: calc(50% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w55 { width: calc(55% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w60 { width: calc(60% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w65 { width: calc(65% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w66 { width: calc(66% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w70 { width: calc(70% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w75 { width: calc(75% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w80 { width: calc(80% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w85 { width: calc(85% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w90 { width: calc(90% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w95 { width: calc(95% - 5px); margin: 0px !important; }
|
||
|
|
.grid-w100 { width: calc(100% - 5px); margin: 0px !important; }
|
||
|
|
|
||
|
|
@screen sm {
|
||
|
|
.sm\:grid-w10 { width: calc(10% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w15 { width: calc(15% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w20 { width: calc(20% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w25 { width: calc(25% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w30 { width: calc(30% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w33 { width: calc(33% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w35 { width: calc(35% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w40 { width: calc(40% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w45 { width: calc(45% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w50 { width: calc(50% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w55 { width: calc(55% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w60 { width: calc(60% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w65 { width: calc(65% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w66 { width: calc(66% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w70 { width: calc(70% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w75 { width: calc(75% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w80 { width: calc(80% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w85 { width: calc(85% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w90 { width: calc(90% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w95 { width: calc(95% - 5px); margin: 0px !important; }
|
||
|
|
.sm\:grid-w100 { width: calc(100% - 5px); margin: 0px !important; }
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen md {
|
||
|
|
.md\:grid-w10 { width: calc(10% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w15 { width: calc(15% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w20 { width: calc(20% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w25 { width: calc(25% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w30 { width: calc(30% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w33 { width: calc(33% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w35 { width: calc(35% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w40 { width: calc(40% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w45 { width: calc(45% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w50 { width: calc(50% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w55 { width: calc(55% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w60 { width: calc(60% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w65 { width: calc(65% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w66 { width: calc(66% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w70 { width: calc(70% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w75 { width: calc(75% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w80 { width: calc(80% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w85 { width: calc(85% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w90 { width: calc(90% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w95 { width: calc(95% - 5px); margin: 0px !important; }
|
||
|
|
.md\:grid-w100 { width: calc(100% - 5px); margin: 0px !important; }
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen lg {
|
||
|
|
.lg\:grid-w10 { width: calc(10% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w15 { width: calc(15% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w20 { width: calc(20% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w25 { width: calc(25% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w30 { width: calc(30% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w33 { width: calc(33% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w35 { width: calc(35% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w40 { width: calc(40% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w45 { width: calc(45% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w50 { width: calc(50% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w55 { width: calc(55% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w60 { width: calc(60% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w65 { width: calc(65% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w66 { width: calc(66% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w70 { width: calc(70% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w75 { width: calc(75% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w80 { width: calc(80% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w85 { width: calc(85% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w90 { width: calc(90% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w95 { width: calc(95% - 5px); margin: 0px !important; }
|
||
|
|
.lg\:grid-w100 { width: calc(100% - 5px); margin: 0px !important; }
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen xl {
|
||
|
|
.xl\:grid-w10 { width: calc(10% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w15 { width: calc(15% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w20 { width: calc(20% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w25 { width: calc(25% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w30 { width: calc(30% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w33 { width: calc(33% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w35 { width: calc(35% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w40 { width: calc(40% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w45 { width: calc(45% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w50 { width: calc(50% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w55 { width: calc(55% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w60 { width: calc(60% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w65 { width: calc(65% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w66 { width: calc(66% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w70 { width: calc(70% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w75 { width: calc(75% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w80 { width: calc(80% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w85 { width: calc(85% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w90 { width: calc(90% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w95 { width: calc(95% - 5px); margin: 0px !important; }
|
||
|
|
.xl\:grid-w100 { width: calc(100% - 5px); margin: 0px !important; }
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen 2xl {
|
||
|
|
.2xl\:grid-w10 { width: calc(10% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w15 { width: calc(15% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w20 { width: calc(20% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w25 { width: calc(25% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w30 { width: calc(30% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w33 { width: calc(33% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w35 { width: calc(35% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w40 { width: calc(40% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w45 { width: calc(45% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w50 { width: calc(50% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w55 { width: calc(55% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w60 { width: calc(60% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w65 { width: calc(65% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w66 { width: calc(66% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w70 { width: calc(70% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w75 { width: calc(75% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w80 { width: calc(80% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w85 { width: calc(85% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w90 { width: calc(90% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w95 { width: calc(95% - 5px); margin: 0px !important; }
|
||
|
|
.2xl\:grid-w100 { width: calc(100% - 5px); margin: 0px !important; }
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Carousel Specific Styles */
|
||
|
|
.ratio-16-9 { padding-top: 56.25%; } /* 16:9 Aspect Ratio */
|
||
|
|
.ratio-21-9 { padding-top: 42.85%; } /* 21:9 Aspect Ratio */
|
||
|
|
.ratio-32-9 { padding-top: 28.125%; } /* 32:9 Aspect Ratio */
|
||
|
|
|
||
|
|
@screen sm {
|
||
|
|
.sm\:ratio-16-9 { padding-top: 56.25%; } /* 16:9 Aspect Ratio */
|
||
|
|
.sm\:ratio-21-9 { padding-top: 42.85%; } /* 21:9 Aspect Ratio */
|
||
|
|
.sm\:ratio-32-9 { padding-top: 28.125%; } /* 32:9 Aspect Ratio */
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen md {
|
||
|
|
.md\:ratio-16-9 { padding-top: 56.25%; } /* 16:9 Aspect Ratio */
|
||
|
|
.md\:ratio-21-9 { padding-top: 42.85%; } /* 21:9 Aspect Ratio */
|
||
|
|
.md\:ratio-32-9 { padding-top: 28.125%; } /* 32:9 Aspect Ratio */
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen lg {
|
||
|
|
.lg\:ratio-16-9 { padding-top: 56.25%; } /* 16:9 Aspect Ratio */
|
||
|
|
.lg\:ratio-21-9 { padding-top: 42.85%; } /* 21:9 Aspect Ratio */
|
||
|
|
.lg\:ratio-32-9 { padding-top: 28.125%; } /* 32:9 Aspect Ratio */
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen xl {
|
||
|
|
.xl\:ratio-16-9 { padding-top: 56.25%; } /* 16:9 Aspect Ratio */
|
||
|
|
.xl\:ratio-21-9 { padding-top: 42.85%; } /* 21:9 Aspect Ratio */
|
||
|
|
.xl\:ratio-32-9 { padding-top: 28.125%; } /* 32:9 Aspect Ratio */
|
||
|
|
}
|
||
|
|
|
||
|
|
@screen 2xl {
|
||
|
|
.2xl\:ratio-16-9 { padding-top: 56.25%; } /* 16:9 Aspect Ratio */
|
||
|
|
.2xl\:ratio-21-9 { padding-top: 42.85%; } /* 21:9 Aspect Ratio */
|
||
|
|
.2xl\:ratio-32-9 { padding-top: 28.125%; } /* 32:9 Aspect Ratio */
|
||
|
|
}
|