/*
Theme Name: Iggo 18
Description: HTML5, CSS Grid, CSS Variables and Flex. Mobile first CSS. No outside framework.
Author: Kimmo Kovalainen
Author URL: http://www.kipex.tv
Version: 1.0 (02/2018 for WP 4.9)
Tags: html5, css grid, css variables, flex, responsive, rule of 4, mobile first
*/
/* Custom font
---------------------------------------------------------------------------------------------------------------------- */
/**
* @license
* MyFonts Webfont Build ID 3576809, 2018-05-08T08:48:27-0400
*
* The fonts listed in this notice are subject to the End User License
* Agreement(s) entered into by the website owner. All other parties are
* explicitly restricted from using the Licensed Webfonts(s).
*
* You may obtain a valid license at the URLs below.
*
* Webfont: SonnyGothic-Bold by W Foundry
* URL: https://www.myfonts.com/fonts/without-foundry/sonny-gothic/bold/
*
* Webfont: SonnyGothic-Book by W Foundry
* URL: https://www.myfonts.com/fonts/without-foundry/sonny-gothic/book/
*
* Webfont: SonnyGothic-BookItalic by W Foundry
* URL: https://www.myfonts.com/fonts/without-foundry/sonny-gothic/book-italic/
*
* Webfont: SonnyGothic-Black by W Foundry
* URL: https://www.myfonts.com/fonts/without-foundry/sonny-gothic/black/
*
* License: https://www.myfonts.com/viewlicense?type=web&buildid=3576809
* Licensed pageviews: 10,000
* Webfonts copyright: Copyright © 2017 by Salvador Rodríguez. All rights reserved.
*
* © 2018 MyFonts Inc
*/
@import url("//hello.myfonts.net/count/3693e9");
@font-face {font-family: 'SonnyGothic';src: url('webfonts/3693E9_4_0.eot');src: url('webfonts/3693E9_4_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3693E9_4_0.woff2') format('woff2'),url('webfonts/3693E9_4_0.woff') format('woff'),url('webfonts/3693E9_4_0.ttf') format('truetype'),url('webfonts/3693E9_4_0.svg#wf') format('svg'); font-weight: 400; font-style: normal; }
@font-face {font-family: 'SonnyGothic';src: url('webfonts/3693E9_5_0.eot');src: url('webfonts/3693E9_5_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3693E9_5_0.woff2') format('woff2'),url('webfonts/3693E9_5_0.woff') format('woff'),url('webfonts/3693E9_5_0.ttf') format('truetype'),url('webfonts/3693E9_5_0.svg#wf') format('svg'); font-weight: 400; font-style: italic; }
@font-face {font-family: 'SonnyGothic';src: url('webfonts/3693E9_3_0.eot');src: url('webfonts/3693E9_3_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3693E9_3_0.woff2') format('woff2'),url('webfonts/3693E9_3_0.woff') format('woff'),url('webfonts/3693E9_3_0.ttf') format('truetype'),url('webfonts/3693E9_3_0.svg#wf') format('svg'); font-weight: 700; font-style: normal; }
@font-face {font-family: 'SonnyGothic';src: url('webfonts/3693E9_0_0.eot');src: url('webfonts/3693E9_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3693E9_0_0.woff2') format('woff2'),url('webfonts/3693E9_0_0.woff') format('woff'),url('webfonts/3693E9_0_0.ttf') format('truetype'),url('webfonts/3693E9_0_0.svg#wf') format('svg'); font-weight: 900; font-style: normal; }
/* CSS Variables
---------------------------------------------------------------------------------------------------------------------- */
body {
/* Primary Color (Light -100 or -200, Dark +100 or +200) */
--primary-light: #FED72E;
--primary: #FDCF08;
--primary-dark: #E4BA02;
--primary-text-color: var(--white-primary);
--primary-title-color: var(--white-primary);
--primary-link-color: #ffad42;
/* Secondary Color (Light -100 or -200, Dark +100 or +200) */
--secondary-light: #ffb300;
--secondary: #ffa000;
--secondary-dark: #ff8f00;
--secondary-text-color: var(--black);
--secondary-title-color: var(--black);
--secondary-link-color: var(--black);
--linkcolor: #AA0F0F;
--linkcolordark: #ffa000;
--errorcolor: #D32F2F;
/* Header */
--headerbg: #FFF;
/* Black - Primary 87%, Secondary 54%, Disabled 38% */
--black: rgba(0,0,0,1);
--black-primary: rgba(0,0,0,0.87);
--black-secondary: rgba(0,0,0,0.54);
--black-disabled: rgba(0,0,0,0.38);
/* White - Primary 100%, Secondary 70%, Disabled 50% */
--white-primary: rgba(255,255,255,1);
--white-secondary: rgba(255,255,255,0.7);
--white-disabled: rgba(255,255,255,0.5);
/* Fonts */
--font-title: "SonnyGothic";
--font-nav: "SonnyGothic";
--font-para: "SonnyGothic";
/* Fontsizes */
--text-large: 16px;
--text-normal: 14px;
--text-small: 12px;
--text-tiny: 10px;
--h1: 15px;
--h2: 22px;
--h3: 15px;
/* Element heights */
--header-height: 40px;
/* Gap between elements */
--gridgap: 20px;
--cardgap: 16px;
--gallerygap: 4px;
--sidebargap: 10px 16px;
--sectiongap: 48px 0;
--ifb-block-gap: 32px 16px;
--ifb-block-gap-full: 32px 0;
/* Transitions */
--transition-fast: 0.16s cubic-bezier(0.4, 0.0, 0.2, 1);
--transition-slow: 0.4s cubic-bezier(0.4, 0.0, 0.2, 1);
/* Borders */
--border-grey: 1px solid rgba(0,0,0,0.12);
--border-radius: 2px;
/* Shadows */
--elevation-2dp: 0 1px 4px rgba(0,0,0,0.14), 0 3px 3px rgba(0,0,0,0.12);
--elevation-4dp: 0 2px 4px rgba(0,0,0,0.14), 0 4px 5px rgba(0,0,0,0.12);
/* Buttons */
--button-normal-padding: 0 32px;
--button-normal-lineheight: 44px;
--button-small-padding: 0 16px;
--button-small-lineheight: 26px;
}
@media (min-width: 768px) {
body {
/* Element heights */
--header-height: 80px;
/* Gap between elements */
--sectiongap: 64px 0;
--ifb-block-gap: 48px 0;
--gridgap: 32px;
/* Fontsizes */
--h1: 16px;
--h2: 24px;
--h3: 16px;
/* Buttons */
--button-small-padding: 0 24px;
--button-small-lineheight: 32px;
}
}
@media (min-width: 992px) {
body {
/* Fontsizes */
--h1: 18px;
--h2: 32px;
--h3: 18px;
}
}
@media (min-width: 1100px) {
body {
/* Fontsizes */
--text-large: 17px;
--text-normal: 15px;
--text-small: 13px;
--text-tiny: 11px;
--h1: 20px;
--h2: 40px;
--h3: 20px;
}
}
@media (min-width: 1200px) {
body {
/* Fontsizes */
--h1: 22px;
--h2: 48px;
--h3: 22px;
}
}
/* Global
---------------------------------------------------------------------------------------------------------------------- */
html { overflow-y: scroll; box-sizing: border-box; line-height: 1.5; touch-action: manipulation; height: 100%; }
body { font-family: var(--font-para), Helvetica, Arial, sans-serif; font-size: var(--text-normal); display: flex; flex-direction: column; min-height: 100vh; height: 100%; padding: 0; word-wrap: break-word; background: #FDCF08; }
*,
*::before,
*::after { box-sizing: inherit; }
header,
section,
footer { width: 100%; }
img { max-width: 100%; height: auto; display: block; }
div, ul, li { margin: 0; padding: 0; }
select { -webkit-appearance: none; }
body:not(.user-is-tabbing) a:focus,
body:not(.user-is-tabbing) button:focus,
body:not(.user-is-tabbing) input:focus,
body:not(.user-is-tabbing) select:focus,
body:not(.user-is-tabbing) textarea:focus { outline: none; } /* Only remove focus outline for users who aren't using keyboard tab */
input[type="text"], input[type="email"], input[type="search"], input[type="password"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } /* No iPad input shadows */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
/* Ripple effect for buttons */
.ripple { position: relative; overflow: hidden; transform: translate3d(0,0,0); }
.ripple:after { content: ""; display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; pointer-events: none; background-image: radial-gradient(circle,#000 10%,transparent 10.01%); background-repeat: no-repeat; background-position: 50%; transform: scale(10,10); opacity: 0; transition: transform .5s, opacity 1s; }
.ripple:active:after { transform: scale(0,0); opacity: .2; transition: 0s; }
.container { margin: 0 auto; padding: 0 16px; width: 100%; }
@media (min-width: 768px) {
body { padding: 0 80px; }
.container { max-width: 1100px; padding: 0 32px; }
}
/* Typography
---------------------------------------------------------------------------------------------------------------------- */
h1 { font-size: var(--h1); color: var(--black-primary); font-family: var(--font-title); font-weight: 900; margin: 0 0 20px 0; line-height: 1.2; text-align: center; }
h2 { font-size: var(--h2); color: var(--black-primary); font-family: var(--font-title); font-weight: 900; margin: 0 0 12px 0; line-height: 1.1; text-transform: uppercase; }
h3 { font-size: var(--h3); color: var(--black-primary); font-family: var(--font-title); font-weight: 700; margin: 0 0 4px 0; line-height: 1.2; }
h2.light { color: #FFF; }
.home h2 { margin: 0; }
h2.frontev { font-size: 19 px; margin-bottom: 14px;}
@media (min-width: 768px) { h2.frontev { font-size: 20px; margin-bottom: 8px;} }
@media (min-width: 992px) { h2.frontev { font-size: 26px; margin-bottom: 10px;} }
@media (min-width: 1100px) { h2.frontev { font-size: 30px; margin-bottom: 14px;} }
@media (min-width: 1200px) { h2.frontev { font-size: 32px; margin-bottom: 18px;} }
a { color: var(--linkcolor); font-weight: bold; text-decoration: none; }
a:hover,
a:focus { color: var(--linkcolor); text-decoration: underline; }
a > svg { margin: 0 4px 0 1px; }
p { margin: 0 0 16px; }
hr { border: var(--border-grey); margin-top: var(--gridgap); }
blockquote { font-style: italic; margin: 0 0 16px; padding: 16px 24px; background: #F0F0F0; }
/* Grunge
---------------------------------------------------------------------------------------------------------------------- */
.grunge { display: none; }
@media (min-width: 768px) {
@keyframes mist {
0% { opacity: 0.4; transform: rotate(0deg); }
10% { opacity: 0.3; transform: rotate(-1deg); transform: scale(1.01); }
25% { opacity: 0.1; transform: rotate(1deg); }
50% { opacity: 0.3; transform: rotate(0deg); }
75% { opacity: 0.1; transform: rotate(1deg); transform: scale(1.01); }
90% { opacity: 0.3; transform: rotate(1deg); }
100% { opacity: 0.4; transform: rotate(0deg); }
}
.grunge { display: block; position: fixed; z-index: -1; background: url("images/bg-mist.png") repeat; border-radius: 200px; }
.grunge1 { bottom: 3%; left: 31%; width: 48%; height: 43%; animation: mist 7s cubic-bezier(.45,.05,.55,.95) 0s infinite alternate; }
.grunge2 { bottom: 39%; right: 2%; width: 40%; height: 47%; animation: mist 10s cubic-bezier(.45,.05,.55,.95) 0s infinite alternate-reverse; }
.grunge3 { bottom: 47%; left: 10%; width: 39%; height: 37%; animation: mist 8s cubic-bezier(.45,.05,.55,.95) 0s infinite alternate; }
.grunge0 { display: block; position: fixed; z-index: -1; background: url("images/bg-mist-static.png") repeat; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.15; border-radius: 10%; }
}
/* Header
---------------------------------------------------------------------------------------------------------------------- */
header { height: var(--header-height); background: var(--headerbg); position: fixed; top: 0; left: 0; transition: var(--transition-fast); z-index: 2; }
.langmenu { position: absolute; top: 13px; right: 12px; }
.langmenu > a { margin: 0 4px; font-weight: 900; color: var(--black-primary); }
.langmenu > a.active { color: #FDCF08; }
.langmenu > a:hover,
.langmenu > a:focus { text-decoration: none; }
.side-overlays { background: #FFF; }
.side-overlays a { color: var(--black-primary); font-weight: 900; font-size: 15px; height: 52px; line-height: 56px; display: inline-block; padding: 0 16px; }
.leftnavlink { position: absolute; bottom: 0; left: 0; text-align: center; width: calc(50% - 25px); opacity: 1; }
.rightnavlink { position: absolute; bottom: 0; right: 0; text-align: center; width: calc(50% - 25px); opacity: 1; }
.leftnavlink a:hover,
.leftnavlink a:focus,
.rightnavlink a:hover,
.rightnavlink a:focus { text-decoration: none; }
@media (min-width: 768px) {
.langmenu { top: 33px; right: 82px; }
.side-overlays a { font-size: 16px; line-height: 80px; height: 80px; padding: 0 16px; }
}
@media (min-width: 992px) {
.side-overlays a { font-size: 18px; }
}
#overlay-left,
#overlay-right { display: none; }
#overlay-bottom { position: fixed; bottom: 0; left: 0; height: 52px; width: 100%; z-index: 200; transition: 0.25s ease-in-out 0s; }
.noscroll #overlay-bottom { background: #FDCF08; }
@media (min-width: 768px) {
#overlay-left { display: block; position: fixed; top: 0; left: 0; height: 100%; width: 80px; z-index: 2; }
#overlay-left a {
transform: rotate(-90deg);
display: none;
position: fixed;
left: -10px;
top: calc(50% - 20px);
width: 100px;
text-align: center;
height: 40px;
padding: 9px 0px;
}
#overlay-right { display: block; position: fixed; top: 0; right: 0; height: 100%; width: 80px; z-index: 2; }
#overlay-right a {
transform: rotate(90deg);
display: none;
position: fixed;
right: -10px;
top: calc(50% - 20px);
width: 100px;
text-align: center;
height: 40px;
padding: 9px 0px;
}
#overlay-bottom { height: 80px; }
}
/* IGGO Burger Navigation Offcanvas Menu
---------------------------------------------------------------------------------------------------------------------- */
nav { position: relative; font-size: 14px; }
nav .logo { width: 90px; height: 112px; position: fixed; top: 7px; left: calc(50% - 45px); z-index: 135; }
header .container { z-index: 950; padding-left: 0; }
html.noscroll { overflow: hidden !important; overflow-y: scroll !important; height: 100%; }
body.noscroll { overflow: hidden !important; height: 100%; position: relative; }
@media (min-width: 768px) {
nav .logo { width: 110px; height: 138px; top: 40px; left: calc(50% - 55px); }
}
/* Navbar Toggle */
.navbar-toggler { background: none; width: 50px; height: 52px; border: none; transition: all 0.05s linear 0s; outline: none; z-index: 110; position: relative; border-radius: 0; padding: 5px 14px; cursor: pointer; position: absolute; bottom: 0; left: calc(50% - 25px); }
.navbar-toggler:active { background: rgba(0,0,0,0.15); }
.icon-bar { background: #212121; float: left; width: 100%; height: 2px; margin: 2px 0; transition: all 0.2s ease-in-out 0s; }
.top-bar { transform: rotate(45deg); transform-origin: 10% 10%; }
.middle-bar { opacity: 0; }
.bottom-bar { transform: rotate(-45deg); transform-origin: 10% 90%; }
.collapsed .top-bar { transform: rotate(0); }
.collapsed .middle-bar { opacity: 1; }
.collapsed .bottom-bar { transform: rotate(0); }
.nav-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); opacity: 1; transition: all 0.2s ease-in-out 0s; z-index: 100; visibility: visible; }
.nav-overlay.disabled { opacity: 0; visibility: hidden; background: rgba(0,0,0,0.0); }
/* Navbar */
nav#mobile { display: block; }
nav#mobile li { list-style: none; }
.yellow-overlay {
background: #FDCF08;
top: 40px;
left: 0;
width: 100%;
height: 96px;
position: fixed;
z-index: 110;
transition: 0.25s ease-in-out 0s;
}
#mobile .yellow-overlay { width: 100%; top: 100%; left: 0; height: 136px; }
.noscroll #mobile .yellow-overlay { top: 0; }
#mainmenu-collapse {
position: fixed;
overflow-y: auto;
display: block !important;
top: 0;
width: 100%;
padding-top: 136px;
height: calc(100% - 52px);
background: #FDCF08;
transform: translate3d(0, 0, 0);
transition: height 0.01s, transform 0.25s ease-in-out 0s !important;
z-index: 105;
text-align: center;
}
#mainmenu-collapse.disabled { transform: translate3d(0, 100%, 0); }
nav .nav .text { float: right; width: calc(100% - 0.75rem); color: #FFF; }
.navbar-nav { display: inline-block; width: 100%; }
.navbar-nav > li { clear: both; float: left; width: 100%; }
.navbar-nav > li > a { float: left; width: 100%; padding: 2px 16px; transition: all 0.05s linear 0s; color: var(--black-primary); text-transform: uppercase; font-weight: 900; font-size: 20px; }
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus { text-decoration: none; color: #FFF; }
.navbar-nav > li > a:active { background: rgba(255,255,255,0.15); color: #FFF; }
.some { margin: 18px 0 20px; }
.some a { display: inline-block; color: #000; margin: 0 12px; }
.some svg { height: 30px !important; width: auto !important; }
#mainmenu-collapse > p { color: #FFF; font-weight: bold; font-size: 13px; text-shadow: 0px 1px 0px rgba(0,0,0,0.15); }
#mainmenu-collapse > p a { color: #FFF; }
@media (min-width: 768px) {
.navbar-toggler { height: 80px; }
#mainmenu-collapse { transform: translate3d(-80px, 0, 0); padding-top: 196px; height: calc(100% - 80px); }
#mainmenu-collapse.disabled { transform: translate3d(-80px, 100%, 0); }
.yellow-overlay { left: 80px; top: 80px; width: calc(100% - 160px); height: 112px; }
#mobile .yellow-overlay { height: 190px; }
.navbar-nav > li > a { font-size: 24px; }
}
@media (min-width: 992px) {
.navbar-nav > li > a { font-size: 26px; }
}
/* IGGO Slider
---------------------------------------------------------------------------------------------------------------------- */
section#iggo-slider { background: #FDCF08; }
#iggo-slider.low { }
#iggo-slider.medium { }
#iggo-slider.full { position: relative; flex: 1 0 auto; }
/* LOW - max and min heights */
#iggo-slider.low,
#iggo-slider.low .single-slide img { max-height: 250px; min-height: 125px; }
/* Slider max and min heights */
#iggo-slider.medium,
#iggo-slider.medium .single-slide img { max-height: 500px; min-height: 250px; }
#iggo-slider, #slider-slides, #iggo-slider .single-slide, #iggo-slider .slick-list, #iggo-slider .slick-track { height: 100%; }
/* Arrow down */
#slider-arrow { z-index: 10; position: absolute; bottom: 60px; width: 32px; left: calc(50% - 16px); display: inline-block; font-size: 32px; color: rgba(255,255,255,0.3); text-align: center; }
#slider-arrow:hover { color: rgba(255,255,255,0.65); }
#slider-arrow:focus,
#slider-arrow:active { color: rgba(255,255,255,0.3); }
@keyframes bounce-down {
0% { opacity: 0; transform: translateY(-10px); color: rgba(255,255,255,0.3); }
50% { opacity: 1; transform: translateY(0); color: rgba(255,255,255,0.75); }
100% { opacity: 0; transform: translateY(5px); color: rgba(255,255,255,0.3); }
}
#slider-arrow svg { animation: bounce-down 2s infinite; }
/* Prevent slide stacking issues on pageload */
#slider-slides { overflow: hidden; }
.slick-initialized,
.single-slide:first-child { display: block; }
/* Other */
.single-slide { outline: none; position: relative; background: #FDCF08; }
.single-slide img { z-index: 0; width: 100%; object-fit: cover; height: 100%; filter: grayscale(1); mix-blend-mode: multiply; }
.single-slide .color-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background: rgba(0,0,0,0.5); }
.single-slide .container { z-index: 10; height: 100%; position: relative; display: flex; align-items: center; }
.single-slide .container.left { justify-content: flex-start; text-align: left; }
.single-slide .container.center { justify-content: center; text-align: center; }
.single-slide .container.right { justify-content: flex-end; text-align: right; }
.slideinfo { width: 100%; text-align: center; display: grid; grid-gap: 16px; padding: 0 16px; }
.slideinfo h2 { color: var(--white-primary); margin: 0; }
.slideinfo p { display: none; margin: 0; }
.slideinfo a.readmore { background: var(--primary); color: var(--white-primary); padding: 0 16px; line-height: 36px; transition: var(--transition-slow); font-size: var(--text-normal); border-radius: var(--border-radius); text-transform: uppercase; margin: 0 auto 4px; }
.slideinfo a.readmore:hover { background: var(--primary-dark); box-shadow: var(--elevation-2dp); }
/* Larger than mobile */
@media (min-width: 768px) {
.slideinfo { text-align: inherit; padding: 0; }
.slideinfo p { display: block; color: var(--white-primary); }
.slideinfo a.readmore { padding: 0 20px; line-height: 44px; }
#iggo-slider.low,
#iggo-slider.low .single-slide img { min-height: auto; }
#iggo-slider.medium,
#iggo-slider.medium .single-slide img { min-height: auto; }
.container.left .slideinfo a.readmore { margin: 0 auto 4px 0; }
.container.center .slideinfo a.readmore { margin: 0 auto 4px auto; }
.container.right .slideinfo a.readmore { margin: 0 0 4px auto; }
.container.left .slideinfo p ~ a.readmore,
.container.center .slideinfo p ~ a.readmore,
.container.right .slideinfo p ~ a.readmore { margin-top: 8px; }
.single-slide .color-overlay.left { background: linear-gradient(to right, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.65) 10%, rgba(0,0,0,0) 66%,rgba(0,0,0,0) 100%); }
.single-slide .color-overlay.center { background: radial-gradient(ellipse at center, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.65) 10%,rgba(0,0,0,0) 66%,rgba(0,0,0,0) 100%); }
.single-slide .color-overlay.right { background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 34%,rgba(0,0,0,0.65) 90%,rgba(0,0,0,0.65) 100%); }
}
@media (min-width: 1100px) {
.slideinfo { max-width: 50%; }
.slideinfo h2 { font-size: var(--h1); }
.slideinfo p { font-size: var(--text-large); }
}
@media (min-height: 800px) {
#iggo-slider.medium,
#iggo-slider.medium .single-slide img { max-height: 625px; }
#iggo-slider.low,
#iggo-slider.low .single-slide img { max-height: 312px; }
}
@media (min-height: 900px) {
#iggo-slider.medium,
#iggo-slider.medium .single-slide img { max-height: 750px; }
#iggo-slider.low,
#iggo-slider.low .single-slide img { max-height: 375px; }
}
@media (min-width: 1920px) {
#iggo-slider.medium,
#iggo-slider.medium .single-slide img { max-height: 750px; }
#iggo-slider.low,
#iggo-slider.low .single-slide img { max-height: 375px; }
.slideinfo { max-width: 50%; }
}
/* SLICK Sliders
---------------------------------------------------------------------------------------------------------------------- */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; display: block; overflow: hidden; }
.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 { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; }
.slick-track:before,
.slick-track:after { display: table; content: ''; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide { float: right; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }
/* Prev & Next */
.slick-prev-wrap,
.slick-next-wrap { display: none !important; }
/* Dots */
.slick-dots { position: absolute; bottom: 8px; left: 0; margin: 0; width: 100%; text-align: center; z-index: 20; }
.slick-dots li { display: inline-block; overflow: hidden; margin: 0 1px; }
.slick-dots li:first-child:last-child { display: none; }
.slick-dots li button { width: 19px; height: 19px; border-radius: 100%; padding: 0; background: none; border: 1px solid rgba(255,255,255,0); text-indent: -100px; cursor: pointer; position: relative; }
.slick-dots li button::after { content: ""; background: var(--white-primary); border-radius: 100%; height: 5px; width: 5px; position: absolute; top: 6px; left: 6px; }
.slick-dots li.slick-active > button { border: 1px solid rgba(255,255,255,0.5); }
@media (min-width: 768px) {
.slick-dots { bottom: 12px; }
}
@media (min-width: 1300px) {
/* Prev & Next */
.slick-prev-wrap,
.slick-next-wrap { display: block !important; position: absolute; width: 52px; height: 60px; top: calc(50% - 30px); opacity: 0.5; z-index: 3; cursor: pointer; transition: var(--transition-fast); }
.slick-prev-wrap { left: 16px; }
.slick-next-wrap { right: 16px; }
.slick-icon-prev,
.slick-icon-next { position: absolute; top: 0; width: 40px; height: 60px; fill: var(--white-primary); transition: var(--transition-fast); }
.slick-icon-prev { left: 0; }
.slick-icon-next { right: 0; }
.slick-prev-wrap:hover,
.slick-next-wrap:hover { opacity: 0.75; }
.slick-prev-wrap:hover .slick-icon-prev { transform: translate3d(-8px, 0, 0); }
.slick-next-wrap:hover .slick-icon-next { transform: translate3d(8px, 0, 0); }
}
/* Content
---------------------------------------------------------------------------------------------------------------------- */
section.expand { flex: 1 0 auto; background: url("images/bg-mist-static-mobile.png") repeat; background-size: 110%; }
.home #content { padding: 0; display: flex; }
.home #content > .container { display: flex; justify-content: center; }
@media (min-width: 768px) {
section.expand { display: flex; background: none; }
}
/* Elements */
section p,
section li { font-size: var(--text-normal); }
section ul,
section ol { margin: 0 0 16px; padding: 0; }
section ul li,
section ol li { margin-left: 15px; margin-bottom: 8px; }
/* Wysiwyg images */
section .alignleft { display: inline; float: left; margin: 4px 24px 20px 0; max-width: 50%; height: auto; }
section .alignright { display: inline; float: right; margin: 4px 0 20px 24px; max-width: 50%; height: auto; }
section .aligncenter { clear: both; display: block; margin: 4px auto 12px; }
.wp-caption { background: #f1f1f1; text-align: center; margin-bottom: 0; padding: 0; }
.wp-caption img { padding: 8px 8px 4px 8px; }
.wp-caption-text { margin: 1px 10px 8px; color: var(--black-secondary); font-size: var(--text-small); font-style: italic; }
/* IGGO File Type Links
---------------------------------------------------------------------------------------------------------------------- */
a.iconlink { padding-left: 23px; background: url("images/iggo-filesprite.png") no-repeat 0px 0px; height: 18px; line-height: 18px; display: inline-block; margin: 4px 0; }
a[href$=".zip"] { background-position: 0px -500px; }
a[href$=".rar"] { background-position: 0px -700px; }
a[href$=".doc"],
a[href$=".docx"] { background-position: 0px -200px; }
a[href$=".xls"],
a[href$=".xlsx"] { background-position: 0px -400px; }
a[href$=".ppt"] { background-position: 0px -600px; }
a[href$=".jpg"],
a[href$=".png"],
a[href$=".gif"],
a[href$=".eps"] { background-position: 0px -100px; }
a[href$=".mov"],
a[href$=".avi"],
a[href$=".mkv"] { background-position: 0px -300px; }
a[href$=".pdf"] { background-position: 0px 0px; }
a[href$=".apk"] { background-position: 0px -1000px; }
a[href$=".ics"] { background-position: 0px -1100px; }
a[href$=".mp3"],
a[href$=".flac"] { background-position: 0px -800px; }
/* Colorbox
---------------------------------------------------------------------------------------------------------------------- */
#colorbox, #cboxOverlay, #cboxWrapper { position: absolute; top: 0; left: 0; z-index: 9999; }
#cboxMiddleLeft, #cboxBottomLeft { clear: left; }
#cboxLoadingOverlay, #cboxLoadingGraphic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.cboxPhoto { float: left; margin: auto; border: 0; display: block; max-width: none; }
#colorbox, #cboxContent, #cboxLoadedContent { box-sizing: content-box; }
.cboxIframe { width: 100%; height: 100%; display: block; border: 0; padding: 0; margin: 0; background: #FFF; }
#cboxError { padding: 50px; border: 1px solid #ccc; }
#colorbox { outline: 0; overflow: visible; }
#cboxWrapper { max-width: none; overflow: visible; }
#cboxLoadedContent { overflow: auto; -webkit-overflow-scrolling: touch; border: none; background: none; }
#cboxOverlay { position: fixed; width: 100%; height: 100%; background: var(--black-primary); overflow: hidden; }
#cboxContent { position: relative; background: none; margin-top: 0; margin-bottom: 40px; }
#cboxLoadingGraphic { background: url("images/ajax-loader.png") no-repeat center center; }
#cboxCurrent { color: #777; bottom: calc(100% + 17px); position: absolute; top: auto; font-size: 14px; line-height: 1.3; width: 60px; right: 54px; text-align: right; }
#cboxTitle { color: var(--white-primary); position: absolute; top: calc(100% + 9px); bottom: auto; left: 0; font-size: 14px; line-height: 1.3; font-style: italic; width: calc(100% - 16px); text-align: center; padding: 0 8px; }
#cboxPrevious,
#cboxNext,
#cboxClose,
#cboxSlideshow { position: absolute; width: 52px; height: 52px; background: none; opacity: 0.5; transition: var(--transition-fast); -webkit-tap-highlight-color: rgba(255, 255, 255, 0); border: 0; padding: 0; cursor: pointer; }
#cboxPrevious { top: calc(50% - 26px); left: -48px; }
#cboxNext { top: calc(50% - 26px); right: -48px; }
#cboxClose { top: -52px; right: 0px; }
#cboxSlideshow { top: -52px; left: 0px; }
.cbox-icon-close,
.cbox-icon-prev,
.cbox-icon-next,
.cbox-icon-play,
.cbox-icon-stop { position: absolute; top: 6px; left: 6px; width: 40px; height: 40px; fill: var(--white-primary); transition: var(--transition-fast); }
/* Avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active { outline: 0; }
@media (min-width: 768px) {
#cboxClose:hover,
#cboxPrevious:hover,
#cboxNext:hover,
#cboxSlideshow:hover { opacity: 0.75; }
#cboxPrevious:hover .cbox-icon-prev { transform: translate3d(-8px, 0, 0); }
#cboxNext:hover .cbox-icon-next { transform: translate3d(8px, 0, 0); }
}
/* Article listings and category view
---------------------------------------------------------------------------------------------------------------------- */
.post-catlist { display: block; width: 100%; margin: -6px 0 0.25rem; }
.post-catlist li { list-style: none; }
.post-catlist li a { font-size: 0.938rem; color: #999; }
/* Article list */
.category .post-categories { margin: 0.875rem -0.188rem 0; width: 100%; text-align: center; }
.category .post-categories > li { margin: 0px 1px; list-style: none; display: inline-block; }
.category .post-categories > li > a { float: left; background: #EEE; border: 1px solid #DDD; padding: 3px 7px 3px; color: var(--black); border-radius: 4px; font-size: 0.75rem; }
.category .post-categories > li > a:hover,
.category .post-categories > li > a:focus { text-decoration: none; background: #E5E5E5; }
/* Formidable
---------------------------------------------------------------------------------------------------------------------- */
.frm_forms { line-height: 1.15; }
.frm_forms legend { display: none; }
.frm_hidden,
.frm_pos_none { display: none !important; }
/* Form Grid */
.frm_forms .frm_fields_container { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 32px; padding: 0; margin: 0; border: none; }
.form-field { grid-column: 1/3; }
@media (min-width: 768px) {
.frm_first.frm_half { grid-column: 1/2; }
.frm_half { grid-column: 2/3; }
}
/* Containers */
.form-field { position: relative; }
textarea { padding: 0; }
/* Error Notification */
.frm_error_style { border-radius: var(--border-radius); background: var(--errorcolor); padding: var(--button-small-padding); line-height: var(--button-normal-lineheight); margin: 0 0 32px; }
.frm_error_style p { color: var(--white-primary); }
.field-filled .frm_error { display: none; }
/* Label */
.form-field-text > label,
.form-field-textarea > label,
.form-field-url > label,
.form-field-email > label,
.form-field-phone > label { position: absolute; left: 0; top: 1px; transform-origin: bottom left; transition: var(--transition-slow); font-size: var(--text-normal); }
.form-field > label { color: var(--black-secondary); }
.field-focus > label { color: var(--black-disabled); }
.field-focus > label,
.field-filled > label { transform: scale(.8) translateY(-26px); }
/* Inputs */
.frm_forms input[type="text"],
.frm_forms input[type="url"],
.frm_forms input[type="email"],
.frm_forms input[type="tel"],
.frm_forms textarea,
.frm_forms select { font-family: var(--font-para); font-size: var(--text-normal); width: 100%; background: none; border: none; border-radius: 0; border-bottom: 1px solid var(--black-disabled); transition: var(--transition-fast); }
.frm_forms input[type="text"],
.frm_forms input[type="url"],
.frm_forms input[type="email"],
.frm_forms input[type="tel"] { padding: 0 0 4px; }
/* Invalid */
.frm_forms :invalid { box-shadow: none; }
.frm_forms .field-filled input[type="text"]:invalid,
.frm_forms .field-filled input[type="url"]:invalid,
.frm_forms .field-filled input[type="email"]:invalid,
.frm_forms .field-filled input[type="tel"]:invalid,
.frm_forms .field-filled textarea:invalid,
.frm_forms .field-filled select:invalid { border-bottom: 1px solid var(--errorcolor); box-shadow: none; }
.frm_error { color: var(--errorcolor); font-size: var(--text-small); }
/* On Focus */
.frm_forms input[type="text"]:focus,
.frm_forms input[type="url"]:focus,
.frm_forms input[type="email"]:focus,
.frm_forms input[type="tel"]:focus,
.frm_forms textarea:focus,
.frm_forms select:focus { border-bottom: 1px solid var(--primary); }
/* File Upload */
.form-field-file .frm_compact_text { display: none; }
.form-field-file .frm_small_text { font-size: var(--text-small); color: var(--black-secondary); }
.form-field-file label { display: block; margin-bottom: 4px; }
/* Captcha */
.form-field-captcha { display: none; }
.dz-success-mark,
.dz-error-mark { display: none; }
.dz-preview { float: left; width: 100%; padding: 16px; background: #F5F5F5; margin: 4px 0 0; }
.dz-image { width: 68px; height: 68px; float: left; background: #CCC; }
.dz-details { width: calc(100% - 80px); float: right; margin-bottom: 4px; }
.dz-progress { clear: right; float: right; width: calc(100% - 80px); }
.dz-progress .dz-upload { background: #f57c00; height: 8px; display: inline-block; transition: var(--transition-slow); }
.dz-complete .dz-upload { background: #689f38; }
.dz-remove { font-size: var(--text-small); padding-left: 12px; }
.dz-max-files-reached > .needsclick { display: none; }
.frm_upload_text { display: inline-block; cursor: pointer; margin-bottom: 6px; border-radius: var(--border-radius); padding: var(--button-normal-padding); line-height: var(--button-normal-lineheight); transition: var(--transition-fast); }
.content-centered .frm_upload_text { background: var(--primary); color: var(--primary-text-color); }
.content-centered .frm_upload_text:hover { background: var(--primary-dark); }
/* Radio & Check */
.form-field-checkbox > label,
.form-field-radio > label { color: var(--black-secondary); margin-bottom: 3px; display: block; }
/* Select */
.form-field-select > label { color: var(--black-secondary); margin-bottom: 3px; display: block; }
/* Submit */
.frm_submit button { border-radius: 0; border: none; cursor: pointer; background: var(--black-primary); color: var(--primary); padding: var(--button-normal-padding); line-height: var(--button-normal-lineheight); transition: var(--transition-fast); text-transform: uppercase; font-weight: bold; font-family: SonnyGothic; }
.frm_submit button:hover { background: var(--black-secondary); }
/* Misc */
.frm_forms .frm_checkbox input[type="checkbox"] { vertical-align: middle !important; margin-bottom: 2px !important; }
.frm_forms .frm_ajax_loading { position: absolute; top: 62px; left: calc(50% - 8px); }
.frm_style_formidable-style.with_frm_style .frm_error { margin-top: 4px; }
.frm_none_container > label.frm_primary_label { display: none; } /* Hide label for Invisible reCAPTCHA */
/* Footer
---------------------------------------------------------------------------------------------------------------------- */
footer { color: var(--secondary-text-color); }
.copyright { display: none; text-align: center; font-size: var(--text-small); }
/* IGGO Flexible Blocks
---------------------------------------------------------------------------------------------------------------------- */
.grid { display: grid; grid-template-columns: 100%; grid-gap: var(--gridgap); height: 100%; padding: 40px 0 52px 0; }
aside { display: none; }
.content-centered { max-width: 820px; width: 100%; margin: 96px 0 32px 0; color: var(--black-primary); }
.content-fullwidth { max-width: none; width: 100%; margin: 32px 0 0 0; }
.home .content-centered { text-align: center; margin: 0; max-width: 900px; }
.home .grid { align-items: center; }
.home #ifb-wrapper { margin: 0 0 24px; }
.home .front-price { margin: 24px 0 0 0; font-size: var(--h3); font-weight: 900; color: #FFF; }
.home .front-ticketlink { margin: 28px 0 0 0; }
.home .front-opentime { margin-bottom: 32px; }
#ifb-wrapper { display: grid; grid-template-columns: 100%; grid-gap: var(--gridgap); }
.page-template-page-fullwidth #ifb-wrapper { grid-gap: 0; }
.ifb-block :last-child { margin-bottom: 0; }
.content-fullwidth .ifb-block { padding: 0 16px; }
.content-fullwidth h1 { padding: 0 16px; text-align: center; }
.content-fullwidth .ifb-section { padding: 64px 0; }
.content-fullwidth .block-style-white + .block-style-white,
.content-fullwidth .block-style-light + .block-style-light,
.content-fullwidth .block-style-dark + .block-style-dark,
.content-fullwidth .block-style-black + .block-style-black,
.content-fullwidth .block-style-primary + .block-style-primary,
.content-fullwidth .block-style-secondary + .block-style-secondary { padding-top: 0; }
@media (min-width: 768px) {
.grid { padding: 80px 0; }
.home #ifb-wrapper { margin: 32px 0 0 0; }
.home .front-price { margin: 32px 0 0 0; }
.home .front-ticketlink { margin: 36px 0 0 0; }
.content-centered { margin: 116px auto 48px auto; }
}
@media (min-width: 992px) {
.content-centered { margin: 116px auto 48px auto; }
}
/* IFB: Columns
------------------------------------------------------------------------------------------------------------------ */
.colcount-1 { }
.colcount-2 { display: grid; grid-template-columns: 100%; grid-gap: var(--gridgap); }
.video-video,
.image-image,
.banner-banner { grid-gap: calc(var(--gridgap) / 2); }
.content-fullwidth .block-style-white { color: var(--black-primary); }
.content-fullwidth .block-style-dark { color: var(--white-primary); }
.content-fullwidth .block-style-black { color: var(--white-secondary); }
.content-fullwidth .block-style-primary { color: var(--primary-text-color); }
.content-fullwidth .block-style-secondary { color: var(--secondary-text-color); }
.content-fullwidth .block-style-primary h2,
.content-fullwidth .block-style-primary h3 { color: var(--primary-title-color); }
.content-fullwidth .block-style-primary h2,
.content-fullwidth .block-style-primary h3 { color: var(--primary-title-color); }
@media (min-width: 768px) {
.colcount-2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.content-fullwidth .colcount-1 { max-width: 100%; margin: 0 auto; }
.content-fullwidth .colcount-2 { max-width: 100%; margin: 0 auto; }
.content-fullwidth .colcount-1.text-only { width: 750px; }
.content-fullwidth .colcount-1.image-only { width: 1000px; }
.content-fullwidth .colcount-2.text-text { width: 1000px; }
.video-video,
.image-image,
.banner-banner { grid-gap: var(--gridgap); }
}
/* IFB: Video
------------------------------------------------------------------------------------------------------------------ */
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; }
.embed-container iframe,
.embed-container object,
.embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* IFB: Image
------------------------------------------------------------------------------------------------------------------ */
.col-image img { width: 100%; }
/* IFB: Banner
------------------------------------------------------------------------------------------------------------------ */
.col-banner > a { display: block; position: relative; overflow: hidden; }
.col-banner img { width: 100%; object-fit: cover; transition: var(--transition-slow); }
.col-banner > a:hover img { transform: scale(1.1); }
.banner-text ~ img { filter: grayscale(0.75); }
.banner-text { background: rgba(96,125,139,0.75); text-align: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: grid; align-items: center; justify-items: center; z-index: 1; }
.banner-inner { padding: 8px; }
.banner-inner > .title { color: var(--primary); font-size: var(--text-normal); }
.banner-inner > .desc { color: var(--white-primary); font-size: var(--text-small); }
/* IFB: Staff
------------------------------------------------------------------------------------------------------------------ */
.staff-grid { display: grid; grid-gap: var(--gridgap); }
.staff-group .group-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap: var(--gridgap); }
.single-person > img { width: 100%; margin: 0 0 4px; }
@media (min-width: 768px) {
.staff-group .group-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* IFB: Logo Block
------------------------------------------------------------------------------------------------------------------ */
/* Carousel */
.logo-carousel { min-height: 0; min-width: 0; position: relative; }
.logo-carousel .logo-wrap { visibility: hidden; opacity: 0; max-height: 0; transition: var(--transition-slow); }
.logo-carousel .logo-wrap.slick-initialized { visibility: visible; opacity: 1; max-height: none; }
.logo-carousel .sidefade { position: absolute; height: 100%; top: 0; width: 24px; z-index: 10; }
.logo-carousel .fadeleft { left: 0; background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); }
.logo-carousel .faderight { right: 0; background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); }
.logo-carousel .slick-track { display: flex; align-items: center; }
.logo-carousel a.slick-slide { height: 100%; display: flex; align-items: center; justify-items: center; padding: 0 12px; }
.logo-carousel img { opacity: 1; transition: var(--transition-fast); max-height: 45px; width: 100%; height: auto; margin: 0 auto; }
/* Grid */
.logo-grid .logo-wrap { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap: var(--gallerygap); }
.logo-grid a { display: flex; background: rgb(237,241,245); border: 1px solid #CCC; transition: var(--transition-fast); padding: 8px 12px; min-height: 80px; position: relative; overflow: hidden; }
.logo-grid img { opacity: 1; transition: var(--transition-fast); height: auto !important; filter: grayscale(1); max-height: 45px; margin: 0 auto; justify-self: center; align-self: center; }
.logo-grid a:hover { background: var(--white-primary); border: 1px solid var(--primary); }
.logo-grid a:hover img { filter: grayscale(0); }
.logo-grid .corner-arrow { transition: var(--transition-fast); position: absolute; bottom: -16px; right: -16px; width: 16px; height: 16px; z-index: 3; transform: translate3d(0,0,0); }
.logo-grid .corner-arrow::before { border-color: transparent transparent var(--primary); border-style: solid; border-width: 0 0 16px 16px; height: 0; width: 0; content:""; display: block; }
.logo-grid a:hover .corner-arrow { transform: translate3d(-16px,-16px,0); }
@media (min-width: 768px) {
.logo-carousel a.slick-slide { padding: 0 16px; }
.logo-carousel img { max-height: 60px; }
.logo-grid .logo-wrap { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.logo-grid a { padding: 16px 28px; min-height: 105px; }
.logo-grid img { max-height: 60px; }
/* Fullwidth version */
.content-fullwidth .logo-grid { max-width: 1400px; margin: 0 auto; }
}
@media (min-width: 1200px) {
.content-fullwidth .logo-grid .logo-wrap { grid-template-columns: repeat(8, minmax(0, 1fr)); }
}
/* IFB: Gallery
------------------------------------------------------------------------------------------------------------------ */
.block-gallery { }
.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: var(--gallerygap); padding: 0 4px; }
.gallery-grid a { display: grid; position: relative; }
.gallery-grid img { align-self: stretch; object-fit: cover; width: 100%; }
.gallery-grid .caption { position: absolute; bottom: 0; left: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; width: 100%; padding: 4px 8px; background: rgba(0,0,0,0.5); font-size: var(--text-tiny); color: var(--white-primary); font-style: italic; }
@media (min-width: 768px) {
.gallery-grid { grid-template-columns: repeat(6, 1fr); padding: 0; }
.gallery-grid .caption { font-size: var(--text-small); }
}
/* IFB: Google Map
------------------------------------------------------------------------------------------------------------------ */
.block-gmap { height: 252px; overflow: hidden; }
.block-gmap .acf-map { background: #E5E3DF; height: 100%; box-shadow: 0px 7px 2px -4px rgba(0,0,0,0.1); }
.content-fullwidth .block-gmap { padding: 0; }
@media (min-width: 768px) {
.block-gmap { height: 300px; }
}
@media (min-width: 1000px) {
.block-gmap { height: 352px; }
}
/* IFB: Pricelist
------------------------------------------------------------------------------------------------------------------ */
.block-pricelist { display: grid; grid-gap: calc(2 * var(--gridgap)); }
.price-group > .group-desc { margin: 0 0 8px; }
.single-price { display: grid; grid-template-columns: minmax(0, 1fr) 65px; padding: 6px 0; border-bottom: 1px solid var(--black-primary); }
.single-price:first-child { border-top: 1px solid var(--black-primary); }
.price-info > .desc { font-size: var(--text-small); color: var(--black-secondary); line-height: 1.2; font-style: italic; }
.price { text-align: right; font-weight: bold; color: var(--black-primary); }
.price-info .title { font-weight: bold; }
@media (min-width: 768px) {
.block-pricelist { grid-gap: var(--gridgap); }
}
/* IFB: Accordion
------------------------------------------------------------------------------------------------------------------ */
.accordion { border-bottom: var(--border-grey); }
.accordion:first-child { border-top: var(--border-grey); }
.acc-content-wrapper { max-height: 0px; display: none; grid-template-columns: 100%; grid-gap: 24px; grid-auto-columns: 90px; }
.acc-title { cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) 24px; }
.acc-title-text { padding: 10px 4px 10px 0; font-size: var(--text-large); transition: var(--transition-fast); font-weight: bold; color: var(--black-primary); }
.acc-title-icon { position: relative; transition: var(--transition-fast); }
.acc-title svg { position: absolute; height: 100%; right: 0; transition: var(--transition-fast); color: var(--black-disabled); }
.acc-title:hover svg { color: var(--black-secondary); }
.open .acc-title-text { color: var(--black-primary); }
.acc-title .fa-chevron-up { opacity: 0; transform: translate3d(0, 8px, 0); }
.acc-title .fa-chevron-down { opacity: 1; transform: translate3d(0, 0, 0); }
.open .acc-title .fa-chevron-up { opacity: 1; transform: translate3d(0, 0, 0); }
.open .acc-title .fa-chevron-down { opacity: 0; transform: translate3d(0, 8px, 0); }
.acc-image { grid-column: 2/3; }
.acc-image img { width: 100%; }
.acc-content :last-child { margin-bottom: 16px; }
.acc-image :last-child { margin: 6px 0 16px; }
.content-fullwidth .block-style-dark .acc-title-text,
.content-fullwidth .block-style-dark .acc-content p,
.content-fullwidth .block-style-dark .acc-content li { color: var(--white-primary); }
.content-fullwidth .block-style-black .acc-title-text,
.content-fullwidth .block-style-black .acc-content p,
.content-fullwidth .block-style-black .acc-content li { color: var(--white-secondary); }
.content-fullwidth .block-style-primary .acc-title-text,
.content-fullwidth .block-style-primary .acc-content p,
.content-fullwidth .block-style-primary .acc-content li { color: var(--primary-text-color); }
.content-fullwidth .block-style-secondary .acc-title-text,
.content-fullwidth .block-style-secondary .acc-content p,
.content-fullwidth .block-style-secondary .acc-content li { color: var(--secondary-text-color); }
/* Event accordion */
.event-accordion .acc-title { }
.event-accordion .acc-content { padding: 0 0 16px 0; }
.event-accordion .acc-title-date { grid-column: 1/3; color: var(--black-secondary); padding: 12px 0 0 0; }
.event-accordion .acc-title-pricingcol { grid-column: 1/3; padding: 0 0 12px; }
.event-accordion .acc-title-price { margin: 0 0 12px 0; display: inline-block; position: relative; top: -1px; width: 100%; }
.event-accordion .acc-title-ticketlink { margin: 0 0 8px 0; display: inline-block; width: 100%; }
.event-accordion .acc-title-text { font-size: var(--text-normal); padding: 2px 0 6px; }
.event-accordion .lighter { color: var(--black-secondary); font-size: 12px; border-radius: 4px; background: rgba(0,0,0,0.1); padding: 2px 5px; margin-left: 4px; }
@media (min-width: 992px) {
.acc-content-wrapper { grid-auto-columns: 150px; }
.content-fullwidth .block-accordion { max-width: 900px; margin: 0 auto; }
.event-accordion .acc-content { padding: 16px 0; }
.event-accordion .acc-title { grid-template-columns: 161px minmax(0, 1fr) 310px 24px; }
.event-accordion .acc-title-date { grid-column: 1; padding: 12px 4px 12px 0; }
.event-accordion .acc-title-text { grid-column: 2; padding: 12px 16px 12px 0; }
.event-accordion .acc-title-pricingcol { grid-column: 3; grid-row: 1; padding: 12px 0; text-align: right; }
.event-accordion .acc-title-price { width: auto; margin: 0; }
.event-accordion .acc-title-ticketlink { text-align: right; margin: -7px 0 -7px 4px; width: auto; }
.event-accordion .acc-title-icon { grid-column: 4; }
}
@media (min-width: 1156px) {
.acc-content-wrapper { grid-auto-columns: 200px; }
}
/* IFB: Article List
------------------------------------------------------------------------------------------------------------------ */
.article-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap: var(--cardgap); }
.article-grid .meta { color: var(--black-disabled); font-size: var(--text-small); text-transform: uppercase; letter-spacing: 1px; }
.article-grid .excerpt { margin: 0; }
.article-list { display: grid; grid-template-columns: 100%; border-top: var(--border-grey); }
.article-list article { display: grid; grid-template-columns: minmax(0, 1fr) 100px; border-bottom: var(--border-grey); padding: 4px 0; }
.article-list h3 { padding-right: 16px; }
.article-list .meta { text-align: right; color: var(--black-disabled); }
/* Card */
.card { background: var(--white-primary); border-radius: var(--border-radius); box-shadow: var(--elevation-2dp); overflow: hidden; }
.card-content { padding: 16px; }
.card img { width: 100%; }
@media (min-width: 768px) {
.article-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.article-grid article:nth-child(4) { display: none; }
}
@media (min-width: 1024px) {
.article-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.article-grid article:nth-child(4) { display: block; }
}
/* IFB: Features
------------------------------------------------------------------------------------------------------------------ */
.features { }
.feature-list { }
.single-feature { }
@media (min-width: 992px) {
.content-fullwidth .features { max-width: 1100px; margin: 0 auto; }
.feature-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-gap: var(--cardgap); }
}
/* IFB: Fullwidth Block Colors
------------------------------------------------------------------------------------------------------------------ */
/* Section Colors */
.content-fullwidth .block-style-white { background: var(--white-primary); }
.content-fullwidth .block-style-light { background: #F5F5F5; }
.content-fullwidth .block-style-dark { background: var(--black-primary); }
.content-fullwidth .block-style-black { background: #000; }
.content-fullwidth .block-style-primary { background: var(--primary); }
.content-fullwidth .block-style-secondary { background: var(--secondary); }
/* Generic Colors: Links */
.content-fullwidth .block-style-dark a,
.content-fullwidth .block-style-black a { color: var(--linkcolordark); }
.content-fullwidth .block-style-primary a { color: var(--primary-link-color); }
.content-fullwidth .block-style-secondary a { color: var(--secondary-link-color); }
/* Form Colors */
.content-fullwidth .block-style-white .frm_upload_text,
.content-fullwidth .block-style-light .frm_upload_text { background: var(--primary); color: var(--primary-text-color); }
.content-fullwidth .block-style-white .frm_upload_text:hover,
.content-fullwidth .block-style-light .frm_upload_text:hover { background: var(--primary-dark); }
.content-fullwidth .block-style-primary .frm_upload_text { background: var(--secondary); color: var(--secondary-text-color); }
.content-fullwidth .block-style-primary .frm_upload_text:hover { background: var(--secondary-dark); }
/* Good */
.content-fullwidth .block-style-dark .form-field > label,
.content-fullwidth .block-style-black .form-field > label { color: var(--white-secondary); }
/* New questionable css */
.content-fullwidth .block-style-dark .frm_forms input[type="text"],
.content-fullwidth .block-style-dark .frm_forms input[type="url"],
.content-fullwidth .block-style-dark .frm_forms input[type="email"],
.content-fullwidth .block-style-dark .frm_forms textarea,
.content-fullwidth .block-style-dark .frm_forms select,
.content-fullwidth .block-style-black .frm_forms input[type="text"],
.content-fullwidth .block-style-black .frm_forms input[type="url"],
.content-fullwidth .block-style-black .frm_forms input[type="email"],
.content-fullwidth .block-style-black .frm_forms textarea,
.content-fullwidth .block-style-black .frm_forms select { border-bottom: 1px solid var(--white-disabled); }
.content-fullwidth .block-style-dark .form-field-file .frm_small_text,
.content-fullwidth .block-style-black .form-field-file .frm_small_text { color: var(--white-disabled); }
/* IFB: TinyMCE Custom Styles
------------------------------------------------------------------------------------------------------------------ */
/* TinyMCE Custom Styles: Read more button */
.mce-readmore { padding: var(--button-small-padding); line-height: var(--button-small-lineheight); background: var(--black-primary); color: var(--primary); display: inline-block; transition: var(--transition-fast); border-radius: 0; text-transform: uppercase; }
.mce-readmore:hover { background: var(--black-secondary); color: var(--primary); box-shadow: none; text-decoration: none; }
.mce-readmore:focus,
.mce-readmore:active { color: var(--primary); text-decoration: none; }
.home .mce-readmore { padding: var(--button-normal-padding); line-height: var(--button-normal-lineheight); }
.content-fullwidth .block-style-dark .mce-readmore,
.content-fullwidth .block-style-black .mce-readmore { background: var(--primary); color: var(--primary-text-color); }
.content-fullwidth .block-style-dark .mce-readmore:hover,
.content-fullwidth .block-style-black .mce-readmore:hover { background: var(--primary-dark); }
.content-fullwidth .block-style-primary .mce-readmore { background: var(--secondary); color: var(--secondary-text-color); }
.content-fullwidth .block-style-primary .mce-readmore:hover { background: var(--secondary-dark); }
.content-fullwidth .block-style-secondary .mce-readmore { background: var(--primary); color: var(--primary-text-color); }
.content-fullwidth .block-style-secondary .mce-readmore:hover { background: var(--primary-dark); }
.event-accordion .mce-readmore { color: var(--black-primary); background: none; border: 2px solid var(--black-primary); font-size: 14px; }
.event-accordion .mce-readmore:hover { color: var(--primary); background: var(--black-primary); }
/* TinyMCE Custom Styles: Ingress paragraph */
.mce-ingress { color: var(--black-secondary); font-size: var(--text-large); }
.content-fullwidth .block-style-dark p.mce-ingress,
.content-fullwidth .block-style-black p.mce-ingress { color: var(--white-disabled); }
/* IE10 & IE11 specific styles go here */
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
}