* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	}
body {
	font-family: "brandon-grotesque", sans-serif;
	font-size: 20px;
	line-height: 1.3em;
	margin: 0px;
	font-weight: 500;
	color: rgb(0, 0, 0);
	background: rgb(255, 255, 255);
	letter-spacing: 0.01em;
}
#dimmer {
	background: rgba(0, 0, 0, 0.4);
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 1;
	display: none;
}
a {
	color: rgb(251, 58, 27);
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
h1, h2, h3 {
	font-family: "Gloock", serif;
	font-weight: 400;
	letter-spacing: 0.03em;
}
h1 {
	font-size: 2em;
}
h2 {
	font-size: 1.5em;
	line-height: 1.1em;
}
h3 {
	font-size: 1.2em;
}
p {
	margin: 15px 0px;
}
p.lead {
	font-size: 1.4em;
	font-style: italic;
	font-weight: 300;
}
.page_container {
	width: 100%;
	float: left;
}
.section_container {
	width: 1200px;
	margin-left: auto;
	margin-right: auto;
}
.section_content {
	width: 100%;
	padding: 20px;
}
#section_top .section_content {
	position: relative;
	min-height: 150px;
}
#top_logo {
	position: absolute;
	bottom: -130px;
	left: 0px;
}
.innerpage #top_logo {
	bottom: -79px;
}
.innerpage #top_logo img{
	width: 190px;
}
#top_logo img{
	width: 250px;
	height: auto;
}
#top_menu {
	float: right;
	font-size: 1.3em;
	text-transform: uppercase;
	margin-top: 50px;
}
#top_menu .menu_item {
	display: inline-block;
	margin-left: 15px;
	color: rgb(24, 15, 78);
}
#top_menu .menu_item:hover {
	text-decoration: none;
	color: rgb(251, 58, 27);
	border-bottom: 3px solid rgb(251, 58, 27);
	cursor: pointer;
}
#top_menu .menu_item .fa {
	margin-left: 3px;
}
#mobilemenu_container {
	width: 100%;
	padding-left: calc(50% - 600px);
	padding-right: calc(50% - 600px);
	position: absolute;
	top: 80px;
	left: 0px;
	z-index: 2;
	height: 1px;
	display: none;
}
#mobilemenu {
	position: relative;
	background: rgb(255, 255, 255);
	top: 0px;
	width: 300px;
	padding: 20px;
	text-transform: none;
	float: right;
}
.mobilemenu_header {
	display: block;
	width: 100%;
	border-top: 2px solid rgba(0, 0, 0, 0.2);
	padding: 6px 0px;
	text-transform: uppercase;
}
.mobilemenu_item {
	display: block;
	width: 100%;
	font-size: 0.85em;
	padding: 2px 0px 4px 10px;
}
.desktop_hide {
	display: none;
}
#mobilemenu .three-columns {
	display: none;
}
#close_menu {
	width: 100%;
	padding: 0px 0px 6px 0px;
	text-align: right;
	text-transform: uppercase;
	font-size: 0.85em;
	margin-top: -10px;
}
#close_menu:after{
  display: inline-block;
  content: "\00d7";
  font-weight: 100;
  font-size: 2.1em;
  position: relative;
  top: 7px;
  margin-left: 5px;
}
#close_menu:hover {
	cursor: pointer;
	text-decoration: underline;
}
#section_hero {
	background: url(img/background_1.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
	color: rgb(255, 255, 255);
	font-family: "Gloock", serif;
	font-weight: 400;
	text-shadow: 0px 0px 30px rgba(0, 0, 0, 0.7); 
	letter-spacing: 0.03em;
	font-size: 3em;
	line-height: 1.2em;
	text-align: center;
	min-height: 400px;
}
#section_hero .section_content {
	padding: 200px 150px;
}
#section_frontpage_info, #section_page {
	background: rgb(232, 167, 5);
}
#section_page {
	font-weight: 400;
}
#section_page .section_content {
	padding: 30px;
	background: rgb(255, 255, 255);
	margin: 60px 0px;
	overflow: auto;
}
#section_page h1:first-child{
	margin-top: 10px;
	line-height: 1.1em;
	overflow-wrap: break-word;
	hyphens: auto;
	hyphenate-character: "-";
}
#section_quicklinks .third {
	float: left;
	width: 33.333%;
	padding: 40px;
	text-align: center;
}
#section_quicklinks .third h3 {
	font-size: 1.5em;
	margin: 0px;
}
.quicklinks_icon {
	width: 130px;
	height: auto;
}
#top_lang {
	float: left;
	width: 100%;
	text-align: right;
	font-size: 0.8em;
}
.lang {
	color: rgb(24, 15, 78);
	text-decoration: none;
	display: inline-block;
	text-transform: uppercase;
	margin: 0px 0px 0px 8px; 
	line-height: 1.2em;
}
.lang:hover {
	text-decoration: none;
	color: rgb(251, 58, 27);
	border-bottom: 2px solid rgb(251, 58, 27);
	cursor: pointer;
}
.lang_selected {
	border-bottom: 2px solid rgb(24, 15, 78);
}
#quicklink_circle_container {
	width: 100%;
	float: left;
	margin-top: -100px;
	margin-bottom: 50px
}
.quicklink_circle {
	display: block;
	float: left;
	background: rgb(255, 255, 255);
	width: 320px;
	height: 320px;
	border-radius: 160px;
	text-align: center;
	padding: 30px 20px;
	color: rgb(0, 0, 0);
	position: relative;
	margin-left: 100px;
}
.quicklink_circle:first-child {
	margin-left: 0px;
}
.quicklink_circle:hover {
	text-decoration: none;
	cursor: pointer;
	top: -5px;
	box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.2);
}
.quicklink_circle img {
	width: 100px;
	height: auto;
}
.quicklink_circle h2 {
	margin: 0px;
	line-height: 1.2em;
}
.image_right {
	float: right;
	max-width: 450px;
	height: auto;
	margin-left: 30px;
	margin-bottom: 30px;
	margin-top: 30px;
}
.image_left {
	float: left;
	max-width: 450px;
	height: auto;
	margin-right: 30px;
	margin-bottom: 30px;
	margin-top: 30px;
}
.image_center {
	display: block;
	max-width: 800px;
	height: auto;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 30px;
	margin-top: 30px;
}
.image_fullwidth {
	width: 100%;
	margin-bottom: 30px;
	margin-top: 30px;
	height: auto;
}
#frontpage_info {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	overflow: hidden;
	margin: 50px 0px 100px 0px;
	float: left;
}
#frontpage_info .frontpage_column {
  background: rgb(255, 255, 255);
}
#frontpage_events {
	flex: 1.1;
}
#frontpage_news {
	flex: 2;
	margin-left: 50px;
}
.frontpage_column h2 {
	font-size: 2em;
	line-height: 1.5em;
	margin: 0px;
	padding: 0px 0px 10px 0px;
	background: rgb(232, 167, 5);
	width: 100%;
}
.events_container, .news_container {
	width: 100%;
	padding: 30px;
	float: left;
}
.events_item, .news_item {
	width: 100%;
	float: left;
	margin-top: 50px;
}
.events_item:first-child, .news_item:first-child {
	margin-top: 0px;
}
.events_date_list {
	font-size: 0.75em;
	margin-bottom: 10px;
}
.events_date {
	width: 70px;
	float: left;
	padding-right: 20px;
}
.events_month, .events_day, .events_year {
	width: 100%;
	float: left;
	text-align: center;
	font-size: 0.9em;
}
.events_month {
	text-transform: uppercase;
	margin-bottom: 10px;
	line-height: 0.9em;
}
.events_day {
	font-size: 2em;
	font-family: "Gloock", serif;
	font-weight: 400;
	letter-spacing: 0.03em;
}
.events_year {
	line-height: 0.9em;
	margin-top: 5px;
}
.events_header {
	border-left: 2.5px solid rgb(251, 58, 27);
	float: left;
	width: calc(100% - 70px);
	padding-left: 20px;
	min-height: 74px;
}
.events_header h3, .news_item h3 {
	font-family: "brandon-grotesque", sans-serif;
	font-size: 1.2em;
	letter-spacing: 0em;
	line-height: 1.3em;
	font-weight: 700;
	margin: 0px 0px 10px 0px;
}
.news_image {
	width: 150px;
	height: 150px;
	border-radius: 75px;
	background-position: center center;
	background-size: cover;
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
}
.news_date {
	font-size: 0.75em;
	margin-bottom: 10px;
}
.news_item p {
	margin: 5px 0px 14px 0px;
}
.more_link {
	font-size: 0.9em;
	font-weight: 700;
	text-transform: uppercase;
}
#quicklinks {
	float: left;
	width: 100%;
	margin: 50px 0px;
}
#section_contact {
	min-height: 200px;
	background: url(https://meteoria.fi/media/background_bottom.png);
	background-size: 1200px auto;
	color: rgb(255, 255, 255);
	font-weight: 400;
	padding-top: 30px;
}
.contact_header h2, .contact_text, #copyright {
	padding: 20px;
	background: rgb(24, 15, 78);
}
.contact_header {
	width: 40%;
	float: left;
	text-align: right; 
}
.contact_header h2 {
	font-size: 2em;
	display: inline-block;
}
.contact_text {
	width: 60%;
	float: left;
}
.contact_logo {
	width: 180px;
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
}
.contact_table th {
	text-align: right;
	vertical-align: top;
	text-transform: uppercase;
	font-weight: 400;
	font-size: 0.8em;
	padding: 2px 20px 0px 0px;
}
#copyright {
	display: inline-block;
	float: left;
}
.mce-accordion summary h3 {
	display: inline;
}

@media (max-width: 1280px) {
	.section_container {
		width: 960px;
	}
	#mobilemenu_container {
		padding-left: calc(50% - 480px);
		padding-right: calc(50% - 480px);
	}
	.quicklink_circle {
		width: 266px;
		height: 266px;
		margin-left: 60px;
	}
	.quicklink_circle img {
		width: 80px;
	}
	.quicklink_circle h2 {
		font-size: 1.3em;
	}
	#section_hero .section_content {
		padding: 160px 150px;
	}
}
@media (max-width: 960px) {
	.section_container {
		width: calc(100% - 40px);
	}
	#mobilemenu_container {
		padding-left: 0px;
		padding-right: 0px;
	}
	#mobilemenu {
		margin-right: 20px;
	}
	body {
		font-size: 18px;
	}
	.quicklink_circle {
		width: 250px;
		height: 250px;
	}
	.quicklink_circle:first-child {
		margin-left: calc(50% - 280px);
	}
	.quicklink_circle:last-child {
		margin-left: calc(50% - 125px);
	}
	.image_right {
		max-width: 300px;
	}
	.image_left {
		max-width: 300px;
	}
	.image_center {
		max-width: 100%;
	}
}
@media (max-width: 876px) {
	.desktop_hide {
		display: block;
	}
	#top_menu {
		margin-top: 21px;
	}
	#top_lang, #top_menu .menu_item {
		display: none;
	}
	#top_menu #menu_open {
		display: inline-block;
	}
	#mobilemenu_container {
		top: 20px;
	}
	#mobilemenu .three-columns {
		display: flex;
		width: 100%;
	}
	#mobilemenu .column {
		flex: 1; /* Equal width columns */
		text-align: center;
		padding: 20px;
		box-sizing: border-box;
	}
	#top_logo img {
		width: 160px;
	}
	#section_top .section_content {
		min-height: 100px;
	}
	#top_logo {
		bottom: -72px;
	}
	#section_page .section_content {
		margin: 30px 0px;
	}
	.events_date {
		width: 100%;
		padding-bottom: 10px;
	}
	.events_header {
		width: 100%;
		border-top: 2.5px solid rgb(198, 40, 40);
		border-left: 0px;
		padding-left: 0px;
		padding-top: 10px;
	}
	.events_day, .events_month, .events_year {
		font-family: "brandon-grotesque", sans-serif;
		font-size: 1em;
		display: inline;
		width: auto;
		margin: 0px;
		line-height: 1em;
		margin-right: 5px;
		font-weight: 500;
	}
	.events_day:after {
		content: ', ';
	}
	.events_year {
		width: auto;
		font-size: 1em;
		margin-top: 0px;
		line-height: 1em;
	}
	.innerpage #top_logo {
		bottom: -56px;
	}
	.innerpage #top_logo img{
		width: 132px;
	}
}
@media (max-width: 700px) {
	#mobilemenu {
		float: none;
		width: calc(100% - 60px);
		margin: 30px;
		font-size: 1.2em;
	}
	.about_text, .contact_text {
		float: left;
		width: 100%;
	}
	#section_contact {
		padding-top: 0px;
	}
	#section_contact .section_content {
		padding: 0px;
	}
	#section_hero {
		font-size: 2.5em;
		min-height: 330px;
	}
	#section_hero .section_content {
		padding: 80px 40px;
	}
	#quicklink_circle_container {
		margin-top: -68px;
		margin-bottom: 0px;
	}
	.quicklink_circle, .quicklink_circle:first-child, .quicklink_circle:last-child {
		width: 100%;
		margin: 10px 0px;
		height: auto;
		padding: 18px 10px;
	}
	.quicklink_circle img {
		float: left;
		width: 45px;
		margin: 0px 10px;
	}
	.quicklink_circle h2 {
		width: calc(100% - 65px);
		float: left;
		text-align: left;
		margin-top: 10px;
	}
	.quicklink_circle h2 br {
		display: none;
	}
	#quicklinks {
		margin: 50px 0px;
	}
	#quicklinks .third {
		width: 100%;
		margin: 30px 0px;
		text-align: left;
		padding: 0px;
	}
	#quicklinks .quicklinks_icon {
		display: block;
		float: left;
		margin-right: 20px;
	}
	#section_frontpage_info .section_container {
		width: 100%;
	}
	#frontpage_info {
		display: block;
		background: rgb(255, 255, 255);
		padding: 20px 30px;
	}
	#frontpage_events, #frontpage_news {
		flex: none;
		width: 100%;
		margin-left: 0px;
		display: block;
		float: left;
	}
	#frontpage_news {
		margin-top: 30px;
	}
	.frontpage_column h2 {
		background: none;
	}
	.events_container, .news_container {
		padding: 0px;
	}
	.image_right, .image_left, .image_center, .image_fullwidth {
		float: none;
		max-width: 100%;
		margin-left: 0px;
		margin-right: 0px;
		width: 100%;
		height: auto;
	}
}