/******* Do not edit this file ******* Simple Custom CSS and JS - by Silkypress.com Saved: Nov 11 2023 | 06:37:48 */ /* ///// Alpha Flexbox System ////// ///////////////////////////////// *//*** Flexbox Formatting Toolkit ***/ /*** Core Component ***/ .flex { display:flex; box-sizing:border-box; } /*** Direction ***/ .column:where(.flex,.block) { flex-direction:column !important } .row:where(.flex,.block) { flex-direction:row !important } .column-r:where(.flex,.block) { flex-direction:column-reverse !important } .row-r:where(.flex,.block) { flex-direction:row-reverse !important } .flex-nowrap { flex-wrap: nowrap; } .flex-wrap { flex-wrap: wrap; } .flex-wrap-3 { flex-wrap: wrap-reverse; } /*** Flex-based Grid Containers ***/ .grid-3 > * { flex-grow: 1; flex-basis:33.33% } .grid-4 > * { flex-grow: 1; flex-basis:25.00% } .grid-5 > * { flex-grow: 1; flex-basis:20.00% } .grid-6 > * { flex-grow: 1; flex-basis:16.66% } .grid-8 > * { flex-grow: 1; flex-basis:12.50% } .grid-12 > * { flex-grow: 1; flex-basis: 8.33% } /*** Themed Containers ***/ .col-grow-13, .col-grow-31 { flex-direction: column; } .row-grow-13, .row-grow-31 { flex-direction: row; } .grow-13 > :last-child, .col-grow-13 > :last-child, .row-grow-13 > :last-child, .grow-31 > :first-child, .col-grow-31 > :first-child, .row-grow-31 > :first-child { flex-grow:3; flex-basis:0; } /*** Sizing ***/ .grow-1, .grow-all > * { flex-grow: 1; } .grow-2 { flex-grow: 2; } .grow-3 { flex-grow: 3; flex-basis: 0; } .basis-0 { flex-basis: 0; } /* used to occupy remaining space */ .basis-25 { flex-basis: 25%; } .basis-32 { flex-basis: 32%; } .basis-33 { flex-basis: 33.3%; } .basis-66 { flex-basis: 66.67%; } .basis-50 { flex-basis: 50%; } .basis-100 { flex-basis: 100%; } /*** Place Content Shorthands ***/ /* Based on numpad positions ex: 1 = bottom-left, 9 = top-right, 5 = middle-center */ .flex.row-1,.flex.col-9 { justify-content: flex-start !important; align-items: flex-end !important } .flex.row-2,.flex.col-6 { justify-content: space-between !important; align-items: flex-end !important } .flex.row-3,.flex.col-3 { justify-content: flex-end !important; align-items: flex-end !important } .flex.row-4,.flex.col-8 { justify-content: flex-start !important; align-items: center !important } .flex.row-5,.flex.col-5 { justify-content: space-between !important; align-items: center !important } .flex.row-6,.flex.col-2 { justify-content: flex-end !important; align-items: center !important } .flex.row-7,.flex.col-7 { justify-content: flex-start !important; align-items: flex-start !important } .flex.row-8,.flex.col-4 { justify-content: space-between !important; align-items: flex-start !important } .flex.row-9,.flex.col-1 { justify-content: flex-end !important; align-items: flex-start !important } /*** Grid/Flex Placements ***/ .flex.start ,.flex > .start { align-items:flex-start !important; } .flex.center ,.flex > .center { align-items:center !important; justify-content:center; } .flex.end ,.flex > .end { align-items:flex-end !important; } .flex.baseline,.flex > .baseline { align-items:baseline !important; } .flex.stretch ,.flex > .stretch { align-items:stretch !important; } .self-start { align-self: flex-start !important; } .self-center { align-self: center !important; justify-content:center; } .self-end { align-self: flex-end !important; } .self-baseline { align-self: baseline !important; } .self-stretch { align-self: stretch !important; } .self-stretch { align-self: stretch !important; } .justify-start { justify-content: flex-start !important; } .justify-end { justify-content: flex-end !important; } .justify-center { justify-content: center !important; } .justify { justify-content: space-between !important; } .justify-around { justify-content: space-around !important; } .justify-even { justify-content: space-evenly !important; } .justify-start-grid { justify-content: start !important; } .justify-end-grid { justify-content: end !important; } /*** Flex Grid Gaps ***/ div[gap= "1"] , div[gap= "1i"], div[gap= "1i"] .flex:not([gap]) { gap: 0.0625em !important } div[gap= "5"] , div[gap= "5i"], div[gap= "5i"] .flex:not([gap]) { gap: 0.3125em !important } div[gap="10"] , div[gap="10i"], div[gap="10i"] .flex:not([gap]) { gap: 0.625em !important } div[gap="15"] , div[gap="15i"], div[gap="15i"] .flex:not([gap]) { gap: 0.9375em !important } div[gap="20"] , div[gap="20i"], div[gap="20i"] .flex:not([gap]) { gap: 1.25em !important } div[gap="25"] , div[gap="25i"], div[gap="25i"] .flex:not([gap]) { gap: 1.5625em !important } div[gap="30"] , div[gap="30i"], div[gap="30i"] .flex:not([gap]) { gap: 1.875em !important } div[gap="40"] , div[gap="40i"], div[gap="40i"] .flex:not([gap]) { gap: 2.5em !important } div[gap= "0"] , div[gap= "0i"], div[gap= "0i"] .flex:not([gap]) { gap: 0em !important } /*** Form Grid Gaps ***/ form[gap= "1"], form[gap= "1i"], form[gap= "1i"] .flex:not([gap]) { gap: 0.0625em !important } form[gap= "5"], form[gap= "5i"], form[gap= "5i"] .flex:not([gap]) { gap: 0.3125em !important } form[gap="10"], form[gap="10i"], form[gap="10i"] .flex:not([gap]) { gap: 0.625em !important } form[gap="15"], form[gap="15i"], form[gap="15i"] .flex:not([gap]) { gap: 0.9375em !important } form[gap="20"], form[gap="20i"], form[gap="20i"] .flex:not([gap]) { gap: 1.25em !important } form[gap="25"], form[gap="25i"], form[gap="25i"] .flex:not([gap]) { gap: 1.5625em !important } form[gap="30"], form[gap="30i"], form[gap="30i"] .flex:not([gap]) { gap: 1.875em !important } form[gap="40"], form[gap="40i"], form[gap="40i"] .flex:not([gap]) { gap: 2.5em !important } form[gap= "0"], form[gap= "0i"], form[gap= "0i"] .flex:not([gap]) { gap: 0em !important }