/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
  color: #222;
  font-size: 62.5%;
  line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
  resize: vertical;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden,
[hidden] {
  display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
 * Extends the .sr-only class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
  visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
}

.clearfix::after {
  clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
  *,
  *::before,
  *::after {
    background: #fff !important;
    color: #000 !important;
    /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]::after {
    content: " (" attr(href) ")";
  }

  abbr[title]::after {
    content: " (" attr(title) ")";
  }

  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }

  pre {
    white-space: pre-wrap !important;
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  /*
   * Printing Tables:
   * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
   */
  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}



/* ==========================================================================
   Font
   ========================================================================== */



/* exo-2-100 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 100;
  src: url('../font/exo-2-v10-latin-100.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-100.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-100.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-200 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 200;
  src: url('../font/exo-2-v10-latin-200.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-200.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-200.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-200.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-200.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-300 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 300;
  src: url('../font/exo-2-v10-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-300.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-regular - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 400;
  src: url('../font/exo-2-v10-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-regular.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-500 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 500;
  src: url('../font/exo-2-v10-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-500.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-600 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 600;
  src: url('../font/exo-2-v10-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-600.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-700 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 700;
  src: url('../font/exo-2-v10-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-700.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-800 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 800;
  src: url('../font/exo-2-v10-latin-800.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-800.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-800.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-900 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 900;
  src: url('../font/exo-2-v10-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-900.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-900.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-200italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 200;
  src: url('../font/exo-2-v10-latin-200italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-200italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-200italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-200italic.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-200italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-200italic.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-100italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 100;
  src: url('../font/exo-2-v10-latin-100italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-100italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-100italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-100italic.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-100italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-100italic.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-300italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 300;
  src: url('../font/exo-2-v10-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-300italic.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 400;
  src: url('../font/exo-2-v10-latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-italic.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-500italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 500;
  src: url('../font/exo-2-v10-latin-500italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-500italic.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-500italic.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-600italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 600;
  src: url('../font/exo-2-v10-latin-600italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-600italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-600italic.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-600italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-600italic.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-700italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 700;
  src: url('../font/exo-2-v10-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-700italic.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-900italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 900;
  src: url('../font/exo-2-v10-latin-900italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-900italic.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-900italic.svg#Exo2') format('svg'); /* Legacy iOS */
}
/* exo-2-800italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 800;
  src: url('../font/exo-2-v10-latin-800italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/exo-2-v10-latin-800italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/exo-2-v10-latin-800italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/exo-2-v10-latin-800italic.woff') format('woff'), /* Modern Browsers */
       url('../font/exo-2-v10-latin-800italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/exo-2-v10-latin-800italic.svg#Exo2') format('svg'); /* Legacy iOS */
}



/* ==========================================================================
   Page
   ========================================================================== */


:root{
	--primary-color: #fbb900;
	--secondary-color: #111111;
	--white-color: #ffffff;
	--font-family: 'Exo 2';
	--section-padding: 90px 0;
	--text-h1-size: 4.2rem;
	--text-h2-size: 3.5rem;
	--text-h3-size: 2.5rem;
	--text-h4-size: 1.5rem;
}

b, strong{
	font-weight: 600;
}


h1, h2, h3, h4{
	font-weight: 400;
	margin: 0;
}

h1{
	font-size: var(--text-h1-size);
}

h2{
	font-size: var(--text-h2-size);
}

h3{
	font-size: var(--text-h3-size);
	margin-bottom: 4rem;
}

h4{
	font-size: var(--text-h4-size);
}

.teaser-text p a,
.teaser-text h4 a{
	color: var(--primary-color);
}

.primarybg .teaser-text p a, .secondarybg .teaser-text p a{
  color: #fff;
}

.text-center{
	text-align: center;
}
.text-right{
	text-align: right;
}

.grid{
	width: 1300px;
	margin: 0 auto;
	display: grid;
}
.blog__post_row{
	
	width: 1300px;
	margin: 0 auto;
}
.blog__post{
	width: 31.3333%;
	margin: 0 1%;
	background: #fff;
	margin-bottom: 3rem;
	border-radius: 0.2rem;
	overflow: hidden;
}

.blog__post figure{
	margin: 0 0 2rem 0;
}

.blog__post figure img{
	width: 100%;
	height: auto;
	display: block;
}

.blog__post .blog__post__content{
	padding: 3rem;
}

.blog__post .blog__post__content h3{
	margin-bottom: 2rem;
	margin-top: 0;
}

.blog__post .blog__post__content h3 a{
	text-decoration: none;
	color: var(--secondary-color)
}

.blog__post .blog__post__content p{
	font-size: 1.6rem;
}
.blog__post .blog__post__content .button{
	margin-top: 3rem;
}


@media(max-width: 1400px){
	.grid, .grid.alm-listing{
		width: 90%;
		margin-left: 5%
	}
	.blog__post_row{
	
	width: 90%;
}
}
@media(max-width: 1110px){

.blog__post{
	width: 48%;
	margin: 0 1% 2rem 1%;
}
}

.link-group{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  justify-content: center;
  justify-items: center;
  align-content: center;
  grid-gap: 3rem;
}

.link-group a{
  display: block;
  background: var(--primary-color);
  padding: 4rem;
  color: #000;
  font-size: 2rem;
  font-weight: 600;
  text-decoration: none;
}

.link-group a:hover{
  background: var(--secondary-color);
  color: var(--primary-color)
}

.link-group a div{
  height: 100%;
  display: flex; 
  flex-wrap: wrap; 
  align-content: center;
  align-items: center; 
  flex-direction: row; 
  justify-content: center;
}
  @media(max-width: 1200px){
  

  .link-group{
    grid-template-columns: 1fr 1fr;

  }
  .link-group a{
    
    box-sizing: border-box;
    width: 100%;
  }
  }
@media(max-width: 767px){

.blog__post{
  width: 100%;
}

.link-group{
  grid-template-columns: 1fr;
}
}

body{
	font-family:  var(--font-family);
	line-height: 1.4;
	font-size: 1.8rem;
	color: var(--secondary-color);
	font-weight: 300;
	/*padding-top: 100px;*/
	
}

section h1,
section h2{
	margin: 0 0 5rem 0;
}

section.ptb{
	padding: var(--section-padding);
}

section.primarybg{
	background: var(--primary-color);
	color: var(--secondary-color);
}

section.secondarybg{
	background: var(--secondary-color);
	color: var(--white-color);
}

section.odd{
	background: #efefef;
}


section .teaser-text{
  margin: 0 auto;
  max-width: 70rem;
}

section .teaser-text.wide{
  max-width:100rem;
}

section .teaser-text.big{
  max-width:120rem;
}


section .teaser-note{
	background: #efefef;
	border-radius: 0.8rem;
	padding: 2rem;
	margin-top: 5rem;
	font-size: 1.6rem;
	
}

section .teaser-note p{
	padding: 0;
	margin: 0;
}

.button{
	background: var(--secondary-color);
	color: var(--white-color);
	border-radius: 2.5rem;
	padding: 1rem 3rem;
	display: inline-block;
	text-decoration: none;
	outline: none;
	border: none;
	cursor: pointer;
	font-size: 1.6rem;
}


.button .button-icon{
	margin-left: 14px;
	height: 14px;
	display: inline-block;
	vertical-align: middle
}

.button .button-icon img{
	height: 14px;
	width: auto;
	display: block
}

.dropdown{
	display: inline-block;
}


.button.primary,
.button.default{	
	background: var(--primary-color);
	color: var(--secondary-color);
}

.button.light{	
	background: var(--white-color);
	color: var(--secondary-color);
}

.button-group{
	margin-top: 5rem;
}

.button-group.noPad{
  margin: 0;
}

.button-group .button{
	margin: 0 0.6rem;
}

.button-group .button:first-of-type{
	margin-left: 0;
}

.button-group .button:last-of-type{
	margin-right: 0;
}

.button-group .button{
  margin-bottom: 2rem;
}


.dropbtn {
  
}

/* Dropdown button on hover & focus */
.dropbtn:hover, .dropbtn:focus {
  
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
	margin: 0 0.6rem;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  margin-top: 1rem;
  border-radius: 0.5rem;
  background-color: var(--secondary-color);
  min-width: 16rem;
  padding: 1.2rem 1.6rem;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
	font-size: 1.6rem;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: var(--white-color);
  padding: 0.6rem 0;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}





.header-spacer{
	height: 0;
	width: 100%;
	display: block;
	
}
.header-spacer.odd{
	background: #efefef
	
}


header{
	position: sticky;
	height: 80px;
	top: 0;
	left: 0;
	background: var(--secondary-color);
	z-index: 20;
	width: 100%
}

header .grid{
	grid-template-columns: repeat(12, 1fr);
    grid-template-areas: "a0 a0 a0 b0 b0 b0 b0 b0 b0 b0 c0 c0";
}
header .grid nav{
	grid-area: b0;
  text-align: center
	
}
header .grid #brand{
	grid-area: a0;
	
}
header .grid .social-icons{
	grid-area: c0;
	
}

header #brand a{
	display: block;
	margin: 0 auto;
	width: 19rem;
	padding-top: 2rem;
	
}

header #brand a img{
	display: block;
	width: 100%;
	height: auto;
	
}


header ul,
header ul li{
	list-style: none;
	margin: 0;
	padding: 0;
	display: inline-block;
	line-height: 8rem;
}

header a{
	color: #fff;
	text-decoration: none;
}

header nav ul li{
  margin: 0 2rem;
}
header .social-icons ul li{
	margin-left: 2rem;
}

header nav ul ul{
	display: none;
}

.stage{
	position: relative;
	overflow: hidden;
}
.stage img, .stage video{
	width: 100%;
	height: auto;
	display: block;
}

.stage .gridder{
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 8;
}

.stage .gridder .grid{
	align-content: flex-end;
	align-items: flex-end;
	height: 100%;
}


.stage .gridder .grid #event-detail-stage{
	margin-bottom: 10%
}

.stage .vector{
	width: 400px;
    height: 300px;
    position: absolute;
    bottom: 0;
    z-index: 10;
    
    right: -15px;
    background: url(../img/stage-vector.svg) right top no-repeat;
    background-size: 400px;
    
}



.stage .vector .description{
	
	position: absolute;
    top: 28%;
    display: block;
    text-align: center;
    color: #111;
    width: 100%;
    font-size: 3rem;
    transform: translateY(0%);
    
}
.stage .vector .description img {
	    width: 53%;
    margin: 0 16% auto 30%;
}


.stage #event-timer{
	
}

.stage #event-timer ul,
.stage #event-timer li{
	margin: 0;
	padding: 0;
}



.stage #event-subheadline span{
  padding: 1rem 2rem;
  background: var(--secondary-color);
  color: #fff;
  font-size: 4.5rem;
  font-weight: 600;
  display: inline-block;	
  border-radius: 1rem 1rem  1rem 0 ;
}


.stage #event-date span{
padding: 0.6rem 2rem;
    background: var(--secondary-color);
    color: #fff;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 3rem;
    display: inline-block;
    margin-top: 1rem;
    border-radius: 1rem;
}

.stage #event-headline span{
	padding: 1rem 2rem;
	background: var(--primary-color);
	color: var(--secondary-color);
	font-size: 4.5rem;
	font-weight: 600;
	display: inline-block;
	border-radius: 0 0 00 1rem;
}

.stage #event-timer li{
	display: inline-block;
  font-size: 1.6rem;
  list-style-type: none;
  text-align: center;
  padding: 2rem;
  min-width: 9rem;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  background: var(--secondary-color);
  color: var(--primary-color);
  border-radius: 0.8rem;
  margin-right: 1.8rem;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.stage #event-timer li span{
	display: block;
  letter-spacing: inherit;
	font-weight: 600;
	
  font-size: 2.6em;
}

#subnav{
	background: var(--primary-color);
	text-align: center;
	 position: -webkit-sticky;
    position: sticky;
    top: 80px;
    z-index: 100;
}

#subnav ul,
#subnav ul li{
	list-style: none;
	margin: 0;
	padding: 0;
	display: inline-block;
	line-height: 6rem;
}
#subnav ul li.current_page_item a{
	font-weight: 600;
}


#subnav a{
	color: #fff;
	text-decoration: none;
	display: block;
}

#subnav  ul li{
	margin: 0 1.6rem;
  position: relative;
}

#subnav ul li ul{
  display: none;
  position: absolute;
  padding: 2rem;
  background: var(--secondary-color);
  text-align: left;
  min-width: 24rem;
  top: 6rem; left: 0;
  font-size: 1.6rem;
}

#subnav ul li:hover ul{
  display: block;
}
#subnav ul li.social-media-links{
	margin: 0 0.8rem;
}

#subnav ul li.social-media-links svg{
	height: 18px;
	width: auto;
}


#subnav ul li.social-media-links.link1{
	margin-left: 4rem;
}
.half__form__grid{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 2rem;
	margin-bottom: 2rem;
}

.full__form__grid{
	display: grid;
	grid-template-columns: 1fr;
	margin-bottom: 2rem;
	grid-gap: 2rem;
}

.half__form__grid input[type="text"],
.half__form__grid input[type="email"],
.half__form__grid textarea,
.full__form__grid input[type="text"],
.full__form__grid input[type="email"],
.full__form__grid textarea{
	width: 100%;
	padding: 0.7rem 1.2rem;
	box-sizing: border-box;
	border: 1px solid #dadada;
	border-radius: 0.5rem;
}

.full__form__grid .wpcf7-not-valid-tip,
.half__form__grid .wpcf7-not-valid-tip{
	font-size: 1.4rem;
	display: block;
	margin-top: 0.5rem;
}


.wpcf7 form.invalid #form-general  .wpcf7-response-output, 
.wpcf7 form.unaccepted #form-general   .wpcf7-response-output{
	border: none;
	background: var(--secondary-color);
	margin: 0 0 20px 0;
	padding: 2rem;
	color: #fff;
	font-size: 1.6rem;
	color: var(--white-color);
	border-radius: 0.8rem;
}

#form-general{
	margin-top: 5rem;
}


.event-col{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	align-items: center;
	align-content: center;
	grid-template-areas: 'a b';
	 background: #EFEFEF
}

.event-col .event-image{
	 grid-area: a;
	 height: 100%;
}


.event-col .event-content{
	 grid-area: b;
}

.event-col.odd .event-image{
	 grid-area: b;
}


.event-col.odd .event-content{
	 grid-area: a;
}

.event-col .event-image img{
	width: 100%;
	object-fit: cover;
	height: 100%;
	display: block;
}



.event-col .event-content-inner{
	max-width: 600px;
	padding: 100px 100px;
}


.event-col .event-content-inner h2{
	margin: 0;
}

.event-col .event-content-inner .event-meta{
	margin-bottom: 30px;
}





.grid.partner{
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 3rem;
	margin-top: 7.5rem;
}

.grid .partner-item{
	background: var(--white-color);
	color: var(--secondary-color);
	text-align: center;
	padding: 4rem 2rem 2rem 2rem;
	border-radius: 0.8rem;
}
.grid .partner-item a{
	display: block;
}

.grid .partner-item img{
	display: block;
	width: 100%;
	height: auto
}



.grid.plans{
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 3rem;
	margin-top: 7.5rem;
}

.grid .plan{
	background: var(--white-color);
	color: var(--secondary-color);
	text-align: center;
	padding: 4rem 2rem 2rem 2rem;
	border-radius: 0.8rem;
}

.grid .plan h3{
	font-size: 2.5rem;
	margin: 0;
}

.grid .plan .plan-date{
	font-size: 1.6rem;
}

.grid .plan dl,
.grid .plan dt,
.grid .plan dd{
	margin: 0;
}
.grid .plan dl{
	margin-top: 3rem;
}
.grid .plan dt{
	color: #707070;
  font-weight: 500;
	font-size: 2rem;
}

.grid .plan.active dt{
  color: #fff;
}

.grid .plan dd{
	margin-bottom: 2rem;
}

.grid .plan.active{
	background: var(--secondary-color);
	color: var(--white-color);
}

.secondarybg .grid .plan.active{
	background: var(--primary-color);
}



.icon-list{
	margin-top: 7.5rem;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 3rem;
	font-size: 1.6rem;
}


.icon-list .icon-item:hover svg circle{
	fill: var(--primary-color);
}


.icon-list .icon-item svg{
	width: 80px;
	height: auto;
	display: block;
	margin: 0 auto 2rem auto;
}

footer{
	padding: 3rem 0;
	background: #efefef;
	font-size: 1.4rem;
}

footer .grid{
	
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}


footer a{
	color: var(--secondary-color);
	text-decoration: none;
}


.gallery{
	
}


.grid-gallery {
  display: grid;
  margin-top: 7.5rem;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(3, 1fr);
  grid-gap: 2rem;
  grid-template-areas:
    "g1 g2 g2 g4 g5 g6"
    "g3 g2 g2 g9 g10 g6"
    "g3 g7 g8 g9 g10 g11";
}



.grid-gallery > a{
	background: #fff;
	border-radius: 0.5rem;
	overflow: hidden;
	min-height: 160px
}
.grid-gallery > a img{
	object-fit: cover;
    width: 100%;
    height: 100%;
}

.grid-gallery .g1,
.grid-gallery .g3{
	border-radius: 0 0.5rem 0.5rem 0;
}

.grid-gallery .g11,
.grid-gallery .g6{
	border-radius: 0.5rem 0 0 0.5rem;
}

.g1 { grid-area: g1; }
.g6 { grid-area: g6; }
.g5 { grid-area: g5; }
.g4 { grid-area: g4; }
.g2 { grid-area: g2; }
.g3 { grid-area: g3; }
.g7 { grid-area: g7; }
.g8 { grid-area: g8; }
.g9 { grid-area: g9; }
.g10 { grid-area: g10; }
.g11 { grid-area: g11; }


body.hidden-scroll {
  overflow: hidden; }

.sl-overlay {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: #fff;
  opacity: 0.7;
  display: none;
  z-index: 1035; }

.sl-wrapper {
  z-index: 1040;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  position: fixed; }
  .sl-wrapper * {
    box-sizing: border-box; }
  .sl-wrapper button {
    border: 0 none;
    background: transparent;
    font-size: 28px;
    padding: 0;
    cursor: pointer; }
    .sl-wrapper button:hover {
      opacity: 0.7; }
  .sl-wrapper .sl-close {
    display: none;
    position: fixed;
    right: 30px;
    top: 30px;
    z-index: 10060;
    margin-top: -14px;
    margin-right: -14px;
    height: 44px;
    width: 44px;
    line-height: 44px;
    font-family: Arial, Baskerville, monospace;
    color: #000;
    font-size: 3rem; }
  .sl-wrapper .sl-counter {
    display: none;
    position: fixed;
    top: 30px;
    left: 30px;
    z-index: 1060;
    color: #000;
    font-size: 1rem; }
  .sl-wrapper .sl-navigation {
    width: 100%;
    display: none; }
    .sl-wrapper .sl-navigation button {
      position: fixed;
      top: 50%;
      margin-top: -22px;
      height: 44px;
      width: 22px;
      line-height: 44px;
      text-align: center;
      display: block;
      z-index: 10060;
      font-family: Arial, Baskerville, monospace;
      color: #000; }
      .sl-wrapper .sl-navigation button.sl-next {
        right: 5px;
        font-size: 2rem; }
      .sl-wrapper .sl-navigation button.sl-prev {
        left: 5px;
        font-size: 2rem; }
      @media (min-width: 35.5em) {
        .sl-wrapper .sl-navigation button {
          width: 44px; }
          .sl-wrapper .sl-navigation button.sl-next {
            right: 10px;
            font-size: 3rem; }
          .sl-wrapper .sl-navigation button.sl-prev {
            left: 10px;
            font-size: 3rem; } }
      @media (min-width: 50em) {
        .sl-wrapper .sl-navigation button {
          width: 44px; }
          .sl-wrapper .sl-navigation button.sl-next {
            right: 20px;
            font-size: 3rem; }
          .sl-wrapper .sl-navigation button.sl-prev {
            left: 20px;
            font-size: 3rem; } }
  .sl-wrapper.sl-dir-rtl .sl-navigation {
    direction: ltr; }
  .sl-wrapper .sl-image {
    position: fixed;
    -ms-touch-action: none;
    touch-action: none;
    z-index: 10000; }
    .sl-wrapper .sl-image img {
      margin: 0;
      padding: 0;
      display: block;
      border: 0 none;
      width: 100%;
      height: auto; }
      @media (min-width: 35.5em) {
        .sl-wrapper .sl-image img {
          border: 0 none; } }
      @media (min-width: 50em) {
        .sl-wrapper .sl-image img {
          border: 0 none; } }
    .sl-wrapper .sl-image iframe {
      background: #000;
      border: 0 none; }
      @media (min-width: 35.5em) {
        .sl-wrapper .sl-image iframe {
          border: 0 none; } }
      @media (min-width: 50em) {
        .sl-wrapper .sl-image iframe {
          border: 0 none; } }
    .sl-wrapper .sl-image .sl-caption {
      display: none;
      padding: 10px;
      color: #fff;
      background: rgba(0, 0, 0, 0.8);
      font-size: 1rem;
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0; }
      .sl-wrapper .sl-image .sl-caption.pos-top {
        bottom: auto;
        top: 0; }
      .sl-wrapper .sl-image .sl-caption.pos-outside {
        bottom: auto; }
    .sl-wrapper .sl-image .sl-download {
      display: none;
      position: absolute;
      bottom: 5px;
      right: 5px;
      color: #000;
      z-index: 1060; }

.sl-spinner {
  display: none;
  border: 5px solid #333;
  border-radius: 40px;
  height: 40px;
  left: 50%;
  margin: -20px 0 0 -20px;
  opacity: 0;
  position: fixed;
  top: 50%;
  width: 40px;
  z-index: 1007;
  -webkit-animation: pulsate 1s ease-out infinite;
  -moz-animation: pulsate 1s ease-out infinite;
  -ms-animation: pulsate 1s ease-out infinite;
  -o-animation: pulsate 1s ease-out infinite;
  animation: pulsate 1s ease-out infinite; }

.sl-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll; }

.sl-transition {
  transition: -moz-transform ease 200ms;
  transition: -ms-transform ease 200ms;
  transition: -o-transform ease 200ms;
  transition: -webkit-transform ease 200ms;
  transition: transform ease 200ms; }

@-webkit-keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0.0; }
  50% {
    opacity: 1; }
  100% {
    transform: scale(1.2);
    opacity: 0; } }

@keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0.0; }
  50% {
    opacity: 1; }
  100% {
    transform: scale(1.2);
    opacity: 0; } }

@-moz-keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0.0; }
  50% {
    opacity: 1; }
  100% {
    transform: scale(1.2);
    opacity: 0; } }

@-o-keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0.0; }
  50% {
    opacity: 1; }
  100% {
    transform: scale(1.2);
    opacity: 0; } }

@-ms-keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0.0; }
  50% {
    opacity: 1; }
  100% {
    transform: scale(1.2);
    opacity: 0; } }

dl{
	margin: 0;
	padding: 0;
}


dl dt{
	padding: 0;
	margin: 0 0 3px 0;
}

dl dt span{
	
	font-weight: 600;
	border-bottom: 2px solid var(--primary-color);
}

dl dd{
	padding: 0;
	margin: 0 0 2rem 0;
}

#social-mobile{
	display: none;
}
.faq-search{
	width: 40%;
	margin: 0 auto 5rem auto;
	
}

.faq-search input{
	display: block; width: 100%;
	padding: 1.2rem 2.4rem;
	outline: none;
	border: 1px solid var(--secondary-color);
}

.faq-item {
  width: 70%;
  margin: 0 auto;
  overflow: hidden;
  margin-bottom: 1.2rem;
}

.faq-item.hidden{
	display: none;
}
.faq-item-headline {
  display: flex;
  justify-content: space-between;
  padding: 1em;
  background: #efefef;
  font-weight: bold;
  cursor: pointer;
  /* Icon */
}
.faq-item-headline:hover {
  background: var(--primary-color);
  color: var(--white-color);
}
.faq-item-headline::after {
  content: "❯";
  width: 1em;
  height: 1em;
  text-align: center;
  transition: all 0.35s;
}
.faq-item-content {
  max-height: 0;
  padding: 0 1em;
  color: #2c3e50;
  overflow: hidden;
  background: white;
  transition: all 0.35s;
}

.faq-item input{
	display: none;
}
section p a,
section li a{
	color: var(--secondary-color);
}


.faq-item input:checked + .faq-item-headline {
    background: var(--secondary-color);
  color: var(--white-color);
}
.faq-item input:checked + .faq-item-headline::after {
  transform: rotate(90deg);
}
.faq-item input:checked ~ .faq-item-content {
  max-height: 100vh;
  padding: 1em;
}


.news-image{
	width: 1000px;
	
	margin:  50px auto;
}

.news-image img{
	width: 100%;
	height: auto;
	display: block;
}




/* SIDENAV */



#sidenav li.current-menu-item > a,

#sidenav li.current-menu-item .toggle,
#sidenav  li.current-menu-parent > a,
#sidenav   li.current-menu-ancestor.hasMegaEntries > a,
#sidenav  li.current-menu-parent > .toggle,
#sidenav   li.current-menu-ancestor.hasMegaEntries > .toggle{
color: var(--primary-color);
font-weight: 600;
}

#sidenav  .icon-handler{
	display: block;
}
#sidenav  .icon-handler a{
	padding: 0;
	font-size: 0.9rem;
}

header nav ul li .icon-handler a,
#sidenav  .icon-handler a{
	line-height: 32px;
	text-align: left;
	padding-left: 25px;
	font-size: 1rem;
	vertical-align: middle;
}
#sidenav .toggle:after {
    content: "+";
    font-size: 3rem;
    line-height: 1;
    position: absolute;
    right: 0px;
    top: 50%;
    margin-top: -13px;
}

#sidenav  .icon-handler a{
	color: #622A80;
	font-weight: 600;
}

#sidenav .centered-info{
	margin-top: 40px;
}



#sidenav .centered-info h4{
	font-size: 1.125rem;
	margin-bottom: 10px;
}


#sidenav  .icon-handler a{
	padding-left: 0;
}

header nav ul li .icon-handler a .ico,
#sidenav .icon-handler a .ico{
	vertical-align: middle;
	width: 40px;
	display: inline-block;
}

header nav ul li .icon-handler a .ico svg,
#sidenav .icon-handler a .ico svg{
	height: 24px;
	vertical-align: middle;
	width: auto;
}


#sidenav-ovrly{
		background: rgba(211,10, 10, .7);
			width: 100%;
		position: fixed;
		left: 0;
		top: 0;
		height: 100%;
		z-index: -1;
		opacity: 0;
 -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
		
	}
	#sidenav{
		width: 75%;
		position: fixed;
		left: 0;
		overflow: auto;
		top: 0;
    box-sizing: border-box;
		padding: 60px 20px; -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
		height: 100%;
		background: var(--secondary-color);
		z-index: -1;
		left: -75%;
	}
	
	.mobNav #sidenav{
		
		z-index: 9999;
		left: 0;
	}
	.mobNav #sidenav-ovrly{
		
		z-index: 9998;
		opacity: 1;
	}
	
	#sidenav [id^=drop]:checked + ul { display: block; }
	#sidenav ul ul li > ul,
	#sidenav ul li > ul { display: none; }
#sidenav .toggle + a,
 #sidenav .menu { display: none; }
#sidenav .toggle,  #sidenav [id^=drop] {
    display: none;
}

#sidenav  ul,
#sidenav  ul li{
	padding: 0;
	list-style: none;
	margin:	0;
}
#sidenav .toggle {
  display: block;
  text-decoration: none;
  border: none;
  position: relative;
  padding: 10px 0 10px 0;
}
#sidenav ul > li {
}
#sidenav ul li:last-of-type{
	border-bottom: 0;
}
#sidenav ul li a,  #sidenav ul .toggle{
	color: #fff;
	text-decoration: none;
	font-size: 2.4rem;
}
#sidenav a{
	display: block;
	
  padding: 10px 0;
}

#sidenav ul ul a,
#sidenav ul ul .toggle{
	padding-left: 10px;
}


#sidenav ul ul ul a,
#sidenav ul ul ul .toggle{
	padding-left: 20px;
}


.hamburger {
  padding: 0 0;
  display: none;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  float: right;
  margin: 0;
  overflow: visible; }
  .hamburger:hover {
    opacity: 0.7; }
  .hamburger.is-active:hover {
    opacity: 0.7; }
  .hamburger.is-active .hamburger-inner,
  .hamburger.is-active .hamburger-inner::before,
  .hamburger.is-active .hamburger-inner::after {
    background-color: #fff; }
  .hamburger.is-active .hamburger-inner {
    transform: translate3d(0, 10px, 0) rotate(45deg); }
    .hamburger.is-active .hamburger-inner::before {
      transform: rotate(-45deg) translate3d(-5.7142857143px, -8px, 0);
      opacity: 0; }
    .hamburger.is-active .hamburger-inner::after {
      transform: translate3d(0, -20px, 0) rotate(-90deg); }

.hamburger-box {
  width: 34px;
  height: 22px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
 }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 34px;
    height: 2px;
    background-color: #fff;
    border-radius: 0;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: 10px;
    transition-property: transform, opacity;
    transition-timing-function: ease;
    transition-duration: 0.15s; }
  .hamburger-inner::after {
    top: 20px; }

/* END SIDENAV */


.grid.icons{
	
  grid-template-columns: repeat(3, 1fr); grid-gap: 2rem;
  padding: 0 10rem;
  margin-top: 7rem;
    box-sizing: border-box;
} 
@media(max-width: 1050px){
	 .grid.icons{
		 padding: 0;
	 }
}

@media(max-width: 800px){
	 .grid.icons{
		 display: block;
	 }
}

.grid.icons .count-icon{
	background: var(--primary-color);
	width: 140px;
	height: 140px;
	border-radius: 50%;
	margin: 0 auto 2rem auto;
}
.grid.icons h3{
	font-size: 2.2rem;
}
.grid.icons .count-icon .counter{
	display: block;
	vertical-align: center;
	width: 140px;
	height: 140px;
	line-height: 140px;
	color: #fff;
	font-weight: 600;
	font-size: 3rem;
}


/* HOME GRID */
.home-event-grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 2rem;
  grid-template-areas:
    "bigEvent bigEvent bigEvent"
    "event2 event3 event4";
	padding: var(--section-padding);
}

.home-event-grid-container .event1 { grid-area: bigEvent; }

.home-event-grid-container .event2 { grid-area: event2; }

.home-event-grid-container .event3 { grid-area: event3; }

.home-event-grid-container .event4 { grid-area: event4; }


.home-event-grid-container img{
	width: 100%;
	height: auto;
	display: block;
}
.home-event-grid-container .event-image {

	position: relative
}

.home-event-grid-container .event1 .event-image {
	height: 400px;
	position: relative
}

.home-event-grid-container .event1 img{
	width: 100%;
	height: 100%;
	object-fit: cover;
  object-position: center bottom;
}


.home-event-grid-container .event-image a{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: block;
	z-index: 10;
}

.home-event-grid-container .event-image .caption{
	position: absolute;
	bottom: 20px;
	left: 20px;
	padding: 1rem 2rem;
    background: var(--secondary-color);
    color: #fff;
    font-size: 2rem;
    font-weight: 600;
    display: inline-block;
    border-radius:1rem;
}

.home-event-grid-container .event1 .event-image .caption{
	
    font-size: 3rem;
    background: var(--primary-color);
}

/* END GRID */

@media(max-width: 1150px){
	
	body{
		
    font-size: 1.6rem;
	}
	 :root{
		 --section-padding: 50px 0;
	    --text-h1-size: 3.2rem;
	    --text-h2-size: 2.5rem;
	    --text-h3-size: 1.5rem;
	    --text-h4-size: 1rem;
	 }
	.event-col{
		display: block;
	}
	
	section .teaser-text{
		width: 80%;
		max-width: inherit
	}
	
	.icon-list {
    margin-top: 5.5rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
   
}
	.button{
		font-size: 1.4rem;
	}
	.event-col .event-content-inner {
    
    padding: 50px;
}
.news-image{
	width: 100%;
	
	margin:  0 auto 50px auto;
}
.single section.ptb{
	padding-top: 0
}
}

@media(max-width: 800px){
	.grid .plan h3{
		font-size: 2rem;
	}
	
	.stage #event-timer li{
	}
	
	#subnav ul li.page_item, 
	#subnav ul li.current_page_item{
		display: none;
	}
	#subnav ul li.social-media-links.link1{
		margin-left: 0.8rem;
	}
	.stage #event-timer {
		padding: 2rem;
	}
	.stage #event-timer ul{
		display: grid;
		
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 2rem;
	}
	.stage #event-timer li{
		margin-right: 0;
		min-width: inherit;
		
		box-sizing: border-box;
	}
	
	
	.stage #event-timer li span{
		
    font-size: 1.6em;
	}
	.icon-list {
    grid-template-columns: repeat(2, 1fr);
   
}

.stage #event-subheadline span {
    padding: 1rem 2rem;
    display: block;
    font-size: 3rem;
    text-align: center;
    border-radius: 0;
}

.home-event-grid-container .event1 .event-image{
	height: auto;
}

.home-event-grid-container .event1 .event-image img{
	width: 100%;
	height: auto;
}
.home-event-grid-container{
	display: block;
}
.home-event-grid-container .event1 .event-image .caption{
	font-size: 2rem;
}
.home-event-grid-container .event-teaser{
	margin-bottom: 2rem;
}

.stage .gridder{
	position: static;
}

.stage .gridder .grid{
	width: 100%;
	margin:	0;
}
	.stage .vector{
		display: none;
	}
.grid .plan dt{
	font-size: 1.6rem;
}
	.grid.plans {
    grid-template-columns: repeat(2, 1fr);
    
    margin-top: 5.5rem;

}


.header-spacer{
	display: none;
}
.stage #event-headline span{
	display: block;
	width: 100%;
	padding: 1rem;
	text-align: center;
	border-radius: 0;
    font-size: 3.5rem;
    box-sizing: border-box
}

.stage .gridder .grid #event-detail-stage{
	background: #efefef;
	margin-bottom: 0;
	padding-bottom: 5rem;
}

.grid-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  
  grid-gap: 2rem;
 grid-template-areas:
    "g1 g2 g3"
    "g4 g2 g6"
    "g4 g5 g6"
    "g7 g7 g7"
    "g7 g7 g7"
    "g8 g9 g10"
    "g8 g11 g10";
}
.grid-gallery > a, .grid-gallery .g1, .grid-gallery .g3,.grid-gallery .g11, .grid-gallery .g6{
	min-height: 100px;
	border-radius: 0;
}
.faq-item{
	width: 100%;
}
	header nav{
		display: none;
	}
	
		.hamburger{
		display: block;
		top: 20px;
		position: fixed;
		z-index: 999999;
		right: 20px;
	}
	
	header .grid {
    grid-template-columns: repeat(12, 1fr);
    grid-template-areas: "b0 b0 b0 b0 b0 b0 b0 b0 b0 b0 b0 b0";
    width: 100%;
    margin-left: 0;
}
header .grid #brand{
  
  grid-area: b0;
}

header #brand a{
  width: 12rem;
  margin: 0 0 0 2rem;
}
	header .grid .social-icons{
	display: none;
}

}

@media(max-width: 750px){
	

}

@media(max-width: 500px){
	
	.button-group{
		
    grid-template-columns: 1fr;
    display: grid;
    text-align: center
	}
	.button-group .button, .dropdown{
		width: 100%;
		display: block;
		margin: 12px 0 0 0 ;
		box-sizing: border-box
	}
		.grid.plans {
    grid-template-columns: 1fr;

}

}


.modal-window img{
  width: 100%;
  height: auto;
}


.modal-window {
  position: fixed;
  background-color: rgba(255, 255, 255, 0.65);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
  transition: all 0.3s;
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
.modal-window > div {
  width: 900px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
}

.modal-window.portrait-mode > div {
  
  width: auto;
  height: 90vh;
}

.modal-window.portrait-mode > div img {
  height: 100%;
  width: auto;
} 


@media(max-width: 700px){
  .modal-window.portrait-mode > div {
    
    width: 90%;
    height: auto;
  }
  
  .modal-window.portrait-mode > div img {
    height: auto;
    width: 100%;
  } 
}
.modal-window header {
  font-weight: bold;
}
.modal-window h1 {
  font-size: 150%;
  margin: 0 0 15px;
}

.modal-close {
  color: #fff;
  background: var(--primary-color);
  
  border-radius: 5px;
  line-height: 37px;
  font-size: 22px;
  transform: rotate(45deg);
  position: fixed;
  right: 30px;
  z-index: 99999999;
  text-align: center;
  top: 30px;
  height: 40px;
  width: 40px;
  text-decoration: none;
}
.modal-close:hover {
  color: black;
}