/*------------------------------------*\

    MAIN

\*------------------------------------*/

body {	

    color: #212529;

	font-family:var(--main_font,'Open Sans', sans-serif);

}

img {

	max-width:100%;

	height:auto;

}

iframe {

	max-width:100%;

}

.screen-reader-text {

	display:none!important;

}

#app {

	position:relative;

	overflow:hidden;

	opacity:0;

	transition:300ms;

}

body.loaded #app {

	opacity:1;

}

#app #main {

	padding:20px 0;

	min-height:100vh;

}

#app .contents.single #main {

	padding-top:50px;

}

.contents {

	position:relative;

}

.contents.single {

	background:#fff;

	z-index:10;

    transition: 300ms;

}

#app #main.menuMain {

	min-height:100vh;

	background-size:cover;

	background-position:center;

	background-repeat:no-repeat;

}

h1,h2,h3,h4{

	color:rgb(var(--main_colour,160,160,160));

	font-family:var(--header_font,'Open Sans', sans-serif);

}

 a {

	color:rgb(var(--main_colour,160,160,160));

}

 a:hover {

	color:rgb(var(--main_colour,160,160,160));

}

table td {

	padding:5px 10px;

	border:1px solid #cfcfcf;

}

.btn-primary {

    color: #fff;

    background-color:rgb(var(--main_colour,160,160,160));

    border-color:rgb(var(--main_colour,160,160,160));

}

.btn-primary:hover {

	color: #fff;

    background-color:rgb(var(--main_colour,160,160,160));

    border-color:rgb(var(--main_colour,160,160,160));

}

#app #main.hasbg .menu a{

	color:#fff;

	text-decoration:none;



}

#header {

	background:rgb(var(--main_colour,160,160,160));

	color:#fff;

	font-size:2em;

	position:absolute;

	top:0;

	left:0;

	width:100%;

	height:50px;

	overflow:hidden;

}

#header.loaded {

	position:fixed;	

}



#header .row {

	height:50px;

}

#header .siteTitle{

	text-align:center;

	font-size:16px;

	margin:0;

	color:#fff;

	padding:0 60px;

}

#header .back {

	position:absolute;

	width:60px;

}

#header a{

	color:#fff;

}

.app_logo {

	text-align:center;

	padding:10px 15px;

	padding-bottom:20px;

}

.app_logo img {

	/*height:100px;*/

	width:auto;

}

.appIcon {

	text-align:center;

	padding:10px 0;	

    display: flex;

    align-items: center;

}

.appIcon a{	

    display: block;

	text-decoration:none;

    flex: 1;

}

.appIcon .icon {

	width:2em;

	height:2em;

	color:#fff;

	background:rgb(var(--main_colour,160,160,160));

	color:#fff;

	position:relative;

    border-radius: 50%;

	margin:0 auto 10px;

	font-size:30px;

}

.appIcon .icon > *{

	position:absolute;

	top:50%;

	left:50%;

	transform:translate(-50%,-50%);

}

.appIcon .icon > img{

	width:70%;

	height:70%;

}

.appIcon .link {

	line-height:1.2;

}

.submenu .appIcon a {

	display:flex;

	align-items:center;

}

.submenu .appIcon .icon {

	margin:0 10px;

	flex: 0 0 auto;

}

@media (min-width:992px){

	#app #main {

		padding:50px 0;

	}

	.app_logo {

		padding:25px 15px;

	}

	.appIcon {

		padding:20px 0;

	}

	.appIcon .icon {

		font-size:35px;		

	}

	.appIcon .link {

		font-size:1.2em;

	}

}

/*Single App*/

.container.singleContainer {

	margin-top:30px;

	margin-bottom:50px;

}

#app #main .postThumb {

	width:100%;

	margin-top:-30px;

	margin-bottom:20px;

}

#app #main .postThumb img{

	width:100%;

	max-height:400px;

	object-fit:cover;

}

/*News*/

.list-item{

    overflow: hidden;

    margin-bottom: 20px;

    padding-bottom: 20px;

    border-bottom: 1px solid #ddd;

}

.list-item-image{

	text-align:center;

}

.list-item-image img {

	width:100%;

}

.list-item-image a{

	display:block;

	padding:10px 0;

}

.list-item-text{



}

.list-item-text p.date{

	font-size:0.8em;

	margin:0;

}

/*Events*/

.eventItem {

	margin:0 auto 20px;

}

.eventItem .date{

	background:rgb(var(--main_colour,160,160,160));

	color:#fff;

	text-align:center;

	height: 4.5em;

	width: 4.5em;	

	border-radius: 50%;

	line-height:1.2;	

    text-align: center;

    display: flex;

    flex-direction: column;

    justify-content: center;

    line-height: 1;

}

.eventItem .date .day{

	font-size:1.8em;

	line-height:1;

}

.eventItem .date .month{	

    text-transform: uppercase;

    margin-bottom: 0.1em;

}

.eventItem .eventText {

	padding-bottom:5px;

	margin-bottom:1em;

	border-bottom:solid 1px rgba(var(--main_colour,160,160,160) ,0.5);

}

@media (min-width:992px){

	.eventItem .date{

		font-size:22px;

	}

}

/*Carousel*/

.slick-dots li button {

	color:#000;

}

.slick-dots li:only-child {

	opacity:0;

}

.slick-dotted.slick-slider

{

    margin-bottom: 30px;

}



.slick-dots{

    position: absolute;

    bottom: -25px;

    display: block;

    width: 100%;

    padding: 0;

    margin: 0;

    list-style: none;

    text-align: center;

}

.slick-dots li{

    position: relative;

    display: inline-block;

    width: 20px;

    height: 20px;

    margin: 0 5px;

    padding: 0;

    cursor: pointer;

}

.slick-dots li button {

	font-size: 0;

    line-height: 0;

    display: block;

    width: 20px;

    height: 20px;

    padding: 5px;

	border:solid 2px;

	border-radius:50%;	

    outline: none;

    background: transparent;

}

.slick-dots li button:before {

	color:transparent;

    width:12px;

	height:12px;

	position: absolute;

    top: 50%;

    left: 50%;

    content: '';

    text-align: center;

	background:#000;

	border-radius:50%;

	opacity:0;

	transform:translate(-50%,-50%);

}



.menuMain.hasbg .slick-dots li button:before {

	background:#fff;

}

.slick-dots li.slick-active button:before {

    opacity: 1;

}

#main.hasbg .slick-dots li button {

	color:#fff;

}

.menuitems .slick-arrow {

	font-size: 0;

    line-height: 0;

    position: absolute;

    top: 50%;

    display: block;

    width: 35px;

    height: 50px;

    padding: 0;

    -webkit-transform: translate(0, -50%);

    -ms-transform: translate(0, -50%);

    transform: translate(0, -50%);

    cursor: pointer;

    color: transparent;

    border: none;

    outline: none;

    background: transparent;

    opacity: 0.75;

}

.menuitems .slick-arrow:before {

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

    font-size: 50px;

    line-height: 1;

    opacity: 1;

    color: white;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}

.menuitems .slick-next:before {

	content:'\f054';

}

.menuitems .slick-prev:before {

	content:'\f053';

}

.menuitems .slick-next {

    right: -25px;

}

.menuitems .slick-prev {

    left: -25px;

}

.menuitems .slick-arrow.slick-disabled {

	opacity:0;

}

@media (min-width:768px){

	.app_logo img {

		height:280px;

	}

	#header .siteTitle {
    	font-size: 1em;
	}	

}

@media (min-width:992px){

	.menu .appIcon {

		height:25vh;

	}

	.container.singleContainer {

		max-width:992px;

	}


}