/* CSS Document */

/* opening */
.opening {
	opacity: 0;
	margin: 0 auto;
	text-align: center;
	}
.opening.baseH img {
	position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
	}

/* header */
header h1 {
	position: absolute;
	}
header h1 a img {
	max-width: 135px;
    max-height: none;
	}

/* Mainimage */
.mainimage {
	height: 200px;
	margin: 75px 0 1.4rem 0;
	background: url(../img/topMainimage.jpg) no-repeat center center transparent;
	background-size: cover;
	}

/* Leaflet */
.leaflet figure, .leaflet figure img {
	margin: 0 auto 1.4rem auto;
	width: 100%;
	}
.leaflet figure > a {
	background: transparent;
	padding: 0;
	border: none;
	}
.leaflet figure figcaption {
	text-align: left;
	font-size: 1.6rem;
	}

/* News Release */
.news p {
	text-align: right;
	}

/* Events */
.events h2 {
	padding: 0 0 0 5px;
	}
.events h2.activity { border-left: 15px solid #E78F3D; }
.events h2.wakka { border-left: 15px solid #60B5BC; }
.events h2.wakka1 { border-left: 15px solid #60B5BC; }
.events h2.instagram { border-left: 15px solid #E69093; }
.events ul {
	margin: 0 0 2.8rem 0;
	}
.events li {
	float: left;
	width: 48%;
	}
.events li:nth-child(even) {
	margin: 0 0 4% 2%;
	}
.events li:nth-child(odd) {
	margin: 0 2% 4% 0;
	}
.events li a {
	border: none;
	}
.events li a[target="_blank"] {
	background: none;
	padding: 0;
	}

/* Access */
.access .mapWrap {
	margin: 0;
	}
.access .link {
	margin: 0.5rem 0;
    text-align: right;	
	}
.access .link li {
	display: inline-block;
    margin: 0 0 0 1.4rem;
	}

/* Banner */
.bnr li {
	margin: 0 auto 1.4rem auto;
	max-width: 468px;
	}
.bnr a {
	background: #fff;
	padding: 0;
	}
.bnr a:hover {
	border: none;
	opacity: 0.8;
	}


/*
------------------------------

  for desktop

------------------------------
*/
@media screen and ( min-width: 480px ) {
	/* header */
	header h1 a img {
		max-width: 255px;
		margin: 0 0 0 0;
		}

	/* mainimage */
	.mainimage {
		height: 450px;
		margin: 0 0 1.4rem 0;
		}
	
	/* Leaflet */
	.leaflet figure img {
		float: left;
		margin: 0 1.4rem 1.4rem 0;
		}
	
	/* Events */
	.events h2 {
		padding: 7px 0 5px 15px;
		}
	.events h2.activity   { border-left: 15px solid #E78F3D; }
	.events h2.perform { border-left: 15px solid #60B5BC; }
	.events h2.instagram { border-left: 15px solid #E69093; }
	.events li {
		width: 23.5%;
		margin: 0 2% 2% 0 !important;
		}
	.events li:nth-child(4n) {
		margin: 0 0 2% 0 !important;
		}
	/* Banner */
	.bnr li {
		float: left;
		margin: 0.5rem;
		max-width: 310px;
		}
}

@media screen and ( max-width: 640px ) and ( min-width: 481px ) {
	/* header */
	header h1 a img {
		max-width: 135px;
		}
}