/* Base CSS - simple reset */
*,
*:before,
*:after {
box-sizing: border-box;
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
table {
border-collapse: collapse;
}
hr {
border: 1px solid rgba(0,0,0,0.1);
border-width: 1px 0 0 0;
margin: 15px 0;
}
body {
line-height: 1.5;
margin: 0;
font-size: 14px;
}
h1,
h2,
h3,
h4,
h5,
h6,
dd,
dt,
label {
margin-bottom: 0.2rem;
font-weight: 400;
line-height: 1.1;
}
ul,
ol,
dl,
p,
dd,
.form-group {
margin-bottom: 1rem;
}
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
dl,
p {
margin-top: 0.5rem;
}
ul ul {
margin-bottom: 0;
}
pre {
white-space: pre-wrap;
}
dt {
font-weight: 700;
}
dd {
margin-left: 0;
}
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;
}
h1,
h2,
h3,
h4,
h5,
h6 {
text-wrap: balance;
}
p {
text-wrap: pretty;
}
a {
color: var(--d-default-link);
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
figure {
margin-inline-start: 0;
margin-inline-end: 0;
margin-block-start: 0;
margin-block-end: 0;
position: relative;
}
input {
margin: 0;
}
select {
margin: 0;
background: #fff;
background: url("data:image/svg+xml;utf8,") no-repeat right 50%;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
}
nav > ul,
ul.list-unstyled {
margin: 0;
padding: 0;
list-style: none;
}
code {
background: rgba(0,0,0,0.05);
padding: 1px 6px;
display: inline-block;
font-family: 'Courier New', Courier, monospace;
font-weight: bold;
border-radius: 3px;
}
iframe {
border: none;
}
.pull-right {
float: right;
}
.pull-left {
float: left;
}
.primary {
color: var(--d-primary);
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
/* hides unloaded custom elements */
*:not(:defined) {
visibility: hidden;
}
html {
background: var(--d-primary);
scroll-behavior: smooth;
scroll-padding-top: 160px;
}
body {
background: #fff;
display: grid;
min-height: 100vh;
grid-template-rows: auto 1fr auto;
grid-template-areas:
"header"
"main"
"footer";
}
main {
grid-area: main;
overflow-x:clip;
}
.container,.breadcrumb {
width:min(100vw - 40px,var(--container-width,1200px));
margin:auto;
}
/* Typography - use tag followed by class format lable-value eg h1.colour-red{} h1.color-blue{} */
/* favour combining styles into a theme, to make it easier for the editor to get common combinations */
/* h1.colour-red,h2.colour-red{
color:#d00;
}
h1.style-bar_left{
font-weight:100;
border-left:5px solid currentColor;
padding-left:10px;
}
h1.style-bar_left strong{
font-weight:400;
color:#d00;
}
*/
blockquote.style-simple{
padding-left:20px;
margin-left:50px;
border-left:5px solid var(--d-primary);
}
/* blockquote.style-shout{
background:linear-gradient(0deg, #d00 0%, #800 100%);
padding:50px;
border-radius: 10px;
box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
position: relative;
color:white;
margin:1em 0;
padding:1.5em 3.5em;
font-size:1.8em;
line-height:150%;
font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
blockquote.style-shout:before {
content: '\301D';
position:absolute;
top:70px;
left:-60px;
font-size:150px;
opacity:0.5
}
blockquote.style-shout:after {
content:"\301E";
position:absolute;
bottom:0em;
right:-50px;
font-size:150px;
opacity:0.5
} */
.alert {
padding: 10px 15px;
position: relative;
color: var(--alert-color, #444);
margin: 10px 0px;
border-radius: 5px;
isolation: isolate;
&:after {
content: '';
position: absolute;
inset: 0;
background: var(--alert-color, #444);
border-radius: inherit;
filter: brightness(240%) saturate(2) opacity(0.25);
z-index: -1;
}
&:before {
content: '';
position: absolute;
inset: 0;
border: 1px solid var(--alert-color, #444);
border-radius: inherit;
filter: brightness(200%) saturate(2) opacity(0.2);
z-index: -1;
}
}
.alert-info {
--alert-color: #055160;
}
.alert-warning {
--alert-color: #664d03;
}
.alert-success {
--alert-color: #0f5132;
}
.alert-danger {
--alert-color: #842029;
}
/* place to put cms8 specific stuff until I've worked out how to manage this*/
.duocmsrow{
display:flex;
flex-wrap:wrap;
margin:0 -10px;
}
.duocmscol{
flex:1 1 100px;
padding:10px 10px;
min-height:50px;
}
/* editmode */
.ProseMirror .duocmscol{
outline:1px dotted rgba(0,0,0,0.1);
}
.ProseMirror .formrows {
outline:1px dotted #ccc;
}
.ProseMirror:focus{
outline:0px;
}
/* fix for excess spacing caused by prosemirror */
.dynamicList{
white-space:normal
}
@supports (display: grid) {
.row,
.duorow {
margin: 0 -15px;
}
.duorow:before,
.row:before {
content: normal;
}
.duorow,
.row {
display: grid;
grid-template-columns: repeat(12, 1fr);
}
.duorow > span,
.row > span {
display: none !important /* fix for slate */;
}
[class*='col-'] {
padding: 0 15px;
grid-column: span 12;
}
.col-xs-1 {
width: auto;
grid-column: span 1;
}
.col-xs-2 {
width: auto;
grid-column: span 2;
}
.col-xs-3 {
width: auto;
grid-column: span 3;
}
.col-xs-4 {
width: auto;
grid-column: span 4;
}
.col-xs-5 {
width: auto;
grid-column: span 5;
}
.col-xs-6 {
width: auto;
grid-column: span 6;
}
.col-xs-7 {
width: auto;
grid-column: span 7;
}
.col-xs-8 {
width: auto;
grid-column: span 8;
}
.col-xs-9 {
width: auto;
grid-column: span 9;
}
.col-xs-10 {
width: auto;
grid-column: span 10;
}
.col-xs-11 {
width: auto;
grid-column: span 11;
}
.col-xs-12 {
width: auto;
grid-column: span 12;
}
@media (min-width: 768px) {
.col-sm-1 {
width: auto;
grid-column: span 1;
}
.col-sm-2 {
width: auto;
grid-column: span 2;
}
.col-sm-3 {
width: auto;
grid-column: span 3;
}
.col-sm-4 {
width: auto;
grid-column: span 4;
}
.col-sm-5 {
width: auto;
grid-column: span 5;
}
.col-sm-6 {
width: auto;
grid-column: span 6;
}
.col-sm-7 {
width: auto;
grid-column: span 7;
}
.col-sm-8 {
width: auto;
grid-column: span 8;
}
.col-sm-9 {
width: auto;
grid-column: span 9;
}
.col-sm-10 {
width: auto;
grid-column: span 10;
}
.col-sm-11 {
width: auto;
grid-column: span 11;
}
.col-sm-12 {
width: auto;
grid-column: span 12;
}
}
@media (min-width: 992px) {
.col-md-1 {
width: auto;
grid-column: span 1;
}
.col-md-2 {
width: auto;
grid-column: span 2;
}
.col-md-3 {
width: auto;
grid-column: span 3;
}
.col-md-4 {
width: auto;
grid-column: span 4;
}
.col-md-5 {
width: auto;
grid-column: span 5;
}
.col-md-6 {
width: auto;
grid-column: span 6;
}
.col-md-7 {
width: auto;
grid-column: span 7;
}
.col-md-8 {
width: auto;
grid-column: span 8;
}
.col-md-9 {
width: auto;
grid-column: span 9;
}
.col-md-10 {
width: auto;
grid-column: span 10;
}
.col-md-11 {
width: auto;
grid-column: span 11;
}
.col-md-12 {
width: auto;
grid-column: span 12;
}
}
@media (min-width: 1200px) {
.col-lg-1 {
width: auto;
grid-column: span 1;
}
.col-lg-2 {
width: auto;
grid-column: span 2;
}
.col-lg-3 {
width: auto;
grid-column: span 3;
}
.col-lg-4 {
width: auto;
grid-column: span 4;
}
.col-lg-5 {
width: auto;
grid-column: span 5;
}
.col-lg-6 {
width: auto;
grid-column: span 6;
}
.col-lg-7 {
width: auto;
grid-column: span 7;
}
.col-lg-8 {
width: auto;
grid-column: span 8;
}
.col-lg-9 {
width: auto;
grid-column: span 9;
}
.col-lg-10 {
width: auto;
grid-column: span 10;
}
.col-lg-11 {
width: auto;
grid-column: span 11;
}
.col-lg-12 {
width: auto;
grid-column: span 12;
}
}
}
.duocol.dark {
background: #444;
}
.duocol.dark > * {
color: #fff;
}
.clearfix,
.container {
display: flow-root;
}
footer {
grid-area: footer;
background: var(--d-primary);
padding: 15px 0 15px 0;
font-size: 12px;
/* Desktop */
}
footer a {
color: #fff;
text-decoration: none;
}
footer .container.footer {
display: grid;
grid-template-areas: "footermap" "copyright" "cookieconsent" "credit";
}
footer .footermap {
grid-area: footermap;
}
footer ul.footermap,
footer li {
list-style: none;
margin: 0;
padding: 1px 0;
}
footer ul.footermap ul,
footer li ul {
padding: 0;
}
footer ul.footermap>li:first-child,
footer li>li:first-child {
display: none;
}
footer ul.footermap>li,
footer li>li {
display: block;
margin: 10px;
width: 20%;
float: left;
font-weight: bold;
}
footer ul.footermap>li li,
footer li>li li {
font-weight: normal;
opacity: 0.7;
}
footer ul.footermap a,
footer li a {
color: rgba(255,255,255,0.8);
}
footer ul.footermap a:hover,
footer li a:hover {
color: #fff;
}
footer .copyright {
grid-area: copyright;
}
footer .cookieconsent {
grid-area: cookieconsent;
}
footer .credit {
grid-area: credit;
}
@media (min-width: 900px) {
footer .container.footer {
display: grid;
grid-template-areas: "footermap footermap footermap" "copyright cookieconsent credit";
}
footer .cookieconsent {
text-align: center;
}
footer .credit {
text-align: right;
}
}
[class*=' col-'] .container {
width: 100%;
margin: 0;
}
.block-accent{
background: var(--d-primary);
color: #fff;
}
.block-subtle {
background: #eee;
}
.nav-pills {
list-style: none;
margin: 0;
padding: 0;
}
.nav-pills li {
margin: 5px 0;
}
.nav-pills a {
color: var(--d-primary);
filter: brightness(95%);
text-decoration: none;
display: block;
padding: 10px 15px;
border-radius: 5px;
transition: all 0.2s;
}
.nav-pills a:hover {
background: #fff;
}
.nav-pills ul {
list-style: none;
margin: 0;
padding: 0;
}
.nav-pills li.depth2 {
background: #eee;
border-radius: 5px;
}
.nav-pills li.depth2 > a {
padding: 5px 15px;
}
.nav-pills li.depth2.active {
padding-bottom: 1px;
border-radius: 0 0 5px 5px;
}
.nav-pills li.depth3 {
margin: 5px;
}
.nav-pills li.depth3 > a {
padding: 3px 11px;
}
.nav-pills li.active > a {
color: #fff;
background: var(--d-primary);
filter: brightness(100%);
}
.breadcrumbbar {
background: #eee;
}
.breadcrumb {
list-style: none;
padding: 0;
}
.breadcrumb li,
.breadcrumb a {
display: inline-block;
}
.breadcrumb a {
text-decoration: none;
padding: 10px 5px;
}
.breadcrumb a:after {
content: " /";
}
.menucheckhide {
all: initial;
opacity: 0;
margin-left: -1000px;
height: 0;
width: 0;
position: absolute;
}
/* main toggle */
.opener {
display: block;
width: 40px;
height: 40px;
position: absolute;
top: 10px;
right: 10px;
z-index: 2;
cursor: pointer;
transition: 0.3s right;
}
.opener:before,
.opener:after {
content: "";
border: 2px solid #fff;
border-width: 2px 0;
position: absolute;
top: 10px;
left: 8px;
width: 26px;
height: 20px;
transition: 0.3s 0.3s height, 0.3s 0.3s top, 0.3s transform;
transform-origin: 13px 1px;
}
.opener:after {
border-width: 2px 0 0 0;
top: 19px;
}
input:checked ~ .opener {
right: 310px;
}
input:checked ~ .opener:before {
height: 0;
top: 19px;
border-width: 1px 0 1px 0;
transform: rotateZ(45deg);
transition: 0.3s height, 0.3s top, 0.3s 0.3s transform;
}
input:checked ~ .opener:after {
transform: rotateZ(-45deg);
transition: 0.3s height, 0.3s top, 0.3s 0.3s transform;
}
/* nav layout */
.mainmenu {
display: block;
position: fixed;
top: 0;
right: 0;
bottom: 0;
width: 300px;
transform: translateX(300px);
transition: 0.3s transform, 0.3s box-shadow;
background: var(--d-dark);
box-shadow: -1000px 0 0 1000px rgba(0,0,0,0);
}
.featurebar {
height: 40px;
transition: 0.5s height;
}
.featurebar.shrink {
height: 0px;
}
input:checked ~ .mainmenu {
transform: translateX(0px);
box-shadow: -1000px 0 0 1000px rgba(0,0,0,0.5);
}
.mainmenu ul,
.mainmenu li {
margin: 0;
}
.mainmenu * {
list-style: none;
padding: 0;
}
.mainmenu a {
display: flex;
align-items: center;
padding: 0 15px;
min-height: 40px;
border-bottom: 1px solid rgba(0,0,0,0.05);
}
.mainmenu a:hover {
text-decoration: none;
}
.mainmenu .depth2 {
padding-left: 10px;
}
.mainmenu li {
position: relative;
}
.mainmenu li:hover {
background: rgba(0,0,0,0.1);
}
.mainmenu li.active {
background: rgba(0,0,0,0.2);
}
/* sub toggle */
.mainmenu .dropdown-arrow {
background: rgba(0,0,0,0.05);
position: absolute;
top: 1px;
right: 0;
height: 38px;
width: 40px;
z-index: 2;
}
.mainmenu .dropdown-arrow:after {
color: #fff;
content: "\00D7";
font-size: 26px;
position: absolute;
top: 0px;
left: 10px;
transform-origin: 8px 15px;
transform: rotateZ(-45deg);
transition: transform 0.3s;
}
input:checked ~ .dropdown-arrow:after {
transform: rotateZ(0deg);
}
input ~ ul > li {
height: 0px;
overflow: hidden;
transition: 0.3s height;
}
input:checked ~ ul > li {
height: 40px;
}
/* Desktop */
@media (min-width: 900px) {
input:checked ~ .mainmenu {
box-shadow: none;
}
.opener {
display: none;
}
.mainmenu {
position: static;
display: flex;
align-items: center;
width: auto;
transform: none;
}
.mainmenu > ul {
display: flex;
align-items: center;
height: 100%;
}
.mainmenu > ul > li {
height: 100%;
display: flex;
justify-content: start;
}
.mainmenu > ul > li.active > a {
color: #fff;
}
.mainmenu a {
border: 0px;
}
.mainmenu ul li.depth2 {
padding: 0;
}
.mainmenu ul li > ul {
position: absolute;
background: #fff;
width: max-content;
min-width: 150px;
top: 100%;
box-shadow: 0 2px 5px rgba(0,0,0,0.5);
opacity: 0;
height: 0;
overflow: hidden;
transform: translateY(20px);
transition: 0.5s opacity, 0.5s transform;
}
.mainmenu ul > li:hover > ul {
opacity: 1;
height: auto;
transform: translateY(0px);
}
.mainmenu .dropdown-menu li {
height: auto;
overflow: visible;
}
.mainmenu .dropdown-menu li a {
color: #000;
background: #fff;
transition: 0.5s background-color;
position: relative;
isolation: isolate;
}
.mainmenu .dropdown-menu li a:after {
content: '';
position: absolute;
inset: 0;
background: var(--d-primary);
z-index: -1;
opacity: 0;
transform-origin: center;
transition: 0.8s opacity;
}
.mainmenu .dropdown-menu li a:hover:after {
content: '';
opacity: 0.4;
}
.mainmenu .dropdown-menu li.active a:after {
opacity: 0.2;
}
.mainmenu .dropdown-arrow {
background: transparent;
pointer-events: none;
position: relative;
width: 15px;
height: 100%;
}
.mainmenu .dropdown-arrow:after {
content: "";
border-style: solid;
border-width: 5px 4px 0px 4px;
border-color: currentcolor transparent transparent transparent;
position: absolute;
top: 50%;
left: -5px;
transform: rotateZ(0deg);
}
}
header {
grid-area: header;
position: sticky;
z-index: 10;
top: 0;
}
header .featurebar {
background: var(--d-primary);
}
header .featurebar .container {
display: flex;
flex-direction: row;
justify-content: flex-end;
}
header .main-navigation {
position: relative;
background: var(--d-dark);
}
header .main-navigation .container {
display: flex;
flex-direction: row;
justify-content: space-between;
}
header .main-navigation .logo {
display: flex;
flex: 1;
color: #fff;
text-decoration: none;
align-items: center;
font-size: 21px;
}
header .main-navigation .logo img {
margin: 5px 10px;
height: 60px;
width: auto;
}
.navbar-features {
height: 40px;
line-height: 30px;
padding: 5px 10px 5px 5px;
}
.navbar-features .row {
margin: 0 -15px;
}
.navbar-features a {
color: #fff;
}
.navbar-features .element {
float: left;
margin-left: 5px;
border-right: 3px solid #fff;
}
.navbar-features .element:last-child {
border: 0px;
}
.navbar-features .searchbar label{
margin:0;
padding:8px 15px;
margin:2px 5px;
border-radius: 2px;
color:white;
}
.navbar-features .searchbar label:hover{
background:rgba(0,0,0,0.2);
}
.navbar-features .searchbar input {
float: left;
border: 0;
background: transparent;
box-shadow: none;
position: relative;
text-align: center;
border-radius: 0px;
width: 180px;
font-size: 14px;
transition: width 0.3s, background 0.3s, color 0.3s;
height: 30px;
color: #fff;
}
.navbar-features .searchbar input::placeholder {
color: #fff;
}
.navbar-features .searchbar input:active,
.navbar-features .searchbar input:focus {
text-align: left;
width: 300px;
background: #fff;
color: #000;
}
.navbar-features .searchbar input:active::placeholder,
.navbar-features .searchbar input:focus::placeholder {
color: rgba(0,0,0,0.2);
}
@media (max-width: 1200px) {
.navbar-features .searchbar input {
position: fixed;
opacity: 0;
padding: 0;
left: 50%;
margin-left: -40vw;
width: 80vw;
top: 100%;
border: 10px solid var(--d-sucess);
padding: 20px;
font-size: 18px;
transition: width 0.3s, top 0.3s, opacity 0.3s;
overflow: visible;
pointer-events: none;
}
.navbar-features .searchbar input +.searchback {
z-index: 999;
}
.navbar-features .searchbar input:focus {
top: 20%;
opacity: 1;
z-index: 1000;
pointer-events: all;
width: 80vw;
}
.navbar-features .searchbar input:focus +.searchback {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0,0,0,0.5);
}
}
.navbar-features login-bar .sbtn,
.navbar-features text-size .sbtn,
.navbar-features basket-modal .sbtn {
background: transparent;
border: 0;
margin: 0;
color: #fff;
border-radius: 0;
width: 100px;
line-height: 18px;
}
@media (min-width: 992px) {
.navbar-features .signup {
width: 100px;
}
}
.loginbar .sbtn.default{
background:transparent;
color:white;
--s-button-margins:-2px 0 0 0;
--s-border-radius:0;
border:0;
/* background:rgba(0,0,0,0.3); */
}
login-bar.element li a {
background: var(--duo-background,#fff);
border: 0;
clear: both;
color: currentColor;
display: block;
font-size: 14px;
font-weight: 400;
line-height: 1.428571429;
padding: 3px 20px;
text-align: left;
text-decoration: none;
white-space: nowrap;
width: 100%;
}
login-bar.element li a:hover{
background-color: color-mix(in srgb,var(--s-primary,#29e) 15%,var(--duo-background,#fff));
color: currentColor;
text-decoration: none;
}
gmap,google-map {
display: block;
}
gmap img[src="/images/assets/maintenance-logo.svg"],
google-map img[src="/images/assets/maintenance-logo.svg"] {
width: 40px !important;
height: 40px !important;
}
gmap.contact {
height: 350px;
}
div:has(> div.map){
display: contents
}
.newsletter-signup {
background: var(--d-dark);
padding: 0 0 20px 0;
margin: 0 auto;
width: 100%;
}
.newsletter-signup label {
color: #fff;
}
.newsletter-signup h4 {
color: var(--d-primary);
font-size: 18px;
}
.newsletter-signup .td {
padding: 5px 0 0 0;
}
.newsletter-signup .td label {
margin: 0 2px -2px 2px;
font-size: 12px;
}
.newsletter-signup .btn {
margin: 10px 0 0 0;
}
.newsletter-signup input {
border: 1px solid #122632;
width: 100%;
background: #3a7ba3;
color: #fff;
font-size: 12px;
padding: 7px;
border-radius: 4px;
}
.newsletter-signup input::placeholder {
color: var(--d-primary);
}
.newsletter-signup input:focus,
.newsletter-signup input:active {
background: #fff;
color: #000;
}
@media (min-width: 900px) {
.newsletter-signup {
padding: 2px 2px 5px 2px;
}
.newsletter-signup form {
display: table;
width: 100%;
}
.newsletter-signup .td {
display: table-cell;
padding: 5px;
}
.newsletter-signup label {
float: right;
}
.newsletter-signup .btn {
margin-top: 0;
}
}
/* mobile + non :has hacks */
/* style examples */
/*
.duoform-size-big{
font-size:2em;
}
.duoform-size-small{
font-size:0.7em;
}
*/
.duoform {
padding: 30px;
accent-color: var(--d-primary);
}
.duoform .formrows {
display: contents;
}
.duoform button[type=submit] {
grid-column: 1/2;
width: max-content;
}
.formrow input,
.formrow textarea,
.formrow select {
padding: 5px;
font-size: 16px;
border: 1px solid #ddd;
box-shadow: inset 0 2px 4px 0 rgba(0,0,0,0.1);
width: 100%;
}
.formrow textarea {
font-family: inherit;
resize: vertical;
}
.formrow label {
text-align: left;
align-self: center;
margin-bottom: 0;
display: block;
padding: 10px 0 5px 0;
}
.formrow input[type=checkbox] {
margin: 10px 10px 5px 0;
}
.formrow input[type=checkbox],
.formrow input[type=radio] {
display: block;
height: 17px;
width: 17px;
align-self: center;
float: left;
box-shadow: none;
}
.duoform .radioblock {
display: flex;
gap: 20px;
margin-left: 2px;
}
.duoform .radiooption {
display: flex;
gap: 5px;
align-items: center;
}
.formrow:has(.radiooption) label {
align-self: start;
}
/* use has and subgrid for browser which support it */
@supports selector(:has(*)) and (grid-template-columns: subgrid) {
.duoform{
container-type: inline-size;
container-name: container;
display:grid;
grid-template-columns:auto 1fr;
gap:15px 10px;
}
.formrow{
display:grid;
gap:5px 10px;
grid-column: 1 / 3;
}
.formrow label{
padding:0;
}
.formrow input[type=checkbox]{
margin:0;
}
.formrow:has(input[type=checkbox]){
grid-column: 1 / 2;
display:grid;
grid-template-columns:auto 1fr;
gap:5px 10px;
}
.formrow:has(input[type=checkbox]) label{
text-align:left;
align-self:center;
}
.formrow:has(textarea) label{
padding-top:5px;
align-self:start;
}
.formrow:has(input[required]) label:before{
content:"* "
}
/* desktop using container query */
@container container (min-width: 400px) {
.formrow{
grid-column: span 2;
grid-template-columns:subgrid;
}
.formrow label{
text-align:right;
}
.formrow:has(input[type=checkbox]){
grid-column: 2 / 3;
}
.duoform button[type=submit]{
grid-column: 2 / 3;
}
}
}
table {
background-color: transparent;
}
caption {
padding-top: 8px;
padding-bottom: 8px;
color: var(--text-muted);
text-align: left;
}
th {
text-align: left;
}
.table {
width: 100%;
max-width: 100%;
margin-bottom: 20px;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
padding: 8px;
line-height: 18px;
vertical-align: top;
border-top: 1px solid #ddd;
}
.table > thead > tr > th > *,
.table > tbody > tr > th > *,
.table > tfoot > tr > th > *,
.table > thead > tr > td > *,
.table > tbody > tr > td > *,
.table > tfoot > tr > td > * {
margin: 0;
}
.table > thead > tr > th {
vertical-align: bottom;
border-bottom: 2px solid #ddd;
}
.table > caption + thead > tr:first-child > th,
.table > colgroup + thead > tr:first-child > th,
.table > thead:first-child > tr:first-child > th,
.table > caption + thead > tr:first-child > td,
.table > colgroup + thead > tr:first-child > td,
.table > thead:first-child > tr:first-child > td {
border-top: 0;
}
.table > tbody + tbody {
border-top: 2px solid #ddd;
}
.table .table {
background-color: transparent;
}
.table-condensed > thead > tr > th,
.table-condensed > tbody > tr > th,
.table-condensed > tfoot > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > td {
padding: 5px;
}
.table-bordered {
border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td {
border-bottom-width: 2px;
}
.table-striped > tbody > tr:nth-of-type(odd) {
background-color: #f9f9f9;
}
.table-hover > tbody > tr:hover {
background-color: #f5f5f5;
}
table col[class*="col-"] {
position: static;
float: none;
display: table-column;
}
table td[class*="col-"],
table th[class*="col-"] {
position: static;
float: none;
display: table-cell;
}
.tablewrapper:has(.table-responsive) {
overflow-x: auto;
min-height: 0.01%;
}
@media screen and (max-width: 768px) {
.tablewrapper:has(.table-responsive) {
width: 100%;
margin-bottom: 15px;
overflow-y: hidden;
-ms-overflow-style: -ms-autohiding-scrollbar;
border: 1px solid #ddd;
}
.tablewrapper:has(.table-responsive) > .table {
margin-bottom: 0;
}
.tablewrapper:has(.table-responsive) > .table > thead > tr > th,
.tablewrapper:has(.table-responsive) > .table > tbody > tr > th,
.tablewrapper:has(.table-responsive) > .table > tfoot > tr > th,
.tablewrapper:has(.table-responsive) > .table > thead > tr > td,
.tablewrapper:has(.table-responsive) > .table > tbody > tr > td,
.tablewrapper:has(.table-responsive) > .table > tfoot > tr > td {
white-space: nowrap;
}
.tablewrapper:has(.table-responsive) > .table-bordered {
border: 0;
}
.tablewrapper:has(.table-responsive) > .table-bordered > thead > tr > th:first-child,
.tablewrapper:has(.table-responsive) > .table-bordered > tbody > tr > th:first-child,
.tablewrapper:has(.table-responsive) > .table-bordered > tfoot > tr > th:first-child,
.tablewrapper:has(.table-responsive) > .table-bordered > thead > tr > td:first-child,
.tablewrapper:has(.table-responsive) > .table-bordered > tbody > tr > td:first-child,
.tablewrapper:has(.table-responsive) > .table-bordered > tfoot > tr > td:first-child {
border-left: 0;
}
.tablewrapper:has(.table-responsive) > .table-bordered > thead > tr > th:last-child,
.tablewrapper:has(.table-responsive) > .table-bordered > tbody > tr > th:last-child,
.tablewrapper:has(.table-responsive) > .table-bordered > tfoot > tr > th:last-child,
.tablewrapper:has(.table-responsive) > .table-bordered > thead > tr > td:last-child,
.tablewrapper:has(.table-responsive) > .table-bordered > tbody > tr > td:last-child,
.tablewrapper:has(.table-responsive) > .table-bordered > tfoot > tr > td:last-child {
border-right: 0;
}
.tablewrapper:has(.table-responsive) > .table-bordered > tbody > tr:last-child > th,
.tablewrapper:has(.table-responsive) > .table-bordered > tfoot > tr:last-child > th,
.tablewrapper:has(.table-responsive) > .table-bordered > tbody > tr:last-child > td,
.tablewrapper:has(.table-responsive) > .table-bordered > tfoot > tr:last-child > td {
border-bottom: 0;
}
}
.duoEditArea img {
height: auto;
width: auto;
max-width: 100%;
}
.duoEditArea figure {
display: grid;
max-width: 100%;
}
.duoEditArea figure > * {
grid-column: 1/2;
grid-row: 1/2;
}
.caption-heading {
color: #fff;
width:min(100% - 80px,var(--container-width,1200px));
color: #fff;
text-shadow: 0 0 3px #000, 0 0 10px #000;
align-self: center;
justify-self: center;
}
.caption-heading h2 {
font-size: clamp(1.8rem, 5vw, 6rem);
margin-bottom: 0px;
}
.caption-heading h3 {
font-size: clamp(1rem, 2.5vw, 3rem);
line-height: clamp(1rem, 2.5vw, 3rem);
}
.caption-footer {
background:rgba(0,0,0,0.5);
padding:5px 8px;
font-size:14px;
color:white;
align-self: end;
}
.img-rounded {
border-radius: 10px;
overflow:clip;
}
/* below grid setup keeps the slideshow at the same height */
duo-slideshow,duo-slideshow::part(wrapper) {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr;
grid-template-areas:"slide";
background:#444;
overflow:hidden;
}
duo-slideshow .duoslide.active figcaption {
animation: 4s ease-out 0s 1 slideswipe;
}
duo-slideshow > .duoslide.duoslide,duo-slideshow > .duoslide.active{
grid-area:slide;
position:relative;
}
duo-slideshow .duoslide figure {
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
}
duo-slideshow .duoslide img {
min-width: 100%;
display: block;
object-fit: cover;
height: 100%;
max-height:min(100vh, 500px);
}
/*
.slideshow-zoombounce .duoslide {
display: block;
position: absolute;
top: 0;
opacity: 0;
width: 100%;
transition: 0.5s opacity, 0.5s transform;
transition-delay: 0.5s;
transform: scale(0.1, 0.1);
transform-origin: center 200px;
}
.slideshow-zoombounce .duoslide.active {
opacity: 1;
position: relative;
left: 0;
z-index: 1;
transition-delay: 0s;
transform: scale(1, 1);
}
.slideshow-zoombounce .duoslide.active figcaption {
animation: 1s ease-out 0s 1 bounce;
}
.slideshow-cube::part(slideshow) {
perspective: 1000px;
background: #000;
overflow: hidden;
}
.slideshow-cube::part(wrapper) {
transform-style: preserve-3d;
transform: translateZ(50vw) rotateY(-90deg);
transition: none;
}
.slideshow-cube::part(wrapper updated) {
transform: translateZ(50vw) rotateY(0deg);
transition: 2s transform;
}
.slideshow-cube .duoslide {
transform: translateX(-50vw) rotateY(90deg);
transition: 1s opacity;
backface-visibility: hidden;
}
.slideshow-cube .duoslide.active {
transform: translateZ(-50vw) rotateY(0deg);
}
.slideshow-tumbler {
height: 700px;
}
.slideshow-tumbler::part(slideshow) {
perspective: 1000px;
background: #000;
overflow: hidden;
}
.slideshow-tumbler::part(wrapper) {
transform-style: preserve-3d;
transform: translateZ(-350px) rotateX(90deg);
transition: none;
}
.slideshow-tumbler::part(wrapper updated) {
transform: translateZ(-350px) rotateX(0deg);
transition: 2s transform;
}
.slideshow-tumbler .duoslide {
transform: translateY(350px) rotateX(-90deg);
transition: 1s opacity;
backface-visibility: hidden;
}
.slideshow-tumbler .duoslide.active {
transform: translateZ(350px) rotateX(0deg);
} */
@keyframes slideswipe {
0% {
transform: translateX(50%);
color: rgba(255,255,255,0);
opacity: 0;
}
10% {
transform: translateX(0);
color: rgba(255,255,255,0);
opacity: 1;
}
30% {
color: #fff;
opacity: 1;
}
100% {
color: #fff;
opacity: 1;
}
}
/*
@keyframes bounce {
0% {
transform: scale(1, 1) translateY(-800px);
}
30% {
transform: scale(1, 1) translateY(-800px);
}
50% {
transform: scale(1, 1) translateY(0);
}
55% {
transform: scale(1, 0.95) translateY(0);
}
65% {
transform: scale(1, 1.05) translateY(-50px);
}
75% {
transform: scale(1, 1) translateY(0);
}
78% {
transform: scale(1, 1) translateY(-7px);
}
82% {
transform: scale(1, 1) translateY(0);
}
100% {
transform: scale(1, 1) translateY(0);
}
} */
.embed-responsive {
position: relative;
display: block;
height: 0;
padding: 0;
overflow: hidden;
}
.embed-responsive-16by9 {
padding-bottom: 56.25%;
}
.embed-responsive iframe {
position: absolute;
top: 0;
left: 0;
bottom: 0;
height: 100%;
width: 100%;
border: 0;
}
.column-dark, .block-dark {
background: #444;
color: #fff;
}
.column-no-padding {
padding: 0;
}
.columns-gap-small {
gap: 5px;
}
.columns-gap-large {
gap: 20px;
}
/**
* okaidia theme for JavaScript, CSS and HTML
* Loosely based on Monokai textmate theme by http://www.monokai.nl/
* @author ocodia
*/
code[class*="language-"],
pre[class*="language-"] {
color: #f8f8f2;
background: none;
text-shadow: 0 1px rgba(0, 0, 0, 0.3);
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
font-size: 1em;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: .5em 0;
overflow: auto;
border-radius: 0.3em;
}
:not(pre) > code[class*="language-"],
pre[class*="language-"] {
background: #272822;
}
/* Inline code */
:not(pre) > code[class*="language-"] {
padding: .1em;
border-radius: .3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: #8292a2;
}
.token.punctuation {
color: #f8f8f2;
}
.token.namespace {
opacity: .7;
}
.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {
color: #f92672;
}
.token.boolean,
.token.number {
color: #ae81ff;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #a6e22e;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string,
.token.variable {
color: #f8f8f2;
}
.token.atrule,
.token.attr-value,
.token.function,
.token.class-name {
color: #e6db74;
}
.token.keyword {
color: #66d9ef;
}
.token.regex,
.token.important {
color: #fd971f;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
.language-shell,.language-nginx,.language-json,.language-sql,.language-html{
margin:5px;
}
[class*=link-icon] {
color: var(--link-icon-color);
}
[class*=link-icon]:before {
content: "";
display: inline-block;
margin: 0 0.2em -0.2em 0.1em;
width: 1.2em;
height: 1.2em;
transform: scale(1.2);
background-color: var(--link-icon-color);
-webkit-mask-image: var(--link-icon);
-webkit-mask-repeat: no-repeat;
mask-image: var(--link-icon);
mask-repeat: no-repeat;
}
[class*=link-type]:not(.link-type-default)[class*=link-icon] {
color: #fff;
}
[class*=link-type]:not(.link-type-default)[class*=link-icon]:before {
margin: 0 0.3em -0.2em -0.1em;
background-color: #fff;
}
.link-icon-txt {
--link-icon: url("data:image/svg+xml;utf8,");
--link-icon-color: #444;
}
.link-icon-pdf {
--link-icon: url("data:image/svg+xml;utf8,");
--link-icon-color: #c00;
}
.link-icon-doc {
--link-icon: url("data:image/svg+xml;utf8,");
--link-icon-color: #4183f8;
}
.link-icon-ppt {
--link-icon: url("data:image/svg+xml;utf8,");
--link-icon-color: #f26832;
}
.link-icon-xls {
--link-icon: url("data:image/svg+xml;utf8,");
--link-icon-color: #1bb371;
}
[class*=link-type] {
padding: 0.55em 0.75em;
background: #eee;
border: 0px;
font-size: 1em;
text-decoration: none;
color: #000;
white-space: nowrap;
display: inline-block;
margin: var(--d-button-margins, 4px);
text-align: center;
cursor: pointer;
line-height: 1.25;
border-radius: var(--d-border-radius, 4px);
box-shadow: 0 1px 2px rgba(0,0,0,0.5);
transition: transform 0.2s, box-shadow 0.2s, filter;
}
[class*=link-type]:hover {
text-decoration: none;
}
[class*=link-type]:focus {
outline: 0px;
box-shadow: 0 0 3px #000;
}
[class*=link-type]:active {
outline: 0px;
box-shadow: inset 0 4px 4px rgba(0,0,0,0.2);
}
.link-size-smaller {
font-size: 12px;
padding: 0.2em 0.7em;
}
.link-size-small {
font-size: 12px;
}
.link-size-large {
font-size: 21px;
}
.link-size-block {
display: block;
width: 100%;
}
.link-size-blocksmaller {
font-size: 10px;
display: block;
width: 100%;
}
.link-size-blocksmall {
font-size: 12px;
display: block;
width: 100%;
}
.link-size-blocklarger {
font-size: 21px;
display: block;
width: 100%;
}
.link-type-primary,
.link-type-info,
.link-type-success,
.link-type-warning,
.link-type-danger,
.link-type-dark {
color: #fff;
}
.link-type-primary[class*=link-icon]:before,
.link-type-info[class*=link-icon]:before,
.link-type-success[class*=link-icon]:before,
.link-type-warning[class*=link-icon]:before,
.link-type-danger[class*=link-icon]:before,
.link-type-dark[class*=link-icon]:before {
margin: 0 0.3em -0.2em -0.1em;
background-color: #fff;
color: #fff;
}
.link-type-primary {
background-color: var(--d-primary, #29e);
}
.link-type-info {
background-color: var(--d-info, #17a2b8);
}
.link-type-success {
background-color: var(--d-success, #28a745);
}
.link-type-warning {
background-color: var(--d-warning, #ffc107);
}
.link-type-danger {
background-color: var(--d-danger, #dc3545);
}
.link-type-dark {
background-color: var(--d-dark, #343a40);
}
.duoEditArea details {
--details-colour: var(--d-primary);
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
padding: 20px;
border-radius: 5px;
background: #fff;
margin-top: 5px;
}
.duoEditArea details h1,
.duoEditArea details h2,
.duoEditArea details h3,
.duoEditArea details h4,
.duoEditArea details h5 {
margin-top: 0px;
}
.duoEditArea details summary {
position: relative;
outline: none;
font-size: 24px;
background: #fff;
padding: 20px;
margin: -20px;
margin-bottom: -20px;
border-radius: 5px;
cursor: pointer;
color: var(--details-colour);
transition: background-color 0.5s, margin-bottom 0.5s;
list-style: none;
}
.duoEditArea details summary::-webkit-details-marker {
display: none;
}
.duoEditArea details summary:before {
display: block;
content: " ";
border: 10px solid transparent;
border-top-color: currentColor;
width: 0;
height: 0;
position: absolute;
top: 45%;
right: 20px;
transform-origin: 10px 5px;
transition: transform 0.3s;
transform: rotate(-90deg);
}
.duoEditArea details[open] summary {
margin-bottom: 10px;
border-radius: 5px 5px 0 0;
background: var(--details-colour);
color: #fff;
z-index: 2;
}
.duoEditArea details[open] summary:before {
transform: rotate(0deg);
}
.duoEditArea details[open] summary ~ * {
animation: sweep 0.5s ease-in-out;
}
.details-danger,
.duoEditArea details.details-danger {
color: #b00;
}
.details-danger summary,
.duoEditArea details.details-danger summary {
background: #b00;
color: #fff;
}
.details-compact,
.duoEditArea details.details-compact {
padding: 5px 15px;
}
.details-compact summary,
.duoEditArea details.details-compact summary {
padding: 5px 15px;
margin: -5px -15px;
}
.details-compact[open] summary,
.duoEditArea details.details-compact[open] summary {
margin-bottom: 10px;
}
@-moz-keyframes sweep {
0% {
opacity: 0;
margin-top: -10%;
}
50% {
opacity: 0.01;
margin-top: 0;
}
100% {
opacity: 1;
margin-top: 0;
}
}
@-webkit-keyframes sweep {
0% {
opacity: 0;
margin-top: -10%;
}
50% {
opacity: 0.01;
margin-top: 0;
}
100% {
opacity: 1;
margin-top: 0;
}
}
@-o-keyframes sweep {
0% {
opacity: 0;
margin-top: -10%;
}
50% {
opacity: 0.01;
margin-top: 0;
}
100% {
opacity: 1;
margin-top: 0;
}
}
@keyframes sweep {
0% {
opacity: 0;
margin-top: -10%;
}
50% {
opacity: 0.01;
margin-top: 0;
}
100% {
opacity: 1;
margin-top: 0;
}
}
/* example colour option below */
/* details.details-colour-red{
--details-colour:var(--d-danger);
} */
.dl_default, .dl_blog {
container-type: inline-size;
container-name: dl_default;
}
.dl_default .item,
.dl_blog .item {
display: grid;
grid-template-columns: auto 1fr;
grid-template-rows: auto auto 1fr;
gap: 5px 20px;
grid-template-areas: "image heading" "image date" "image description";
}
.dl_default .item h3,
.dl_blog .item h3 {
grid-area: heading;
}
.dl_default .item img,
.dl_blog .item img,
.dl_default .item .image-placeholder,
.dl_blog .item .image-placeholder {
grid-area: image;
display: block;
width: 200px;
height: 100%;
object-fit: cover;
}
.dl_default .item .description,
.dl_blog .item .description {
grid-area: description;
align-self: start;
}
.dl_default .item small,
.dl_blog .item small {
grid-area: date;
}
.dl_default .item .image-placeholder,
.dl_blog .item .image-placeholder {
width: 200px;
height: 100%;
background: #f4f4f4;
}
.dl_default hr,
.dl_blog hr {
border: 2px solid #eee;
margin: 5px 0;
}
.dl_default .space,
.dl_blog .space {
height: 5px;
}
.dl_gallery duo-gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 10px;
}
.dl_gallery duo-gallery .item {
display: grid;
outline: 1px solid #eee;
overflow: hidden;
}
.dl_gallery duo-gallery .item > * {
grid-column: 1/2;
grid-row: 1/2;
}
.dl_gallery duo-gallery .item:hover figcaption {
background: rgba(0,0,0,0.8);
}
.dl_gallery duo-gallery .item:hover img {
scale: 1.04;
}
.dl_gallery duo-gallery .item img {
width: 100%;
/* height: 200px; */
/* object-fit: cover; */
transition: scale 0.3s;
}
.dl_gallery duo-gallery .item figcaption {
min-width: 0;
background: rgba(0,0,0,0.6);
transition: background 0.3s;
align-self: end;
padding: 20px;
color: #fff;
z-index: 2;
}
.dl_gallery duo-gallery .item h3 {
font-size: 1.5em;
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.slider .gallery-panel .item img {
min-width: 500px;
border: 10px solid #222;
background: #222;
border-bottom: 0;
height: auto;
}
.slider .gallery-panel .item figcaption {
min-width: 0;
background: #111;
align-self: end;
padding: 10px;
color: #fff;
z-index: 2;
transform: translate(0, 100%);
border: 10px solid #222;
border-top: 0px;
}
.dl_files {
margin-top: 15px;
}
.dl_files .item p {
margin: 0 0 5px 0;
}
.dl_files .item a {
display: block;
padding: 10px;
border: 1px solid #eee;
background: #fff;
transition: all 0.3s;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.dl_files .item a:hover {
text-decoration: none;
background: #f4f4f4;
border: 1px solid #ddd;
}
.dl_files .item a small {
font-size: 0.5em;
padding: 0;
}
.dl_files .grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
gap: 5px;
}
.dl_files .grid .item p {
height: 100%;
}
.dl_files .grid .item p a {
text-align: center;
height: 100%;
font-size: 16px;
}
.dl_files .grid .item p a:before {
font-size: 60px;
display: block;
margin: 10px auto;
transform: scale(1) translate(10px, 0);
transition: transform 0.3s ease-in-out;
}
.dl_files .grid .item p a:hover:before {
transform: scale(1.08) translate(10px, -5px);
}
.dl_files .grid small {
font-size: 0.8em;
}
@container dl_default (width < 600px) {
.dl_default .item,
.dl_blog .item {
margin-bottom: 20px;
grid-template-columns: 1fr;
grid-template-rows: auto auto auto 1fr;
gap: 5px 20px;
grid-template-areas: "image" "heading" "date" "description";
}
.dl_default .item h3,
.dl_blog .item h3,
.dl_default .item .description,
.dl_blog .item .description,
.dl_default .item small,
.dl_blog .item small {
padding-inline: 5px;
}
.dl_default .item img,
.dl_blog .item img {
width: 100%;
height: 150px;
object-fit: cover;
border-top: 1px solid var(--d-primary);
}
.dl_default .item .image-placeholder,
.dl_blog .item .image-placeholder {
width: 100%;
opacity: 1;
border-top: 1px solid var(--d-primary);
}
}
pop-up::part(modal) {
padding: 20px;
}
.popup-padding-none::part(modal) {
padding: 0px;
}
.popup-padding-small::part(modal) {
padding: 10px;
}
.popup-padding-large::part(modal) {
padding: 30px;
}
.popup-colour-dark::part(modal) {
background: #444;
color: #fff;
border-radius: 5px;
}
duo-gallery {
position: relative;
}
.gallery-layout-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 2px;
}
.gallery-layout-grid figure{
width:100%;
}
.gallery-layout-grid figure img {
height: 200px;
object-fit: cover;
}
.duoEditArea li > * {
margin:5px 5px;
}
.list-style-none{
list-style:none;
margin:0;
padding:0;
}
.list-style-block{
list-style:none;
margin:0;
padding:0;
}
.list-height-small li > * {
margin:0px 5px;
}
.list-height-large li > * {
margin:10px 5px;
}
/* below are read by the chart interface 1-12 */
duo-chart{
max-width:100%;
--chart-colour1:#FF1616;
--chart-colour2:#FF914D;
--chart-colour3:#FFDE59;
--chart-colour4:#7ED957;
--chart-colour5:#5271FF;
--chart-colour6:#8C52FF;
--chart-colour7:#7F00FF;
--chart-opacity:44;
}
/* used on search page */
.pagination {
display: flex;
margin-bottom: 20px;
}
.pagination li > a {
padding: 0.5em 0.8em;
border: 1px solid #eee;
margin: 2px;
color: var(--d-dark);
}
.pagination li.active > a {
background: var(--d-primary);
color: #fff;
}
.pagination li > a:hover {
text-decoration: none;
border: 1px solid var(--d-primary);
}
.pagination li.disabled > a {
color: #ddd;
cursor: not-allowed;
border: 1px solid #eee;
}
.duoicon-size-auto{
font-size:1em;
}
.duoicon-size-medium{
font-size:5em;
}
.duoicon-size-large{
font-size:200px;
}
.duoicon-align-left{
text-align:left;
display:block;
}
.duoicon-align-center{
text-align:center;
display:block;
}
.duoicon-align-right{
text-align:right;
display:block;
}
.duoicon-align-block{
display:block;
}
.duoicon-colour-primary{
color:var(--d-primary);
}
.duoicon-colour-info{
color:var(--d-info);
}
.duoicon-colour-success{
color:var(--d-success);
}
.duoicon-colour-warning{
color:var(--d-warning);
}
.duoicon-colour-danger{
color:var(--d-danger);
}
.duoicon-colour-dark{
color:var(--d-dark);
}
/* below only neccessary since 8.5.38 */
.icon{
height:1em;
width:1em;
display: inline-flex;
align-self: center;
position:relative;
top:0.15em;
-webkit-font-smoothing:antialiased;
fill:currentcolor;
}
/* part is used to reach into shadow dop */
duo-card::part(card){
display:grid;
grid-template-columns:1fr;
grid-template-rows:auto 1fr auto;
grid-template-areas:
"title"
"text"
"footer";
gap:20px;
padding:10px;
box-shadow:0 2px 5px rgba(0,0,0,0.3);
min-height:300px;
}
duo-card:has(> [slot=image])::part(card){
grid-template-columns:1fr 1fr;
grid-template-areas:
"image title"
"image text"
"image footer";
}
duo-card [slot='image']{
margin:0;
grid-area:image;
}
duo-card figure{
overflow: hidden;
height:100%;
}
duo-card img{
/* aspect-ratio: 1/1; */
min-height:100%;
object-fit:cover;
}
duo-card [slot=heading]{ grid-area:title;}
duo-card [slot=text]{ grid-area:text;}
duo-card [slot=footer]{ grid-area:footer;}
/* Layouts */
:has(> duo-card.card-layout-responsive){
container: responsive-wrap / inline-size;
}
@container responsive-wrap (max-width: 500px) {
duo-card.card-layout-responsive::part(card) {
grid-template-columns:1fr;
grid-template-areas:
"title"
"image"
"text"
"footer";
}
}
duo-card.card-layout-vertical::part(card) {
grid-template-columns:1fr;
grid-template-areas:
"title"
"image"
"text"
"footer";
}
duo-card.card-layout-list::part(card) {
grid-template-columns:100px 1fr 100px;
grid-template-rows: 1fr;
min-height:auto;
grid-template-areas:
"image title footer"
}
.card-layout-list [slot=text]{ display:none }
/* Theme */
.card-theme-dark{
background:#444;
color:white;
}
.card-theme-compact::part(card){
padding:0;
gap:0;
}
.card-theme-compact [slot=heading]{ padding:10px 15px;}
.card-theme-compact [slot=text]{ padding:10px 15px;}
.card-theme-compact [slot=footer]{ padding:10px 10px 0 10px; }
h1.svelte-1wx390f{
color:green;
}
.box.svelte-1wx390f{
border:1px solid #eee;
width:fit-content;
padding:15px 20px;
border-radius:3px;
box-shadow: 3px 3px 10px rgba(0,0,0,0.2);
}
.toaster.svelte-xc0tms{
z-index:10002;
position: fixed;
top: 5px;
right:10px;
}
.slice.svelte-xc0tms{
width:250px;
padding:15px 20px;
border-radius:4px;
box-shadow:0 2px 10px rgba(0,0,0,0.3);
margin:5px 0;
position:relative;
}
.cancel.svelte-xc0tms{
position:absolute;
top:5px;
right:5px;
background:transparent;
border:0;
color:white;
width:34px;
height:34px;
cursor:pointer;
transition: transform 0.3s;
}
.cancel.svelte-xc0tms:hover{
transform:scale(1.3);
}
.slice.svelte-xc0tms h3:where(.svelte-xc0tms){
margin:0 0 10px 0;
color:white;
}
/* backgrounds set twice, first for IE11 */
.slice.primary.svelte-xc0tms,.slice.info.svelte-xc0tms,.slice.success.svelte-xc0tms,.slice.warning.svelte-xc0tms,.slice.danger.svelte-xc0tms,.slice.dark.svelte-xc0tms { color:white; fill:white;}
.slice.primary.svelte-xc0tms {background-color:hsla(var(--themehue), 50%, 35%, 1)}
.slice.info.svelte-xc0tms {background-color:#17a2b8;background-color:var(--s-info,#17a2b8)}
.slice.success.svelte-xc0tms {background-color:#28a745;background-color:var(--s-success,#28a745)}
.slice.warning.svelte-xc0tms {background-color:#ffc107;background-color:var(--s-warning,#ffc107)}
.slice.danger.svelte-xc0tms {background-color:#dc3545;background-color:var(--s-danger,#dc3545)}
.slice.dark.svelte-xc0tms {background-color:#343a40;background-color:var(--s-dark,#343a40)}
:host{
display:block;
}
.smodal.svelte-1gib9mj{
display:block;
position:static;
background:white;
z-index:1000;
padding:15px;
border-radius:var(--s-border-radius,4px);
box-shadow:0 3px 10px rgba(0,0,0,0.5);
transition:transform 0.5s;
transform:scale3d(1,1,1);
height: auto;
max-width:100%;
min-width:300px;
align-self: flex-start;
}
.backdrop.svelte-1gib9mj{
position:fixed;
background-color:rgba(0,0,0,0.4);
padding:20px;
top:0;
left:0;
right:0;
bottom:0;
transition:background-color 0.5s;
z-index:999;
display:flex;
align-content:start;
overflow:auto;
align-items: start;
justify-content: center;
}
.heading.svelte-1gib9mj h3:where(.svelte-1gib9mj){
margin:3px 0;
font-size:21px;
font-weight:normal;
}
.heading.svelte-1gib9mj{
border-radius:var(--s-border-radius,4px) var(--s-border-radius,4px) 0 0;
padding:10px 15px 10px 15px;;
margin:-15px;
margin-bottom:10px;
border-bottom:1px solid rgba(0,0,0,0.1);
}
.close.svelte-1gib9mj{
background:transparent;
border:0px;
font-size:24px;
font-weight:bold;
position:absolute;
right:0px;
top:0px;
padding:7px 15px;
cursor:pointer;
opacity:0.5
}
.close.svelte-1gib9mj:hover{
opacity:1;
}
.modaltoolbar.svelte-1gib9mj{
border-top:1px solid #eee;
padding:10px 10px 0px 10px;
margin:20px -15px 0 -15px;
}
.modaltoolbar.svelte-1gib9mj:blank{
display:none;
}
.slider.svelte-724qlf{
position:absolute;
width:100%;
height:4px;
overflow-x: hidden;
}
.line.svelte-724qlf{
position:absolute;
opacity: 0.4;
background:rgba(0,0,0,0.2);
width:150%;
height:4px;
}
.subline.svelte-724qlf{
position:absolute;
background:#4a8df8;
height:3px;
}
.inc.svelte-724qlf{
animation: svelte-724qlf-increase 2s infinite;
}
.dec.svelte-724qlf{
animation: svelte-724qlf-decrease 2s 0.5s infinite;
}
@keyframes svelte-724qlf-increase {
from { left: -5%; width: 5%; }
to { left: 130%; width: 100%;}
}
@keyframes svelte-724qlf-decrease {
from { left: -80%; width: 80%; }
to { left: 110%; width: 10%;}
}
.formdate .form-row .form-control{
border-radius:4px 0 0 4px;
border-right-width: 0px;
}
.svelte-k13m19 {
white-space: normal;
-webkit-user-modify:read-only;
}
.dropdown.svelte-k13m19{
display:inline-block;
position:relative;
}
.dropdown-menu.svelte-k13m19{
display:block;
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
float: left;
min-width: 160px;
padding: 5px 0;
margin: 2px 0 0;
list-style: none;
font-size: 14px;
text-align: left;
background:var(--duo-background,white);
border: 1px solid rgba(0,0,0,0.1);
border: 1px solid rgba(0,0,0,0.15);
border-radius: 4px;
box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
background-clip: padding-box;
}
.dropdown-menu.right.svelte-k13m19{
right:0;
left:auto;
}
.dropdown-menu.top.svelte-k13m19{
top:auto;
bottom:100%;
}
duo-dropdown [slot="menu"] a,
.dropdown-menu [slot="menu"] a,
.dropdown-menu [slot="menu"] button{
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: 1.428571429;
color: currentColor;
white-space: nowrap;
background:var(--duo-background,white);
width:100%;
text-align:left;
border:0px;
font-size:14px;
text-decoration: none;
}
duo-dropdown [slot="menu"] a:hover,
.dropdown-menu [slot="menu"] a:hover,
.dropdown-menu [slot="menu"] button:hover{
text-decoration: none;
color: currentColor;
background-color: color-mix(in srgb, var(--s-primary,#2299ee) 15%, var(--duo-background,white))
}
.pop-backdrop.svelte-k13m19{
position: fixed;
left:0;
right:0;
bottom:0;
top:0;
background:rgba(0,0,0,0.01);
z-index:9;
}
.duo-toolbar.svelte-1caxla8{
display:flex;
justify-items: stretch;
margin:0 -8px;
}
.duo-toolbar.svelte-1caxla8 > *{
flex:1;
margin:0 5px;
}
.sbtn.svelte-d623es{
border:1px solid #ccc;
position: relative;
box-sizing: border-box;
padding:6px 12px;
background:#fff;
font-size: 14px;
text-decoration: none;
color:#333;
white-space: nowrap;
display: inline-block;
margin:var(--s-button-margins,4px);
text-align: center;
cursor: pointer;
line-height:1.25;
border-radius:var(--s-border-radius,4px);
box-shadow:0 0 0px rgba(0,0,0,0.5),0 0px 0px rgba(0,0,0,0.1);
transition:box-shadow 0.2s;
line-height:20px;
height:34px;
vertical-align: middle;
}
/* .sbtn :global(svg){ height:15px; margin:0 2px; display:inline-block;vertical-align: middle;}
.sbtn.xs :global(svg){ height:10px;width:10px;}
.sbtn.sm :global(svg){ height:12px;width:12px;}
.sbtn.lg :global(svg){ height:21px;width:21px;} */
.sbtn.svelte-d623es:disabled{
opacity:0.5;
cursor:not-allowed;
}
.sbtn.svelte-d623es:disabled:hover{
box-shadow:0 0 2px rgba(0,0,0,0.1),0 0px 0px rgba(0,0,0,0.1);
}
.sbtn.svelte-d623es:hover{box-shadow:0 0 4px rgba(0,0,0,0.5),0 0px 0px rgba(0,0,0,0.2);}
.sbtn.svelte-d623es:focus{outline:0px;box-shadow:0 0 3px rgba(0,0,0,0.5)}
.sbtn.svelte-d623es:active{ outline:0px; box-shadow:inset 0 4px 4px rgba(0,0,0,0.2);}
.xs.svelte-d623es{font-size:10px; padding:2px 7px;height:21px;line-height:12px;}
.sm.svelte-d623es{font-size:12px; padding:0px 10px;height:26px;line-height:16px;}
.lg.svelte-d623es{font-size:21px; padding:10px 20px;height:52px;line-height:30px;}
.block.svelte-d623es{display:block;width:100%;}
.primary.svelte-d623es,.info.svelte-d623es,.success.svelte-d623es,.warning.svelte-d623es,.danger.svelte-d623es,.dark.svelte-d623es{
color:white;
box-shadow:0 0 2px rgba(0,0,0,0.1),0 0px 0px rgba(0,0,0,0.1);
}
.primary.svelte-d623es{border-color:#2299ee;background-color:#2299ee; background-color:var(--s-primary,#2299ee);border-color:var(--s-primary,#2299ee)}
.info.svelte-d623es{border-color:#17a2b8;background-color:#17a2b8; background-color:var(--s-info,#17a2b8);border-color:var(--s-info,#17a2b8);}
.success.svelte-d623es{border-color:#28a745;background-color:#28a745; background-color:var(--s-success,#28a745);border-color:var(--s-success,#28a745);}
.warning.svelte-d623es{border-color:#ffc107;background-color:#ffc107; background-color:var(--s-warning,#ffc107);border-color:var(--s-warning,#ffc107);}
.danger.svelte-d623es{border-color:#dc3545;background-color:#dc3545; background-color:var(--s-danger,#dc3545);border-color:var(--s-danger,#dc3545);}
.dark.svelte-d623es{border-color:#343a40;background-color:#343a40; background-color:var(--s-dark,#343a40);border-color:var(--s-dark,#343a40);}
.spagination.svelte-1hokmn0{
overflow:hidden;/* fix float */
}
.spagination.svelte-1hokmn0 .sbtn{
margin:0;
border-radius: var(--s-border-radius,0px);
border-right-width:0;
display:block;
float:left;
}
.spagination.svelte-1hokmn0 .sbtn:first-child{
border-radius: var(--s-border-radius,4px) 0 0 var(--s-border-radius,4px);
}
.spagination.svelte-1hokmn0 .sbtn:last-child{
border-radius: 0 var(--s-border-radius,4px) var(--s-border-radius,4px) 0;
border-right-width:1px;
}
.btn-group.svelte-yv91m0{
padding:5px 0;
--s-button-margins:0px;
}
.toolbar.svelte-yv91m0{
padding:0px 5px 0px 5px;
display:flex;
justify-content: space-between;
}
.btn-group.svelte-yv91m0 > *{
margin:0;
}
.crudlist.svelte-yv91m0{
display:flex;
flex-direction: column;
height:100%;
min-height:200px;/* prevent grid locking with 0 height */
}
.gridarea.svelte-yv91m0{
flex: 1;
overflow: auto;
}
.autocomplete.svelte-1c8p4jn{
width:100%;
position:relative
}
.optionlist.svelte-1c8p4jn{
position:absolute;
left:0;
right:0;
top:35px;
background:white;
box-shadow:0 1px 5px rgba(0,0,0,0.3);
z-index:1001;
max-height:200px;
overflow:auto;
overscroll-behavior: contain;
}
.optionlist.svelte-1c8p4jn > div:where(.svelte-1c8p4jn){
padding:7px 10px;
cursor:pointer;
}
.optionlist.svelte-1c8p4jn > div.active:where(.svelte-1c8p4jn){
background:#eee;
}
.portal{
z-index:2000;
position: fixed;
padding:none;
}
.svelte-cspwm2 {
box-sizing: border-box
}
.wrapper.svelte-cspwm2 {
display: inline-block;
}
.toolbar.svelte-cspwm2{
display:flex;
width:100%;
}
.toolbar.svelte-cspwm2 > :where(.svelte-cspwm2){
margin:0px;
}
.month.svelte-cspwm2{
text-align-last: right;
}
button.svelte-cspwm2{
font-size:14px;
padding:6px 9px;
border:0px;
background:white;
}
.toolbar.svelte-cspwm2 > button:where(.svelte-cspwm2){
width:0px;
padding:6px 9px;
width:15%;
}
select.svelte-cspwm2{
-webkit-appearance: none;
appearance: none;
font-size:14px;
padding:6px 5px;
border:0px;
background:white;
width:35%;
}
table.svelte-cspwm2{
table-layout: fixed;
border-collapse: collapse;
margin:5px;
font-size:14px;
}
td.svelte-cspwm2,th.svelte-cspwm2{
font-size:14px;
padding:0;
text-align:center;
}
td.svelte-cspwm2 button:where(.svelte-cspwm2){
display:block;
width:100%;
border:0px;
border-radius:3px;
}
td.svelte-cspwm2 button.today:where(.svelte-cspwm2){
background-color: color-mix(in srgb, var(--s-primary,#2299ee) 15%, var(--duo-background,white))
}
td.svelte-cspwm2 button.active:where(.svelte-cspwm2){
background:#2299ee;
background:var(--s-primary,#2299ee);
color:white;
}
.svelte-1fthriu{
box-sizing: border-box;
}
.salert.svelte-1fthriu{
padding:12px 15px;
position:relative;
color:var(--alert-color,#444);
margin:10px 0px;
border-radius:5px;
isolation:isolate;
transition:max-height 0.5s,opacity 0.5s,padding 0.5s,margin-bottom 0.5s,transform 0.5s;
}
.salert.svelte-1fthriu:first-child{
margin-top:0!important
}
.salert.svelte-1fthriu:last-child{
margin-bottom:0!important
}
@supports(background-color:color-mix(in srgb, var(--alert-color) 20%, white)){
.salert.info.svelte-1fthriu{
--alert-color:var(--alert-info,#d9edf7);
}
.salert.warning.svelte-1fthriu{
--alert-color:var(--alert-warning,#ffe69c);
}
.salert.success.svelte-1fthriu{
--alert-color:var(--alert-success,#ccf8e4);
}
.salert.danger.svelte-1fthriu{
--alert-color:var(--alert-danger,#ffd9dd);
}
.salert.dark.svelte-1fthriu{
--alert-color:var(--alert-dark,#ced4da);
}
.salert.svelte-1fthriu{
background:var(--alert-color);
color:color-mix(in lch, var(--alert-color) 0%, lch(40 40 none));
border:1px solid color-mix(in lch, var(--alert-color) 0%, lch(85 20 none));
}
}
.salert.svelte-1fthriu h1,.salert.svelte-1fthriu h2,.salert.svelte-1fthriu h3,.salert.svelte-1fthriu h4,.salert.svelte-1fthriu h5,.salert.svelte-1fthriu h6,.salert.svelte-1fthriu p{
margin:0 0 10px 0;
}
.close.svelte-1fthriu{
background:transparent;
border:0px;
font-size:24px;
font-weight:bold;
position:absolute;
right:0px;
top:0px;
padding:4px 10px;
cursor:pointer;
opacity:0.5
}
.close.svelte-1fthriu:hover{
opacity:1;
}
.hiding.svelte-1fthriu{
overflow:hidden;
max-height:0!important;
opacity:0;
padding:0 15px;
margin-bottom:0;
transform-origin: top;
transform: scale(1,0)
}
/* OLD CSS BELOW - can be removed when color-mix is better supported */
@supports not (background-color:color-mix(in srgb, var(--alert-color) 20%, white)){
.salert.info.svelte-1fthriu{
--alert-color:#055160
}
.salert.warning.svelte-1fthriu{
--alert-color:#664d03
}
.salert.success.svelte-1fthriu{
--alert-color:#0f5132
}
.salert.danger.svelte-1fthriu{
--alert-color:#842029
}
.salert.dark.svelte-1fthriu{
--alert-color:#141619
}
.salert.svelte-1fthriu:after{
content:'';
position:absolute;
inset:0;
background:var(--alert-color,#444);
border-radius:inherit;
filter:brightness(240%) saturate(2) opacity(0.25);
z-index:-1;
}
.salert.svelte-1fthriu:before{
content:'';
position:absolute;
inset:0;
border:1px solid var(--alert-color,#444);
border-radius:inherit;
filter:brightness(200%) saturate(2) opacity(0.2);
z-index:-1;
background:white;
}
}
.svelte-xow58 {
box-sizing: border-box;
}
.grid.svelte-xow58{
height:100%;
min-height:100px;
display:flex;
flex-direction: column;
border:var(--duo-border,1px solid #ccc);
}
.rows.svelte-xow58{
flex:1;
height:calc(100% - 70px);
cursor:pointer;
position:relative;
overflow:hidden;
}
.headerrow.svelte-xow58,.gridrow.svelte-xow58,.virtual-row .gridrow [slot="row"]{
display:flex;
flex-direction: row;
justify-content: space-evenly;
position:relative;
}
.virtual-row .gridrow [slot="row"]{
flex:1
}
.headerrow.svelte-xow58,.gridfooter.svelte-xow58{
border:var(--duo-border,1px solid #ccc);
border-width:0 0 1px 0;
background:var(--duo-gridhead,linear-gradient(to bottom, #fff 0, #eee 100%));
}
.gridfooter.svelte-xow58{
border-width:1px 0 0 0;
padding:7px;
font-size:0.9em;
height:30px;
}
.header.svelte-xow58{
padding:7px;
font-size:0.9em;
font-weight: bold;
cursor:pointer;
}
.gridrow.svelte-xow58 .cell{
padding:7px;
font-size:0.9em;
overflow:hidden;
white-space: nowrap;
width: 0; /** fixes column expansion bug **/
}
/* :global([slot="row"]){
display:contents;
} */
.gridrow.svelte-xow58{
background:var(--duo-background,white);
}
.gridrow.odd.svelte-xow58{
background:var(--duo-oddrow,#f3f3f3);
}
.gridrow.active.svelte-xow58{
background-color:var(--s-primary,#2299ee);
color:white;
}
.arrow.flip.svelte-xow58{
transform:rotate(180deg) scaleX(-1);
display:inline-block;
}
.dragover_top.svelte-xow58,.dragover_bottom.svelte-xow58{
background-color:rgba(0,0,0,0);
position:absolute;
left:0;
right:0;
height:15px;
z-index:100;
}
.dragover_top.svelte-xow58{
top:-2px;
}
.dragover_bottom.svelte-xow58{
bottom:-2px;
}
.dragover_top.svelte-xow58.hover{
border-top:4px solid #22aae3;
}
.dragover_bottom.svelte-xow58.hover{
border-bottom:4px solid #22aae3;
}
.svelte-2lgxqu {
box-sizing: border-box;
}
.grid.svelte-2lgxqu{
height:100%;
min-height:100px;
display:flex;
flex-direction: column;
border:var(--duo-border,1px solid #ccc);
}
.headerrow.svelte-2lgxqu,.gridrow.svelte-2lgxqu{
display:flex;
flex-direction: row;
justify-content: space-evenly;
position:relative;
}
.headerrow.svelte-2lgxqu{
position:sticky;
top:0;
}
.gridrow.svelte-2lgxqu{
position: absolute;
left:0;
right:0;
z-index:1;
}
.gridrow.svelte-2lgxqu .cell{
background:var(--duo-background,white);
}
.gridrow.odd.svelte-2lgxqu .cell{
background:var(--duo-oddrow,#f3f3f3);
}
.gridrow.active.svelte-2lgxqu .cell{
background-color:var(--s-primary,#2299ee);
color:white;
}
.arrow.flip.svelte-2lgxqu{
transform:rotate(180deg) scaleX(-1);
display:inline-block;
}
.rows.svelte-2lgxqu{
flex:1;
height:calc(100% - 70px);
cursor:pointer;
position: relative;
}
.scrollarea.svelte-2lgxqu{
overflow:auto;
flex:1;
}
.scrollarea.svelte-2lgxqu .headerrow:where(.svelte-2lgxqu){
position: sticky;
top:0;
z-index:2;
}
.gridrow.svelte-2lgxqu .cell{
padding:7px;
font-size:0.9em;
overflow:hidden;
white-space: nowrap;
width: 0; /** fixes column expansion bug **/
}
.gridrow.svelte-2lgxqu .cell.sticky{
border-right:var(--duo-border,1px solid #ddd);
}
.gridrow.svelte-2lgxqu .sticky{
position:sticky;
left:0;
z-index:1;
}
.headerrow.svelte-2lgxqu,.gridfooter.svelte-2lgxqu{
border:var(--duo-border,1px solid #ccc);
border-width:0 0 1px 0;
background:var(--duo-gridhead,linear-gradient(to bottom, #fff 0, #eee 100%));
}
.header.svelte-2lgxqu{
padding:7px;
font-size:0.9em;
font-weight: bold;
cursor:pointer;
}
.header.sticky.svelte-2lgxqu{
position:sticky;
left:0;
z-index:1;
background:var(--duo-gridhead,linear-gradient(to bottom, #fff 0, #eee 100%));
border-right:var(--duo-border,1px solid #ddd);
}
.gridfooter.svelte-2lgxqu{
border-width:1px 0 0 0;
padding:7px;
font-size:0.9em;
height:30px;
}
.dragover_top.svelte-2lgxqu,.dragover_bottom.svelte-2lgxqu{
background-color:rgba(0,0,0,0);
position:absolute;
left:0;
right:0;
height:15px;
z-index:100;
}
.dragover_top.svelte-2lgxqu{
top:-2px;
}
.dragover_bottom.svelte-2lgxqu{
bottom:-2px;
}
.dragover_top.svelte-2lgxqu.hover{
border-top:4px solid #22aae3;
}
.dragover_bottom.svelte-2lgxqu.hover{
border-bottom:4px solid #22aae3;
}
.form-row.vertical.svelte-1gdqdka{
display:flex;
flex-wrap: wrap;
}
.form-row.svelte-1gdqdka{
display:flex;
margin:var(--s-formrow-margins,5px);
box-sizing: border-box;
align-items:flex-start;
align-items: center;
}
.checkrow.svelte-1gdqdka{
align-items:center;
}
.form-row.svelte-1gdqdka :has(.stars){
align-self: center
}
.form-row.svelte-1gdqdka :where(.svelte-1gdqdka) {
box-sizing: border-box;
}
.form-row.svelte-1gdqdka label:where(.svelte-1gdqdka){
text-align:right;
line-height:1.8em;
padding:0 8px 0 0;
}
.form-row.vertical.svelte-1gdqdka label:where(.svelte-1gdqdka){
text-align:left;
margin:0;
padding:0 0 0 0;
}
.form-row.svelte-1gdqdka .form-input{
flex:3;
padding:5px 8px;
font-size:14px;
box-sizing: border-box;
}
.slotwrap.svelte-1gdqdka{
flex:3;
}
.form-row.svelte-1gdqdka .checkboxLabel:where(.svelte-1gdqdka){
padding:0;
margin:2px 3px;
text-align:left;
}
.form-row.svelte-1gdqdka [slot="suffix"] .sbtn{
border-radius:0 var(--s-border-radius,4px) var(--s-border-radius,4px) 0;
margin:0;
}
.form-row.hasSuffix.svelte-1gdqdka [slot="suffix"] > :not(button),
.form-row.hasPrefix.svelte-1gdqdka [slot="prefix"] > :not(button){
display:flex;
padding: 6px 12px;
border: 1px solid #ccc;
height:34px;
align-items: center;
box-sizing: border-box;
}
.form-row.hasSuffix.svelte-1gdqdka [slot="suffix"] > div.dropdown{
padding:0;
border:0;
}
.form-row.hasSuffix.svelte-1gdqdka [slot="suffix"] > :not(button){
border-radius:0 var(--s-border-radius,4px) var(--s-border-radius,4px) 0;
}
.form-row.hasPrefix.svelte-1gdqdka [slot="prefix"] > :not(button){
border-radius:var(--s-border-radius,4px) 0 0 var(--s-border-radius,4px);
}
.form-row.svelte-1gdqdka [slot="prefix"] .sbtn{
border-radius:var(--s-border-radius,4px) 0 0 var(--s-border-radius,4px);
margin:0;
}
.form-row.svelte-1gdqdka input.form-input,
.form-row.svelte-1gdqdka select.form-input,
.form-row.svelte-1gdqdka textarea.form-input,
.form-row.svelte-1gdqdka div.form-input{
font-weight:normal;
border-radius:var(--s-border-radius,4px);
display: block;
width: 100%;
font-size: 14px;
font-family:inherit;
line-height: 1.428571429;
color: #555;
background-color: #fff;
border: 1px solid #ccc;
box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
margin: 0;
height:34px;
padding: 4px 8px 5px 8px;
}
/* add own dropdown arrow */
.form-row.svelte-1gdqdka select.form-input{
background: white url("data:image/svg+xml;utf8,") no-repeat right 50%;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
padding: 4px 25px 5px 8px;
}
.form-row.svelte-1gdqdka input.form-input[disabled],
.form-row.svelte-1gdqdka select.form-input[disabled],
.form-row.svelte-1gdqdka textarea.form-input[disabled],
.form-row.svelte-1gdqdka div.form-input[disabled]{
color:#999;
background-color:rgba(0,0,0,0.03);
cursor:not-allowed;
}
.form-row.svelte-1gdqdka .form-input-static{
display:block;
padding: 0 8px;
}
.form-row.svelte-1gdqdka textarea.form-input,
.form-row.svelte-1gdqdka div.form-input{
height:auto;
}
.form-row.hasSuffix.svelte-1gdqdka input.form-input{
border-radius:var(--s-border-radius,4px) 0 0 var(--s-border-radius,4px);
border-right:0px;
}
.form-row.hasPrefix.svelte-1gdqdka input.form-input{
border-radius:0 var(--s-border-radius,4px) var(--s-border-radius,4px) 0;
border-left:0px;
}
.form-row.hasPrefix.hasSuffix.svelte-1gdqdka input.form-input{
border-radius:0;
border-left:0px;
border-right:0px;
}
.form-row.svelte-1gdqdka input[type=range]{
flex:3;
display:block;
}
.form-row.svelte-1gdqdka input[type=color]{
padding:0;
height:35px;
width:40px;
flex:none;
}
.form-row.svelte-1gdqdka input[type="checkbox"],.form-row.svelte-1gdqdka input[type="radio"]{
width:auto;
border:0;
margin: 0px 5px 0 5px;
display:inline-block;
}
.checkboxLabel.svelte-1gdqdka{
padding: 0;
margin: 3px 0;
text-align: left;
}
.note.svelte-1gdqdka{
font-size:0.8em;
margin-left:var(--s-labelwidth);
padding:0 0 8px 0;
}
/* Mobile, put lable on line above */
@media only screen and (max-width: 600px) {
.form-row.svelte-1gdqdka:not(.checkrow){
flex-wrap: wrap;
justify-content: space-between;
}
.form-row.svelte-1gdqdka .slabel:where(.svelte-1gdqdka){
text-align:left;
margin:0;
width:100%!important;
padding:1px 2px;
}
.note.svelte-1gdqdka{
margin-left:5px;
}
.note.svelte-1gdqdka a{
color:inherit;
}
}
.cell.svelte-1b06uz7{
display:inline-block;
}
.gridrow.svelte-1b06uz7{
clear:both;
display:flex;
}
label.svelte-olyqff{
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
background:rgba(0,0,0,0.001);
cursor:pointer;
}
input[type=file].svelte-olyqff{
opacity:0;
position:absolute;
top:0
}
body.size2{
font-size:18px;
}
body.size3{
font-size:21px;
}
div.form-input.tags.svelte-fpd2ux{
padding:2px;
display:flex;
flex-wrap: wrap;
gap:2px;
}
.inputwrap.svelte-fpd2ux{
flex:1;
min-width:50px;
}
.tags-input.svelte-fpd2ux{
display:block;
width:100%;
height:100%;
font-size:14px;
margin:0;
line-height:20px;
border:0px;
}
div.form-input.svelte-fpd2ux .sbtn{
margin:2px;
}
.tags-input.svelte-fpd2ux::-webkit-calendar-picker-indicator {
display: none!important
}
.tags-input.svelte-fpd2ux:focus{
outline:0px;
}
.tags.svelte-fpd2ux .remove:where(.svelte-fpd2ux){
background:transparent;
border:0px;
margin:-5px -8px -5px 0px;
transition:transform 0.2;
color:inherit;
}
.tags.svelte-fpd2ux .remove:where(.svelte-fpd2ux):hover{
transform: scale(1.5,1.5);
}
.tags.svelte-fpd2ux .remove:where(.svelte-fpd2ux):active,.tags.svelte-fpd2ux .remove:where(.svelte-fpd2ux):focus{
outline:none;
box-shadow: none;
}
.svelte-qyg5hr {
box-sizing: border-box
}
.spopover-title.svelte-qyg5hr{
margin: 0;
padding: 8px 14px;
font-size: 14px;
background-color: #f7f7f7;
border-bottom: 1px solid #ebebeb;
}
.spopover.svelte-qyg5hr{
position: absolute;
top: 0;
left: 0;
z-index: 1060;
padding: 1px;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
font-weight: normal;
line-height: 1.428571429;
text-align: left;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0,0,0,0.2);
border-radius: 0;
box-shadow: 0 5px 10px rgba(0,0,0,0.2);
white-space: normal;
}
.spopover-content.svelte-qyg5hr{
padding: 9px 14px;
}
.pop-backdrop.svelte-qyg5hr{
position: fixed;
left:0;
right:0;
bottom:0;
top:0;
background:rgba(0,0,0,0.01)
}
.sprogress.svelte-efozyn{
min-height:10px;
background:rgba(0,0,0,0.03);
box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
border-radius:4px;
border-radius:var(--s-border-radius,4px);
}
.sbar.svelte-efozyn{
border-radius:4px;
border-radius:var(--s-border-radius,4px);
transition:0.5s width;
font-size:11px;
line-height:18px;
height:18px;
text-align:center;
}
.primary.svelte-efozyn,.info.svelte-efozyn,.success.svelte-efozyn,.warning.svelte-efozyn,.danger.svelte-efozyn,.dark.svelte-efozyn{
color:white;
box-shadow:0 0 2px rgba(0,0,0,0.1),0 0px 0px rgba(0,0,0,0.1);
}
.primary.svelte-efozyn{background-color:#2299ee; background-color:var(--s-primary,#2299ee)}
.info.svelte-efozyn{background-color:#17a2b8; background-color:var(--s-info,#17a2b8)}
.success.svelte-efozyn{background-color:#28a745; background-color:var(--s-success,#28a745)}
.warning.svelte-efozyn{background-color:#ffc107; background-color:var(--s-warning,#ffc107)}
.danger.svelte-efozyn{background-color:#dc3545; background-color:var(--s-danger,#dc3545)}
.dark.svelte-efozyn{background-color:#343a40; background-color:var(--s-dark,#343a40)}
.tags.svelte-199fblh{
margin-bottom:10px;
}
.tagwrap.svelte-199fblh{
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
padding: 10px;
border-radius: 5px;
background: #fff;
margin-top: 5px;
}
@property --fillperc {
syntax: "";
inherits: true;
initial-value: 0%;
}
.stars.svelte-5cxlkr{
display:inline-flex;
gap:0.3em;
position: relative;
}
.fill.svelte-5cxlkr{
pointer-events: none;
position: absolute;
inset:0;
outline:1px solid red;
display:inline-flex;
gap:0.3em;
-webkit-mask-image: linear-gradient(to right, currentColor var(--fillperc), transparent var(--fillperc));
mask-image: linear-gradient(to right, currentColor var(--fillperc), transparent var(--fillperc));
transition:--fillperc 0.3s;
}
.stars.svelte-5cxlkr > :where(.svelte-5cxlkr) svg{
opacity:0.6;
fill:transparent;
}
.stars.svelte-5cxlkr button:where(.svelte-5cxlkr){
all:unset;
cursor:pointer;
}
.active.svelte-5cxlkr .d-icon svg{
opacity:1;
fill:currentColor;
}
.stars.svelte-5cxlkr button:where(.svelte-5cxlkr):hover{
opacity:0.4;
}
svg.svelte-1pdnixf{
fill:currentColor;
stroke:currentColor;
stroke-width:4px;
}
.dspin.svelte-pubq6 {
animation:svelte-pubq6-dspin 1s linear infinite;
transform-origin: 50% 50%;
}
@keyframes svelte-pubq6-dspin { 100% { transform:rotate(360deg); } }
/* Hides webcomponent until it's loaded*/
duo-tabs:not(:defined) {
display:none
}
.tabbuttons.svelte-u5syxs button:where(.svelte-u5syxs){
background:#eee;
font-size:14px;
border:1px solid #eee;
border-bottom:1px solid #ccc;
padding:8px 12px;
margin:0 2px -1px 0;
}
.tabpanel.svelte-u5syxs{
border:1px solid #ccc;
padding:15px;
}
.tabbuttons.svelte-u5syxs button.active:where(.svelte-u5syxs){
background:white;
border:1px solid #ccc;
border-bottom:1px solid white;
}
.tabbuttons.svelte-u5syxs button:where(.svelte-u5syxs):focus{
outline:0;
border-top:1px solid #888;
}
.strengthrow.svelte-yvtec3{
margin:0 5px 0 170px;
--s-button-margins:0px;
}
@media only screen and (max-width: 600px) {
.strengthrow.svelte-yvtec3{
margin:0 5px 0 5px;
}
}
.uploadinput.svelte-1xdv9e1{
position:fixed;
top: -100px; /* hidden off screen */
}
.uploadbutton.svelte-1xdv9e1{
border:1px solid #ccc;
position: relative;
box-sizing: border-box;
background:#fff;
text-decoration: none;
color:#333;
white-space: nowrap;
display: inline-block;
margin:var(--s-button-margins,4px);
text-align: center;
cursor: pointer;
border-radius:var(--s-border-radius,4px);
box-shadow:0 0 0px rgba(0,0,0,0.5),0 0px 0px rgba(0,0,0,0.1);
transition:box-shadow 0.2s;
vertical-align: middle;
font-size:12px;
padding:0px 10px;
height:26px;
line-height:16px;
}
.uploadbutton.svelte-1xdv9e1:hover{
box-shadow:0 0 2px rgba(0,0,0,0.1),0 0px 0px rgba(0,0,0,0.1);
cursor:pointer;
}
.uploadbutton.svelte-1xdv9e1 .d-icon{ top:0.4em;}
/* not sure why this is neccessary ?*/
.markdowninput.svelte-1xdv9e1{
width:100%;
border:1px solid #ddd;
}
.stabs.svelte-1xdv9e1 {
text-align:left;
background:#eee;
padding:10px 10px 0 10px;
border-bottom:1px solid #ccc;
position:relative;
}
.stabs.svelte-1xdv9e1 button:where(.svelte-1xdv9e1){
position: relative;
box-sizing: border-box;
padding:7px 12px;
background:#fff;
border:0px;
font-size: 14px;
text-decoration: none;
color:black;
white-space: nowrap;
display: inline-block;
text-align: center;
cursor: pointer;
line-height:1.25;
border-radius:var(--s-border-radius,4px) var(--s-border-radius,4px) 0 0;
line-height:18px;
border:1px solid #ccc;
color:rgba(0,0,0,0.7);
margin-bottom:-1px;
}
.stabs.svelte-1xdv9e1 button.active:where(.svelte-1xdv9e1){
color:black;
border:1px solid #ccc;
border-bottom:1px solid white;
}
.stabs.svelte-1xdv9e1 button:where(.svelte-1xdv9e1):active,.stabs.svelte-1xdv9e1 button:where(.svelte-1xdv9e1):focus{
outline:0px;
color:black;
border:2px solid #ccc;
border-bottom:1px solid white;
}
.inputarea.svelte-1xdv9e1,.preview.svelte-1xdv9e1{
padding:10px;
}
.inputarea.svelte-1xdv9e1 textarea:where(.svelte-1xdv9e1),.cusortrack.svelte-1xdv9e1{
font-weight:normal;
border:0px;
font-size:14px;
resize: none;
width:100%;
}
.inputarea.svelte-1xdv9e1 textarea:where(.svelte-1xdv9e1):focus{
outline:0px;
}
.stoolbar.svelte-1xdv9e1{
position: absolute;
top:10px;
right:10px;
--s-button-margins:0px;
}
.preview.svelte-1xdv9e1 img{
max-width:100%;
}
.preview.svelte-1xdv9e1 .video{
width:100%;
padding-top:56.25%;
position:relative;
}
.preview.svelte-1xdv9e1 .video iframe{
position: absolute;
top:0;
left:0;
right:0;
bottom:0;
width:100%;
height:100%;
border:0;
}
.preview.svelte-1xdv9e1 > :first-child{
margin-top:0;
}
.cusortrack.svelte-1xdv9e1{
position: absolute;
top:0;
bottom:0;
left:0;
right:0;
padding:2px;
overflow-wrap:break-word;
white-space:pre-wrap;
z-index:2;
line-height:normal;
font:400 11px system-ui;
font-size:14px;
pointer-events: none;
opacity:0.01;
}
.cusortrack.svelte-1xdv9e1 .cursor:where(.svelte-1xdv9e1){
outline:1px solid black;
}
.emojilist.svelte-1xdv9e1{
position:absolute;
top:0;
left:0;
border:1px solid #eee;
padding:1px;
background:white;
z-index:3;
border-radius:2px;
box-shadow:0 1px 3px rgba(0,0,0,0.3);
}
.emojilist.svelte-1xdv9e1 > div:where(.svelte-1xdv9e1){
padding:5px 8px;
cursor:pointer;
}
.emojilist.svelte-1xdv9e1 > .active:where(.svelte-1xdv9e1){
background:#eee;
}
.wrapper.svelte-47e8q2{
padding:10px;
border:1px solid #eee;
margin:0;
}
.content.svelte-47e8q2{
display:flex;
flex-wrap: wrap;
gap:10px;
}
.calcol.svelte-47e8q2{
border:1px solid #eee;
padding:5px 10px;
}
h4.svelte-47e8q2{
background:#f5f5f5;
border-bottom:1px solid #eee;
margin:-10px -10px 10px -10px;
padding:10px 15px;
}
.availcol.svelte-47e8q2{
flex:1;
flex-basis:300px;
display:flex;
flex-direction: column;
padding:10px;
}
h5.svelte-47e8q2{
margin:0;
padding:0px 0 15px 0;
font-size:1em;
}
.bookingcol.svelte-47e8q2{
padding:10px;
flex:1;
flex-basis:300px;
}
.mybookings.svelte-47e8q2{
width:100%;
max-width:100%;
border-collapse: collapse;
}
.mybookings.svelte-47e8q2 thead:where(.svelte-47e8q2) td:where(.svelte-47e8q2):first-child{
width:10%;
}
.mybookings.svelte-47e8q2 thead:where(.svelte-47e8q2) tr:where(.svelte-47e8q2){
border-bottom:1px solid #ddd;
font-weight: bold;
}
.mybookings.svelte-47e8q2 tbody:where(.svelte-47e8q2) tr:where(.svelte-47e8q2):nth-child(odd){
background:#f9f9f9
}
.toolbar.svelte-2bqwqf{
border-top:1px solid #eee;
padding-top:10px;
margin-top:20px;
}
.forgotlink.svelte-2bqwqf{
display:inline-block;
padding:10px;
}
.editarea.svelte-1rtih5n{
box-shadow:0 0 0 1px rgba(255,255,255,0.5),0 0 0 1px rgba(0,0,0,0.5);
padding:0px 10px;
color:rgba(0,0,0,0.3);
text-shadow:0px 0px 1px white;
}
.wrapper.svelte-1s1od2b{
position:relative;
}
.tweets.svelte-1s1od2b{
height:200px;
display:flex;
overflow-x:hidden;
flex-direction:row;
flex-wrap: nowrap;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
}
.tweets.svelte-1s1od2b::-webkit-scrollbar {
display: none;
}
.tweet.svelte-1s1od2b{
flex: 0 0 auto;
scroll-snap-align: center;
width:100%;
z-index:1;
}
.tweet.svelte-1s1od2b p:where(.svelte-1s1od2b){
text-align:center;
max-width:250px;
margin:10% auto 0 auto;
}
.twittericon.svelte-1s1od2b{
position:absolute;
top:-20%;
left:25%;
opacity:0.1;
z-index:0;
pointer-events: none;
font-size:250px;
color:#00adee;
}
.pager.svelte-1s1od2b button:where(.svelte-1s1od2b){
background:white;
display:inline-block;
border:1px solid #00adee;
width:10px;
height:10px;
padding:0;
border-radius:50%;
margin:0 5px
}
.pager.svelte-1s1od2b button.active:where(.svelte-1s1od2b){
background:#00adee;
}
.buy.svelte-qa1ynh{
display:flex;
width:180px;
margin:5px;
}
input.svelte-qa1ynh,button.svelte-qa1ynh{
padding:8px 10px;
font-size:14px;
border:1px solid var(--s-primary,#444);
}
input.svelte-qa1ynh{
width:50px;
border-radius:5px 0 0 5px;
text-align: center;
}
button.svelte-qa1ynh{
flex:100;
background:#2299ee;
background:var(--s-primary,#444);
color:white;
border-radius:0 5px 5px 0;
}
button.svelte-qa1ynh:hover{
box-shadow: inset 0 0 100px rgba(0,0,0,0.1)
}
.icon.svelte-1hrfbt1{
display:inline-flex;
place-content: center;
width:1em;
vertical-align: text-bottom;
}
svg.svelte-1hrfbt1{
width: 1em;
height: 1em;
vertical-align: -0.125em;
fill: currentColor;
overflow: hidden;
}
.userdetails-toolbar.svelte-1pfkk7p{
display:flex;
justify-content:flex-end;
margin:5px 0;
}
button.svelte-15le1me{
cursor: pointer;
}
.editing.svelte-15le1me{
display:block;
position:absolute;
inset:0;
outline:1px solid #22aae3;
z-index:2;
pointer-events:none;
}
.label.svelte-15le1me{
position:absolute;
top:0;
right:0;
background-color: #22aae3;
color:white;
font-size:11px;
padding:2px 4px;
z-index:2;
pointer-events:none;
}
.gallery.svelte-15le1me{
display:contents;
}
.gallery-backdrop.svelte-15le1me{
position: fixed;
inset:0px;
background:rgba(0,0,0,0);
transition:0.4s background-color;
overflow-x:scroll;
overflow-y:hidden;
scroll-snap-type: x mandatory;
-ms-overflow-style: none; /* hide scrollbar for Internet Explorer, Edge */
scrollbar-width: none; /* for Firefox */
}
.show.gallery-backdrop.svelte-15le1me{
background:rgba(0,0,0,0.9);
}
.gallery-backdrop.svelte-15le1me::-webkit-scrollbar {
display: none; /* for Chrome, Safari, and Opera */
}
.slider.svelte-15le1me{
display:flex;
height:80vh;
width:auto;
}
.gallery-panel.svelte-15le1me{
flex:1 0 100vw;
height:100vh;
display:grid;
place-items: center;
scroll-snap-align: start;
}
.gallery-panel.svelte-15le1me figure,.gallery-panel.svelte-15le1me img{
display:grid;
box-shadow:0 0 10px rgba(0,0,0,0.5);
transform:scale(0.3);
opacity:0;
transition:0.2s opacity, 0.3s transform;
}
.show.svelte-15le1me .gallery-panel:where(.svelte-15le1me) figure,.show.svelte-15le1me .gallery-panel:where(.svelte-15le1me) img{
transform:scale(1);
opacity:1;
}
.gallery-panel.svelte-15le1me figure > *{
grid-column:1 / 2;
grid-row:1 / 2;
}
.gallery-panel.svelte-15le1me img{
max-height:90vh;
max-width:90vw;
object-fit: contain;
}
.gallery-pager.svelte-15le1me{
position: fixed;
inset:auto 0 15px 0;
display:flex;
justify-content: center;
gap:5px;
}
.gallery-pager.svelte-15le1me button:where(.svelte-15le1me){
all:unset;
width:10px;
height:10px;
background:white;
opacity:0.3;
cursor: pointer;
}
.gallery-pager.svelte-15le1me button:where(.svelte-15le1me):hover{
opacity:0.6;
}
.gallery-pager.svelte-15le1me button.active:where(.svelte-15le1me){
opacity:1;
}
.close.svelte-15le1me{
border:0;
background:transparent;
position: fixed;
top:0px;
right:0px;
display:grid;
place-items: center;
width:50px;
height:50px;
font-size:21px;
color:white;
z-index:5;
transition:0.3s background-color;
}
.close.svelte-15le1me:hover{
background: rgba(0,0,0,0.5);
}
.gallery-controls.svelte-15le1me{
z-index:10;
}
.gallery-controls.svelte-15le1me .next:where(.svelte-15le1me), .gallery-controls.svelte-15le1me .prev:where(.svelte-15le1me){
all:unset;
position: fixed;
display: block;
inset:50% 0 auto auto;
height:50px;
width:50px;
background: rgba(0,0,0,0);
transition:0.3s background-color;
z-index:10;
}
.gallery-controls.svelte-15le1me .next:where(.svelte-15le1me):hover, .gallery-controls.svelte-15le1me .prev:where(.svelte-15le1me):hover{
background: rgba(0,0,0,0.5);
color: #fff;
}
.gallery-controls.svelte-15le1me .next:where(.svelte-15le1me):before, .gallery-controls.svelte-15le1me .prev:where(.svelte-15le1me):before{
content:'';
position: absolute;
top: calc(50% - 15px);
left: 10px;
height:30px;
width:30px;
background-image:url('data:image/svg+xml;utf8,')
}
.gallery-controls.svelte-15le1me .prev:where(.svelte-15le1me){
right: auto;
left: 0;
transform:scaleX(-1)
}
.map.svelte-1mac6yd {
width: 100%;
height: 100%;
min-height:100px;
}
/* below hack to fix tripple icons in shadow mode - taken from https://stackoverflow.com/questions/53849251/google-maps-api-showing-fullscreen-and-zoom-icons-3-times-in-each-button/54761069 */
.gm-control-active > img {
box-sizing: content-box;
display: none;
left: 50%;
pointer-events: none;
position: absolute;
top: 50%;
transform: translate(-50%,-50%);
}
.gm-control-active > img:nth-child(1) {
display:block;
}
.gm-control-active:hover > img:nth-child(1),
.gm-control-active:active > img:nth-child(1) {
display:none;
}
.gm-control-active:hover > img:nth-child(2),
.gm-control-active:active > img:nth-child(3) {
display:block;
}
.menu.svelte-517jul{
position:relative;
}
.overlay.svelte-517jul{
position: absolute;
inset:0;
background-image: linear-gradient(45deg, #00000002 25%, #00000009 25%, #00000009 50%, #00000002 50%, #00000002 75%, #00000009 75%, #00000009 100%);
background-size: 56.57px 56.57px;
}
/** Below can be overridden per site **/
:root{
--chart-colour1:#FF1616;
--chart-colour2:#FF914D;
--chart-colour3:#FFDE59;
--chart-colour4:#7ED957;
--chart-colour5:#5271FF;
--chart-colour6:#8C52FF;
--chart-colour7:#7F00FF;
--chart-opacity:44;
}
duo-card:not(:defined) {
visibility: hidden;
}
.popup.svelte-zilu77{
padding:6px 10px;
border:1px dotted #444;
background:rgba(255,255,255,0.5);
color:#444;
transition: 0.2s all;
cursor:pointer;
display:inline-block;
}
.popup.svelte-zilu77:hover{
background:#eee;
}
.popup.svelte-zilu77 button:where(.svelte-zilu77){
margin:-7px -10px -7px 5px;
display:inline-block;
cursor:pointer;
height:100%;
border:0px;
height:30px;
width:30px;
background:#ddd;
}
.popup.svelte-zilu77 button:where(.svelte-zilu77):hover{
background:#ccc;
}
.backdrop.svelte-zilu77{
position:fixed;
background-color:rgba(0,0,0,0.3);
top:0;
left:0;
right:0;
bottom:0;
transition:background-color 0.5s;
z-index:999;
display:grid;
overflow:auto;
place-items:center;
opacity:1;
transition: 0.3s opacity;
}
.backdrop.hide.svelte-zilu77{
opacity: 0;
}
.dialog.svelte-zilu77{
max-width:80%;
min-width:min(90%,300px);
margin:0 auto;
border:0;
box-shadow:0 2px 5px rgba(0,0,0,0.5);
padding:25px;
position:relative;
background:white;
}
.dialog.svelte-zilu77 {
animation: svelte-zilu77-show 0.3s ease normal;
}
@keyframes svelte-zilu77-show{
from {
transform: scale(0.3,0.3);
opacity:0;
}
to {
transform: scale(1,1);
opacity:1;
}
}
.hide.svelte-zilu77 .dialog:where(.svelte-zilu77) {
animation: svelte-zilu77-hide 0.3s ease normal;
}
@keyframes svelte-zilu77-hide{
to {
transform: scale(0.1,0.1);
opacity:0;
box-shadow:0 2px 5px rgba(0,0,0,0.5),0 0 0 100vw rgba(0, 0, 0, 0);
}
}
.close.svelte-zilu77{
position:absolute;
top:0;
right:0;
background:transparent;
border:0;
color:#999;
opacity:0.8;
padding:8px 14px;
font-size:21px;
z-index:10;
cursor: pointer;
}
.close.svelte-zilu77:hover{
opacity:1;
}
.archive.svelte-112g8wj{
margin-bottom:10px;
}
details.svelte-112g8wj {
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
padding: 10px;
border-radius: 5px;
background: #fff;
margin-top: 5px;
}
details.svelte-112g8wj summary:where(.svelte-112g8wj) {
position: relative;
outline: none;
font-size: 16px;
background: #fff;
padding: 10px;
margin: -10px;
margin-bottom: -10px;
border-radius: 5px;
cursor: pointer;
color: var(--d-primary);
transition: background-color 0.5s, margin-bottom 0.5s;
list-style: none;
}
details.svelte-112g8wj summary:where(.svelte-112g8wj)::-webkit-details-marker {
display: none;
}
details.svelte-112g8wj summary:where(.svelte-112g8wj):before {
display: block;
content: " ";
border: 5px solid transparent;
border-top-color: currentColor;
width: 0;
height: 0;
position: absolute;
top: 17px;
right: 15px;
transform-origin: 5px 3px;
transition: transform 0.3s;
transform: rotate(-90deg);
}
details[open].svelte-112g8wj summary:where(.svelte-112g8wj) {
margin-bottom: 10px;
border-radius: 5px 5px 0 0;
background: var(--d-primary);
color: #fff;
z-index: 2;
}
details[open].svelte-112g8wj summary:where(.svelte-112g8wj):before {
transform: rotate(0deg);
}
details[open].svelte-112g8wj summary:where(.svelte-112g8wj) ~ :where(.svelte-112g8wj) {
animation: sweep 0.5s ease-in-out;
}
.yearlist.svelte-112g8wj{
list-style:none;
margin:0 -10px;
padding:0;
}
.yearlist.svelte-112g8wj a:where(.svelte-112g8wj){
display:block;
color:var(--d-primary);
padding:5px 10px;
}
.yearlist.svelte-112g8wj a:where(.svelte-112g8wj):hover{
text-decoration: none;
background:#eee;
}
li.active.svelte-112g8wj{
font-weight:600;
}
duo-icon{
display:inline-block;
line-height:1em;
}
.icon.svelte-k9w96m{
height:1em;
width:1em;
display: inline-flex;
align-self: center;
position:relative;
top:0.15em;
-webkit-font-smoothing:antialiased;
fill:currentcolor;
}
.icon.svelte-k9w96m svg{
width:1em;
height:1em;
}
.no-icon.svelte-k9w96m,.error.svelte-k9w96m{
background:#eee;
height: 1.1em;
width:1.1em;
line-height:1em;
border:1px solid #ccc;
border-radius:10000px;
font-size:1em;
flex:1;
text-align:center;
position:relative;
top:-0.1em;
}
.loading.svelte-k9w96m{
flex:1;
height: 1.1em;
width:1.1em;
border:1px solid #ccc;
}
duo-slideshow > .duoslide{ /* direct descendant of this tag */
display: block;
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
opacity: 0;
transition: 0.5s transform, 0.5s opacity;
transition-delay: 0.5s;
}
duo-slideshow > .duoslide.active{
opacity: 1;
position: relative;
margin-top:0;
z-index: 1;
transition-delay: 0s;
}
.timer.svelte-10360tc{
position:absolute;
bottom:0;
left:0;
height:5px;
width:100%;
background:white;
opacity:0.3;
transform-origin: top left;
animation:4s linear 1 svelte-10360tc-fill;
z-index:10;
}
@keyframes svelte-10360tc-fill{
0%{
transform:scaleX(0);
}
100%{
transform:scaleX(1);
}
}
.duo-slideshow.svelte-10360tc{
position: relative;
display:block;
}
.controls.svelte-10360tc{
z-index:10;
}
.controls.svelte-10360tc .next:where(.svelte-10360tc),
.controls.svelte-10360tc .prev:where(.svelte-10360tc){
all:unset;
position: absolute;
display: block;
top: 0;
bottom: 0;
right: 0;
text-shadow: 0 0 5px rgba(0,0,0,0.5);
transition: 0.5s all;
color: rgba(255,255,255,0.8);
background: rgba(0,0,0,0);
padding: 18% 20px;
font-size: 30px;
line-height: 100%;
z-index: 2;
cursor:pointer
}
.controls.svelte-10360tc .next:where(.svelte-10360tc):hover,
.controls.svelte-10360tc .prev:where(.svelte-10360tc):hover{
background: rgba(0,0,0,0.5);
color: #fff;
}
.controls.svelte-10360tc .next:where(.svelte-10360tc):before,
.controls.svelte-10360tc .prev:where(.svelte-10360tc):before{
content:'';
position: absolute;
top: calc(50% - 20px);
left: 10px;
height:30px;
width:30px;
background-image:url('data:image/svg+xml;utf8,')
}
.controls.svelte-10360tc .prev:where(.svelte-10360tc){
right: auto;
left: 0;
transform:scaleX(-1)
}
.controls.svelte-10360tc .pager:where(.svelte-10360tc){
position: absolute;
z-index: 2;
bottom: 20px;
left: 0;
right: 0;
height: 20px;
display: flex;
justify-content: center;
}
.controls.svelte-10360tc .pager:where(.svelte-10360tc) button:where(.svelte-10360tc){
all:unset;
width: 12px;
height: 12px;
background: rgba(255,255,255,0);
box-shadow: 0 0 5px rgba(0,0,0,0.5);
border: 1px solid #fff;
display: inline-block;
margin: 5px;
cursor:pointer;
border-radius: 50%;
}
.controls.svelte-10360tc button.active:where(.svelte-10360tc){
background: #fff;
}
.controls.svelte-10360tc button[disabled]:where(.svelte-10360tc){
cursor:not-allowed;
}
.cookie-banner.svelte-1uk6o7x{
position:fixed;
bottom:0;
left:0;
right:0;
background-color:rgba(0,0,0,0.8);
padding:25px;
color:white;
display:flex;
flex-wrap:wrap;
font-size:14px;
gap:15px;
font-weight:400;
z-index:1059;
}
.message.svelte-1uk6o7x{
flex:1 1 400px;
}
.message.svelte-1uk6o7x::slotted{
color:white;
font-weight:400;
}
.options.svelte-1uk6o7x{
display:flex;
gap:5px;
align-items: center;
justify-content: center
}
.modal-body.svelte-1uk6o7x{
padding:20px;
}
button.svelte-1uk6o7x{
background:black;
border:1px solid white;
padding:0.5em 1em;
display:flex;
color:white;
}
.infopanel.svelte-1uk6o7x{
max-height:50px;
overflow:hidden;
font-size:14px;
transition:max-height 0.3s;
}
.infopanel.active.svelte-1uk6o7x{
max-height:800px;
}
.infopanel.svelte-1uk6o7x .infotitle:where(.svelte-1uk6o7x){
all:unset;
width:90%;
display:block;
background:#eee;
padding:5px 30px;
border-radius:5px;
position: relative;
cursor:pointer;
}
.infopanel.svelte-1uk6o7x .infotitle:where(.svelte-1uk6o7x) h4:where(.svelte-1uk6o7x){
font-size:16px;
padding:0;
margin:0.5rem 0 0.5rem 0;
}
.infopanel.svelte-1uk6o7x .infotitle:where(.svelte-1uk6o7x):before{
content:"";
position: absolute;
top: calc(50% - 10px);
left: 5px;
height:20px;
width:20px;
background-image:url('data:image/svg+xml;utf8,');
transition:transform 0.3s;
}
.infopanel.active.svelte-1uk6o7x .infotitle:where(.svelte-1uk6o7x):before{
transform: rotate(90deg);
}
.infopanel.svelte-1uk6o7x h4:is(span,label){
font-size:12px;
text-align:right;
}
.infotools.svelte-1uk6o7x{
position: absolute;
right:20px;
top:0px;
display:flex;
gap:10px;
align-items: center;
height:45px;
}
.infotools.svelte-1uk6o7x > :where(.svelte-1uk6o7x){
margin:0;
}
.panelinner.svelte-1uk6o7x{
padding:10px;
}
thead.svelte-1uk6o7x{
background:#777;
color:white;
}
.checkbox.svelte-1uk6o7x{
display:flex;
}
.checkbox.svelte-1uk6o7x input[type=checkbox]:where(.svelte-1uk6o7x){
position: relative;
width: 44px;
height: 24px;
margin: 0;
background: #d0d5d2;
-webkit-appearance: none;
border-radius: 50px;
cursor: pointer;
outline: 0;
border: none;
top: 0;
}
.checkbox.svelte-1uk6o7x input[type=checkbox]:where(.svelte-1uk6o7x):before {
position: absolute;
content: "";
height: 20px;
width: 20px;
left: 2px;
bottom: 2px;
border-radius: 50%;
background-color: white;
-webkit-transition: 0.4s;
transition: 0.4s;
margin: 0;
}
.checkbox.svelte-1uk6o7x input[type=checkbox]:where(.svelte-1uk6o7x):checked{
background:var(--s-success,#28a745);
}
.checkbox.svelte-1uk6o7x input[type=checkbox]:where(.svelte-1uk6o7x):checked:before{
transform: translateX(20px);
}
.toolbar.svelte-5rvvpo{
text-align:right;
}
.gridcols.svelte-5rvvpo{
display:grid;
grid-template-columns:repeat(auto-fit, minmax(min(400px,100%), 1fr));
}
.comments.svelte-5rvvpo{
display:grid;
gap:5px;
}
form.svelte-5rvvpo,.comment.svelte-5rvvpo{
padding:10px;
margin-top:10px;
padding:10px;
border-radius:8px;
box-shadow: 0 1px 5px rgba(0,0,0,0.3);
}
form.svelte-5rvvpo{
margin-bottom:20px;
}
.comment.svelte-5rvvpo{
display:grid;
gap:2px;
position: relative;
grid-template-areas:
"content content"
"when author";
}
.content.svelte-5rvvpo{
grid-area: content;
border-radius:4px;
padding:10px;
white-space: pre-wrap;
background:#fff;
}
.author.svelte-5rvvpo{
padding:0px 10px;
grid-area: author;
text-align:right;
font-size:12px;
}
.when.svelte-5rvvpo{
padding:0px 10px;
grid-area: when;
font-size:12px;
}
.tools.svelte-5rvvpo{
--s-button-margins:0px;
text-align:right;
}
.edittxt.svelte-5rvvpo{
width:calc(100% + 30px);
margin:-15px;
border:0px;
padding:15px;
}
.pagination.svelte-1fu0qh{
--s-primary:var(--d-primary,#ff3e00);
margin-top:10px;
}
.events.svelte-1fu0qh{
display:grid;
grid-template-columns: repeat( auto-fill, minmax(250px, 1fr) );
gap:10px;
container-type: inline-size;
}
.picker.svelte-1fu0qh{
border:1px solid #ccc;
border-radius:5px;
display:grid;
grid-template-rows: 1fr auto;
}
.picker.svelte-1fu0qh h2:where(.svelte-1fu0qh){
padding:15px;
margin:auto;
font-size:3em;
font-weight:normal;
color:var(--s-primary,var(--d-primary,#ff3e00));
}
.info.svelte-1fu0qh{
text-align:left;
width:100%;
border:1px solid var(--s-primary,var(--d-primary,#ff3e00));
padding:10px 15px 20px 15px;
min-height:100%;
background:var(--s-primary,var(--d-primary,#ff3e00));
border-radius:5px;
cursor:pointer;
transition:scale 0.3s;
color:white;
display:flex;
flex-direction: column;
justify-content: center;
}
.info.svelte-1fu0qh p:where(.svelte-1fu0qh){
margin:0 0 5px 0;
}
.event.svelte-1fu0qh{
text-align:left;
appearance: none;
width:100%;
background:white;
text-decoration: none;
color:inherit;
box-sizing: border-box;
display:grid;
padding:10px 15px;
min-height:100%;
border:1px solid #ccc;
gap:10px;
grid-template-rows:80px 1fr;
border-radius:5px;
cursor:pointer;
transition:scale 0.3s;
grid-template-areas:
"title"
"date"
"description";
}
.event.svelte-1fu0qh:hover,.info.svelte-1fu0qh:hover{
scale:0.95;
}
.title.svelte-1fu0qh{
align-self: center;
margin:0;
padding:0;
color:var(--s-primary,var(--d-primary,#ff3e00));
grid-area: title;
font-size:1.5em;
text-wrap: balance;
}
.date.svelte-1fu0qh{
grid-area: date;
}
.day.svelte-1fu0qh{
font-size:4.5em;
line-height:0.9em;
}
.day.svelte-1fu0qh sup:where(.svelte-1fu0qh){
font-size:0.4em;
line-height:1em;
position: relative;
top: -0.5em;
}
.month.svelte-1fu0qh{
font-size:2.5em;
font-weight: normal;
}
.year.svelte-1fu0qh{
font-size:1.5em;
}
.description.svelte-1fu0qh{
grid-area: description;
font-size:0.9em;
}
.info.svelte-1fu0qh ul:where(.svelte-1fu0qh){
list-style:none;
padding:0;
margin:0;
}
.info.svelte-1fu0qh ul:where(.svelte-1fu0qh),.info.svelte-1fu0qh li:where(.svelte-1fu0qh){
font-size:0.8rem;
}
h4.svelte-1fu0qh{
margin:0px 0 0 0;
font-size:1.5em;
}
.dates.svelte-1fu0qh{
margin-top:5px;
}
@container (width< 400px) {
.picker.svelte-1fu0qh h2:where(.svelte-1fu0qh){
margin:0;
font-size:2em;
}
.event.svelte-1fu0qh {
padding-top:10px;
gap:5px;
grid-template-rows:1fr min-content;
grid-template-columns:80px 1fr;
grid-template-areas:
"date title"
"date description";
}
.date.svelte-1fu0qh{
display:grid;
font-size:6px;
place-content:center start;
}
.description.svelte-1fu0qh{
margin:0;
}
.info.svelte-1fu0qh{
padding:10px 15px 10px 15px;
}
}
.steps.svelte-1txbbbh{
--s-border-radius: 0px;
--s-button-margins: 0px;
}
.steps.svelte-1txbbbh > button{
flex:1;
width: 100%;
margin-right:-1px;
}
/* desktop */
@media(min-width:900px){
.steps.svelte-1txbbbh{
display: flex;
width: 100%;
margin-right:1px;
}
}
/* mobile */
@media(max-width: 600px){
.addresses.svelte-1txbbbh{
--s-labelwidth:0px;
}
}
.addresses.svelte-1txbbbh{
display:grid;
margin:5px;
grid-template-columns: repeat( auto-fit, minmax(280px, 1fr) );
gap:20px;
}
.sbreadcrumb.svelte-1d7i6i9{
padding:0;
margin:0;
background:white;
border:2px solid #eee;
margin-bottom:20px;
list-style:none;
}
.sbreadcrumb.svelte-1d7i6i9 li:where(.svelte-1d7i6i9){
margin:0;
display:inline-block;
}
.sbreadcrumb.svelte-1d7i6i9 button:where(.svelte-1d7i6i9){
border:0px;
padding:6px 12px;
font-size:16px;
line-height:1.5;
cursor:pointer;
color:#555;
background:transparent;
}
.sbreadcrumb.svelte-1d7i6i9 > li:where(.svelte-1d7i6i9) + li:where(.svelte-1d7i6i9):before{
content: '/\00a0';
padding: 0 5px;
color: #ccc;
}
.forum.svelte-1d7i6i9{
position:relative;
}
.forum.svelte-1d7i6i9 .edit{
position:absolute;
bottom:2px;
right:5px;
}
.forum.svelte-1d7i6i9 .edit button{
margin:0
}
.forum.svelte-1d7i6i9 img[alt=icon]{
float:left;
max-width:100px;
margin:0 10px 10px 0;
}
.forum.svelte-1d7i6i9 .preview{
overflow:hidden; /* prevent float on icon cause overlap */
}
.post.svelte-1d7i6i9{
border:2px solid #eee;
background:white;
padding:10px 15px;
margin:10px 0;
transition:0.5s border;
position: relative;
}
.clickinto.svelte-1d7i6i9{
cursor:pointer;
}
.post.svelte-1d7i6i9:hover{
border:2px solid #aaa;
}
.post.svelte-1d7i6i9:hover .details:where(.svelte-1d7i6i9){
background:#ddd;
}
.details.svelte-1d7i6i9,.toolbar.svelte-1d7i6i9{
background:#eee;
padding:5px 15px;
margin:10px -15px -10px -15px;
font-size:12px;
transition:0.5s background;
}
.toolbar.svelte-1d7i6i9{
text-align:right;
}
.unpublished.svelte-1d7i6i9{
position:absolute;
top:5px;
right:5px;
pointer-events: none;
padding:3px 8px;
font-size:12px;
border:1px solid #ddd;
border-radius: 3px;
}
.spinner.svelte-1d7i6i9{
border:4px solid #444;
border-color:rgba(0,0,0,0.5) rgba(0,0,0,0.3) rgba(0,0,0,0.2) rgba(0,0,0,0.1);
border-radius:50%;
width:18px;
height:18px;
display:inline-block;
animation:svelte-1d7i6i9-spin 1s infinite linear;
margin-bottom:-4px;
}
@keyframes svelte-1d7i6i9-spin {
from {transform:rotate(0deg);}
to {transform:rotate(360deg);}
}
.chart.svelte-8atcib {
display:inline-grid;
}
.chart.svelte-8atcib > :where(.svelte-8atcib) {
grid-column:1 / 2;
grid-row:1 / 2;
align-self:center;
justify-self: center;
}
.ring.svelte-8atcib {
opacity: 0.5;
stroke-width:3;
fill:transparent;
}
.segment.svelte-8atcib {
opacity: 1;
transform-origin: center;
stroke-dasharray: 0, 100;
stroke-dashoffset:25;
animation: svelte-8atcib-donut var(--duration,3s) linear forwards;
}
@keyframes svelte-8atcib-donut {
to {
stroke-dasharray: 100, 0;
}
}
.d-icon.svelte-8mwtv4{
height:1em;
display: inline-flex;
align-self: center;
position:relative;
top:0.15em;
-webkit-font-smoothing:antialiased;
}
.d-icon.svelte-8mwtv4 svg{
height:100%;
shape-rendering: geometricPrecision;
}
.alertwrap.svelte-eekf4q{
margin:5px 0;
}
.alertwrap.svelte-eekf4q .salert{
padding:0;
--s-formrow-margins:5px;
}
.virtual-viewport.svelte-1ru5i85 {
position: relative;
overflow-y: auto;
-webkit-overflow-scrolling:touch;
display: block;
min-height:20px;
}
.virtual-contents.svelte-1ru5i85, .virtual-row.svelte-1ru5i85 {
display: block;
}
/* removed so we could show re-order bar better */
/* virtual-row {
overflow: hidden;
} */
.times.svelte-1lv4zsn{
flex:1;
display:flex;
flex-direction: column;
min-height:180px;
}
.timeslot.svelte-1lv4zsn {
flex:1;
display:flex;
flex-direction: row;
position:relative;
}
.time.svelte-1lv4zsn{
width:50px;
position:relative;
}
.label.svelte-1lv4zsn{
position:absolute;
top:-50%;
}
.line.svelte-1lv4zsn{
flex:1;
border-top:1px solid #eee;
}
.chosen.svelte-1lv4zsn{
border-right:4px solid var(--d-primary);
}
.usage.svelte-1lv4zsn{
background-image:repeating-linear-gradient(-45deg, #eee, #eee 7px, #fff 7px, #fff 14px);
background-repeat:no-repeat;
height:100%;
}
.toolbar.svelte-19zg9mj{
display:flex;
justify-content: flex-end;
align-items: center;
gap:15px;
}
:root{
box-sizing: border-box;
}
.totalline.svelte-ytxqzb{
background:#eee;
}
.table.svelte-ytxqzb > thead:where(.svelte-ytxqzb) > tr:where(.svelte-ytxqzb) > th:where(.svelte-ytxqzb), .table.svelte-ytxqzb > tbody:where(.svelte-ytxqzb) > tr:where(.svelte-ytxqzb) > td:where(.svelte-ytxqzb), .table.svelte-ytxqzb > tfoot:where(.svelte-ytxqzb) > tr:where(.svelte-ytxqzb) > td:where(.svelte-ytxqzb) {
padding: 8px;
vertical-align: top;
}
.table.svelte-ytxqzb > tbody:where(.svelte-ytxqzb) > tr:where(.svelte-ytxqzb) > td:where(.svelte-ytxqzb), .table.svelte-ytxqzb > tfoot:where(.svelte-ytxqzb) > tr:where(.svelte-ytxqzb) > td:where(.svelte-ytxqzb) {
border-top: 1px solid #ddd;
}
.table.svelte-ytxqzb > thead:where(.svelte-ytxqzb) > tr:where(.svelte-ytxqzb) > th:where(.svelte-ytxqzb) {
vertical-align: bottom;
border-bottom: 2px solid #ddd;
}
th.svelte-ytxqzb{
text-align: left;
}
.form-control.svelte-ytxqzb{
display: block;
padding: 0.2rem 0.75rem;
line-height: 1.25;
font-size: 1rem;
background-color: #fff;
background-image: none;
border: 1px solid rgba(0,0,0,0.15);
border-radius: var(--d-border-radius,4px);
box-sizing: inherit;
width: calc(100% - 1.5em);
}
table.table.svelte-ytxqzb > tbody:where(.svelte-ytxqzb) > tr:where(.svelte-ytxqzb) > td:where(.svelte-ytxqzb){
vertical-align: middle;
}
button.remove.svelte-ytxqzb{
border:0;
padding:10px;
background:transparent;
color:#777;
cursor:pointer;
}
button.remove.svelte-ytxqzb:hover{
color:black;
}
.table.svelte-ytxqzb{
width: 100%;
max-width: 100%;
margin-bottom: 20px;
border-collapse: collapse;
}
.table-striped.svelte-ytxqzb > tbody:where(.svelte-ytxqzb) > tr:where(.svelte-ytxqzb):nth-of-type(odd) {
background-color: #f9f9f9;
}
.nowrap.svelte-ytxqzb{
white-space: nowrap;
}
/*mobile*/
@media(max-width:900px){
.hidden-sm.svelte-ytxqzb{
display:none;
}
.table.svelte-ytxqzb{
font-size:12px;
}
.table.svelte-ytxqzb .form-control:where(.svelte-ytxqzb){
font-size:12px;
padding:0.2em 0.75em;
}
}
.flipcard.svelte-45ifkp{
perspective:500px;
transform-origin: center;
display:inline-block;
--speed:0.5s;
height:100%;
}
.cardwrap.svelte-45ifkp{
transition:transform var(--speed);
display:grid;
transform-style: preserve-3d;
height:100%;
}
.flipx.svelte-45ifkp{
transform: rotateY(180deg);
}
.flipy.svelte-45ifkp{
transform: rotateX(180deg);
}
.flipy.flipx.svelte-45ifkp{
transform: rotate3d(-45,-45,0,180deg)
}
.front.svelte-45ifkp,.back.svelte-45ifkp{
background: white;
backface-visibility:hidden;
height:100%;
}
.front.svelte-45ifkp{
transform:rotateY(0deg);
grid-column:1 / 2;
grid-row:1 / 2;
position: relative;
height:100%;
}
.back.svelte-45ifkp{
transform:rotate3d(0,1,0,180deg);
transition-delay: calc(var(--speed) / 4);
position: absolute;
inset:0;
overflow:hidden;
}
/* below makes card get bigger if neccessary on back */
.flipy.svelte-45ifkp .back:where(.svelte-45ifkp),.flipx.svelte-45ifkp .back:where(.svelte-45ifkp){
overflow:visible;
position: static;
grid-column:1 / 2;
grid-row:1 / 2;
}
.flipy.svelte-45ifkp .back:where(.svelte-45ifkp){
transform:rotate3d(1,0,0,180deg);
}
.flipy.flipx.svelte-45ifkp .back:where(.svelte-45ifkp){
transform: rotate3d(-1,-1,0,180deg);
}
@media(min-width:800px){
.search.svelte-yhback{
width:200px;
position:absolute;
top:0px;
right:0;
}
}
h5.svelte-yhback{
cursor:pointer;
font-weight:bold;
}
h5.svelte-yhback:hover{
text-decoration:underline;
}
/* Theme */
:root {
--d-primary: #306e93;
--d-info: #17a2b8;
--d-success: #28a745;
--d-warning: #ffc107;
--d-danger: #dc3545;
--d-dark: #1d3e52;
--d-button-margins:4px;
--d-default-link: #88b6d7;
--s-primary:var(--d-primary);
--container-width:1200px; /* see layouts.css */
}
/* @view-transition {
navigation: auto;
} */
/* @keyframes fade-in {
from { opacity: 0; }
}
@keyframes fade-out {
to { opacity: 0; }
}
@keyframes slide-from-right {
from { transform: scale(0.8); }
}
@keyframes slide-to-left {
to { transform: scale(0.8); }
}
::view-transition-old(main) {
transform-origin: top center;
animation:
90ms both fade-out,
300ms both slide-to-left;
}
::view-transition-new(main) {
transform-origin: top center;
animation:
210ms 90ms both fade-in,
300ms both slide-from-right;
}
/* header {
view-transition-name: main-header;
} */
/* main {
view-transition-name: main;
} */