/* Bootstrap helpers required */ /* Base styles */ /*============================================================================== // File: _webkit.scss // Package: Joomla / Mr Zen // Synopsis: Extra webkit styles for compatibility - SASS //============================================================================*/ .row:not(.justify-content-center) .sppb-col-auto, .row:not(.justify-content-center) .col-auto { -webkit-flex: 0 0 auto; } .row:not(.justify-content-center) .sppb-col-1, .row:not(.justify-content-center) .col-1 { -webkit-flex: 0 0 8.333333%; } .row:not(.justify-content-center) .sppb-col-2, .row:not(.justify-content-center) .col-2 { -webkit-flex: 0 0 16.666667%; } .row:not(.justify-content-center) .sppb-col-3, .row:not(.justify-content-center) .col-3 { -webkit-flex: 0 0 25%; } .row:not(.justify-content-center) .sppb-col-4, .row:not(.justify-content-center) .col-4 { -webkit-flex: 0 0 33.333333%; } .row:not(.justify-content-center) .sppb-col-5, .row:not(.justify-content-center) .col-5 { -webkit-flex: 0 0 41.666667%; } .row:not(.justify-content-center) .sppb-col-6, .row:not(.justify-content-center) .col-6 { -webkit-flex: 0 0 50%; } .row:not(.justify-content-center) .sppb-col-7, .row:not(.justify-content-center) .col-7 { -webkit-flex: 0 0 58.333333%; } .row:not(.justify-content-center) .sppb-col-8, .row:not(.justify-content-center) .col-8 { -webkit-flex: 0 0 66.666667%; } .row:not(.justify-content-center) .sppb-col-9, .row:not(.justify-content-center) .col-9 { -webkit-flex: 0 0 75%; } .row:not(.justify-content-center) .sppb-col-10, .row:not(.justify-content-center) .col-10 { -webkit-flex: 0 0 83.333333%; } .row:not(.justify-content-center) .sppb-col-11, .row:not(.justify-content-center) .col-11 { -webkit-flex: 0 0 91.666667%; } .row:not(.justify-content-center) .sppb-col-12, .row:not(.justify-content-center) .col-12 { -webkit-flex: 0 0 100%; } @media (max-width: 767.98px) { .row:not(.justify-content-center) .sppb-col-xs-auto { -webkit-flex: 0 0 auto; } .row:not(.justify-content-center) .sppb-col-xs-1 { -webkit-flex: 0 0 8.333333%; } .row:not(.justify-content-center) .sppb-col-xs-2 { -webkit-flex: 0 0 16.666667%; } .row:not(.justify-content-center) .sppb-col-xs-3 { -webkit-flex: 0 0 25%; } .row:not(.justify-content-center) .sppb-col-xs-4 { -webkit-flex: 0 0 33.333333%; } .row:not(.justify-content-center) .sppb-col-xs-5 { -webkit-flex: 0 0 41.666667%; } .row:not(.justify-content-center) .sppb-col-xs-6 { -webkit-flex: 0 0 50%; } .row:not(.justify-content-center) .sppb-col-xs-7 { -webkit-flex: 0 0 58.333333%; } .row:not(.justify-content-center) .sppb-col-xs-8 { -webkit-flex: 0 0 66.666667%; } .row:not(.justify-content-center) .sppb-col-xs-9 { -webkit-flex: 0 0 75%; } .row:not(.justify-content-center) .sppb-col-xs-10 { -webkit-flex: 0 0 83.333333%; } .row:not(.justify-content-center) .sppb-col-xs-11 { -webkit-flex: 0 0 91.666667%; } .row:not(.justify-content-center) .sppb-col-xs-12 { -webkit-flex: 0 0 100%; } } @media (min-width: 576px) { .row:not(.justify-content-center) .col-sm-auto { -webkit-flex: 0 0 auto; } .row:not(.justify-content-center) .sppb-col-sm-1, .row:not(.justify-content-center) .col-sm-1 { -webkit-flex: 0 0 8.333333%; } .row:not(.justify-content-center) .sppb-col-sm-2, .row:not(.justify-content-center) .col-sm-2 { -webkit-flex: 0 0 16.666667%; } .row:not(.justify-content-center) .sppb-col-sm-3, .row:not(.justify-content-center) .col-sm-3 { -webkit-flex: 0 0 25%; } .row:not(.justify-content-center) .sppb-col-sm-4, .row:not(.justify-content-center) .col-sm-4 { -webkit-flex: 0 0 33.333333%; } .row:not(.justify-content-center) .sppb-col-sm-5, .row:not(.justify-content-center) .col-sm-5 { -webkit-flex: 0 0 41.666667%; } .row:not(.justify-content-center) .sppb-col-sm-6, .row:not(.justify-content-center) .col-sm-6 { -webkit-flex: 0 0 50%; } .row:not(.justify-content-center) .sppb-col-sm-7, .row:not(.justify-content-center) .col-sm-7 { -webkit-flex: 0 0 58.333333%; } .row:not(.justify-content-center) .sppb-col-sm-8, .row:not(.justify-content-center) .col-sm-8 { -webkit-flex: 0 0 66.666667%; } .row:not(.justify-content-center) .sppb-col-sm-9, .row:not(.justify-content-center) .col-sm-9 { -webkit-flex: 0 0 75%; } .row:not(.justify-content-center) .sppb-col-sm-10, .row:not(.justify-content-center) .col-sm-10 { -webkit-flex: 0 0 83.333333%; } .row:not(.justify-content-center) .sppb-col-sm-11, .row:not(.justify-content-center) .col-sm-11 { -webkit-flex: 0 0 91.666667%; } .row:not(.justify-content-center) .sppb-col-sm-12, .row:not(.justify-content-center) .col-sm-12 { -webkit-flex: 0 0 100%; } } @media (min-width: 768px) { .row:not(.justify-content-center) .sppb-col-sm-auto, .row:not(.justify-content-center) .col-md-auto { -webkit-flex: 0 0 auto; } .row:not(.justify-content-center) .sppb-col-sm-1, .row:not(.justify-content-center) .col-md-1 { -webkit-flex: 0 0 8.333333%; } .row:not(.justify-content-center) .sppb-col-sm-2, .row:not(.justify-content-center) .col-md-2 { -webkit-flex: 0 0 16.666667%; } .row:not(.justify-content-center) .sppb-col-sm-3, .row:not(.justify-content-center) .col-md-3 { -webkit-flex: 0 0 25%; } .row:not(.justify-content-center) .sppb-col-sm-4, .row:not(.justify-content-center) .col-md-4 { -webkit-flex: 0 0 33.333333%; } .row:not(.justify-content-center) .sppb-col-sm-5, .row:not(.justify-content-center) .col-md-5 { -webkit-flex: 0 0 41.666667%; } .row:not(.justify-content-center) .sppb-col-sm-6, .row:not(.justify-content-center) .col-md-6 { -webkit-flex: 0 0 50%; } .row:not(.justify-content-center) .sppb-col-sm-7, .row:not(.justify-content-center) .col-md-7 { -webkit-flex: 0 0 58.333333%; } .row:not(.justify-content-center) .sppb-col-sm-8, .row:not(.justify-content-center) .col-md-8 { -webkit-flex: 0 0 66.666667%; } .row:not(.justify-content-center) .sppb-col-sm-9, .row:not(.justify-content-center) .col-md-9 { -webkit-flex: 0 0 75%; } .row:not(.justify-content-center) .sppb-col-sm-10, .row:not(.justify-content-center) .col-md-10 { -webkit-flex: 0 0 83.333333%; } .row:not(.justify-content-center) .sppb-col-sm-11, .row:not(.justify-content-center) .col-md-11 { -webkit-flex: 0 0 91.666667%; } .row:not(.justify-content-center) .sppb-col-sm-12, .row:not(.justify-content-center) .col-md-12 { -webkit-flex: 0 0 100%; } } @media (min-width: 992px) { .row:not(.justify-content-center) .sppb-col-md-auto, .row:not(.justify-content-center) .col-lg-auto { -webkit-flex: 0 0 auto; } .row:not(.justify-content-center) .sppb-col-md-1, .row:not(.justify-content-center) .col-lg-1 { -webkit-flex: 0 0 8.333333%; } .row:not(.justify-content-center) .sppb-col-md-2, .row:not(.justify-content-center) .col-lg-2 { -webkit-flex: 0 0 16.666667%; } .row:not(.justify-content-center) .sppb-col-md-3, .row:not(.justify-content-center) .col-lg-3 { -webkit-flex: 0 0 25%; } .row:not(.justify-content-center) .sppb-col-md-4, .row:not(.justify-content-center) .col-lg-4 { -webkit-flex: 0 0 33.333333%; } .row:not(.justify-content-center) .sppb-col-md-5, .row:not(.justify-content-center) .col-lg-5 { -webkit-flex: 0 0 41.666667%; } .row:not(.justify-content-center) .sppb-col-md-6, .row:not(.justify-content-center) .col-lg-6 { -webkit-flex: 0 0 50%; } .row:not(.justify-content-center) .sppb-col-md-7, .row:not(.justify-content-center) .col-lg-7 { -webkit-flex: 0 0 58.333333%; } .row:not(.justify-content-center) .sppb-col-md-8, .row:not(.justify-content-center) .col-lg-8 { -webkit-flex: 0 0 66.666667%; } .row:not(.justify-content-center) .sppb-col-md-9, .row:not(.justify-content-center) .col-lg-9 { -webkit-flex: 0 0 75%; } .row:not(.justify-content-center) .sppb-col-md-10, .row:not(.justify-content-center) .col-lg-10 { -webkit-flex: 0 0 83.333333%; } .row:not(.justify-content-center) .sppb-col-md-11, .row:not(.justify-content-center) .col-lg-11 { -webkit-flex: 0 0 91.666667%; } .row:not(.justify-content-center) .sppb-col-md-12, .row:not(.justify-content-center) .col-lg-12 { -webkit-flex: 0 0 100%; } } @media (min-width: 1200px) { .row:not(.justify-content-center) .sppb-col-lg-auto, .row:not(.justify-content-center) .col-xl-auto { -webkit-flex: 0 0 auto; } .row:not(.justify-content-center) .sppb-col-lg-1, .row:not(.justify-content-center) .col-xl-1 { -webkit-flex: 0 0 8.333333%; } .row:not(.justify-content-center) .sppb-col-lg-2, .row:not(.justify-content-center) .col-xl-2 { -webkit-flex: 0 0 16.666667%; } .row:not(.justify-content-center) .sppb-col-lg-3, .row:not(.justify-content-center) .col-xl-3 { -webkit-flex: 0 0 25%; } .row:not(.justify-content-center) .sppb-col-lg-4, .row:not(.justify-content-center) .col-xl-4 { -webkit-flex: 0 0 33.333333%; } .row:not(.justify-content-center) .sppb-col-lg-5, .row:not(.justify-content-center) .col-xl-5 { -webkit-flex: 0 0 41.666667%; } .row:not(.justify-content-center) .sppb-col-lg-6, .row:not(.justify-content-center) .col-xl-6 { -webkit-flex: 0 0 50%; } .row:not(.justify-content-center) .sppb-col-lg-7, .row:not(.justify-content-center) .col-xl-7 { -webkit-flex: 0 0 58.333333%; } .row:not(.justify-content-center) .sppb-col-lg-8, .row:not(.justify-content-center) .col-xl-8 { -webkit-flex: 0 0 66.666667%; } .row:not(.justify-content-center) .sppb-col-lg-9, .row:not(.justify-content-center) .col-xl-9 { -webkit-flex: 0 0 75%; } .row:not(.justify-content-center) .sppb-col-lg-10, .row:not(.justify-content-center) .col-xl-10 { -webkit-flex: 0 0 83.333333%; } .row:not(.justify-content-center) .sppb-col-lg-11, .row:not(.justify-content-center) .col-xl-11 { -webkit-flex: 0 0 91.666667%; } .row:not(.justify-content-center) .sppb-col-lg-12, .row:not(.justify-content-center) .col-xl-12 { -webkit-flex: 0 0 100%; } } .col { -webkit-flex-basis: 0; -webkit-flex-grow: 1; } .row-cols-1 > *, .row-cols-2 > *, .row-cols-3 > *, .row-cols-4 > *, .row-cols-5 > *, .row-cols-6 > *, .row-cols-7 > *, .row-cols-8 > *, .row-cols-9 > *, .row-cols-10 > *, .row-cols-11 > *, .row-cols-12 > * { -webkit-flex-basis: auto !important; } .sppb-row, .row { -webkit-flex-wrap: wrap; display: -webkit-flex; } .sppb-instagram-images, .sp-pagebuilder-row { display: -webkit-flex; } .sp-item.slider-content-vercally-center { -webkit-align-items: center; -webkit-flex-wrap: wrap; display: -webkit-flex; } @media (min-width: 992px) { .d-lg-flex { display: -webkit-flex !important; } } /*============================================================================== // File: _variables.scss // Package: Joomla / Mr Zen // Synopsis: Main variables & reusable items - SASS //============================================================================*/ /*------------------------------------------------------------------------------ // Global Variables / Bootstrap 4 :root variables //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Font Variables / Bootstrap 4 :root variables //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Icon Variables //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Layout Variables //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Breakpoint Variables //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // z-index Variables //----------------------------------------------------------------------------*/ /*============================================================================== // File: _mixins.scss // Package: Joomla / Mr Zen // Synopsis: Main mixins & reusable items - SASS //============================================================================*/ /*------------------------------------------------------------------------------ // Mixins //----------------------------------------------------------------------------*/ /*============================================================================== // File: _fonts.scss // Package: Joomla / Mr Zen // Synopsis: Main web font references - SASS //============================================================================*/ /*------------------------------------------------------------------------------ // Web fonts - Google Fonts "Oswald" & "Source Sans Pro" //----------------------------------------------------------------------------*/ @font-face { font-family: "Oswald"; src: url("../fonts/Oswald-Regular.eot"); src: url("../fonts/Oswald-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Oswald-Regular.woff") format("woff"), url("../fonts/Oswald-Regular.ttf") format("truetype"), url("../fonts/Oswald-Regular.svg#Oswald-Regular") format("svg"); font-weight: normal; font-display: swap; font-style: normal; } @font-face { font-family: "Oswald SemiBold"; src: url("../fonts/Oswald-SemiBold.eot"); src: url("../fonts/Oswald-SemiBold.eot?#iefix") format("embedded-opentype"), url("../fonts/Oswald-SemiBold.woff") format("woff"), url("../fonts/Oswald-SemiBold.ttf") format("truetype"), url("../fonts/Oswald-SemiBold.svg#Oswald-SemiBold") format("svg"); font-style: normal; font-display: swap; font-weight: 600; } @font-face { font-family: "Source Sans Pro"; src: url("../fonts/SourceSansPro-Regular.eot"); src: url("../fonts/SourceSansPro-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/SourceSansPro-Regular.woff") format("woff"), url("../fonts/SourceSansPro-Regular.ttf") format("truetype"), url("../fonts/SourceSansPro-Regular.svg#SourceSansPro-Regular") format("svg"); font-weight: normal; font-display: swap; font-style: normal; } @font-face { font-family: "Source Sans Pro ExtraLight"; src: url("../fonts/SourceSansPro-ExtraLight.eot"); src: url("../fonts/SourceSansPro-ExtraLight.eot?#iefix") format("embedded-opentype"), url("../fonts/SourceSansPro-ExtraLight.woff") format("woff"), url("../fonts/SourceSansPro-ExtraLight.ttf") format("truetype"), url("../fonts/SourceSansPro-ExtraLight.svg#SourceSansPro-ExtraLight") format("svg"); font-style: normal; font-display: swap; font-weight: 200; } /*------------------------------------------------------------------------------ // Font Awesome 5 //----------------------------------------------------------------------------*/ @font-face { font-family: "Font Awesome 5 Free Solid"; src: url("../fonts/fa-solid-900.eot"); src: url("../fonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../fonts/fa-solid-900.woff") format("woff"), url("../fonts/fa-solid-900.ttf") format("truetype"), url("../fonts/fa-solid-900.svg#fontawesome") format("svg"); font-style: normal; font-display: swap; font-weight: 900; } @font-face { font-family: "Font Awesome 5 Brands"; src: url("../fonts/fa-brands-400.eot"); src: url("../fonts/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("../fonts/fa-brands-400.woff") format("woff"), url("../fonts/fa-brands-400.ttf") format("truetype"), url("../fonts/fa-brands-400.svg#fontawesome") format("svg"); font-style: normal; font-display: swap; font-weight: 300; } @font-face { font-family: "Font Awesome 5 Free"; src: url("../fonts/fa-regular-400.eot"); src: url("../fonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../fonts/fa-regular-400.woff") format("woff"), url("../fonts/fa-regular-400.ttf") format("truetype"), url("../fonts/fa-regular-400.svg#fontawesome") format("svg"); font-weight: normal; font-display: swap; font-style: normal; } .fa, .zen-tab__link:after, .zen-blog .pagenav li .icon-chevron-left, .zen-blog .pagenav li .icon-chevron-right, .carousel-control-next .carousel-control-next-icon, .carousel-control-next .carousel-control-prev-icon, .carousel-control-prev .carousel-control-next-icon, .carousel-control-prev .carousel-control-prev-icon, .fas, .zen-link--filter-tag:after, .fab, .far { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; font-variant: normal; text-rendering: auto; font-style: normal; line-height: 1; } .fa, .zen-tab__link:after, .zen-blog .pagenav li .icon-chevron-left, .zen-blog .pagenav li .icon-chevron-right, .carousel-control-next .carousel-control-next-icon, .carousel-control-next .carousel-control-prev-icon, .carousel-control-prev .carousel-control-next-icon, .carousel-control-prev .carousel-control-prev-icon, .fas, .zen-link--filter-tag:after { font-family: "Font Awesome 5 Free Solid"; font-weight: 900; } .fab { font-family: "Font Awesome 5 Brands"; font-weight: 400; } .far { font-family: "Font Awesome 5 Free"; font-weight: 400; } /*------------------------------------------------------------------------------ // Extend Icon Class //----------------------------------------------------------------------------*/ /*============================================================================== // File: _type.scss // Package: Joomla / Mr Zen // Synopsis: Main type styling - SASS //============================================================================*/ h1 { font-size: 38px; font-family: "Oswald", Helvetica, Arial, sans-serif; text-transform: uppercase; color: #691934; } @media (min-width: 576px) { h1 { font-size: calc(38px + 10 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { h1 { font-size: 48px; } } h2 { font-size: 23px; font-family: "Oswald", Helvetica, Arial, sans-serif; text-transform: uppercase; color: #EFAF25; color: #191919; } @media (min-width: 576px) { h2 { font-size: calc(23px + 7 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { h2 { font-size: 30px; } } h3 { font-size: 20px; font-family: "Oswald", Helvetica, Arial, sans-serif; text-transform: uppercase; color: #691934; } @media (min-width: 576px) { h3 { font-size: calc(20px + 4 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { h3 { font-size: 24px; } } h4 { font-size: 18px; font-family: "Oswald SemiBold", Helvetica, Arial, sans-serif; text-transform: uppercase; color: #EFAF25; } @media (min-width: 576px) { h4 { font-size: calc(18px + 2 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { h4 { font-size: 20px; } } h5 { font-size: 16px; font-family: "Oswald", Helvetica, Arial, sans-serif; text-transform: uppercase; color: #EFAF25; } @media (min-width: 576px) { h5 { font-size: calc(16px + 2 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { h5 { font-size: 18px; } } h6 { font-size: 14px; font-family: "Oswald SemiBold", Helvetica, Arial, sans-serif; text-transform: uppercase; color: #691934; } @media (min-width: 576px) { h6 { font-size: calc(14px + 2 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { h6 { font-size: 16px; } } /*------------------------------------------------------------------------------ // Extend heading tags //----------------------------------------------------------------------------*/ /* Shared component styles */ /*============================================================================== // File: _breadcrumbs.scss // Package: Joomla / Mr Zen // Synopsis: Shared breadcrumbs component - SASS //============================================================================*/ .zen-breadcrumbs, .breadcrumb { font-size: 12px; background: var(--light); margin: 0; /*============================================================================== // Modifiers //============================================================================*/ } .zen-breadcrumbs--light { background: #FFF; margin: 20px 0; padding: 0; } .zen-breadcrumbs--light .breadcrumb-item.active { color: #191919; } /*------------------------------------------------------------------------------ // Extend button element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _line-break.scss // Package: Joomla / Mr Zen // Synopsis: Shared line break component - SASS //============================================================================*/ .zen-line-break { position: relative; margin: 0 0 8rem; /*============================================================================== // Modifiers //============================================================================*/ } .zen-line-break:before, .zen-line-break:after { content: ""; display: block; position: absolute; height: 5px; width: 50%; top: 50%; } @media (max-width: 767.98px) { .zen-line-break:before, .zen-line-break:after { display: none; } } .zen-line-break:before { left: 0; } .zen-line-break:after { right: 0; } .zen-line-break--default:before { background: #FFF; /* Root Background Colour */ background: -webkit-linear-gradient(left, #FFF 0%, #691934 100%); background: -moz-linear-gradient(left, #FFF 0%, #691934 100%); background: linear-gradient(to right, #FFF 0%, #691934 100%); left: 0; } .zen-line-break--default:after { background: #691934; /* Root Background Colour */ background: -webkit-linear-gradient(left, #691934 0%, #FFF 100%); background: -moz-linear-gradient(left, #691934 0%, #FFF 100%); background: linear-gradient(to right, #691934 0%, #FFF 100%); right: 0; } .zen-line-break--light:before { background: var(--light); /* Root Background Colour */ background: -webkit-linear-gradient(left, var(--light) 0%, #691934 100%); background: -moz-linear-gradient(left, var(--light) 0%, #691934 100%); background: linear-gradient(to right, var(--light) 0%, #691934 100%); left: 0; } .zen-line-break--light:after { background: #691934; /* Root Background Colour */ background: -webkit-linear-gradient(left, #691934 0%, var(--light) 100%); background: -moz-linear-gradient(left, #691934 0%, var(--light) 100%); background: linear-gradient(to right, #691934 0%, var(--light) 100%); right: 0; } .zen-line-break--dark:before { background: var(--dark); /* Root Background Colour */ background: -webkit-linear-gradient(left, var(--dark) 0%, #691934 100%); background: -moz-linear-gradient(left, var(--dark) 0%, #691934 100%); background: linear-gradient(to right, var(--dark) 0%, #691934 100%); left: 0; } .zen-line-break--dark:after { background: #691934; /* Root Background Colour */ background: -webkit-linear-gradient(left, #691934 0%, var(--dark) 100%); background: -moz-linear-gradient(left, #691934 0%, var(--dark) 100%); background: linear-gradient(to right, #691934 0%, var(--dark) 100%); right: 0; } .zen-line-break--reduced-spacing-md { margin: 0 0 4rem; } .zen-line-break--reduced-spacing-sm { margin: 0 0 3rem; } .zen-line-break--reduced-spacing-xs { margin: 0 0 2rem; } /*============================================================================== // File: _article.scss // Package: Joomla / Mr Zen // Synopsis: Shared article component - SASS //============================================================================*/ .zen-article { margin: 0 15px 15px; max-width: 400px; /*============================================================================== // Elements //============================================================================*/ } .zen-article__image { margin: 0 0 15px; } .zen-article__title { font-size: 15px; font-weight: bold; margin: 0 0 15px; } .zen-article__text { padding: 0; } /*============================================================================== // File: _panel.scss // Package: Joomla / Mr Zen // Synopsis: Shared panel component - SASS //============================================================================*/ .zen-panel { -webkit-transition: all 1s ease 0.5s; -moz-transition: all 1s ease 0.5s; -ms-transition: all 1s ease 0.5s; -o-transition: all 1s ease 0.5s; transition: all 1s ease 0.5s; z-index: 20; background: var(--light); visibility: hidden; position: fixed; padding: 15px; opacity: 0; /*============================================================================== // Elements //============================================================================*/ /*============================================================================== // Modifiers //============================================================================*/ } .zen-panel.show-panel { visibility: visible; opacity: 1; } @media (max-width: 1199.98px) { .zen-panel__content { font-size: 14px; } } @media (max-width: 767.98px) { .zen-panel__content { font-size: 12px; } } .zen-panel--policy { border-top: 1px solid #CCC; bottom: -200px; width: 100%; } .zen-panel--policy.show-panel { bottom: 0; } /*------------------------------------------------------------------------------ // Extend panel element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _menu.scss // Package: Joomla / Mr Zen // Synopsis: Shared menu component - SASS //============================================================================*/ .zen-menu { position: relative; /*============================================================================== // Elements //============================================================================*/ } .zen-menu__main { background: #191919; padding: 0; } .zen-menu__main .nav-header, .zen-menu__main .nav-link { text-transform: uppercase; } .zen-menu__main .sub-item { display: inline-block; padding: 5px 10px; } @media (max-width: 991.98px) { .zen-menu__main { -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; z-index: 30; background: #191919; font-weight: normal; min-width: 300px; position: fixed; overflow: auto; max-width: 85%; right: -300px; height: 100%; opacity: 0; margin: 0; top: 0; } .zen-menu__main .container, .zen-menu__main .col-12, .zen-menu__main .row { padding: 0; margin: 0; } } .zen-menu__main-mobile { overflow: auto; height: 95vh; } /*------------------------------------------------------------------------------ // Extend menu element & modifiers //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Mobile menu features //----------------------------------------------------------------------------*/ @media (max-width: 991.98px) { .zen-menu-open { max-height: 100vh; overflow: hidden; } .zen-menu-open .zen-overlay { display: block; opacity: 1; } .zen-menu-open .zen-menu__main { -webkit-transform: translateX(-300px); -moz-transform: translateX(-300px); -ms-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px); opacity: 1; } } .scroll-transition { margin-top: 60px; } .fixed-menu { -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; z-index: 20; background: #191919; position: fixed; width: 100%; top: 0; } /*============================================================================== // File: _modal.scss // Package: Joomla / Mr Zen // Synopsis: Shared modal component - SASS //============================================================================*/ .zen-modal, .modal { margin: 0; /*============================================================================== // Modifiers //============================================================================*/ } .zen-modal--gallery { background: #000; } /*------------------------------------------------------------------------------ // Extend modal element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _hero.scss // Package: Joomla / Mr Zen // Synopsis: Shared hero component - SASS //============================================================================*/ .zen-hero { position: relative; margin: 0 0 30px; /*============================================================================== // Elements //============================================================================*/ } .zen-hero__title { padding: 0; } /*============================================================================== // File: _card.scss // Package: Joomla / Mr Zen // Synopsis: Shared card component - SASS //============================================================================*/ .zen-card, .card { -webkit-box-shadow: 10px 10px 15px -15px rgba(0, 0, 0, 0.2); -moz-box-shadow: 10px 10px 15px -15px rgba(0, 0, 0, 0.2); box-shadow: 10px 10px 15px -15px rgba(0, 0, 0, 0.2); border-color: #EEE; background: #FFF; margin: 0; /*============================================================================== // Elements //============================================================================*/ /*============================================================================== // Modifiers //============================================================================*/ } .zen-card__image, .card-image { position: relative; padding: 0; margin: 0; } .zen-card__image--max-height { max-height: 200px; overflow: hidden; } .zen-card__title, .card-title { margin: 20px 0; } .zen-card__header, .card-header { background: var(--light); border-radius: 0; border: none; } .zen-card__body, .card-body { padding: 15px; } .zen-card__content { border-top: 1px solid #FBBE46; padding: 10px 0; } .zen-card__info, .card-info { border-top: 1px solid var(--light); padding: 15px; } .zen-card__footer, .card-footer { border-color: #EEE; background: var(--light); } .zen-card--exclusive { border: 1px solid #691934; } .zen-card--note { padding: 30px 40px; } .zen-card--full-height { /* Rollback Display */ display: block; display: grid; height: 100%; } /*------------------------------------------------------------------------------ // Extend menu element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _icon.scss // Package: Joomla / Mr Zen // Synopsis: Shared icon component - SASS //============================================================================*/ .zen-icon { padding: 0; /*============================================================================== // Modifiers //============================================================================*/ /*------------------------------------------------------------------------------ // Font Size Changes //----------------------------------------------------------------------------*/ } .zen-icon--default { color: #191919; } .zen-icon--helper { margin: 0 0 0 -1px; position: relative; font-size: 10px; color: #191919; top: -3px; } .zen-icon--text-xl { font-size: 22px; } .zen-icon--text-lg { font-size: 18px; } .zen-icon--text-md { font-size: 15px; } .zen-icon--text-sm { font-size: 13px; } .zen-icon--text-xs { font-size: 12px; } /*============================================================================== // File: _title.scss // Package: Joomla / Mr Zen // Synopsis: Shared title component - SASS //============================================================================*/ .zen-title { padding: 0; /*============================================================================== // Modifiers //============================================================================*/ } .zen-title--light, .zen-heading-light, .zen-heading-light .sppb-addon-title { color: #FFF; } .zen-title--dark, .zen-heading-dark, .zen-heading-dark .sppb-addon-title { color: #191919; } .zen-title--primary, .zen-heading-primary, .zen-heading-primary .sppb-addon-title { color: #691934; } .zen-title--secondary, .zen-heading-secondary, .zen-heading-secondary .sppb-addon-title { color: #FBBE46; } .zen-title--hr-primary { margin: 0 0 35px; } .zen-title--hr-primary:after { content: ""; display: block; position: absolute; border-bottom: 1px solid #691934; margin: 15px auto; width: 100px; right: 0; left: 0; } .zen-title--category { font-size: 18px; border-bottom: 1px solid #FBBE46; padding: 0 0 10px; margin: 0 0 20px; font-weight: bold; color: #FBBE46; } @media (min-width: 576px) { .zen-title--category { font-size: calc(18px + 3 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { .zen-title--category { font-size: 21px; } } .zen-title--booking { letter-spacing: normal; margin: 10px 0 5px; text-transform: none; font-style: italic; color: #191919; } /*------------------------------------------------------------------------------ // Extend title element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _gallery.scss // Package: Joomla / Mr Zen // Synopsis: Shared gallery component - SASS //============================================================================*/ .zen-gallery { border-bottom: 1px solid #191919; margin: 0 auto 40px; padding: 0 0 20px; max-width: 750px; /*============================================================================== // Modifiers //============================================================================*/ } .zen-gallery--large { margin: 30px auto; max-width: 100%; border: none; } .zen-gallery--fade-transition .carousel-item { transition-property: opacity; transition-duration: .9s; opacity: 0; } .zen-gallery--fade-transition .carousel-item-prev.carousel-item-right, .zen-gallery--fade-transition .carousel-item-next.carousel-item-left, .zen-gallery--fade-transition .carousel-item.active { opacity: 1; } .zen-gallery--fade-transition .active.carousel-item-right, .zen-gallery--fade-transition .active.carousel-item-left { opacity: 0; } .zen-gallery--fade-transition .active.carousel-item-left, .zen-gallery--fade-transition .active.carousel-item-prev, .zen-gallery--fade-transition .carousel-item.active, .zen-gallery--fade-transition .carousel-item-next, .zen-gallery--fade-transition .carousel-item-prev { transform: translate3d(0, 0, 0); transform: translateX(0); } /*============================================================================== // File: _select.scss // Package: Joomla / Mr Zen // Synopsis: Shared select component - SASS //============================================================================*/ .zen-select { margin: 0; /*============================================================================== // Elements //============================================================================*/ /*============================================================================== // Modifiers //============================================================================*/ } .zen-select__span, .selectlist span { max-width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; border-radius: 4px; line-height: 18px; border: 1px solid #CCC; background: #FFF; padding: 15px; display: inline-block; text-rendering: auto; font-size: inherit; position: relative; text-align: left; width: 100%; z-index: 1; } .zen-select__span:focus, .selectlist span:focus { border-color: #691934; box-shadow: none; outline: none; } .zen-select__span.focus, .selectlist span.focus { border-color: #691934; box-shadow: none; outline: none; } .zen-select--default, .selectlist { font-size: 14px; position: relative; } /*------------------------------------------------------------------------------ // Extend menu element & modifiers //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Default AngularJS select styling //----------------------------------------------------------------------------*/ .selectlist:hover { cursor: pointer; } .selectlist select { position: absolute; height: 50px; border: none; width: 100%; opacity: 0; z-index: 2; left: 0; top: 0; } .zen-styled-select { border-color: #CCC; background: #FFF; padding: 5px; opacity: 0; } /*============================================================================== // File: _button.scss // Package: Joomla / Mr Zen // Synopsis: Shared button component - SASS //============================================================================*/ .zen-btn, .btn, .btn.btn-primary, a.zen-btn:not([href]):not([tabindex]), .rsform-submit-button, .rsform-calendar-button, .rsform-calendar-button.btn.btn-secondary, .sppb-btn, .sppb-btn.sppb-btn-default, .sppb-btn.sppb-btn-primary, .sppb-sp-slider-button .sp-slider-btn-text { -webkit-transition: all 0.5s ease 0.1s; -moz-transition: all 0.5s ease 0.1s; -ms-transition: all 0.5s ease 0.1s; -o-transition: all 0.5s ease 0.1s; transition: all 0.5s ease 0.1s; letter-spacing: 0.05em; border-radius: 4px; padding: 10px 20px; text-transform: uppercase; z-index: 5; font-size: 15px; display: inline-block; background: #691934; position: relative; color: #FBBE46; font-weight: bold; border: none; /*============================================================================== // Modifiers //============================================================================*/ /*------------------------------------------------------------------------------ // Accordion Buttons //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Filter Panel //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Font Size Changes //----------------------------------------------------------------------------*/ /* Default btn text size medium */ } .zen-btn:active, .btn:active, a.zen-btn:active:not([href]):not([tabindex]), .rsform-submit-button:active, .rsform-calendar-button:active, .rsform-calendar-button.btn.btn-secondary:active, .sppb-btn:active, .sppb-sp-slider-button .sp-slider-btn-text:active, .zen-btn:hover, .btn:hover, a.zen-btn:hover:not([href]):not([tabindex]), .rsform-submit-button:hover, .rsform-calendar-button:hover, .rsform-calendar-button.btn.btn-secondary:hover, .sppb-btn:hover, .sppb-sp-slider-button .sp-slider-btn-text:hover, .zen-btn:focus, .btn:focus, a.zen-btn:focus:not([href]):not([tabindex]), .rsform-submit-button:focus, .rsform-calendar-button:focus, .rsform-calendar-button.btn.btn-secondary:focus, .sppb-btn:focus, .sppb-sp-slider-button .sp-slider-btn-text:focus { background: #FBBE46; text-decoration: none; color: #FFF; cursor: pointer; } .zen-btn:disabled, .btn:disabled, a.zen-btn:disabled:not([href]):not([tabindex]), .rsform-submit-button:disabled, .rsform-calendar-button:disabled, .rsform-calendar-button.btn.btn-secondary:disabled, .sppb-btn:disabled, .sppb-sp-slider-button .sp-slider-btn-text:disabled { cursor: not-allowed; background: var(--light); color: #191919; opacity: .6; } .zen-btn--invert, .btn.btn-secondary, .sppb-btn.sppb-btn-secondary { background: #FBBE46; } .zen-btn--invert:hover, .btn.btn-secondary:hover, .sppb-btn.sppb-btn-secondary:hover, .zen-btn--invert:focus, .btn.btn-secondary:focus, .sppb-btn.sppb-btn-secondary:focus { background: #691934; } .zen-btn--outlined, .btn.btn-success, a.zen-btn--outlined:not([href]):not([tabindex]), .sppb-btn.sppb-btn-success, .sppb-btn.sppb-btn-link, .zen-blog__link .read-more a { border: 3px solid #691934; background: #FFF; color: #691934; } .zen-btn--outlined:hover, .btn.btn-success:hover, a.zen-btn--outlined:hover:not([href]):not([tabindex]), .sppb-btn.sppb-btn-success:hover, .sppb-btn.sppb-btn-link:hover, .zen-blog__link .read-more a:hover, .zen-btn--outlined:focus, .btn.btn-success:focus, a.zen-btn--outlined:focus:not([href]):not([tabindex]), .sppb-btn.sppb-btn-success:focus, .sppb-btn.sppb-btn-link:focus, .zen-blog__link .read-more a:focus { border-color: #56172C; background: #FFF; color: #56172C; } .zen-btn--info, .sppb-btn.sppb-btn-info { background: var(--info); } .zen-btn--info:hover, .sppb-btn.sppb-btn-info:hover, .zen-btn--info:focus, .sppb-btn.sppb-btn-info:focus { background: #FBBE46; } .zen-btn--warning, .sppb-btn.sppb-btn-warning { background: var(--warning); } .zen-btn--warning:hover, .sppb-btn.sppb-btn-warning:hover, .zen-btn--warning:focus, .sppb-btn.sppb-btn-warning:focus { background: #FBBE46; } .zen-btn--danger, .sppb-btn.sppb-btn-danger { background: var(--danger); } .zen-btn--danger:hover, .sppb-btn.sppb-btn-danger:hover, .zen-btn--danger:focus, .sppb-btn.sppb-btn-danger:focus { background: #FBBE46; } .zen-btn--dark, .sppb-btn.sppb-btn-dark { background: var(--dark); } .zen-btn--dark:hover, .sppb-btn.sppb-btn-dark:hover, .zen-btn--dark:focus, .sppb-btn.sppb-btn-dark:focus { background: #FBBE46; } .zen-btn--icon-submit { line-height: 24px; font-size: 18px; background: #FFF; position: absolute; padding: 10px; color: #191919; right: 1px; top: 1px; } .zen-btn--icon-submit:hover, .zen-btn--icon-submit:focus { background: #FFF; color: #FBBE46; outline: none; } .zen-btn--full-size, .rsform-submit-button { width: 100%; } .zen-btn--extra-pad-lg { padding: 20px 30px; } .zen-btn--extra-pad-md { padding: 10px 20px; } .zen-btn--extra-pad-sm { padding: 10px 10px; } .zen-btn--scroll { border-radius: 4px; border: 1px solid #56172C; background: #691934; color: #FFF; font-size: 30px; display: none; width: 45px; padding: 0; } .zen-btn--scroll:hover, .zen-btn--scroll:focus { background: #FBBE46; color: #FFF; } .zen-btn--scroll.show-btn { display: inline-block; } .zen-btn--scroll :before { vertical-align: top; } .zen-btn--accordion-main, .zen-accordion__btn-main, a.zen-btn--accordion-main:not([href]):not([tabindex]) { border-top: 1px solid #191919; background: #FFF; text-align: left; border-radius: 0; padding: 10px; color: #191919; margin: 0; } .zen-btn--accordion-main:hover, .zen-accordion__btn-main:hover, a.zen-btn--accordion-main:hover:not([href]):not([tabindex]), .zen-btn--accordion-main:focus, .zen-accordion__btn-main:focus, a.zen-btn--accordion-main:focus:not([href]):not([tabindex]) { background: #FFF; color: #F9CA6E; outline: none; } .zen-btn--accordion-sub, .zen-accordion__btn-sub, a.zen-btn--accordion-sub:not([href]):not([tabindex]) { border-bottom: 1px solid #191919; background: #F9CA6E; text-align: left; border-radius: 0; padding: 10px; color: #191919; margin: 0; } .zen-btn--accordion-sub:hover, .zen-accordion__btn-sub:hover, a.zen-btn--accordion-sub:hover:not([href]):not([tabindex]), .zen-btn--accordion-sub:focus, .zen-accordion__btn-sub:focus, a.zen-btn--accordion-sub:focus:not([href]):not([tabindex]) { background: #CCC; outline: none; color: #191919; } .zen-btn--navigate { border-bottom: 1px solid #CCC; justify-content: space-between; -webkit-align-items: center; text-transform: uppercase; background: #FFF; display: -webkit-flex; align-items: center; font-weight: normal; text-align: unset; color: #FBBE46; display: flex; } .zen-btn--navigate:hover, .zen-btn--navigate:focus { background: #FFF; color: #F9CA6E; outline: none; } .zen-btn--text-xl { font-size: 22px; } .zen-btn--text-lg { font-size: 18px; } .zen-btn--text-sm { font-size: 13px; } .zen-btn--text-xs { font-size: 12px; } /*------------------------------------------------------------------------------ // Extend button element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _pagination.scss // Package: Joomla / Mr Zen // Synopsis: Shared pagination component - SASS //============================================================================*/ .zen-pagination { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-pagination__item, .pagination .page-item { color: #191919; } /*------------------------------------------------------------------------------ // Extend pagination element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _accordion.scss // Package: Joomla / Mr Zen // Synopsis: Shared accordion component - SASS //============================================================================*/ .zen-accordion { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-accordion__content { margin: 0; } /*============================================================================== // File: _facet.scss // Package: Joomla / Mr Zen // Synopsis: Shared facet component - SASS //============================================================================*/ .zen-facet, .facet { border-top: 1px solid #CCC; padding: 5px 0 0; position: relative; /*============================================================================== // Elements //============================================================================*/ } .zen-facet .btn-collapse, .facet .btn-collapse { padding: 0 5px; } .zen-facet + .facet, .facet + .facet { margin-top: 20px; } @media (max-width: 991.98px) { .zen-facet, .facet { font-size: 13px; } .zen-facet.keyword-range-facet, .keyword-range-facet.facet { border-top: none; } } .zen-facet__scroll-filters { display: block; } @media (max-width: 991.98px) { .zen-facet__scroll-filters { -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; background: #FFF; z-index: 30; position: fixed; overflow: unset; max-height: 95%; bottom: -1000px; height: 100%; width: 100%; opacity: 0; margin: 0; left: 0; } } @media (min-width: 992px) { .zen-facet__scroll-filters { display: none; } } .zen-facet__main-filters { display: block; overflow: auto; } @media (max-width: 991.98px) { .zen-facet__main-filters { -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; background: #FFF; z-index: 30; min-width: 220px; position: fixed; overflow: auto; max-width: 90%; left: -1000px; height: 100%; opacity: 0; margin: 0; top: 0; } } .zen-facet__main-filters .zen-facet__body { padding: 15px; } .zen-facet__main-filters .zen-search__refine-footer { position: sticky; } .zen-facet__body { -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); padding: 20px 20px 5px; background: #FFF; } @media (max-width: 991.98px) { .zen-facet__body { position: relative; overflow-y: auto; overflow-x: hidden; min-height: 83vh; display: none; padding: 0; } } .zen-facet__filter-panel { padding: 0; } .zen-facet__filter-panel-item { -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; position: absolute; padding: 5px 15px; left: 1000px; opacity: 0; } .zen-facet__filter-panel-item.active { -webkit-transform: translateX(-1000px); -moz-transform: translateX(-1000px); -ms-transform: translateX(-1000px); -o-transform: translateX(-1000px); transform: translateX(-1000px); position: relative; opacity: 1; } @media (min-width: 992px) { .zen-facet__item { max-height: 350px; overflow: auto; } } .zen-facet__clear { position: absolute; bottom: -15px; right: 0; } .zen-facet__clear:hover, .zen-facet__clear:focus { text-decoration: underline; cursor: pointer; } @media (max-width: 991.98px) { .zen-facet__clear { bottom: auto; right: 15px; top: -38px; } .zen-facet__clear:hover, .zen-facet__clear:focus { text-decoration: none; } } /*------------------------------------------------------------------------------ // Extend menu element & modifiers //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Mobile menu features //----------------------------------------------------------------------------*/ @media (max-width: 991.98px) { .zen-filters-open { max-height: 100vh; overflow: hidden; } .zen-filters-open .zen-search__refine-header, .zen-filters-open .zen-search__refine-footer, .zen-filters-open .zen-facet__body, .zen-filters-open .zen-overlay { display: block; opacity: 1; } .zen-filters-open .zen-facet__scroll-filters { -webkit-transform: translateY(-1000px); -moz-transform: translateY(-1000px); -ms-transform: translateY(-1000px); -o-transform: translateY(-1000px); transform: translateY(-1000px); padding: 0; opacity: 1; } .zen-filters-open .zen-facet__main-filters { -webkit-transform: translateX(1000px); -moz-transform: translateX(1000px); -ms-transform: translateX(1000px); -o-transform: translateX(1000px); transform: translateX(1000px); padding: 0; opacity: 1; } } /*============================================================================== // File: _input.scss // Package: Joomla / Mr Zen // Synopsis: Shared input component - SASS //============================================================================*/ .zen-input, .form-control, .rsform-select-box, .rsform-input-box, .sppb-form-group .sppb-form-control, .sppb-form-control { border: 1px solid #DDD; border-radius: 4px; font-size: 14px; background: #FFF; line-height: 1.5em; padding: 12px; height: auto; } .zen-input:focus, .form-control:focus, .rsform-select-box:focus, .rsform-input-box:focus, .sppb-form-control:focus { border-color: #691934; box-shadow: none; outline: none; color: #191919; } .zen-input::-webkit-input-placeholder, .form-control::-webkit-input-placeholder, .rsform-select-box::-webkit-input-placeholder, .rsform-input-box::-webkit-input-placeholder, .sppb-form-group .sppb-form-control::-webkit-input-placeholder, .sppb-form-control::-webkit-input-placeholder { color: #AAA; } .zen-input:-ms-input-placeholder, .form-control:-ms-input-placeholder, .rsform-select-box:-ms-input-placeholder, .rsform-input-box:-ms-input-placeholder, .sppb-form-control:-ms-input-placeholder { color: #AAA; } .zen-input::placeholder, .form-control::placeholder, .rsform-select-box::placeholder, .rsform-input-box::placeholder, .sppb-form-group .sppb-form-control::placeholder, .sppb-form-control::placeholder { color: #AAA; } /*------------------------------------------------------------------------------ // Extend input element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _form.scss // Package: Joomla / Mr Zen // Synopsis: Shared form component - SASS //============================================================================*/ .zen-form { position: relative; } /*============================================================================== // File: _text.scss // Package: Joomla / Mr Zen // Synopsis: Shared text component - SASS //============================================================================*/ .zen-text { padding: 0; /*============================================================================== // Modifiers //============================================================================*/ /*------------------------------------------------------------------------------ // Font Size Changes //----------------------------------------------------------------------------*/ } .zen-text--lead { font-size: 16px; line-height: 32px; } @media (min-width: 576px) { .zen-text--lead { font-size: calc(16px + 2 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { .zen-text--lead { font-size: 18px; } } .zen-text--default { color: #191919; } .zen-text--default-bold { line-height: 18px; font-weight: bold; color: #191919; } .zen-text--primary { color: #691934; } .zen-text--secondary { color: #FBBE46; } .zen-text--light { color: #FFF; } .zen-text--light-bold { color: #FFF; font-weight: bold; } .zen-text--large { font-size: 14px; line-height: 24px; } @media (min-width: 576px) { .zen-text--large { font-size: calc(14px + 2 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { .zen-text--large { font-size: 16px; } } .zen-text--large-bold { font-size: 14px; line-height: 19px; font-weight: bold; } @media (min-width: 576px) { .zen-text--large-bold { font-size: calc(14px + 2 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { .zen-text--large-bold { font-size: 16px; } } .zen-text--availability { font-size: 15px; vertical-align: middle; display: inline-block; color: #FBBE46; padding: 0; margin: 0; } .zen-text--availability.active { font-weight: bold; color: #691934; } .zen-text--text-df { font-size: 14px; } .zen-text--text-xl { font-size: 22px; } .zen-text--text-lg { font-size: 18px; } .zen-text--text-md { font-size: 15px; } .zen-text--text-sm { font-size: 13px; } .zen-text--text-xs { font-size: 12px; } /*------------------------------------------------------------------------------ // Extend text element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _list.scss // Package: Joomla / Mr Zen // Synopsis: Shared list component - SASS //============================================================================*/ .zen-list, .zen-card__content ul, .zen-blog .pagination ul, .zen-blog .pagenav { padding: 0; margin: 0; /*============================================================================== // Modifiers //============================================================================*/ /*------------------------------------------------------------------------------ // Standard menu list item //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Font Size Changes //----------------------------------------------------------------------------*/ } .zen-list--no-type { list-style-type: none; } .zen-list--default, .zen-card__content ul { list-style-type: disc; } .zen-list--default li, .zen-card__content ul li { line-height: 24px; margin: 0 0 0 15px; display: list-item; } .zen-list--inline li, .zen-blog .pagination ul li, .zen-blog .pagenav li { margin: 0 20px 0 0; display: inline-block; } .zen-list--facet { list-style-type: none; } .zen-list--facet li { background: url("../images/holidays/checkbox-sprite.png") no-repeat left top transparent; margin: 10px 0; } .zen-list--facet li:focus-within, .zen-list--facet li:focus { background-position: left -50px; outline: none; } .zen-list--facet li.active { background-position: left -97px; } .zen-list--facet li.active:focus-within, .zen-list--facet li.active:focus { background-position: left -147px; } .zen-list--filter-tags { list-style-type: none; text-align: center; overflow-x: hidden; max-height: 150px; overflow-y: auto; margin: 0; } .zen-list--filter-tags li { display: inline-block; margin: 0 5px 5px 0; } .zen-list--filter-item { list-style-type: none; margin: 0 -15px; } .zen-list--filter-item li { position: relative; padding: 15px; margin: 0; } .zen-list--filter-item li.active { background: #EEE; font-weight: bold; } .zen-list--menu { text-transform: none; } .zen-list--menu li { display: block; margin: 0; } .zen-list--menu-dropdown { text-transform: none; } .zen-list--menu-dropdown li { display: block; margin: 0; } .zen-list--menu-main, .zen-menu__main .zen-list--menu { justify-content: center; display: -webkit-flex; display: flex; height: 50px; } .zen-list--menu-main li, .zen-menu__main .zen-list--menu li { -webkit-align-items: center; display: -webkit-flex; align-items: center; margin: 0 1px 0 0; display: flex; } .zen-list--menu-sub, .zen-menu__main .zen-list--menu-dropdown { background: #111; color: #FFF; border-radius: 0; min-width: 200px; border: none; margin: 0; } .zen-list--menu-sub li, .zen-menu__main .zen-list--menu-dropdown li { border-bottom: 1px solid #CCC; display: -webkit-flex; display: flex; } .zen-list--text-xl { font-size: 22px; } .zen-list--text-lg { font-size: 18px; } .zen-list--text-md { font-size: 15px; } .zen-list--text-sm { font-size: 13px; } .zen-list--text-xs { font-size: 12px; } /*------------------------------------------------------------------------------ // Extend text element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _link.scss // Package: Joomla / Mr Zen // Synopsis: Shared link component - SASS //============================================================================*/ .zen-link, a:not([href]):not([tabindex]), .pagination .page-item .page-link, .zen-blog .pagination a { color: #691934; /*============================================================================== // Elements //============================================================================*/ /*============================================================================== // Modifiers //============================================================================*/ /*------------------------------------------------------------------------------ // Menu Link Items //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Font Size Changes //----------------------------------------------------------------------------*/ } .zen-link:hover, a:hover:not([href]):not([tabindex]), .pagination .page-item .page-link:hover, .zen-blog .pagination a:hover, .zen-link:focus, a:focus:not([href]):not([tabindex]), .pagination .page-item .page-link:focus, .zen-blog .pagination a:focus { text-decoration: none; color: #FBBE46; cursor: pointer; } .zen-link__icon { font-size: 40px; } .zen-link--invert { color: #FBBE46; } .zen-link--invert:hover, .zen-link--invert:focus { color: #691934; } .zen-link--default, a:not([href]):not([tabindex]), .zen-blog .pagination a { color: #191919; } .zen-link--default:hover, a:hover:not([href]):not([tabindex]), .zen-blog .pagination a:hover, .zen-link--default:focus, a:focus:not([href]):not([tabindex]), .zen-blog .pagination a:focus { color: #191919; } .zen-link--default-underline { color: #191919; } .zen-link--default-underline:hover, .zen-link--default-underline:focus { text-decoration: underline; color: #191919; } .zen-link--default-full-underline, a.zen-underline:not([href]):not([tabindex]) { text-decoration: underline; color: #191919; } .zen-link--default-full-underline:hover, a.zen-underline:hover:not([href]):not([tabindex]), .zen-link--default-full-underline:focus, a.zen-underline:focus:not([href]):not([tabindex]) { text-decoration: underline; color: #191919; } .zen-link--light { color: #FFF; } .zen-link--light:hover, .zen-link--light:focus { color: #FFF; } .zen-link--primary { color: #691934; } .zen-link--primary:hover, .zen-link--primary:focus { color: #56172C; } .zen-link--secondary { color: #FBBE46; } .zen-link--secondary:hover, .zen-link--secondary:focus { color: #F9CA6E; } .zen-link--image-zoom { overflow: hidden; } .zen-link--image-zoom img { -webkit-transition: transform 1s ease 0.1s; -moz-transition: transform 1s ease 0.1s; -ms-transition: transform 1s ease 0.1s; -o-transition: transform 1s ease 0.1s; transition: transform 1s ease 0.1s; } .zen-link--image-zoom:hover img { transform: scale(1.15); } .zen-link--facet { padding: 0 0 0 30px; line-height: 21px; display: block; } .zen-link--filter-tag { padding: 5px 35px 5px 20px; text-transform: uppercase; background: #691934; border-radius: 30px; position: relative; color: #FFF; text-align: center; font-weight: bold; font-size: 14px; display: block; } .zen-link--filter-tag:after { content: ""; display: block; position: absolute; margin: 0 0 0 5px; content: "\f00d"; right: 15px; top: 9px; } .zen-link--filter-item { justify-content: space-between; -webkit-align-items: center; text-transform: uppercase; display: -webkit-flex; display: flex; } .zen-link--facet-heading { text-transform: uppercase; font-size: 13px; margin: 10px 0 15px; font-weight: bold; display: block; padding: 0; } .zen-link--facet-heading .fa-caret-square-down { display: none; } .zen-link--facet-heading .fa-caret-square-up { display: inline-block; } .zen-link--facet-heading.collapsed .fa-caret-square-down { display: inline-block; } .zen-link--facet-heading.collapsed .fa-caret-square-up { display: none; } .zen-link--pagination-active, .pagination .page-item.active .page-link { border-color: #691934; background: #691934; color: #FFF; } .zen-link--menu-main, .zen-menu__main .nav-header, .zen-menu__main .nav-link { padding: 15px 30px; line-height: 21px; font-size: 15px; text-decoration: none; color: #FFF; } .zen-link--menu-main:hover, .zen-menu__main .nav-header:hover, .zen-menu__main .nav-link:hover, .zen-link--menu-main:focus, .zen-menu__main .nav-header:focus, .zen-menu__main .nav-link:focus { color: #FFF; background: var(--dark); } .zen-link--menu-sub { padding: 10px 15px; text-transform: capitalize; color: #FFF; } .zen-link--menu-sub:hover, .zen-link--menu-sub:focus { background: #191919; color: #CCC; } .zen-link--menu-mobile, .zen-menu__main .top-item a { padding: 10px; display: inline-block; color: #FBBE46; width: 100%; } .zen-link--menu-mobile:hover, .zen-menu__main .top-item a:hover, .zen-link--menu-mobile:focus, .zen-menu__main .top-item a:focus { color: #CCC; } .zen-link--text-xl { font-size: 22px; } .zen-link--text-lg { font-size: 18px; } .zen-link--text-md { font-size: 15px; } .zen-link--text-sm { font-size: 13px; } .zen-link--text-xs { font-size: 12px; } /*------------------------------------------------------------------------------ // Extend link element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _cta.scss // Package: Joomla / Mr Zen // Synopsis: Shared cta component - SASS //============================================================================*/ .zen-cta { position: relative; padding: 15px; color: #191919; /*============================================================================== // Elements //============================================================================*/ /*------------------------------------------------------------------------------ // Mr Zen SPPB Feature Button //----------------------------------------------------------------------------*/ /*============================================================================== // Modifiers //============================================================================*/ /*------------------------------------------------------------------------------ // Font Size Changes //----------------------------------------------------------------------------*/ } .zen-cta__text { color: #191919; } .zen-cta__featurebutton-image { margin: 0 15px 0 0; } .zen-cta__featurebutton-icon { font-size: 30px; margin: 0 15px 0 0; line-height: 1em; color: #691934; } @media (min-width: 100px) { .zen-cta__featurebutton-icon { font-size: calc(30px + 40 * (100vw - 100px) / 1500); } } @media (min-width: 1600px) { .zen-cta__featurebutton-icon { font-size: 70px; } } .zen-cta__featurebutton-title { font-size: 14px; font-family: "Source Sans Pro", Helvetica, Arial, sans-serif; text-transform: uppercase; color: #191919; } @media (min-width: 100px) { .zen-cta__featurebutton-title { font-size: calc(14px + 10 * (100vw - 100px) / 1500); } } @media (min-width: 1600px) { .zen-cta__featurebutton-title { font-size: 24px; } } .zen-cta--no-pad { padding: 0; } .zen-cta--btn { display: inline-block; text-align: center; } .zen-cta--btn:hover, .zen-cta--btn:focus { text-decoration: none; } .zen-cta--featurebox { -webkit-box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.2); border-top-right-radius: 4px; border-top-left-radius: 4px; border-bottom: 6px solid #691934; text-align: center; margin: 0 0 30px; padding: 30px; } .zen-cta--featurebutton { -webkit-align-items: center; justify-content: center; display: -webkit-flex; align-items: center; display: flex; -webkit-box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.2); border-top-right-radius: 4px; border-top-left-radius: 4px; border: 1px solid #DDD; border-bottom: 6px solid #691934; text-align: center; margin: 0 0 30px; padding: 10px; } .zen-cta--text-xl { font-size: 22px; } .zen-cta--text-lg { font-size: 18px; } .zen-cta--text-md { font-size: 15px; } .zen-cta--text-sm { font-size: 13px; } .zen-cta--text-xs { font-size: 12px; } /*------------------------------------------------------------------------------ // Extend cta element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _tag.scss // Package: Joomla / Mr Zen // Synopsis: Shared tag component - SASS //============================================================================*/ .zen-tag { padding: 5px 15px 5px 25px; text-transform: uppercase; font-size: 13px; color: #FFF; font-weight: bold; line-height: 21px; /*============================================================================== // Modifiers //============================================================================*/ } .zen-tag--default { background: var(--orange); } .zen-tag--primary { background: #691934; } .zen-tag--secondary { background: #FBBE46; } /*============================================================================== // File: _tab.scss // Package: Joomla / Mr Zen // Synopsis: Shared tab component - SASS //============================================================================*/ .zen-tab { border-bottom: 2px solid var(--dark); padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-tab__heading-item { display: inline-block; } @media (max-width: 767.98px) { .zen-tab__heading-item { width: 50%; } } @media (max-width: 575.98px) { .zen-tab__heading-item { width: 100%; } } .zen-tab__content-pane { padding: 40px 0; display: none; } .zen-tab__content-pane--active { display: block; } .zen-tab__content-pane--no-pad { padding: 0; } .zen-tab__link { font-size: 17px; padding: 8px 30px 8px 10px; text-transform: uppercase; position: relative; margin: 0 2px 0 0; display: block; color: #191919; } @media (min-width: 100px) { .zen-tab__link { font-size: calc(13px + 4 * (100vw - 100px) / 1500); } } @media (min-width: 1600px) { .zen-tab__link { font-size: 17px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .zen-tab__link { font-size: 15px; padding: 8px 26px 8px 7px; } } @media (min-width: 992px) and (max-width: 1199.98px) and (min-width: 992px) { .zen-tab__link { font-size: calc(12px + 3 * (100vw - 992px) / 208); } } @media (min-width: 992px) and (max-width: 1199.98px) and (min-width: 1200px) { .zen-tab__link { font-size: 15px; } } .zen-tab__link:hover, .zen-tab__link:focus { text-decoration: none; background: var(--light); color: #000; } .zen-tab__link:after { position: absolute; content: "\f078"; margin: 3px 0 0; right: 5px; top: 8px; } .zen-tab__link--active { background: #691934; color: #FFF; } .zen-tab__link--active:after { content: "\f077"; } .zen-tab__link--current { background: #691934; color: #FFF; } .zen-tab__link--current:after { content: "\f077"; } /*------------------------------------------------------------------------------ // Extend tab element & modifiers //----------------------------------------------------------------------------*/ /* Generic styles */ /*============================================================================== // File: _styles.scss // Package: Joomla / Mr Zen // Synopsis: Main styles for the website - SASS //============================================================================*/ /*------------------------------------------------------------------------------ // Layout Styles //----------------------------------------------------------------------------*/ html { overflow-x: hidden; } body { font-family: "Source Sans Pro", Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; color: #191919; } a { color: #691934; } a:hover, a:focus { color: #FBBE46; } p { margin-bottom: 15px; } iframe { border: none; } .zen-back-to-top { z-index: 20; position: fixed; bottom: 10px; right: 10px; } .zen-overlay { background: transparent; /* Rollback to clear BG */ background: rgba(0, 0, 0, 0.4); position: fixed; display: none; height: 100%; z-index: 25; width: 100%; opacity: 0; top: 0; } /*------------------------------------------------------------------------------ // Example Class Animation for Lazyload //----------------------------------------------------------------------------*/ .zen-lazy-load { display: block; height: 1px; width: 1px; } .in-viewport { -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; visibility: hidden; display: none; opacity: 0; height: 0; } .in-viewport.active-viewport { -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; visibility: visible; display: block; height: auto; opacity: 1; } /*------------------------------------------------------------------------------ // Zen Main Styles //----------------------------------------------------------------------------*/ .zen-flex-center { -webkit-align-items: center; justify-content: center; display: -webkit-flex; align-items: center; display: flex; } .zen-flex-end { -webkit-align-items: flex-end; justify-content: flex-end; display: -webkit-flex; align-items: flex-end; display: flex; } .zen-bg-default { background: #CCC; } .zen-bg-default-light { background: var(--light); } .zen-bg-default-dark { background: var(--dark); } .zen-valid-error { border-color: var(--pink); background-color: var(--light); color: var(--red); } .zen-error-text { font-size: 14px; color: var(--red); } .zen-white-bg { background: #FFF; } .zen-emphasized { font-style: normal; } .zen-no-shadow { box-shadow: none; } .zen-bold { font-weight: bold; } .zen-capitalize { text-transform: capitalize; } .zen-line-through { text-decoration: line-through; } .zen-hide { display: none; } .zen-inline-block { display: inline-block; } .zen-overflow-hidden { overflow: hidden; } .zen-no-transform { text-transform: none; } .zen-uppercase { text-transform: uppercase; } .zen-underline { text-decoration: underline; } .zen-nomargin { margin: 0; } .zen-row { margin: 0 -15px; } .zen-col { float: left; } .zen-width-full { width: 100%; } .zen-width-half { width: 50%; } .zen-nopad { padding: 0; } .zen-nopad-top { padding-top: 0; } .zen-nopad-right { padding-right: 0; } .zen-nopad-bottom { padding-bottom: 0; } .zen-nopad-left { padding-left: 0; } /*------------------------------------------------------------------------------ // Login Page Styling //----------------------------------------------------------------------------*/ .profile { padding: 15px 0; } .profile .profile-core { margin: 0 0 15px; } .profile-edit { padding: 15px 0; } /*------------------------------------------------------------------------------ // Error Page Styling //----------------------------------------------------------------------------*/ .error-page .jumbotron { border-top: 1px solid #FFF; background: #FBBE46; } /* Layout styles */ /*============================================================================== // File: _header.scss // Package: Joomla / Mr Zen // Synopsis: Main header styles for the website - SASS //============================================================================*/ .zen-header { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-header__logo { margin-right: auto; margin-left: auto; padding: 10px 0; } /*============================================================================== // File: _body.scss // Package: Joomla / Mr Zen // Synopsis: Main body styles for the website - SASS //============================================================================*/ .zen-body { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-body__main { padding: 0; } .zen-body__breadcrumbs { padding: 0; } @media (max-width: 991.98px) { .zen-body__breadcrumbs { border-top: 1px solid #EEE; } } /*============================================================================== // File: _blog.scss // Package: Joomla / Mr Zen // Synopsis: Main blog styles for the website - SASS //============================================================================*/ .zen-blog { padding: 0; } .zen-blog .zen-cta .pull-left { float: none !important; } .zen-blog .pagination-main { display: none; } .zen-blog__item { margin-bottom: 20px; } .zen-blog__item .article-info-term, .zen-blog__item .fa, .zen-blog__item .zen-tab__link:after, .zen-blog__item .zen-blog .pagenav li .icon-chevron-left, .zen-blog .pagenav li .zen-blog__item .icon-chevron-left, .zen-blog__item .zen-blog .pagenav li .icon-chevron-right, .zen-blog .pagenav li .zen-blog__item .icon-chevron-right, .zen-blog__item .carousel-control-next .carousel-control-next-icon, .carousel-control-next .zen-blog__item .carousel-control-next-icon, .zen-blog__item .carousel-control-next .carousel-control-prev-icon, .carousel-control-next .zen-blog__item .carousel-control-prev-icon, .zen-blog__item .carousel-control-prev .carousel-control-next-icon, .carousel-control-prev .zen-blog__item .carousel-control-next-icon, .zen-blog__item .carousel-control-prev .carousel-control-prev-icon, .carousel-control-prev .zen-blog__item .carousel-control-prev-icon { display: none; } .zen-blog__item .article-info, .zen-blog__item .published { margin: 0; } .zen-blog__item h2 { font-size: 22px; } .zen-blog__item a { color: #FFF; } .zen-blog__item img { width: 100%; } .zen-blog__link { border-top: 1px solid #CCC; margin-bottom: 40px; padding-top: 40px; } .zen-blog__link .article-info-term { display: none; } @media (max-width: 991.98px) { .zen-blog .pagination { margin-bottom: 20px; } .zen-blog .pagination ul li { display: none; } .zen-blog .pagination ul .pagination-start, .zen-blog .pagination ul .pagination-prev, .zen-blog .pagination ul .pagination-next, .zen-blog .pagination ul .pagination-end { display: inline-block; } } .zen-blog .pagenav li a span { background-color: transparent; display: inline-block; } .zen-blog .pagenav li .icon-chevron-left, .zen-blog .pagenav li .icon-chevron-right { font-size: 70px; vertical-align: middle; padding: 0; } .zen-blog .pagenav li .icon-chevron-left:before { content: "\f054"; } .zen-blog__article-body .article-info-term { display: none; } .zen-blog__article-body .item-image img { margin-bottom: 10px; max-width: 100%; width: 100%; } .zen-blog__article-image { overflow: hidden; } .zen-blog__article-image img { margin-bottom: 40px; width: 100%; } /*============================================================================== // File: _footer.scss // Package: Joomla / Mr Zen // Synopsis: Main footer styles for the website - SASS //============================================================================*/ .zen-footer { background: #111; margin: 25px 0 0; padding: 10px 0; /*============================================================================== // Elements //============================================================================*/ } .zen-footer__copyright { font-size: 12px; text-align: center; color: #FFF; padding: 15px; } /* Module styles */ /*============================================================================== // File: _favourites.scss // Package: Joomla / Mr Zen // Synopsis: Elastic Search favourites module styling - SASS //============================================================================*/ .zen-favourites { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-favourites__count { font-size: 12px; background: #FBBE46; padding: 1px 1px 0 0; position: absolute; border-radius: 50%; color: #FFF; font-weight: bold; margin: 0 0 0 2px; height: 20px; width: 20px; top: 30px; } .zen-favourites__toast li { display: none; } .zen-favourites__toast li.last { display: inline-block; } .zen-favourites__close { font-size: 22px; float: right; } .zen-favourites__list { -webkit-box-shadow: 0 5px 25px -5px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 5px 25px -5px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 25px -5px rgba(0, 0, 0, 0.2); z-index: 20; background: #FFF; position: absolute; min-width: 300px; display: none; width: 100%; } .zen-favourites__list.active { display: block; } .zen-favourites__separate { margin: 15px 0 20px; } .zen-favourites__separate .hr { border-top: 1px solid #CCC; margin: 0; } .zen-favourites__title { border-bottom: 3px solid #691934; text-transform: uppercase; padding: 15px; } .zen-favourites__items { max-height: 450px; overflow: auto; } .favourite-toggler { font-size: 22px; color: #691934; margin: 0; } .favourite-toggler:hover, .favourite-toggler:focus { color: #FBBE46; cursor: pointer; } /*============================================================================== // File: _local-favourites.scss // Package: Joomla / Mr Zen // Synopsis: Elastic Search local favourites module styling - SASS //============================================================================*/ .zen-local-favourites { display: inline-block; padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-local-favourites__button { display: block; padding: 0; } .zen-local-favourites__button .zen-wishlist-added { display: none; } .zen-local-favourites__button.favourited .zen-wishlist-add { display: none; } .zen-local-favourites__button.favourited .zen-wishlist-added { display: block; } .zen-local-favourites__button:hover, .zen-local-favourites__button:focus { cursor: pointer; } .zen-local-favourites__button:hover .zen-local-favourites__icon, .zen-local-favourites__button:focus .zen-local-favourites__icon { color: #FBBE46; } .zen-local-favourites__icon { font-size: 70px; color: #691934; margin: 0; } .zen-local-favourites__icon:hover, .zen-local-favourites__icon:focus { color: #FBBE46; cursor: pointer; } .zen-local-favourites__count { font-size: 12px; background: #FBBE46; padding: 1px 0 0 0; position: absolute; border-radius: 50%; color: #FFF; font-weight: bold; margin: 0 0 0 2px; height: 20px; width: 20px; top: 30px; } @media (max-width: 575.98px) { .zen-local-favourites__count { top: 15px; } } .zen-local-favourites__toast li { display: none; } .zen-local-favourites__toast li.last { display: inline-block; } .zen-local-favourites__close { font-size: 70px; float: right; } .zen-local-favourites__separate { margin: 15px 0 20px; } .zen-local-favourites__separate .hr { border-top: 1px solid #CCC; margin: 0; } .zen-local-favourites__title { border-bottom: 3px solid #691934; text-transform: uppercase; padding: 15px; } .zen-local-favourites__list { -webkit-box-shadow: 0 5px 25px -5px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 5px 25px -5px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 25px -5px rgba(0, 0, 0, 0.2); z-index: 20; background: #FFF; position: absolute; min-width: 300px; display: none; width: 100%; } @media (max-width: 575.98px) { .zen-local-favourites__list { left: 0; } } .zen-local-favourites__list.active { display: block; } .zen-local-favourites__items { max-height: 450px; overflow: auto; } /*============================================================================== // File: _quick-search.scss // Package: Joomla / Mr Zen // Synopsis: Quick Search module styling - SASS //============================================================================*/ .zen-quicksearch { margin: 0 auto; } .zen-quicksearch .loading-img { line-height: 60px; } /* Accommodation component styles */ /*============================================================================== // File: _main.scss // Package: Joomla / Mr Zen // Synopsis: Main accommodation template - SASS //============================================================================*/ .zen-accommodation { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-accommodation__content { margin: 0 0 50px; } .zen-accommodation__content-item { display: inline-block; margin: 15px 0; width: 100%; } .zen-accommodation__intro { line-height: 18px; } /*============================================================================== // File: _category.scss // Package: Joomla / Mr Zen // Synopsis: Main accommodation category template - SASS //============================================================================*/ .zen-accommodation-category { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-accommodation-category__content { margin: 0; } .zen-accommodation-category__intro { line-height: 18px; } /* Holiday component styles */ /*============================================================================== // File: _main.scss // Package: Joomla / Mr Zen // Synopsis: Main holiday template - SASS //============================================================================*/ .zen-holiday { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-holiday__content { margin: 0 0 50px; } .zen-holiday__content-item { display: inline-block; margin: 15px 0; width: 100%; } .zen-holiday__intro { line-height: 18px; } /*============================================================================== // File: _category.scss // Package: Joomla / Mr Zen // Synopsis: Main holiday category template - SASS //============================================================================*/ .zen-holiday-category { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-holiday-category__content { margin: 0; } .zen-holiday-category__intro { line-height: 18px; } /* Location component styles */ /*============================================================================== // File: _main.scss // Package: Joomla / Mr Zen // Synopsis: Main location template - SASS //============================================================================*/ .zen-location { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-location__content { margin: 0 0 50px; } .zen-location__content-item { display: inline-block; margin: 15px 0; width: 100%; } .zen-location__intro { line-height: 18px; } /* Search styles */ /*============================================================================== // File: _pagination.scss // Package: Joomla / Mr Zen // Synopsis: Search pagination styles - SASS //============================================================================*/ .pagination-main__inner { margin: 0; } .pagination-main__item { padding: 5px 10px; text-align: center; font-weight: bold; color: #191919; } .pagination-main__item span { padding: 10px 15px; background: var(--light); border-radius: 50%; color: #FBBE46; margin: 0 -10px; } .pagination-main__item:hover { text-decoration: underline; cursor: pointer; color: #191919; } .pagination-main__btn { background: #FFF; vertical-align: middle; text-align: center; margin: 0 5px 0 0; height: 30px; width: 30px; padding: 0; } .pagination-main__btn span { font-weight: bold; color: #691934; } .pagination-main__btn:hover { cursor: pointer; } .pagination-main__btn a { color: #FBBE46; } .pagination-main__btn a:hover { color: #FBBE46; } .pagination-main .pagination__first, .pagination-main .pagination__next, .pagination-main .pagination__last, .pagination-main .pagination__prev, .pagination-main .pagination__go { border: 2px solid #691934; background: #FFF; vertical-align: middle; margin: 0 10px 0 0; text-align: center; border-radius: 50%; font-size: 32px; height: 50px; width: 50px; padding: 0; } .pagination-main .pagination__first span, .pagination-main .pagination__next span, .pagination-main .pagination__last span, .pagination-main .pagination__prev span, .pagination-main .pagination__go span { font-weight: bold; color: #691934; } .pagination-main .pagination__first:hover, .pagination-main .pagination__next:hover, .pagination-main .pagination__last:hover, .pagination-main .pagination__prev:hover, .pagination-main .pagination__go:hover { border-color: #FBBE46; cursor: pointer; } .pagination-main .pagination__first a, .pagination-main .pagination__next a, .pagination-main .pagination__last a, .pagination-main .pagination__prev a, .pagination-main .pagination__go a { color: #691934; } .pagination-main .pagination__first a:hover, .pagination-main .pagination__next a:hover, .pagination-main .pagination__last a:hover, .pagination-main .pagination__prev a:hover, .pagination-main .pagination__go a:hover { color: #FBBE46; } /*------------------------------------------------------------------------------ // Extend pagination element & modifiers //----------------------------------------------------------------------------*/ /*============================================================================== // File: _facets.scss // Package: Joomla / Mr Zen // Synopsis: Search facet styles - SASS //============================================================================*/ @media (min-width: 992px) { .facets.collapse { display: block; } } .facet-body { max-height: 280px; list-style: none; overflow-y: auto; padding-left: 0; } .facet-body li { background: url("../images/holidays/checkbox-sprite.png") no-repeat left top transparent; margin-bottom: 10px; } .facet-body li.active { background: url("../images/holidays/checkbox-sprite.png") no-repeat left bottom transparent; } .facet-body li a { padding: 0 0 0 20px; display: block; } .facet-body li a:hover { text-decoration: none; cursor: pointer; } @media (max-width: 991.98px) { .facet-body li.active { background: url("../images/holidays/checkbox-sprite.png") no-repeat left -20px transparent; } } @media (max-width: 991.98px) { .facets-body { margin: 10px 0 0; min-height: 85vh; padding: 0 10px; } } /*============================================================================== // File: _main.scss // Package: Joomla / Mr Zen // Synopsis: Main search page styling - SASS //============================================================================*/ .zen-search { padding: 0; /*============================================================================== // Elements //============================================================================*/ } .zen-search__content { padding: 50px 0; } @media (max-width: 991.98px) { .zen-search__content { padding: 0 0 15px; } } .zen-search__hit-loading { margin: 0; } @media (max-width: 991.98px) { .zen-search__hit-loading { display: inline-block; margin: 0 0 0 10px; height: 20px; } .zen-search__hit-loading .spinner-border { vertical-align: baseline; height: 1rem; width: 1rem; } } .zen-search__hit-count { margin: 15px 0; display: block; } @media (max-width: 991.98px) { .zen-search__hit-count { margin: 15px 0 20px; height: 50px; } } .zen-search__intro { padding: 0; } .zen-search__tag { position: absolute; top: 20px; } .zen-search__title, .zen-search__title-label { font-size: 16px; line-height: 22px; text-transform: uppercase; letter-spacing: 1.15px; font-weight: bold; margin: 15px 0; display: block; color: #191919; } @media (min-width: 576px) { .zen-search__title, .zen-search__title-label { font-size: calc(16px + 2 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { .zen-search__title, .zen-search__title-label { font-size: 18px; } } .zen-search__title-label { display: inline-block; margin: 0; } @media (max-width: 991.98px) { .zen-search__title-label { display: block; } } .zen-search__sub-title { text-transform: uppercase; font-size: 12px; padding: 15px 10px 0; vertical-align: top; font-weight: bold; } @media (max-width: 767.98px) { .zen-search__item { max-width: 500px; margin: 0 auto; } } .zen-search__refine-header { -webkit-box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.05); -moz-box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.05); box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.05); border-bottom: 2px solid var(--light); position: -webkit-sticky; background: #FFF; z-index: 30; padding: 15px 10px; position: sticky; width: 100%; left: 0; top: 0; } .zen-search__refine-header img { max-width: 20px; } .zen-search__refine-filters { border-top: 1px solid #CCC; padding: 15px 15px 0; margin: 15px -15px 0; } .zen-search__refine-panel { border-bottom: 1px solid #CCC; padding: 15px; display: none; } .zen-search__refine-footer { -webkit-box-shadow: 0 -10px 10px -5px rgba(0, 0, 0, 0.05); -moz-box-shadow: 0 -10px 10px -5px rgba(0, 0, 0, 0.05); box-shadow: 0 -10px 10px -5px rgba(0, 0, 0, 0.05); background: #FFF; padding: 15px 10px 5px; z-index: 30; text-align: center; position: fixed; height: 70px; width: 100%; bottom: 0; left: 0; } .zen-search__refine-footer a { max-width: 300px; } /*------------------------------------------------------------------------------ // Extend menu element & modifiers //----------------------------------------------------------------------------*/ /* External override styles */ /*============================================================================== // File: _slick-slider.scss // Package: Joomla / Mr Zen // Synopsis: Slick Slider styles & overrides - SASS //============================================================================*/ .slick-slider { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -ms-touch-action: pan-y; -moz-user-select: none; box-sizing: border-box; -ms-user-select: none; position: relative; user-select: none; display: block; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0 50px; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { display: -webkit-flex; position: relative; margin-right: auto; margin-left: auto; display: flex; left: 0; top: 0; } .slick-track:before, .slick-track:after { display: table; content: ""; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { -webkit-align-items: center; justify-content: center; align-items: center; min-height: 1px; display: none; height: 100%; float: left; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { border: 1px solid #FFF; max-width: 100%; display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: -webkit-flex; display: flex; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { border: 1px solid transparent; display: block; height: auto; } .slick-arrow.slick-hidden { display: none; } /*------------------------------------------------------------------------------ // Slick Slider Overrides //----------------------------------------------------------------------------*/ .slick-slider { margin: 20px 0 0; } .slick-slide { position: relative; } .slick-arrow { position: absolute; line-height: 1em; background: none; font-size: 75px; color: #691934; border: none; opacity: .6; padding: 0; z-index: 1; top: 35%; } @media (max-width: 575.98px) { .slick-arrow { font-size: 55px; } } .slick-arrow:hover, .slick-arrow:focus { cursor: pointer; outline: 0; opacity: 1; } .slick-arrow.slick-prev { left: 0; } .slick-arrow.slick-next { right: 0; } /*============================================================================== // File: _datepicker.scss // Package: Joomla / Mr Zen // Synopsis: Date Picker overrides - SASS //============================================================================*/ /*------------------------------------------------------------------------------ * Stylesheet for the Date Range Picker, for use with Bootstrap 3.x * * Copyright 2013 Dan Grossman ( http://www.dangrossman.info ) * Licensed under the Apache License v2.0 * http://www.apache.org/licenses/LICENSE-2.0 * * Built for http://www.improvely.com /-----------------------------------------------------------------------------*/ .daterangepicker .btn-sm { width: 100%; } .daterangepicker.dropdown-menu { max-width: none; z-index: 3000; padding: 18px; } .daterangepicker.opensleft .calendar, .daterangepicker.opensleft .ranges { float: left; margin: 4px; } .daterangepicker.openscenter .calendar, .daterangepicker.opensright .calendar, .daterangepicker.openscenter .ranges, .daterangepicker.opensright .ranges { float: right; margin: 4px; } .daterangepicker.single .calendar, .daterangepicker.single .ranges { float: none; } .daterangepicker .ranges { margin-right: 18px !important; text-align: left; width: 165px; } .daterangepicker .ranges .range_inputs > div { margin: 0 0 25px; float: left; } .daterangepicker .ranges .range_inputs > div:nth-child(2) { padding-left: 11px; } .daterangepicker .calendar { max-width: 270px; display: none; } .daterangepicker.show-calendar .calendar { display: block; } .daterangepicker .calendar.single .calendar-date { border: none; } .daterangepicker .calendar th, .daterangepicker .calendar td { white-space: nowrap; text-align: center; min-width: 32px; } .daterangepicker .daterangepicker_start_input label, .daterangepicker .daterangepicker_end_input label { text-shadow: #FFF 1px 1px 0; text-transform: uppercase; font-weight: normal; margin-bottom: 2px; line-height: 20px; font-size: 11px; display: block; height: 20px; color: #333; width: 74px; } .daterangepicker .ranges input { font-size: 11px; } .daterangepicker .ranges .input-mini { vertical-align: middle; border: 1px solid #CCC; border-radius: 4px; margin: 0 0 10px 0; line-height: 30px; font-size: 11px; padding: 0 6px; display: block; height: 30px; width: 74px; color: #555; } .daterangepicker .ranges ul { list-style: none; padding: 0; margin: 0; } .daterangepicker .ranges li { -webkit-border-radius: 5px; border: 1px solid #691934; -moz-border-radius: 5px; background: #691934; margin-bottom: 8px; border-radius: 5px; padding: 3px 12px; font-size: 13px; cursor: pointer; color: #691934; } .daterangepicker .ranges li.active { border: 1px solid #691934; background: #691934; color: #FFF; } .daterangepicker .ranges li:hover { border: 1px solid #FBBE46; background: #FBBE46; color: #FFF; } .daterangepicker .ranges li.zen-filter-next { color: #FFF; } .daterangepicker .calendar-date { background: #FFF; border: 1px solid #DDD; border-radius: 4px; padding: 4px; } .daterangepicker .calendar-time { margin: 8px auto 0 auto; text-align: center; line-height: 30px; } .daterangepicker { -webkit-border-radius: 4px; -moz-border-radius: 4px; background: #FFF; border-radius: 4px; position: absolute; margin-top: 1px; padding: 4px; top: 100px; left: 20px; } .daterangepicker.opensleft:before { border-bottom-color: rgba(0, 0, 0, 0.2); border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 7px solid #CCC; display: inline-block; position: absolute; content: ""; right: 9px; top: -7px; } .daterangepicker.opensleft:after { border-bottom: 6px solid #FFF; border-right: 6px solid transparent; border-left: 6px solid transparent; display: inline-block; position: absolute; right: 10px; content: ""; top: -6px; } .daterangepicker.openscenter:before { border-bottom-color: rgba(0, 0, 0, 0.2); border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 7px solid #CCC; display: inline-block; margin-right: auto; position: absolute; margin-left: auto; content: ""; top: -7px; right: 0; width: 0; left: 0; } .daterangepicker.openscenter:after { border-bottom: 6px solid #FFF; border-right: 6px solid transparent; border-left: 6px solid transparent; display: inline-block; margin-right: auto; position: absolute; margin-left: auto; content: ""; top: -6px; right: 0; width: 0; left: 0; } .daterangepicker.opensright:before { border-bottom-color: rgba(0, 0, 0, 0.2); border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 7px solid #CCC; display: inline-block; position: absolute; content: ""; top: -7px; left: 9px; } .daterangepicker.opensright:after { border-bottom: 6px solid #FFF; border-right: 6px solid transparent; border-left: 6px solid transparent; display: inline-block; position: absolute; content: ""; left: 10px; top: -6px; } .daterangepicker table { width: 100%; margin: 0; } .daterangepicker td, .daterangepicker th { -webkit-border-radius: 4px; -moz-border-radius: 4px; white-space: nowrap; border-radius: 4px; text-align: center; cursor: pointer; height: 20px; width: 20px; } .daterangepicker td.off { color: #999; } .daterangepicker option.disabled, .daterangepicker td.disabled { color: #999; } .daterangepicker td.available:hover, .daterangepicker th.available:hover { background: #691934; color: #FFF; } .daterangepicker td.in-range { -webkit-border-radius: 0; -moz-border-radius: 0; background: #FEF5E3; border-radius: 0; } .daterangepicker td.start-date { -webkit-border-radius: 4px 0 0 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; } .daterangepicker td.end-date { -webkit-border-radius: 0 4px 4px 0; -moz-border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0; } .daterangepicker td.start-date.end-date { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .daterangepicker td.active:hover, .daterangepicker td.active { background-color: #691934; border-color: #691934; color: #FFF; } .daterangepicker td.week, .daterangepicker th.week { font-size: 80%; color: #CCC; } .daterangepicker select.monthselect, .daterangepicker select.yearselect { cursor: default; font-size: 12px; padding: 1px; height: auto; margin: 0; } .daterangepicker select.monthselect { margin-right: 2%; width: 56%; } .daterangepicker select.yearselect { width: 40%; } .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.hourselect, .daterangepicker select.ampmselect { margin-bottom: 0; width: 50px; } .daterangepicker_start_input { float: left; } .daterangepicker_end_input { padding-left: 11px; float: left; } .daterangepicker th.month { width: auto; } @media (max-width: 767.98px) { .daterangepicker.show-calendar .calendar { display: none; } } .daterangepicker .applyBtn { color: #691934; } /*============================================================================== // File: _bootstrap.scss // Package: Joomla / Mr Zen // Synopsis: Bootstrap style overrides - SASS //============================================================================*/ /*------------------------------------------------------------------------------ // Example changing the standard spacing to 20px // Setting all items to maximum width up to 1440px //----------------------------------------------------------------------------*/ .container { padding-right: 20px; padding-left: 20px; } @media (min-width: 576px) { .container { max-width: 760px; } } @media (min-width: 768px) { .container { max-width: 900px; } } @media (min-width: 992px) { .container { max-width: 1110px; } } @media (min-width: 1200px) { .container { max-width: 1440px; } } .row { margin-right: -10px; margin-left: -10px; } .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto { padding-right: 10px; padding-left: 10px; } /*------------------------------------------------------------------------------ // Navbar overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .navbar .container-fluid { display: block; } /*------------------------------------------------------------------------------ // Menu overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ /* Allow menu on hover - remove if click is used */ .zen-menu .dropdown:hover > .dropdown-menu { display: block; } /* Sub menu position */ .zen-menu .dropdown-menu .dropdown .dropdown-menu { left: 100%; margin: 0; top: 0%; } .dropdown-item.active, .dropdown-item:active { background: #691934; } /*------------------------------------------------------------------------------ // Card feature overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Background overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .bg-primary { background: #691934 !important; } .bg-secondary { background: #FBBE46 !important; } /*------------------------------------------------------------------------------ // Button module and class overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Carousel overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .carousel-control-next, .carousel-control-prev { opacity: 1; } .carousel-control-next .carousel-control-next-icon, .carousel-control-next .carousel-control-prev-icon, .carousel-control-prev .carousel-control-next-icon, .carousel-control-prev .carousel-control-prev-icon { -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; background: rgba(255, 255, 255, 0.15); border: 1px solid #FFF; border-radius: 50%; color: #FFF; line-height: 60px; font-size: 30px; height: 60px; width: 60px; } .carousel-control-next:hover .carousel-control-next-icon, .carousel-control-next:hover .carousel-control-prev-icon, .carousel-control-next:focus .carousel-control-next-icon, .carousel-control-next:focus .carousel-control-prev-icon, .carousel-control-prev:hover .carousel-control-next-icon, .carousel-control-prev:hover .carousel-control-prev-icon, .carousel-control-prev:focus .carousel-control-next-icon, .carousel-control-prev:focus .carousel-control-prev-icon { background: rgba(0, 0, 0, 0.6); } .carousel-control-next-icon:before { margin: 0 0 0 4px; content: "\f105"; } .carousel-control-prev-icon:before { margin: 0 4px 0 0; content: "\f104"; } /*------------------------------------------------------------------------------ // Pagination overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Breadcrumbs - Mr Zen Customisations //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // List Group overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .list-group-item { border-color: #DDD; } .list-group-item.active { background-color: #691934; border-color: #691934; } /*------------------------------------------------------------------------------ // Toast overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .toast { z-index: 20; position: fixed; left: 15px; top: 0; } .toast .toast-body { padding: 5px; } /*------------------------------------------------------------------------------ // Form overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Table overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .table { color: #191919; } .table thead th { border-bottom: 1px solid #CCC; color: #691934; } .table-responsive td, .table-responsive th { min-width: 140px; } .table-bordered { border: 1px solid #CCC; } .table-bordered td, .table-bordered th { border: 1px solid #CCC; } .table-striped tbody tr:nth-of-type(odd) { background: var(--light); } /*------------------------------------------------------------------------------ // Modal overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ /*============================================================================== // File: _rsforms.scss // Package: Joomla / Mr Zen // Synopsis: RSForms styling & overrides - SASS //============================================================================*/ .rsform-block-inline { display: inline-block; vertical-align: top; } .rsform-block-title h3 { color: #191919; margin: 0; } .rsform-select-box, .rsform-input-box { margin: 0 20px 0 0; } .rsform-calendar-button { border-bottom-left-radius: 0; border: 1px solid #691934; border-top-left-radius: 0; } .rsform-calendar-button.btn.btn-secondary { border-bottom-left-radius: 0; border: 1px solid #691934; border-top-left-radius: 0; } /*============================================================================== // File: _sppb.scss // Package: Joomla / Mr Zen // Synopsis: SP Page Builder overrides - SASS //============================================================================*/ .sppb-panel-modern > .sppb-panel-heading { background: #691934; color: #FFF; } .sppb-alert-primary { background: #691934; color: #FFF; } .sppb-progress-bar { background: #691934; } .animated-text-words-wrapper { color: #691934; } .alert-warning { color: var(--warning); } .sppb-blocknumber-number { background-color: #691934 !important; } .sppb-pricing-price { color: #691934 !important; } .sppb-addon-flickr .sppb-flickr-gallery li a:before { background: #FBBE46; } .sppb-addon-flickr .sppb-flickr-gallery li a:hover:before { background: transparent; } .image-effect-zoom-in { cursor: pointer; } .pricelist-left-image img { max-width: 100%; } /*------------------------------------------------------------------------------ // Fix SP Page Builder Breakpoint Issue //----------------------------------------------------------------------------*/ @media screen and (max-width: 768px) and (min-width: 768px) { .sppb-addon-image-content .sppb-col-sm-6 { -ms-flex: 0 0 100%; max-width: 100%; flex: 0 0 100%; } } /*------------------------------------------------------------------------------ // Fix for adding a new row - SPPB front-end edit mode //----------------------------------------------------------------------------*/ .sppb-row-bottom-new-row .open .sp-pagebuilder-dropdown-row-layouts { display: block; } /*------------------------------------------------------------------------------ // Zen SP Page Builder Overrides // // Example changing the standard spacing to 20px // Setting all items to maximum width up to 1440px //----------------------------------------------------------------------------*/ .sppb-row-container { padding-right: 20px; padding-left: 20px; } @media (min-width: 576px) { .sppb-row-container { max-width: 760px; width: 100%; } } @media (min-width: 768px) { .sppb-row-container { max-width: 900px; width: 100%; } } @media (min-width: 992px) { .sppb-row-container { max-width: 1100px; width: 100%; } } @media (min-width: 1200px) { .sppb-row-container { max-width: 1440px; width: 100%; } } .sp-pagebuilder-row, .sppb-row { margin-right: -10px; margin-left: -10px; } .sp-pagebuilder-row.sppb-no-gutter, .sppb-row.sppb-no-gutter { margin-right: 0; margin-left: 0; } .sppb-col, .sppb-col-auto, .sppb-col-lg, .sppb-col-lg-1, .sppb-col-lg-10, .sppb-col-lg-11, .sppb-col-lg-12, .sppb-col-lg-2, .sppb-col-lg-3, .sppb-col-lg-4, .sppb-col-lg-5, .sppb-col-lg-6, .sppb-col-lg-7, .sppb-col-lg-8, .sppb-col-lg-9, .sppb-col-lg-auto, .sppb-col-md, .sppb-col-md-1, .sppb-col-md-10, .sppb-col-md-11, .sppb-col-md-12, .sppb-col-md-2, .sppb-col-md-3, .sppb-col-md-4, .sppb-col-md-5, .sppb-col-md-6, .sppb-col-md-7, .sppb-col-md-8, .sppb-col-md-9, .sppb-col-md-auto, .sppb-col-sm, .sppb-col-sm-1, .sppb-col-sm-10, .sppb-col-sm-11, .sppb-col-sm-12, .sppb-col-sm-2, .sppb-col-sm-3, .sppb-col-sm-4, .sppb-col-sm-5, .sppb-col-sm-6, .sppb-col-sm-7, .sppb-col-sm-8, .sppb-col-sm-9, .sppb-col-sm-auto, .sppb-col-xl, .sppb-col-xl-1, .sppb-col-xl-10, .sppb-col-xl-11, .sppb-col-xl-12, .sppb-col-xl-2, .sppb-col-xl-3, .sppb-col-xl-4, .sppb-col-xl-5, .sppb-col-xl-6, .sppb-col-xl-7, .sppb-col-xl-8, .sppb-col-xl-9, .sppb-col-xl-auto, .sppb-col-xs-1, .sppb-col-xs-10, .sppb-col-xs-11, .sppb-col-xs-12, .sppb-col-xs-2, .sppb-col-xs-3, .sppb-col-xs-4, .sppb-col-xs-5, .sppb-col-xs-6, .sppb-col-xs-7, .sppb-col-xs-8, .sppb-col-xs-9 { padding-right: 10px; padding-left: 10px; } /*------------------------------------------------------------------------------ // Button Module and Class Overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Slideshow Module - Mr Zen Customisations //----------------------------------------------------------------------------*/ @media (max-width: 991.98px) { .sp-slider .sp-dots, .sp-slider .sp-nav-control { height: 40px; } } .sppb-addon-sp-slider .sp-item .sp-background:after { background: rgba(0, 0, 0, 0.1); } div.sp-slider .sp-nav-control .nav-control { background: rgba(255, 255, 255, 0.15); } div[data-arrow-content=icon_only].sp-slider .sp-nav-control .nav-control { font-size: 30px; height: 60px; width: 60px; } div[data-arrow-content=icon_only] .sp-nav-control .nav-control i { line-height: 58px; } .sp-slider .sp-nav-control .nav-control.next-control i { margin: 0 -2px 0 0; right: 5px; } .sp-slider .sp-nav-control .nav-control.prev-control i { margin: 0 0 0 -2px; left: 5px; } .sp-dots ul li:before { content: none; } /*------------------------------------------------------------------------------ // Carousel Pro Overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .sppb-carousel-pro-text h2, .sppb-carousel-text h2 { text-shadow: 1px 1px 10px #000; } .sppb-carousel-pro-text .sppb-carousel-pro-content, .sppb-carousel-text .sppb-carousel-pro-content { text-shadow: 1px 1px 5px #000; } /*------------------------------------------------------------------------------ // Image Carousel Overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .sppb-carousel-extended-dots ul li span { background: #691934 !important; } .sppb-carousel-extended-nav-control .nav-control { border-color: #FBBE46 !important; background: #FBBE46 !important; height: auto !important; width: auto !important; } /*------------------------------------------------------------------------------ // Title Style Overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .sppb-sp-slider-title { text-shadow: 1px 1px 10px #000; margin: 0 0 15px; } @media (max-width: 767.98px) { .sppb-sp-slider-title { padding: 0 15%; } } .sppb-sp-slider-text { text-shadow: 1px 1px 5px #000; } @media (max-width: 767.98px) { .sppb-sp-slider-text { padding: 0 15%; } } h1.sppb-sp-slider-title { font-size: 38px; } @media (min-width: 576px) { h1.sppb-sp-slider-title { font-size: calc(38px + 10 * (100vw - 576px) / 1024); } } @media (min-width: 1600px) { h1.sppb-sp-slider-title { font-size: 48px; } } .zen-capitalize .sppb-addon-title { text-transform: capitalize; } .sppb-addon-header { position: relative; } /*------------------------------------------------------------------------------ // Contact Form Overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------ // Table Overrides - Mr Zen Customisations //----------------------------------------------------------------------------*/ .sppb-addon-table-main th { background: #111 !important; } .sppb-addon-table-main tbody tr { background: var(--light); } /*------------------------------------------------------------------------------ // Remove SPPB 'z-index' CSS Class '.zen-remove-zindex' //----------------------------------------------------------------------------*/ #sp-page-builder .page-content .sppb-section.zen-remove-zindex, .mod-sppagebuilder .sppb-section.zen-remove-zindex, #sp-page-builder .sppb-section.zen-remove-zindex { z-index: auto; } .zen-remove-zindex .sppb-column-addons, .zen-remove-zindex .sppb-column { z-index: auto; } /* User agent override styles */ /*============================================================================== // File: _user-agent.scss // Package: Joomla / Mr Zen // Synopsis: User agent targeting - SASS //============================================================================*/ /*------------------------------------------------------------------------------ // IE //----------------------------------------------------------------------------*/ /*============================================================================== // ISSUE - https://github.com/twbs/bootstrap/issues/25242 //============================================================================*/ .ie .img-fluid { width: 100%; }