/**
 * Name: Main Style Sheet
 * Domain: https://2stic.nl
 * Version: 1.0
 *
 * Legend:
 * 1. Framework
 * 2. General Declarations
 * 3. Styling
 *
**/
/** Import Fonts **/
@import url('fonts.css');
/** 1. Framework **/
.fullbackground {background-color: #f1f1f1;background-position: center center;background-repeat: no-repeat !important;-webkit-background-size: cover !important;  -moz-background-size: cover !important;-o-background-size: cover !important;background-size: cover !important;}
.page, #main {max-width: 100%;margin: 0 auto;}
.wrap, main > p  {max-width: 960px;margin: 0 auto;}
.wrap.fullwidth {max-width: 100%;margin: 0 auto;padding: 0px;}
.wrap.smallwidth {max-width: 640px;margin: 0 auto;padding: 0px;}
.columns, .wp-block-columns {display: -webkit-flex;display: -webkit-box;display: -moz-flex;display: -moz-box;display: -ms-flexbox;display: flex;-webkit-flex-direction: row;-moz-flex-direction: row;-ms-flex-direction: row;flex-direction: row;-webkit-box-orient: horizontal;-moz-box-orient: horizontal;-ms-box-orient: horizontal;box-orient: horizontal;width: 100%;flex-wrap: wrap;}
.rows {display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -moz-flex;display: -webkit-flex;display: flex;-webkit-flex-direction: column;-moz-flex-direction: column;-ms-flex-direction: column;flex-direction: column;-webkit-box-orient: vertical;-moz-box-orient: vertical;-ms-box-orient: vertical;box-orient: vertical;width: 100%;align-items: stretch;}
.columns > * , .rows > *, .wp-block-columns > * {-webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */-moz-box-flex: 1; /* OLD - Firefox 19- */-webkit-flex: 1; /* Chrome */-ms-flex: 1; /* IE 10 */flex: 1;min-width:233.33px; margin-left: 0px!important; margin-right: 0px!important; padding: 0px;}
.flex{display: flex;flex-wrap:wrap;}
.flex_2{-webkit-box-flex: 2; /* OLD - iOS 6-, Safari 3.1-6 */-moz-box-flex: 2; /* OLD - Firefox 19- */-webkit-flex: 2; /* Chrome */-ms-flex: 2; /* IE 10 */flex: 2;}
.flex_3{-webkit-box-flex: 3; /* OLD - iOS 6-, Safari 3.1-6 */-moz-box-flex: 3; /* OLD - Firefox 19- */-webkit-flex: 3; /* Chrome */-ms-flex: 3; /* IE 10 */flex: 3;}
.center, .aligned{align-items: center;}
.centered{justify-content: center;}
/** 2. General Declarations **/
h1,h2,h3{font-family: 'Exo 2', sans-serif;color:#2c184e;}
a, p, span, div{font-family: 'Open Sans', sans-serif;color:#2c184e;line-height: 1.6em;}
p{margin-top:2em;margin-bottom:2em;}
blockquote{font-style:italic;}
a{color:rgb(238,72,95);}
img{max-width:100%;}
figure{margin:0;text-align:center;}
@media screen and (max-width:767px){
  .hamburger {padding: 15px 15px;display: inline-block;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;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-box {width: 40px;height: 24px;display: inline-block;position: relative; }
  .hamburger-inner {display: block;top: 50%;margin-top: -2px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {width: 40px;height: 4px;background-color: #fff;border-radius: 4px;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; }
  .hamburger-inner::after {bottom: -10px; }
  /*Hamburger animaiton*/
  .hamburger--slider .hamburger-inner {top: 2px; }
  .hamburger--slider .hamburger-inner::before {top: 10px;transition-property: transform, opacity;transition-timing-function: ease;transition-duration: 0.15s; }
  .hamburger--slider .hamburger-inner::after {top: 20px; }
  .hamburger--slider.is-active .hamburger-inner {
    transform: translate3d(0, 10px, 0) rotate(45deg); }
  .hamburger--slider.is-active .hamburger-inner::before {
    transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);opacity: 0; }
  .hamburger--slider.is-active .hamburger-inner::after {
    transform: translate3d(0, -20px, 0) rotate(-90deg); }
}
.pace {
  -webkit-pointer-events: none;pointer-events: none;-webkit-user-select: none;-moz-user-select: none;user-select: none;position: fixed;top: 0;left: 0;width: 100%;-webkit-transform: translate3d(0, -50px, 0);-ms-transform: translate3d(0, -50px, 0);transform: translate3d(0, -50px, 0);
  -webkit-transition: -webkit-transform .5s ease-out;-ms-transition: -webkit-transform .5s ease-out;transition: transform .5s ease-out;
}
.pace.pace-active {-webkit-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
.pace .pace-progress {display: block;position: fixed;z-index: 2000;top: 0;right: 100%;width: 100%;height: 6px;background: rgb(238,72,95);pointer-events: none;}

/** 3. Theme Styling **/
header#header{background:#2c184e;color:#9366bd;height:60px;}
button#menu-toggle{display: none;}
nav.main-navigation ul{list-style: none;padding:0;margin:0;height:60px;}
nav.main-navigation a{text-decoration: none; color:#fff;}
nav.main-navigation a:hover{color:rgb(238,72,95);border-bottom:1px solid rgb(238,72,95);}
nav.main-navigation li.active a{color:rgb(238,72,95);}
.menu{justify-content: space-between;}
div#second-header .bg-row {background: #2c184e;padding-top:90px;}
div#second-header .bg-row .wrap .main-heading:after {content: ' ';background: #2c184e;position: absolute;left: 0;top: 0;border-right: 60px solid #fff;border-top: 60px solid transparent;}
div#second-header .bg-row .wrap .main-heading{background:#fff;height:170px;position: relative;flex-direction: row-reverse;border-top-right-radius: 10px;}
div#second-header .bg-row .wrap .main-heading:before {
    content: ' ';width: 50px;height: 85%;background: rgb(238,72,95);background: linear-gradient(180deg, rgba(238,72,95,1) 0%, rgba(238,72,95,1) 20%, rgba(44,24,78,1) 120%);
    position: absolute;right: -50px; bottom: 0;border-top-right-radius: 10px;
}
div#second-header .bg-row .wrap .main-heading .logo{position: absolute;top:0;transform: translate(-25%, -50%);}
div#second-header .bg-row .wrap .main-heading .content{min-width:640px;transform: translateY(50%);}
div#second-header .bg-row .wrap .main-heading .content h1, div#second-header .bg-row .wrap .main-heading .content p{margin:0;}
div#second-header .bg-row .wrap .main-heading .content h1{text-transform: uppercase;}
div#second-header .bg-row .wrap .main-heading .content p{color:#9366bd;}
div#second-header .bg-row .wrap .main-heading .wrap.smallwidth:before {content: ' ';background: #9366bd;width: 30px;  height: 30px;position: absolute;left: 0;bottom: 0;border-radius: 40px;transform: translate(-50%, 50%);}
div#second-header .wrap .wrap.smallwidth .content p:first-child{margin-top:0;}
/* Generalized */
section{padding-top:40px;}
section .wrap .title h2{font-size: 28px;}
section .wrap .above-colored-container .title{padding-bottom:40px;}
/* News Section */
section.news .wrap .title span{color:#9366bd;}
section.news .wrap .container {background: #edf8fe;max-width: 800px;margin: 0 auto;border: 2px solid #2c184e;border-radius: 10px;}
section.news .wrap .container .wrap.smallwidth ul{padding-left:0;}
section.news .wrap .container .wrap.smallwidth ul li{flex-direction: column;padding: 20px 0;border-bottom: 2px solid #2c184e;}
section.news .wrap .container .wrap.smallwidth ul li:last-child{border-bottom: 0;}
section.news .wrap .container .wrap.smallwidth ul li span{color:rgb(238,72,95); text-transform: uppercase;font-family: 'Exo 2', sans-serif;font-size:22px; }
section.news .wrap .container .wrap.smallwidth ul li p{margin:0;font-size:22px;}
/* Calendar Section */
section.calendar .wrap .title span{color:#9366bd;margin-top:-20px;display: block;}
section.calendar .wrap .container {box-sizing: border-box;background: #e9e7ed;max-width: 800px;margin: 0 auto;border: 2px solid #2c184e;border-radius: 10px;padding:30px 30px 0 30px;}
section.calendar.past .wrap .container{padding:30px 30px 20px 30px;}
section.calendar.past .wrap .container{background:#fbfafb;border-color:#d5d1dc;}
section.calendar .wrap .container ul{padding-left:0;margin:0;}
section.calendar .wrap .container ul li .event{padding: 20px 0;border-bottom: 2px solid #2c184e;}
section.calendar .wrap .container ul li:last-child .event{border-bottom:0;}
.calendar-head {border-bottom: 2px solid #2c184e;padding-bottom: 20px;}
.calendar-head span{text-transform: uppercase;font-family: 'Exo 2', sans-serif;font-size:16px;}
.calendar-head span.date-head {margin-right: 50px;}
section.calendar .wrap .container ul.calendar-items li.calendar-item .date{height: 66px;}
section.calendar .wrap .container ul.calendar-items li.calendar-item .date span.year{color:#9366bd;}
section.calendar .wrap .container ul.calendar-items li.calendar-item{align-items: center;}
section.calendar .wrap .container ul.calendar-items li.calendar-item .event {flex: 1;justify-content: space-between;align-items: center;position: relative;}
section.calendar .wrap .container ul.calendar-items li.calendar-item .event p{margin:0;font-size:22px;}
section.calendar .wrap .container ul.calendar-items li.calendar-item .date {flex-direction: column;align-items: center;margin-right: 45px;height:66px;width:45px;}
section.calendar .wrap .container ul.calendar-items li.calendar-item .date span{text-transform: uppercase;font-family: 'Exo 2', sans-serif;color:rgb(238,72,95);line-height: 22px;}
section.calendar .wrap .container ul.calendar-items li.calendar-item .date span.day{color:#2c184e;font-size:32px;}
a.ticket-link {background: #2c184e;color: #fff;padding: 12px 36px;text-decoration: none;position: absolute;right: 0;width:180px;text-align: center;transition: .3s ease-in;}
a.ticket-link:hover {background: rgb(238,72,95);transition: .3s ease-out;}
/* Article section */
section.article .wrap .title h2{text-align: center;}

.notice{font-size: 1.4em;color: red;}

/* Footer */
footer#footer{padding-top:80px;}
footer#footer .wrap .container{max-width:800px;margin:0 auto;border-top: 2px solid #e9e7ed;border-bottom:2px solid #e9e7ed;}
footer#footer .wrap .container .footer-text h2{font-size: 28px;text-align: center;}
.images {justify-content: space-around;min-height:100px;}
.images .image {display: flex;align-items: center;}
.footer-logo {padding: 100px 0;float: right;}
/* Responsive */
@media screen and (max-width:767px){
  .bg-row .wrap{padding:0;}
  .bg-row .wrap.smallwidth{padding:0 60px;}
  .wrap.smallwidth:before{content:none !important;}
  ul.menu {flex-direction: column;height: 100% !important;position: absolute;left: 0;right: 0;z-index: 999;  background: #2c184e;top: 0;justify-content: center;visibility: hidden;margin-top:-10%;transition: margin .3s ease-in;}
  .publications .wrap.smallwidth{min-height:150px; display: flex;align-items: flex-end;}
  button#menu-toggle {position: absolute;z-index: 9990;display: block;top:2%;right:5%;}
  ul.menu li.item {padding: 15px 0;}
  nav.active ul.menu{visibility: visible;margin-top:0;transition: margin .3s ease-out;}
  div#second-header .bg-row .wrap .main-heading .logo{left:0;right:0;transform: translateY(-50%);}
  div#second-header .bg-row .wrap .main-heading .logo img{display: block;margin:auto;}
  .wrap.smallwidth{padding:0 40px;}
  .wrap{padding:0 20px;}
  div#second-header .bg-row .wrap .main-heading:before{content:none;}
  div#second-header .bg-row .wrap .main-heading:after {content: ' ';background: #2c184e;position: absolute;left: 0;top: 0;border-right: 30px solid #fff;border-top: 30px solid transparent;}
  div#second-header .bg-row .wrap .main-heading{height:240px;}
  body.about div#second-header .bg-row .wrap .main-heading{height:160px;flex-direction: column;}
  body.about div#second-header .bg-row .wrap .main-heading .content{padding-top:60px;}
  div#second-header .bg-row .wrap .main-heading .content{min-width: auto;transform: translateY(25%) /* override of 50% */;}
  div#second-header .bg-row .wrap .main-heading .wrap.smallwidth:before{bottom:50%; z-index:9;}
  .event a.event-link, .event a.ticket-link{display: none;}
  footer#footer .wrap .container .footer-text h2{font-size: 17px !important; padding-bottom: 20px !important;}
  .images{align-items: center !important;flex-direction: column;}
  .images .image{margin:20px 0;}
  .footer-logo{float:inherit !important;}
  .footer-logo img{display: block; margin:auto;}
}
@media screen and (min-width:768px) and (max-width:1024px){
  .wrap{padding:0 40px;}
  div#second-header .bg-row .wrap .main-heading:before{content:none;}
}
/** END OF STYLE **/
