/* hidden on default */
div#popup { display: none; }

/* use a media query to filter small devices */
@media only screen and (max-device-width:600px) {
    /* show the popup */
    div#popup {
		display: block;
		position: relative;
		margin:auto;
		margin-top:200px;
		width:80%;
		height:360px;
		background: rgba(255,255,255,0.8);
		border:1px solid #333;
		z-index:3000;
		margin-bottom: -640px;
		text-align: center;
		padding-top:80px;
		-webkit-border-radius: 9px;
		-moz-border-radius: 9px;
		border-radius: 9px;
		-webkit-box-shadow: 3px 3px 5px 0px rgba(170,170,170,1);
		-moz-box-shadow: 3px 3px 5px 0px rgba(170,170,170,1);
		box-shadow: 3px 3px 5px 0px rgba(170,170,170,1);
		 }
}
.switch {
	display:block;
	width:90%;
	position: relative;
	margin:auto;
	text-align: center;
	height:80px;
	background:#00A4DF;
	text-decoration:none;
	border: 1px solid #006b91;
	padding-top:30px;
	font-family: 'Raleway', sans-serif;
	font-size: 2.1em;
	color: #FFF;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: 3px 3px 5px 0px rgba(170,170,170,1);
	-moz-box-shadow: 3px 3px 5px 0px rgba(170,170,170,1);
	box-shadow: 3px 3px 5px 0px rgba(170,170,170,1);
}
* {
	margin: 0px;
	padding: 0px;
}
img {
	border: none;
}
body {
	background-image:url(../img/bg-sky-tile02.jpg);
	background-repeat: repeat;
	background-attachment:fixed;
}
.fadeInBlock {
    opacity:0;
}
#wrapper {
	position:relative;
	margin:auto;
  	margin-top:0px;
	width: 1022px;
	height: auto;
	overflow:visible;
}
#header {
	position:relative;
	display:inline-block;
	top:0px;
	width: 100%;
	height:400px;
	background-image:url(../img/clouds.png);
	background-position:0 50%;
	background-repeat:no-repeat;
}
a { outline:none; }
#mainNav {
	position:relative;
	margin:auto;
	width: 850px;
	height: 60px;
}
#mainNav a {
	position: relative;
	float:right;
	margin-left:1px;
	text-align:center;
	font-family: 'Raleway', sans-serif;
	padding-top:6px;
	color: #FFF;
	text-decoration: none;
	width:120px;
	height:30px;
	background:#00A4DF;
}
#mainNav a:hover {
	height:36px;
	padding-top:16px!important;
}
.active {
	background-color:#4A79C2!important;
}
#title {
	position:relative;
	width: 100%;
	height: 240px;
	margin:auto;
	margin-top:0px;
	text-align: center;
	background-image:url(../img/nation-of-gondwana-2016.png);
	background-position:center center;
	background-repeat:no-repeat;
	font-family: 'Raleway', sans-serif;
	font-size:1.1em;
	color: #4A79C2;
}	
#island {
	position:absolute;
	margin-top:-160px;
	margin-left:0px;
	width: 100%;
	height: 1600px;
	background-image:url(../img/islandbg.png);
	background-repeat:no-repeat;
	z-index: 100;
}
#tree {
	position: absolute;
	top:-40px;
	margin-left:270px;
	z-index: 100;
}
#beaconre {
	position: absolute;
	top:514px;
	margin-left:825px;
	z-index: 100;
}
#beaconle {
	position: absolute;
	top:317px;
	margin-left:146px;
	z-index: 100;
}
#eyes {
	position: absolute;
	top: 332px;
	margin-left: 576px;
	z-index: 100;
}
#fire {
	position: absolute;
	margin-top: 315px;
	margin-left: 619px;
	width: 49px;
	height:36px;
	z-index: 100;
}
#ghostone {
	position:absolute;
	margin-top: 415px;
	margin-left: 399px;
	width:622px;
	height:552px;
	background-image:url(../images/1315.png);
	z-index:2000!important;
	display:none;
}
#ghosttwo {
	position:absolute;
	margin-top: 800px;
	margin-left: 0px;
	width:588px;
	height:450px;
	background-image:url(../images/smokeghost-body-le-014.png);
	z-index:2000!important;
	display:none;
	}
#ghosthead {
	position:absolute;
	margin-top: 740px;
	margin-left: 400px;
	width:270px;
	height:284px;
	background-image:url(../images/smokeghost-head3.png);
	z-index:2000!important;
	display:none;
}
#ghosteyes{
	position:absolute;
	margin-top: 110px;
	margin-left: 30px;
	width:156px;
	height:109px;
	background-image:url(../images/smokeghost-eyes.png);
	z-index:2000!important;
	display:none;
}
#strobeleft {
	position:absolute;
	margin-top: 781px;
	margin-left: 145px;
	width: 185px;
	height:206px;
	background-image:url(../img/strobe-left.png);
	z-index: 100;
	display:none;
}
#rocks {
	position:absolute;
	margin-top: 831px;
	margin-left: 300px;
	width: 370px;
	height:500px;
	z-index: 100;
}
#artists {
	position:absolute;
	margin:auto;
	margin-top:120px;
	width:1022px;
	height:1020px;
	color:#ED1C9F;
	padding:40px;
	font-family: "brandon-grotesque",sans-serif;
	font-weight:900;
	font-size:32px;
	z-index:1000;
	
	text-transform:uppercase;
	text-shadow:rgba(255, 255, 255, 0.7) 2px 1px 2px;
}
.live {
	font-family: 'Merriweather', serif;
	margin-bottom:10px;
	vertical-align: 3px;
	display:inline-block;
	text-transform:none;
	font-style:italic;
	font-weight: 300;
	font-size: 18px;
	-moz-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	-webkit-transform: rotate(-3deg);

	transform: rotate(-3deg);
}
#footer {
	position:absolute;
	margin-top:1660px;
	width:100%;
	height:300px;
	border-top: 1px solid #3B579D;
	z-index:2000;
	font-family: 'Raleway', sans-serif;
	color: #00A4DF;
}
#footer a{
	float:left;
	margin-top:20px;
	margin-right:40px;
	height:40px;
	font-family: 'Raleway', sans-serif;
	color: #00A4DF;
	text-decoration: none;
}
.impressum{
	float:right;margin-top:10px;color: #00A4DF;
}
.impressum a{
	text-align: right;
}
.intro {
	-webkit-animation: fadein 4s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 4s; /* Firefox < 16 */
        -ms-animation: fadein 4s; /* Internet Explorer */
         -o-animation: fadein 4s; /* Opera < 12.1 */
            animation: fadein 4s;
}
.introone {
	-webkit-animation: fadein 15s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 15s; /* Firefox < 16 */
        -ms-animation: fadein 15s; /* Internet Explorer */
         -o-animation: fadein 15s; /* Opera < 12.1 */
            animation: fadein 15s;
}
.introtwo {
	-webkit-animation: fadein 8s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 8s; /* Firefox < 16 */
        -ms-animation: fadein 8s; /* Internet Explorer */
         -o-animation: fadein 8s; /* Opera < 12.1 */
            animation: fadein 8s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}


