:root {
--p-button-label-font-weight: normal;
--p-button-border-radius: 4px;
--p-button-primary-color: #fff;
--p-button-primary-background: #03b4ce;
--p-button-primary-border-color: #03b4ce;
--p-button-primary-hover-color: #fff;
--p-button-primary-hover-background: #0a3d6b;
--p-button-primary-hover-border-color: #0a3d6b;
--p-button-primary-active-color: #fff;
--p-button-primary-active-background: #000;
--p-button-primary-active-border-color: #000;
--p-button-secondary-color: #fff;
--p-button-secondary-background: var(--p-slate-400);
--p-button-secondary-border-color: var(--p-slate-400);
--p-button-secondary-hover-color: #fff;
--p-button-secondary-hover-background: var(--p-slate-500);
--p-button-secondary-hover-border-color: var(--p-slate-500);
--p-button-secondary-active-color: #fff;
--p-button-secondary-active-background: #000;
--p-button-secondary-active-border-color: #000;
--p-button-contrast-color: #fff;
--p-button-contrast-background: var(--p-slate-600);
--p-button-contrast-border-color: var(--p-slate-600);
--p-button-contrast-hover-color: #fff;
--p-button-contrast-hover-background: var(--p-slate-700);
--p-button-contrast-hover-border-color: var(--p-slate-700);
--p-button-contrast-active-color: #fff;
--p-button-contrast-active-background: #000;
--p-button-contrast-active-border-color: #000;
--p-button-outlined-primary-color: #03b4ce;
--p-button-outlined-primary-border-color: #03b4ce;
--p-button-outlined-primary-hover-background: var(--p-slate-100);
--p-button-outlined-primary-active-background: var(--p-slate-200);
--p-button-outlined-secondary-color: var(--p-slate-500);
--p-button-outlined-secondary-border-color: var(--p-slate-500);
--p-button-outlined-secondary-hover-background: var(--p-slate-100);
--p-button-outlined-secondary-active-background: var(--p-slate-200);
--p-button-outlined-contrast-color: var(--p-slate-800);
--p-button-outlined-contrast-border-color: var(--p-slate-800);
--p-button-outlined-contrast-hover-background: var(--p-slate-100);
--p-button-outlined-contrast-active-background: var(--p-slate-200);
--p-dialog-border-radius: 4px;
--p-select-option-focus-background: var(--p-slate-100);
--p-select-option-selected-background: var(--p-slate-200);
--p-select-option-selected-focus-background: var(--p-slate-300);
--p-message-text-sm-font-size: 1rem;
--p-inputtext-padding-x: 10px;
--p-inputtext-padding-y: 7px;
--p-inputtext-border-radius: 0px;
--p-inputtext-border-color: var(--p-slate-400);
--p-textarea-border-color: var(--p-slate-400);
--p-select-border-color: var(--p-slate-400);
--p-inputgroup-addon-border-radius: 0px;
--p-select-border-radius: 0px;
--p-form-field-border-radius:0px;
--p-badge-primary-background: #03b4ce;
--p-badge-secondary-background: var(--p-slate-400);
--p-message-text-font-weight: 400;
--p-message-text-sm-font-size: 0.9rem;
--p-primary-color: var(--p-slate-500);
--p-primary-hover-color: var(--p-slate-500);
--p-datepicker-today-background: #03b4ce;
--p-datepicker-today-color: #fff;
--p-datepicker-date-focus-ring-width: 0;
--p-iftalabel-focus-color: #03b4ce;
--p-checkbox-checked-background: #03b4ce;
--p-checkbox-checked-border-color: #03b4ce;
--p-checkbox-checked-hover-background: #03b4ce;
--p-checkbox-checked-hover-border-color: #03b4ce;
}
/* darkest blue */
/* dark blue */
/* red */
/* green */
/* yellow */
@font-face {
font-family: "primeicons";
font-display: block;
src: url("/content/fonts/primeicons.woff2") format("woff2");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Poppins";
src: url("/content/fonts/Poppins-Bold.woff2") format("woff2");
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Poppins";
src: url("/content/fonts/Poppins-Light.woff2") format("woff2");
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Poppins";
src: url("/content/fonts/Poppins-Regular.woff2") format("woff2");
font-weight: normal;
font-style: normal;
font-display: swap;
}
/* social media */
.branding {
background-image: url("data:image/svg+xml;base64, PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeD0iMCIgeT0iMCIgdmlld0JveD0iMCAwIDM2Ni43IDUwLjgiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxzdHlsZT4uc3Qwe2ZpbGw6IzAwYjRjZX08L3N0eWxlPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik02Mi42IDQwLjZ2LTI2aDcuM2w3IDE0LjUgNy0xNC41aDcuMnYyNmgtNi40VjI0LjRMNzkuNSAzNWgtNS4zTDY5IDI0LjN2MTYuM3ptMzMuOSAwdi0yNmgxOC4xdjUuMmgtMTEuOHY1aDEwLjRWMzBoLTEwLjR2NS4zaDEyLjN2NS4ySDk2LjV6bTM2LjEuNGMtMyAwLTUuNS0uNS03LjctMS42cS0zLjMtMS42NS01LjEtNC41VDExOCAyOGMwLTIuOC42LTUuMiAxLjktNy4zczMtMy43IDUuMy00LjggNS0xLjcgOC4xLTEuN2MxLjYgMCAzLjEuMiA0LjcuNSAxLjYuNCAzIC44IDQuMyAxLjVsLTEuMSA1LjVjLTIuNi0xLjItNS4zLTEuNy04LTEuNy0xLjcgMC0zLjIuMy00LjQgMS0xLjMuNi0yLjIgMS41LTIuOSAyLjdzLTEgMi41LTEgNC4xYzAgMi40LjcgNC4zIDIuMiA1LjZzMy41IDIgNi4xIDJjLjYgMCAxLjEgMCAxLjctLjFzMS4xLS4yIDEuNy0uNHYtNC4yaC00LjR2LTVoMTAuNlYzOXEtMi4yNS45LTQuOCAxLjVjLTEuOC4zLTMuNi41LTUuNC41bTEyLjgtLjQgMTAuMi0yNmg3LjJsMTAuMiAyNmgtNy4zbC0yLTYuMWgtOS41bC0yIDYuMXptMTAuNS0xMS4yaDZsLTMtOS4xek0xODkuNCA0MWMtMiAwLTMuOC0uMy01LjQtMXMtMy4xLTEuNi00LjItMi44Yy0xLjItMS4yLTIuMS0yLjYtMi44LTQuMnMtMS0zLjQtMS01LjRjMC0yLjcuNi01IDEuNy03IDEuMi0yIDIuOC0zLjYgNC44LTQuNyAyLjEtMS4xIDQuNC0xLjcgNy4xLTEuNyAxLjMgMCAyLjcuMiA0LjEuNSAxLjQuNCAyLjYuOCAzLjYgMS41bC0uNCAxLjljLTIuNS0xLjMtNS0yLTcuNS0yLTIuMiAwLTQuMi41LTUuOSAxLjQtMS43IDEtMyAyLjMtNCA0LS45IDEuNy0xLjQgMy43LTEuNCA2cy41IDQuMyAxLjQgNiAyLjIgMy4xIDMuOSA0YzEuNyAxIDMuNyAxLjQgNS45IDEuNCAxLjMgMCAyLjYtLjIgNC0uNXMyLjctLjggMy44LTEuNGwuMyAxLjljLTEuMi42LTIuNSAxLjEtMy45IDEuNC0xLjMuNS0yLjcuNy00LjEuN20xMi0uNCAxMC43LTI2aDIuM2wxMC43IDI2aC0yLjNsLTMuMy04LjNoLTEyLjZsLTMuMyA4LjN6bTYuMi0xMC4xaDExLjFsLTUuNS0xMy45em0yMi42IDEwLjF2LTI2aDcuMXEyLjU1IDAgNC41LjljMS4zLjYgMi4zIDEuNSAzIDIuNnMxLjEgMi41IDEuMSA0YzAgMS44LS41IDMuMy0xLjQgNC41cy0yLjIgMi4xLTMuNyAyLjZsNy42IDExLjRoLTIuNWwtNy4xLTEwLjljLS42LjEtMS4yLjEtMS44LjFoLTQuOHYxMC44em02LjktMjQuMmgtNC44VjI4aDQuNGMyLjMgMCA0LjEtLjUgNS4zLTEuNXMxLjgtMi40IDEuOC00LjNjMC0xLjgtLjYtMy4zLTEuNy00LjMtMS4yLTEtMi44LTEuNS01LTEuNW0yMC43IDI0LjItOC4xLTI2aDIuMmw3LjEgMjMuNiA3LjItMjMuM2gyLjJsNy4yIDIzLjIgNy4xLTIzLjVoMi4ybC04LjEgMjZoLTIuM2wtNy4zLTIzLjEtNy4yIDIzLjF6bTI2LjggMCAxMC43LTI2aDIuM2wxMC43IDI2SDMwNmwtMy4zLTguM2gtMTIuNmwtMy4zIDguM3ptNi4yLTEwLjFoMTEuMWwtNS41LTEzLjl6bTI5IDEwLjdjLTEuNSAwLTIuOS0uMi00LjQtLjZxLTIuMjUtLjYtMy42LTEuNWwuMy0yYzEgLjcgMi4yIDEuMiAzLjYgMS42czIuNy42IDQgLjZjMi4xIDAgMy44LS41IDUtMS40czEuOS0yLjIgMS45LTMuOGMwLTEtLjItMS44LS42LTIuNXMtMS4xLTEuMy0yLjItMS44Yy0xLS41LTIuNS0xLjEtNC40LTEuOHEtMy45LTEuMzUtNS40LTNjLTEuMS0xLjEtMS42LTIuNS0xLjYtNC4zIDAtMi4xLjctMy43IDIuMi00LjlzMy41LTEuOCA1LjktMS44YzEuMiAwIDIuNS4yIDMuNy41czIuNC43IDMuNCAxLjNsLS40IDEuOGMtMS4xLS41LTIuMS0xLTMuMy0xLjMtMS4xLS4zLTIuMy0uNC0zLjQtLjQtMS45IDAtMy40LjQtNC41IDEuMy0xLjEuOC0xLjYgMi0xLjYgMy41IDAgLjkuMiAxLjcuNSAyLjMuNC42IDEgMS4yIDEuOCAxLjdxMS4zNS43NSAzLjYgMS41YzIuMS43IDMuOCAxLjQgNSAyLjFzMi4xIDEuNSAyLjYgMi40LjggMiAuOCAzLjJjMCAyLjItLjggNC0yLjQgNS4zcy0zLjggMi02LjUgMm0xNi4xLS42di0yNmgyLjF2MTEuNWgxNi44VjE0LjZoMi4xdjI2aC0yLjFWMjcuOUgzMzh2MTIuN3oiLz48Y2lyY2xlIGNsYXNzPSJzdDAiIGN4PSIyNi42IiBjeT0iMjUuNyIgcj0iMjIuNCIvPjxwYXRoIGQ9Im00MC4xIDIyLjUtNC4zLTQuM2MtLjctLjgtMS43LTEuMy0yLjgtMS4zcy0yLjEuNS0yLjggMS4zTDI3LjQgMjFjLS41LjUtMS4yLjUtMS43IDBMMjMgMTguM2MtLjctLjgtMS43LTEuMy0yLjktMS4zLTEuMSAwLTIuMS41LTIuOCAxLjNMMTMgMjIuNmwxMC43IDEwLjdjLjcuOCAxLjcgMS4zIDIuOCAxLjNzMi4xLS41IDIuOC0xLjN6IiBzdHlsZT0iZmlsbDojZmZmIi8+PHBhdGggZD0ibTEzLjEgMjIuNS01LjUgNS40Yy0uNy43LTEuMSAxLjYtMS4xIDIuNyAwIDIuMSAxLjcgMy44IDMuOCAzLjggMS4xIDAgMi0uNSAyLjctMS4ybDUuNC01LjR6TTQ1LjYgMjhsLTUuNS01LjUtMiAyLTIuOSAyLjktLjQuNCA1LjQgNS40Yy43LjcgMS43IDEuMiAyLjggMS4yIDIuMSAwIDMuOC0xLjcgMy44LTMuOC0uMS0xLS41LTEuOS0xLjItMi42IiBzdHlsZT0iZmlsbDojOTZkM2UzIi8+PC9zdmc+");
background-repeat: no-repeat;
}
.icon {
mask-position: 50% 50%;
-webkit-mask-position: 50% 50%;
mask-size: contain;
-webkit-mask-size: contain;
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
cursor: pointer;
}
.icon.account {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.check {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.chevron-down {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.chevron-left {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.chevron-right {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.chevron-up {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.copy {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.delete {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.download {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.drag {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.edit {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.erase {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.excel {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.filter {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.flip-horizontal {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.import {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.information {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.link {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.logout {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.minus {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.minus-circle-outline {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.minus-square-outline {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.plus {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.plus-circle-outline {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.plus-square-outline {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.rotate-left {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.rotate-right {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.save {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.sort {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.text {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.trash {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.upload {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.view-list {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.view-grid {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.facebook {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.instagram {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.linkedin {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.telegram {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.twitter {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.x {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.whatsapp {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
.icon.youtube {
mask-image: url("data:image/svg+xml;utf8, ");
-webkit-mask-image: url("data:image/svg+xml;utf8, ");
}
span.icon {
/*
*/
display: inline-block;
width: 24px;
height: 24px;
padding: 2px;
background-color: #333;
cursor: pointer;
}
span.icon.small {
width: 20px;
height: 20px;
}
span.icon.large {
width: 32px;
height: 32px;
}
span.icon:hover {
background-color: var(--p-button-outlined-info-color);
}
span.icon.success {
background-color: var(--p-button-outlined-success-color);
}
span.icon.warn {
background-color: var(--p-button-outlined-warn-color);
}
span.icon.danger {
background-color: var(--p-button-outlined-danger-color);
}
.lang-icon {
background: transparent no-repeat 0 0;
background-size: contain;
}
.lang-icon.nl {
background-image: url('data:image/svg+xml, ');
}
.lang-icon.en {
background-image: url('data:image/svg+xml, ');
}
.lang-icon.de {
background-image: url('data:image/svg+xml, ');
}
.lang-icon.fr {
background-image: url('data:image/svg+xml, ');
}
.lang-icon.es {
background-image: url('data:image/svg+xml, ');
}
.lang-icon.it {
background-image: url('data:image/svg+xml, ');
}
.lang-icon.pt {
background-image: url('data:image/svg+xml, ');
}
.lang-icon.pl {
background-image: url('data:image/svg+xml, ');
}
.lang-icon.tr {
background-image: url('data:image/svg+xml, ');
}
.p-button {
/*
button with label and icon
button with icon only
*/
cursor: pointer;
}
.p-button span.icon {
width: 24px;
height: 24px;
background-color: var(--p-button-primary-color);
}
.p-button.p-button-outlined {
border-color: var(--p-button-outlined-primary-color);
}
.p-button.p-button-outlined span.icon {
background-color: var(--p-button-outlined-primary-color);
}
.p-button.p-button-outlined:not(:disabled):hover, .p-button.p-button-outlined:not(:disabled):active {
border-color: var(--p-button-outlined-primary-color);
}
.p-button.p-button-secondary span.icon {
background-color: var(--p-button-secondary-color);
}
.p-button.p-button-secondary.p-button-outlined {
border-color: var(--p-button-outlined-secondary-color);
}
.p-button.p-button-secondary.p-button-outlined span.icon {
background-color: var(--p-button-outlined-secondary-color);
}
.p-button.p-button-secondary.p-button-outlined:not(:disabled):hover, .p-button.p-button-secondary.p-button-outlined:not(:disabled):active {
border-color: var(--p-button-outlined-secondary-color);
}
.p-button.p-button-success span.icon {
background-color: var(--p-button-success-color);
}
.p-button.p-button-success.p-button-outlined {
border-color: var(--p-button-outlined-success-color);
}
.p-button.p-button-success.p-button-outlined span.icon {
background-color: var(--p-button-outlined-success-color);
}
.p-button.p-button-success.p-button-outlined:not(:disabled):hover, .p-button.p-button-success.p-button-outlined:not(:disabled):active {
border-color: var(--p-button-outlined-success-color);
}
.p-button.p-button-warn span.icon {
background-color: var(--p-button-warn-color);
}
.p-button.p-button-warn.p-button-outlined {
border-color: var(--p-button-outlined-warn-color);
}
.p-button.p-button-warn.p-button-outlined span.icon {
background-color: var(--p-button-outlined-warn-color);
}
.p-button.p-button-warn.p-button-outlined:not(:disabled):hover, .p-button.p-button-warn.p-button-outlined:not(:disabled):active {
border-color: var(--p-button-outlined-warn-color);
}
.p-button.p-button-danger span.icon {
background-color: var(--p-button-danger-color);
}
.p-button.p-button-danger.p-button-outlined {
border-color: var(--p-button-outlined-danger-color);
}
.p-button.p-button-danger.p-button-outlined span.icon {
background-color: var(--p-button-outlined-danger-color);
}
.p-button.p-button-danger.p-button-outlined:not(:disabled):hover, .p-button.p-button-danger.p-button-outlined:not(:disabled):active {
border-color: var(--p-button-outlined-danger-color);
}
.p-button.p-button-info span.icon {
background-color: var(--p-button-info-color);
}
.p-button.p-button-info.p-button-outlined {
border-color: var(--p-button-outlined-info-color);
}
.p-button.p-button-info.p-button-outlined span.icon {
background-color: var(--p-button-outlined-info-color);
}
.p-button.p-button-info.p-button-outlined:not(:disabled):hover, .p-button.p-button-info.p-button-outlined:not(:disabled):active {
border-color: var(--p-button-outlined-info-color);
}
.p-button.p-button-help span.icon {
background-color: var(--p-button-help-color);
}
.p-button.p-button-help.p-button-outlined {
border-color: var(--p-button-outlined-help-color);
}
.p-button.p-button-help.p-button-outlined span.icon {
background-color: var(--p-button-outlined-help-color);
}
.p-button.p-button-help.p-button-outlined:not(:disabled):hover, .p-button.p-button-help.p-button-outlined:not(:disabled):active {
border-color: var(--p-button-outlined-help-color);
}
.p-button.p-button-contrast span.icon {
background-color: var(--p-button-contrast-color);
}
.p-button.p-button-contrast.p-button-outlined {
color: var(--p-button-outlined-contrast-color);
border-color: var(--p-button-outlined-contrast-color);
}
.p-button.p-button-contrast.p-button-outlined span.icon {
background-color: var(--p-button-outlined-contrast-color);
}
.p-button.p-button-contrast.p-button-outlined:not(:disabled):hover, .p-button.p-button-contrast.p-button-outlined:not(:disabled):active {
border-color: var(--p-button-outlined-contrast-color);
}
.p-button.p-button-icon-only {
padding: 4px;
}
.p-button.p-button-icon-only span.icon {
width: 32px;
height: 32px;
}
.p-button.p-button-lg span.icon {
width: 24px;
height: 24px;
}
.p-button.p-button-sm span.icon {
width: 20px;
height: 20px;
}
.p-button.p-button-icon-only.p-button-sm {
padding: 4px 2px;
}
.p-button.p-button-icon-only.p-button-sm span.icon {
width: 20px;
height: 20px;
}
div.loading-mask {
position: fixed;
top: 0px;
left: 0px;
width: 100%;
height: 100% !important;
z-index: 10001;
background-color: rgba(255, 255, 255, 0.6);
display: none;
grid-template-columns: 1fr;
place-items: center;
}
div.loading-mask div.progress-spinner svg {
width: 72px;
height: 72px;
fill: rgba(0, 0, 0, 0.2);
transform-origin: center;
animation: spinner 0.75s linear infinite;
}
@keyframes spinner {
100% {
transform: rotate(360deg);
}
}
/* buttons */
a.p-button {
text-decoration: none;
}
a.p-button:focus, a.p-button:hover {
text-decoration: none;
}
div.buttons {
margin: 15px 0;
}
div.buttons button.p-button {
margin: 0;
}
/* forms & fields */
input, input.input, input.p-inputtext {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1rem;
color: #0a3d6b;
}
@media (max-width: 1440px) {
input, input.input, input.p-inputtext {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
input, input.input, input.p-inputtext {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
input, input.input, input.p-inputtext {
font-size: 0.85rem;
}
}
input.p-invalid, input.input.p-invalid, input.p-inputtext.p-invalid {
color: #000;
background-color: var(--p-amber-100);
}
textarea.p-textarea {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1rem;
color: #0a3d6b;
}
@media (max-width: 1440px) {
textarea.p-textarea {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
textarea.p-textarea {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
textarea.p-textarea {
font-size: 0.85rem;
}
}
textarea.p-textarea.p-invalid {
/*padding: 8px 12px; background-color: $color-white-smoke; border-radius: 6px; border-color: $clr-border;*/
color: #000;
background-color: var(--p-amber-100);
}
span.p-select-label {
color: #03b4ce;
}
.p-button {
padding: 7px 12px !important;
line-height: 1.5 !important;
}
.p-button.p-button-text {
color: #03b4ce;
border-color: transparent;
background-color: transparent;
}
.p-button.p-button-text:not(:disabled):hover, .p-button.p-button-text:not(:disabled):focus {
color: #03b4ce;
border-color: #03b4ce;
background-color: transparent;
}
.p-button.btn-primary {
color: #fff;
border-color: #03b4ce;
background-color: #03b4ce;
}
.p-button.btn-primary:not(:disabled):hover, .p-button.btn-primary:not(:disabled):focus {
color: #fff;
border-color: #5dd5e8;
background-color: #5dd5e8;
}
.p-button.btn-primary.p-button-outlined {
color: #03b4ce;
border-color: #03b4ce;
background-color: transparent;
}
.p-button.btn-primary.p-button-outlined:not(:disabled):hover, .p-button.btn-primary.p-button-outlined:not(:disabled):focus {
color: #fff;
border-color: #5dd5e8;
background-color: #5dd5e8;
}
.p-button.btn-secondary {
color: #fff;
border-color: #5dd5e8;
background-color: #5dd5e8;
}
.p-button.btn-secondary:not(:disabled):hover, .p-button.btn-secondary:not(:disabled):focus {
color: #fff;
border-color: #5dd5e8;
background-color: #5dd5e8;
}
.p-button.btn-secondary.p-button-outlined {
color: #5dd5e8;
border-color: #5dd5e8;
background-color: transparent;
}
.p-button.btn-secondary.p-button-outlined:not(:disabled):hover, .p-button.btn-secondary.p-button-outlined:not(:disabled):focus {
color: #fff;
border-color: #5dd5e8;
background-color: #5dd5e8;
}
.p-button.p-scrolltop {
color: #fff;
border-color: #5dd5e8;
background-color: #5dd5e8;
margin: 5px;
right: 15px !important;
}
div.buttons.navigation {
margin-top: 30px;
}
div.buttons.navigation button {
margin-right: 10px;
}
@media (max-width: 599px) {
div.buttons.navigation button {
display: block;
margin: 0;
margin-bottom: 10px;
}
}
span.p-datepicker-day.p-disabled {
opacity: 0.3;
}
span.p-datepicker-day:not(.p-disabled) {
color: #fff;
background-color: #5dd5e8;
}
span.p-datepicker-day.p-datepicker-day-selected {
background-color: #0a3d6b;
}
div.p-toast {
max-width: 90vw !important;
}
div.p-toast div {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
div.p-toast div {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
div.p-toast div {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
div.p-toast div {
font-size: 0.935rem;
}
}
div.field-wrapper {
display: grid;
grid-template-columns: 1fr;
grid-gap: 15px;
}
div.field-wrapper.two {
grid-template-columns: repeat(2, 1fr);
}
div.field-wrapper.three {
grid-template-columns: repeat(3, 1fr);
}
div.field-wrapper.four {
grid-template-columns: repeat(4, 1fr);
}
div.field-wrapper.five {
grid-template-columns: repeat(5, 1fr);
}
div.field-wrapper.six {
grid-template-columns: repeat(6, 1fr);
}
@media (max-width: 599px) {
div.field-wrapper {
grid-template-columns: 1fr;
}
}
span.p-floatlabel {
margin-top: 30px;
}
ul.p-select-list li.option-small span {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1rem;
}
@media (max-width: 1440px) {
ul.p-select-list li.option-small span {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
ul.p-select-list li.option-small span {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
ul.p-select-list li.option-small span {
font-size: 0.85rem;
}
}
div.field {
display: grid;
grid-template-columns: 1fr;
margin-bottom: 15px;
}
div.field label {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 0.9rem;
}
@media (max-width: 1440px) {
div.field label {
font-size: 0.855rem;
}
}
@media (max-width: 1280px) {
div.field label {
font-size: 0.81rem;
}
}
@media (max-width: 1024px) {
div.field label {
font-size: 0.765rem;
}
}
div.field span.p-iftalabel label {
color: var(--p-slate-400);
}
div.field span.p-iftalabel input {
padding-top: 24px;
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
div.field span.p-iftalabel input {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
div.field span.p-iftalabel input {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
div.field span.p-iftalabel input {
font-size: 0.935rem;
}
}
div.field small {
display: none;
}
div.field.error label {
color: #03b4ce;
}
div.field.error small {
display: block;
color: #03b4ce;
}
div.field.error input, div.field.error textarea, div.field.error div.p-select {
background: rgba(231, 76, 60, 0.1);
}
ul.key-value-pairs {
list-style-type: none;
margin: 0;
padding: 0;
padding-bottom: 15px;
}
ul.key-value-pairs li {
display: grid;
grid-template-columns: 200px 1fr;
grid-gap: 10px;
}
ul.key-value-pairs li div {
padding: 4px 2px;
}
ul.key-value-pairs li div:first-of-type {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
ul.key-value-pairs li div:first-of-type {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
ul.key-value-pairs li div:first-of-type {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
ul.key-value-pairs li div:first-of-type {
font-size: 0.935rem;
}
}
ul.key-value-pairs li:nth-of-type(odd) {
background-color: #f8fafc;
}
div.p-dialog {
border: none;
}
div.p-dialog div.p-dialog-header {
padding: 5px 15px;
padding-right: 5px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
background-color: var(--p-slate-600);
}
div.p-dialog div.p-dialog-header h2, div.p-dialog div.p-dialog-header span {
padding-bottom: 0;
color: #fff;
}
div.p-dialog div.p-dialog-header h2 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
div.p-dialog div.p-dialog-header h2 {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
div.p-dialog div.p-dialog-header h2 {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
div.p-dialog div.p-dialog-header h2 {
font-size: 0.935rem;
}
}
div.p-dialog div.p-dialog-header div.p-dialog-header-actions button.p-dialog-close-button {
color: #fff;
border-color: var(--p-slate-600);
}
div.p-dialog div.p-dialog-header div.p-dialog-header-actions button.p-dialog-close-button:hover, div.p-dialog div.p-dialog-header div.p-dialog-header-actions button.p-dialog-close-button:active {
color: #000;
border-color: var(--p-slate-600);
}
div.p-dialog div.p-dialog-content {
padding: 10px;
padding-top: 20px;
background-color: var(--p-slate-100);
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
div.p-dialog.p-confirmdialog div.p-dialog-content {
padding: 15px;
}
div.p-dialog.p-confirmdialog div.p-dialog-content span {
padding: 0;
}
div.p-dialog.p-confirmdialog div.p-dialog-footer {
padding: 15px;
justify-content: center;
}
div.p-dialog.p-confirmdialog div.p-dialog-footer button {
margin: 0;
}
.list-item {
padding: 2px;
border-top: 1px solid #5dd5e8;
}
.list-item:nth-of-type(odd) {
background-color: var(--p-slate-100);
}
.list-item.active {
background-color: #5dd5e8;
}
.list-item.active a {
color: #03b4ce;
}
span.p-tag.status-new {
color: #fff;
background-color: #5dd5e8;
}
span.p-tag.status-pending {
color: #000;
background-color: #5dd5e8;
}
span.p-tag.status-completed {
color: #fff;
background-color: #5dd5e8;
}
span.p-tag.priority-high {
color: #5dd5e8;
border-color: #5dd5e8;
background-color: #fff;
border: 1px solid;
}
span.p-tag.priority-medium {
color: var(--p-slate-200);
border-color: var(--p-slate-200);
background-color: #fff;
border: 1px solid;
}
span.p-tag.priority-low {
color: var(--p-slate-50);
border-color: var(--p-slate-50);
background-color: #fff;
border: 1px solid;
}
span.p-tag.due-date {
color: #5dd5e8;
border-color: #5dd5e8;
background-color: #fff;
border: 1px solid;
}
.ql-toolbar.ql-snow {
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.ql-container.ql-snow {
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
}
.ql-editor {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
color: #03b4ce !important;
background-color: var(--p-slate-100) !important;
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
}
@media (max-width: 1440px) {
.ql-editor {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
.ql-editor {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
.ql-editor {
font-size: 0.935rem;
}
}
body {
margin: 0;
min-height: 100vh;
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
color: #333;
line-height: 1.5;
}
@media (max-width: 1440px) {
body {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
body {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
body {
font-size: 0.935rem;
}
}
main {
width: 100%;
min-height: calc(100vh - 60px - 40px);
z-index: 101;
}
section.module-wrapper {
background-color: var(--p-slate-100);
}
@media (min-width: 1280px) {
section.module-wrapper {
padding: 60px 0;
}
}
@media (max-width: 1279px) {
section.module-wrapper {
padding: 50px 0;
}
}
@media (max-width: 767px) {
section.module-wrapper {
padding: 30px 0;
}
}
a {
color: #5dd5e8;
text-decoration: none;
text-underline-position: under;
}
a:hover, a:focus {
text-decoration: underline;
}
h1 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.8rem;
line-height: 1.2;
color: #03b4ce;
margin: 0;
padding-bottom: 20px;
}
@media (max-width: 1440px) {
h1 {
font-size: 1.71rem;
}
}
@media (max-width: 1280px) {
h1 {
font-size: 1.62rem;
}
}
@media (max-width: 1024px) {
h1 {
font-size: 1.53rem;
}
}
h2 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.6rem;
line-height: 1.25;
color: #03b4ce;
margin: 0;
padding-bottom: 15px;
}
@media (max-width: 1440px) {
h2 {
font-size: 1.52rem;
}
}
@media (max-width: 1280px) {
h2 {
font-size: 1.44rem;
}
}
@media (max-width: 1024px) {
h2 {
font-size: 1.36rem;
}
}
h3 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.4rem;
line-height: 1.3;
color: #03b4ce;
margin: 0;
padding-bottom: 10px;
}
@media (max-width: 1440px) {
h3 {
font-size: 1.33rem;
}
}
@media (max-width: 1280px) {
h3 {
font-size: 1.26rem;
}
}
@media (max-width: 1024px) {
h3 {
font-size: 1.19rem;
}
}
h4 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.2rem;
line-height: 1.35;
color: #333;
margin: 0;
padding-bottom: 10px;
}
@media (max-width: 1440px) {
h4 {
font-size: 1.14rem;
}
}
@media (max-width: 1280px) {
h4 {
font-size: 1.08rem;
}
}
@media (max-width: 1024px) {
h4 {
font-size: 1.02rem;
}
}
h2:not(:first-of-type), h3:not(:first-of-type) {
padding-top: 15px;
}
p {
margin-top: 0;
}
/* containers */
div.container {
margin: 0 auto;
padding: 0 10px;
width: 100%;
}
@media (min-width: 1280px) {
div.container {
max-width: 1200px !important;
}
}
@media (max-width: 1279px) {
div.container {
max-width: calc(100vw - 80px);
}
}
@media (max-width: 767px) {
div.container {
max-width: calc(100vw - 20px);
}
}
@media (max-width: 399px) {
div.container {
max-width: 100%;
padding: 0;
}
}
div.p-drawer.sidebar {
background: #fff;
}
div.p-drawer.sidebar div.p-drawer-header {
display: grid;
grid-template-columns: 1fr 40px;
align-items: center;
grid-gap: 30px;
}
div.p-drawer.sidebar div.p-drawer-header h3 {
padding: 0;
color: #03b4ce;
}
div.p-drawer.sidebar div.p-drawer-header button.p-button {
margin: 0;
border: 0;
}
div.p-drawer.sidebar div.sidebar-menu a.p-button {
display: block;
margin-bottom: 5px;
}
div.p-drawer.sidebar div.p-drawer-footer p {
margin-top: 0;
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1rem;
}
@media (max-width: 1440px) {
div.p-drawer.sidebar div.p-drawer-footer p {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
div.p-drawer.sidebar div.p-drawer-footer p {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
div.p-drawer.sidebar div.p-drawer-footer p {
font-size: 0.85rem;
}
}
div.p-drawer.sidebar div.p-drawer-footer div.content-wrapper {
display: grid;
grid-template-columns: auto 1fr;
}
div.p-drawer.sidebar div.p-drawer-footer div.content-wrapper div.p-select {
justify-self: start;
height: 40px;
}
div.p-drawer.sidebar div.p-drawer-footer div.content-wrapper button {
justify-self: end;
margin: 0;
background: #fff;
border: 0;
}
header.default {
height: 60px;
background-color: #fff;
z-index: 101;
}
header.default section.header-topbar {
width: 100%;
padding: 5px 15px;
display: grid;
grid-template-columns: 1fr 75px;
grid-column-gap: 20px;
align-items: center;
}
header.default section.header-topbar a.branding {
align-self: start;
width: 200px;
height: 50px;
background-color: transparent;
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: cover;
background-size: contain;
background-position: 0 50%;
}
header.default section.header-topbar div.header-navigation {
justify-self: end;
padding-top: 2px;
/*
display:grid;
grid-template-columns:repeat(2, 1fr);
grid-gap:15px;
justify-items:end;
align-items:start;
button.sidebar-toggle {
margin:0;
padding:5px !important;
span.p-button-icon { color:$color-primary; font-size:24px; }
&:hover, &:focus {
background-color: $color-white;
span.p-button-icon { color:$color-secondary; }
}
}
*/
}
header.default section.header-topbar div.header-navigation div.p-select {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1rem;
}
@media (max-width: 1440px) {
header.default section.header-topbar div.header-navigation div.p-select {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
header.default section.header-topbar div.header-navigation div.p-select {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
header.default section.header-topbar div.header-navigation div.p-select {
font-size: 0.85rem;
}
}
footer.default {
height: 40px;
background-color: #0d1b2a;
z-index: 101;
}
footer.default section.footer-main div.content-wrapper {
display: grid;
justify-items: center;
padding: 10px 0;
}
footer.default section.footer-main div.content-wrapper div.footer-disclaimer {
color: #fff;
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1rem;
line-height: 20px;
}
@media (max-width: 1440px) {
footer.default section.footer-main div.content-wrapper div.footer-disclaimer {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
footer.default section.footer-main div.content-wrapper div.footer-disclaimer {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
footer.default section.footer-main div.content-wrapper div.footer-disclaimer {
font-size: 0.85rem;
}
}
section.style-definitions {
min-height: inherit;
padding: 30px 0;
}
section.style-definitions div.font-definitions {
width: 100%;
max-width: 960px;
margin: 60px auto;
}
section.style-definitions div.font-definitions .a-h1 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.8rem;
line-height: 1.2;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-h1 {
font-size: 1.71rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-h1 {
font-size: 1.62rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-h1 {
font-size: 1.53rem;
}
}
section.style-definitions div.font-definitions .a-h2 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.6rem;
line-height: 1.25;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-h2 {
font-size: 1.52rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-h2 {
font-size: 1.44rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-h2 {
font-size: 1.36rem;
}
}
section.style-definitions div.font-definitions .a-h3 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.4rem;
line-height: 1.3;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-h3 {
font-size: 1.33rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-h3 {
font-size: 1.26rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-h3 {
font-size: 1.19rem;
}
}
section.style-definitions div.font-definitions .a-h4 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.2rem;
line-height: 1.35;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-h4 {
font-size: 1.14rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-h4 {
font-size: 1.08rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-h4 {
font-size: 1.02rem;
}
}
section.style-definitions div.font-definitions .a-h5 {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-h5 {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-h5 {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-h5 {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .a-p {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-p {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-p {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-p {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .a-p.light {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: 300;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-p.light {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-p.light {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-p.light {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .a-p.regular {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-p.regular {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-p.regular {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-p.regular {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .a-p.medium {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-p.medium {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-p.medium {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-p.medium {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .a-p.semibold {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-p.semibold {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-p.semibold {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-p.semibold {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .a-p.bold {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-p.bold {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-p.bold {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-p.bold {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .a-p.black {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-p.black {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-p.black {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-p.black {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .a-small {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-small {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-small {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-small {
font-size: 0.85rem;
}
}
section.style-definitions div.font-definitions .a-tiny {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 0.9rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .a-tiny {
font-size: 0.855rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .a-tiny {
font-size: 0.81rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .a-tiny {
font-size: 0.765rem;
}
}
section.style-definitions div.font-definitions .b-h1 {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: 600;
/* font size */
font-size: 1.8rem;
line-height: 1.2;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-h1 {
font-size: 1.71rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-h1 {
font-size: 1.62rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-h1 {
font-size: 1.53rem;
}
}
section.style-definitions div.font-definitions .b-h2 {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: 600;
/* font size */
font-size: 1.6rem;
line-height: 1.25;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-h2 {
font-size: 1.52rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-h2 {
font-size: 1.44rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-h2 {
font-size: 1.36rem;
}
}
section.style-definitions div.font-definitions .b-h3 {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: 600;
/* font size */
font-size: 1.4rem;
line-height: 1.3;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-h3 {
font-size: 1.33rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-h3 {
font-size: 1.26rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-h3 {
font-size: 1.19rem;
}
}
section.style-definitions div.font-definitions .b-h4 {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: 600;
/* font size */
font-size: 1.2rem;
line-height: 1.35;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-h4 {
font-size: 1.14rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-h4 {
font-size: 1.08rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-h4 {
font-size: 1.02rem;
}
}
section.style-definitions div.font-definitions .b-h5 {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: 600;
/* font size */
font-size: 1.1rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-h5 {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-h5 {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-h5 {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .b-p {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: normal;
/* font size */
font-size: 1.1rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-p {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-p {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-p {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .b-p.light {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: 300;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-p.light {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-p.light {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-p.light {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .b-p.regular {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: normal;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-p.regular {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-p.regular {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-p.regular {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .b-p.medium {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: normal;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-p.medium {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-p.medium {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-p.medium {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .b-p.semibold {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: 600;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-p.semibold {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-p.semibold {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-p.semibold {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .b-p.bold {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: 600;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-p.bold {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-p.bold {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-p.bold {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .b-p.black {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: 600;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-p.black {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-p.black {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-p.black {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .b-small {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: normal;
/* font size */
font-size: 1rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-small {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-small {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-small {
font-size: 0.85rem;
}
}
section.style-definitions div.font-definitions .b-tiny {
/* family, weight and line-height */
font-family: "Source Sans 3", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.4;
font-weight: normal;
/* font size */
font-size: 0.9rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .b-tiny {
font-size: 0.855rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .b-tiny {
font-size: 0.81rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .b-tiny {
font-size: 0.765rem;
}
}
section.style-definitions div.font-definitions .c-h1 {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.8rem;
line-height: 1.2;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-h1 {
font-size: 1.71rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-h1 {
font-size: 1.62rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-h1 {
font-size: 1.53rem;
}
}
section.style-definitions div.font-definitions .c-h2 {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.6rem;
line-height: 1.25;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-h2 {
font-size: 1.52rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-h2 {
font-size: 1.44rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-h2 {
font-size: 1.36rem;
}
}
section.style-definitions div.font-definitions .c-h3 {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.4rem;
line-height: 1.3;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-h3 {
font-size: 1.33rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-h3 {
font-size: 1.26rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-h3 {
font-size: 1.19rem;
}
}
section.style-definitions div.font-definitions .c-h4 {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.2rem;
line-height: 1.35;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-h4 {
font-size: 1.14rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-h4 {
font-size: 1.08rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-h4 {
font-size: 1.02rem;
}
}
section.style-definitions div.font-definitions .c-h5 {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-h5 {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-h5 {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-h5 {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .c-p {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-p {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-p {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-p {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .c-p.light {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: 300;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-p.light {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-p.light {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-p.light {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .c-p.regular {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-p.regular {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-p.regular {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-p.regular {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .c-p.medium {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-p.medium {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-p.medium {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-p.medium {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .c-p.semibold {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-p.semibold {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-p.semibold {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-p.semibold {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .c-p.bold {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-p.bold {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-p.bold {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-p.bold {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .c-p.black {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-p.black {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-p.black {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-p.black {
font-size: 0.935rem;
}
}
section.style-definitions div.font-definitions .c-small {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-small {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-small {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-small {
font-size: 0.85rem;
}
}
section.style-definitions div.font-definitions .c-tiny {
/* family, weight and line-height */
font-family: "Roboto Condensed", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 0.9rem;
color: #333;
}
@media (max-width: 1440px) {
section.style-definitions div.font-definitions .c-tiny {
font-size: 0.855rem;
}
}
@media (max-width: 1280px) {
section.style-definitions div.font-definitions .c-tiny {
font-size: 0.81rem;
}
}
@media (max-width: 1024px) {
section.style-definitions div.font-definitions .c-tiny {
font-size: 0.765rem;
}
}
section.style-definitions div.color-palette {
width: 100%;
max-width: 960px;
margin: 60px auto;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 15px 45px;
}
section.style-definitions div.color-palette .color-1 {
background-color: #03b4ce;
}
section.style-definitions div.color-palette .color-1-light {
background-color: #22e0fc;
}
section.style-definitions div.color-palette .color-1-dark {
background-color: #027283;
}
section.style-definitions div.color-palette .color-2 {
background-color: #5dd5e8;
}
section.style-definitions div.color-palette .color-2-light {
background-color: #a0e6f2;
}
section.style-definitions div.color-palette .color-2-dark {
background-color: #1fc0da;
}
section.style-definitions div.color-palette .color-3 {
background-color: #0d1b2a;
}
section.style-definitions div.color-palette .color-3-light {
background-color: #193451;
}
section.style-definitions div.color-palette .color-3-dark {
background-color: black;
}
section.style-definitions div.color-palette .color-4 {
background-color: #0a3d6b;
}
section.style-definitions div.color-palette .color-4-light {
background-color: #1165b1;
}
section.style-definitions div.color-palette .color-4-dark {
background-color: #031525;
}
section.style-definitions div.color-palette .color-5 {
background-color: #e30916;
}
section.style-definitions div.color-palette .color-5-light {
background-color: #f7414c;
}
section.style-definitions div.color-palette .color-5-dark {
background-color: #99060f;
}
section.style-definitions div.color-palette .color-6 {
background-color: #25a75b;
}
section.style-definitions div.color-palette .color-6-light {
background-color: #43d580;
}
section.style-definitions div.color-palette .color-6-dark {
background-color: #176839;
}
section.style-definitions div.color-palette .color-7 {
background-color: #fbbf24;
}
section.style-definitions div.color-palette .color-7-light {
background-color: #fcd56f;
}
section.style-definitions div.color-palette .color-7-dark {
background-color: #cf9604;
}
section.style-definitions div.color-palette .color-8 {
background-color: #03b4ce;
}
section.style-definitions div.color-palette .color-8-light {
background-color: #22e0fc;
}
section.style-definitions div.color-palette .color-8-dark {
background-color: #027283;
}
section.style-definitions div.color-palette .color-9 {
background-color: #03b4ce;
}
section.style-definitions div.color-palette .color-9-light {
background-color: #22e0fc;
}
section.style-definitions div.color-palette .color-9-dark {
background-color: #027283;
}
section.style-definitions div.color-palette .color-white-ghost {
background-color: var(--p-slate-50);
}
section.style-definitions div.color-palette .color-white-smoke {
background-color: var(--p-slate-100);
}
section.style-definitions div.color-palette .color-white-fog {
background-color: var(--p-slate-200);
}
section.style-definitions div.color-palette .color-grey-light {
background-color: var(--p-slate-300);
}
section.style-definitions div.color-palette .color-grey-medium {
background-color: var(--p-slate-400);
}
section.style-definitions div.color-palette .color-grey-dark {
background-color: var(--p-slate-600);
}
@media (max-width: 1279px) {
section.style-definitions div.color-palette {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 1023px) {
section.style-definitions div.color-palette {
grid-template-columns: 1fr;
}
}
section.style-definitions div.color-palette div.color-item {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 15px;
}
section.style-definitions div.color-palette div.color-item div.shade div.swatch {
display: block;
width: 100%;
height: 50px;
}
section.style-definitions div.color-palette div.color-item div.shade div.label {
text-align: center;
font-size: 1rem;
}
section.style-definitions div.default-buttons {
width: 100%;
max-width: 960px;
margin: 60px auto;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 15px;
}
section.style-definitions div.default-buttons button.p-button.p-button-primary.hover {
background: var(--p-button-primary-hover-background);
border: 1px solid var(--p-button-primary-hover-border-color);
color: var(--p-button-primary-hover-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-primary.active {
background: var(--p-button-primary-active-background);
border: 1px solid var(--p-button-primary-active-border-color);
color: var(--p-button-primary-active-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-secondary.hover {
background: var(--p-button-secondary-hover-background);
border: 1px solid var(--p-button-secondary-hover-border-color);
color: var(--p-button-secondary-hover-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-secondary.active {
background: var(--p-button-secondary-active-background);
border: 1px solid var(--p-button-secondary-active-border-color);
color: var(--p-button-secondary-active-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-contrast.hover {
background: var(--p-button-contrast-hover-background);
border: 1px solid var(--p-button-contrast-hover-border-color);
color: var(--p-button-contrast-hover-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-contrast.active {
background: var(--p-button-contrast-active-background);
border: 1px solid var(--p-button-contrast-active-border-color);
color: var(--p-button-contrast-active-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-outlined.p-button-primary.hover {
background: var(--p-button-outlined-primary-hover-background);
border-color: var(--p-button-outlined-primary-border-color);
color: var(--p-button-outlined-primary-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-outlined.p-button-primary.active {
background: var(--p-button-outlined-primary-active-background);
border-color: var(--p-button-outlined-primary-border-color);
color: var(--p-button-outlined-primary-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-outlined.p-button-secondary.hover {
background: var(--p-button-outlined-secondary-hover-background);
border-color: var(--p-button-outlined-secondary-border-color);
color: var(--p-button-outlined-secondary-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-outlined.p-button-secondary.active {
background: var(--p-button-outlined-secondary-active-background);
border-color: var(--p-button-outlined-secondary-border-color);
color: var(--p-button-outlined-secondary-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-outlined.p-button-contrast.hover {
background: var(--p-button-outlined-contrast-hover-background);
border-color: var(--p-button-outlined-contrast-border-color);
color: var(--p-button-outlined-contrast-color);
}
section.style-definitions div.default-buttons button.p-button.p-button-outlined.p-button-contrast.active {
background: var(--p-button-outlined-contrast-active-background);
border-color: var(--p-button-outlined-contrast-border-color);
color: var(--p-button-outlined-contrast-color);
}
/* planner */
section.planner {
min-height: inherit;
background-color: transparent;
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: cover;
background-size: cover;
background-position: 50% 50%;
background-image: url("/content/media/page-bg.jpg");
display: grid;
justify-items: center;
}
section.planner div.p-card {
width: 90%;
max-width: 480px;
margin: 0 auto;
background-color: var(--p-slate-200);
}
section.planner div.p-card div.p-card-body div.p-card-caption {
padding-bottom: 15px;
}
section.planner div.p-card div.p-card-body div.p-card-caption div.p-card-title {
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.planner div.p-card div.p-card-body div.p-card-caption div.p-card-title {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.planner div.p-card div.p-card-body div.p-card-caption div.p-card-title {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.planner div.p-card div.p-card-body div.p-card-caption div.p-card-title {
font-size: 0.935rem;
}
}
section.planner div.p-card div.p-card-body div.p-card-caption div.p-card-subtitle p {
margin: 0;
}
section.planner div.p-card div.p-card-body div.p-card-caption div.p-card-subtitle div.p-message {
padding: 5px 10px;
}
section.planner div.p-card div.p-card-body div.p-card-content p {
margin: 0;
margin-bottom: 15px;
}
section.planner div.p-card div.p-card-body div.p-card-content div.buttons {
margin: 0;
margin-top: 30px;
display: grid;
grid-template-columns: 1fr;
grid-gap: 10px;
}
section.planner div.p-card div.p-card-body div.p-card-content div.buttons button.p-button {
margin: 0;
}
section.planner div.p-card div.p-card-body div.p-card-footer div.buttons {
margin: 0;
}
section.planner div.p-card.slot-selection div.p-card-body div.p-card-content div.block {
margin-bottom: 15px;
display: grid;
grid-template-columns: 1fr 0.5fr;
grid-gap: 30px 10px;
}
@media (max-width: 599px) {
section.planner div.p-card.slot-selection div.p-card-body div.p-card-content div.block {
grid-template-columns: 1fr;
}
}
section.planner div.p-card.slot-selection div.p-card-body div.p-card-content div.block button.p-datepicker-select-month {
pointer-events: none;
}
section.planner div.p-card.slot-selection div.p-card-body div.p-card-content div.block button.p-datepicker-select-year {
pointer-events: none;
}
section.planner div.p-card.slot-selection div.p-card-body div.p-card-content div.block div.slot-wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 5px;
}
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.date-selected {
margin-bottom: 30px;
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.date-selected {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.date-selected {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.date-selected {
font-size: 0.935rem;
}
}
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.client-details {
margin-bottom: 30px;
}
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options {
margin-bottom: 30px;
}
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options div.checkbox-group {
display: block;
}
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options div.checkbox-group div.checkbox-item {
display: grid;
grid-template-columns: 30px 1fr;
grid-column-gap: 5px;
align-items: center;
}
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options div.checkbox-group div.checkbox-item label {
display: grid;
grid-template-columns: 1fr auto;
cursor: pointer;
}
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options div.checkbox-group div.checkbox-item label span.price {
text-align: right;
}
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options div.checkbox-group div.checkbox-item.total {
margin: 5px 0;
padding: 5px 0;
border-top: 1px solid var(--p-slate-400);
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: bold;
/* font size */
font-size: 1.1rem;
}
@media (max-width: 1440px) {
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options div.checkbox-group div.checkbox-item.total {
font-size: 1.045rem;
}
}
@media (max-width: 1280px) {
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options div.checkbox-group div.checkbox-item.total {
font-size: 0.99rem;
}
}
@media (max-width: 1024px) {
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options div.checkbox-group div.checkbox-item.total {
font-size: 0.935rem;
}
}
section.planner div.p-card.appointment-details div.p-card-body div.p-card-content div.service-options div.checkbox-group div.checkbox-item.total label {
pointer-events: none;
}
body.pmod-planner div.p-drawer-mask.p-overlay-mask {
background-color: transparent !important;
}
body.pmod-planner div.p-drawer-mask div.p-drawer.form-feedback {
height: auto;
/* family, weight and line-height */
font-family: "Poppins", Helvetica, Arial, Verdana, sans-serif;
line-height: 1.5;
font-weight: normal;
/* font size */
font-size: 1rem;
}
@media (max-width: 1440px) {
body.pmod-planner div.p-drawer-mask div.p-drawer.form-feedback {
font-size: 0.95rem;
}
}
@media (max-width: 1280px) {
body.pmod-planner div.p-drawer-mask div.p-drawer.form-feedback {
font-size: 0.9rem;
}
}
@media (max-width: 1024px) {
body.pmod-planner div.p-drawer-mask div.p-drawer.form-feedback {
font-size: 0.85rem;
}
}
body.pmod-planner div.p-drawer-mask div.p-drawer.form-feedback.error {
color: #fff;
border-color: #e30916;
background: #e30916;
}
body.pmod-planner div.p-drawer-mask div.p-drawer.form-feedback.warn {
border-color: #fbbf24;
background: #fbbf24;
}
body.pmod-planner div.p-drawer-mask div.p-drawer.form-feedback div.p-drawer-header {
display: none;
}
body.pmod-planner div.p-drawer-mask div.p-drawer.form-feedback div.p-drawer-content {
padding: 10px 15px;
text-align: center;
}