@font-face {
	font-family: "Agrandir-C4-Medium";
	src: url('assets/fonts/Agrandir-C4-Medium.woff') format('woff');
}
@font-face {
	font-family: "Agrandir-D3-WideRegular";
	src: url('assets/fonts/Agrandir-D3-WideRegular.woff') format('woff');
}		


@font-face {
	font-family: "Agrandir-C5-Bold";
	src: url('assets/fonts/Agrandir-C5-Bold.woff') format('woff');
}	

@font-face {
	font-family: "Agrandir-A2-NarrowLight";
	src: url('assets/fonts/Agrandir-A2-NarrowLight.woff') format('woff');
}	
			
@font-face {
	font-family: "AgrandirVariable";
	src: url('assets/fonts/AgrandirVariable.ttf') format('truetype');
} 


main{
	display: block;
}

body{
	background-color: rgb(235, 236, 236);
	font-family: "Agrandir-C4-Medium";
	font-size: 16px;
	line-height: 20px;
	margin-left: 20px;
	margin-top: 15px;
	margin: 0;
	padding: 0;
	
}

strong{
	font-family: "Agrandir-C5-Bold";
}


html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  }
  
  
  

h1{
	font-weight: normal;
	font-size: 32px;
	line-height: 38px;
}


h2{
	font-weight: normal;
	    font-size: 20px;
    line-height: 25px;
}

h3,h4,h5,h6{
	font-size: inherit;
	line-height: inherit;
	font-weight: normal;
	margin: 0;
	padding: 0;
}

ul{
	padding: 0;
	list-style-type: none;
}

.clear{
	clear: both;
}

a{
	text-decoration: none;
	color: black;
}
a:hover{
	color: #10693e
}

.light-italic
{    font-family: "Agrandir-D3-WideRegular";
    font-style: italic;
}

.light
{    font-family: "Agrandir-A2-NarrowLight";
}

img{
	max-width: 100%;
	height: auto;
}


.page-wrap{
	margin-left: 20px;
	margin-right: 20px;
	margin-top: 10px;
}


main{
	margin-top: 50px;
}


section em {
    font-family: "Agrandir-D3-WideRegular";
}


audio{
	max-width: 100%;
}

/* menu */


.menu > ul > li.active-submenu > a >.dot{
/*    ...this will only affect the first level. */
background: #10449e;

}

.menu > ul > li.active > a >.dot{
/*    ...this will only affect the first level. */
background: #10449e;

}



.menu > ul > li > ul > li.active > a > .dot{
/*    ...this will only affect the second level. */

background: green;

}


.menu .menu-items{
	margin: 0;
	padding: 0;
	
	padding-top: 10px;
	padding-bottom: 10px;
	background: rgb(235, 236, 236);

	position: relative;
	
	margin-bottom: 15px;
}

.menu{
	z-index: 99;

}

.menu .menu-item{
	display: inline-block;
	margin-right: 20px;

}

.submenu{
	margin: 0;
	padding: 0;
	
	padding-top: 10px;
	padding-bottom: 10px;


	position: absolute!important;
	left: 0;
	top: 28px;
	
	right: 0;

	background: rgb(235, 236, 236);

}



.menu-item.Vagant{
    font-family: "Agrandir-D3-WideRegular";
    font-style: italic;
}

.dot {
	display:inline-block;
	width:10px;
	height:10px;
	border-radius:50%;
	margin-right:4px;
	margin-bottom: 1px;
	background:white;
}


.menu a:hover > .dot{
	background: #3a3333;
}

.hamburger{
	display: none;
	cursor: pointer;
}



/*

language selector
*/
.lang{
	position: absolute;
	right: 0;
}

.lang .wpml-ls-statics-shortcode_actions a{
	background: none;
}


.lang .wpml-ls-statics-shortcode_actions, .wpml-ls-statics-shortcode_actions .wpml-ls-sub-menu, .wpml-ls-statics-shortcode_actions a{
		background: none;

}


.lang .wpml-ls-legacy-list-horizontal {
	padding: 0;
	background: 0;
	border: 0;
}

.lang .wpml-ls-legacy-list-horizontal a{
	padding: 0;
}








/* index */


.half{
	width: 50%;
	float: left;
	padding-right: 50px;

	
}

.frontpage-text{
		font-size: 20px;
	line-height: 25px;

}
.frontpage-news{
	margin-top: 50px;
}
.frontpage-news p:last-of-type {
    margin-bottom: 0;
}



.frontpage .high-tides .tides {
    font-family: "AgrandirVariable";
    font-variation-settings: 'wght' 400;
    position: absolute;
	font-size: 20px;
	line-height: 25px;
}
.frontpage .high-tides{
overflow: hidden;
}

/*
.frontpage  .high-tides #starfish {
    width: 100%;
    height: 100%;
}
*/
.frontpage  .high-tides #starfish {

/*
    width: 600px;
    height: 700px;
*/
/*
	margin-left: inherit;
	margin-right: inherit;
	
	position: relative;
 	left: -25vw;
*/

}



/*

content
*/
.col1 {
    width: 351px;
    float: left;
    margin-right: 30px;
    min-height: 1px; /* make empty div floating */
}

.col2 {
    width: 550px;
    float: left;
    margin-right: 30px;
    min-height: 1px; /* make empty div floating */
    
}

.col3 {
    width: 350px;
    float: left;
}


.subheadline{
	font-size: 20px;
	line-height: 25px;
}


.col1 .image,
.col2 .image,
.col3 .image,
.col1 .gallery,
.col2 .gallery,
.col3 .gallery
{
	margin-top: 12px;
}


.carousel-cell {
  width: 100%;
  
}

.single h1{
	margin-bottom: 15px;
}





/* news loop */

.news-post{
	margin-bottom: 70px;
	font-size: 16px;
	line-height: 20px;
	width: 1000px;
}


.news-post .text p:last-of-type{
	margin-bottom: 0;
}


.news-post .image{
	width: 350px;
}



/* archive loop */


.archive h1{
	margin-bottom: 25px;
}

.archive .post .image{
	width: 280px;
margin-bottom: 8px;
	
}

.archive .post .text{
	float: left;
}
/*
.archive .post .text p:first-child{
	margin-top: 0;
}
*/




/* participants-archive loop */

.archive h2{
	margin: 0;
	margin-bottom: 8px;
}







/* tides */

.tides-text{
    font-size: 20px;
    line-height: 25px;	
    
    width: 850px;
}


.tides #starfish {
    width: 1000px;
    height: 700px;
    margin-left: auto;
    margin-right: auto;
}




.tides{
	position: relative;
}


.tides .digermulen{
	left: 50%;
    top: 16%;

}

.tides .skrova{
	top: 50%;
    left: 15%;
}


.tides .ramberg{
	 right: 15%;
    top: 35%;
}

.tides .valberg{
	bottom: 13%;
    left: 46%;
}


.tides .place{
	position: absolute;
	font-size: 32px;
	line-height: 38px;
}






/* read-more post */

.read-more-post{
	margin-bottom: 70px;
	font-size: 16px;
	line-height: 20px;
/* 	width: 1000px; */
}


.read-more-post .text p:last-of-type{
	margin-bottom: 0;
}


.read-more-post .image{
	width: 350px;
}




/* footer */

.contact-footer{
	margin-top: 75px;
}


.contact-footer .col1{
	width: 20%;
}

.contact-footer .col2{
	width: 30%;
}

.contact-footer .col3{
	width: 20%;
}

.contact-footer .col4{
	width: 20%;
	float: left;
}


/*

newsletter
*/
#mc_embed_signup{
	background: none!important;
	font: inherit!important;
	margin: 0!important;
	padding: 0!important;
	
}
#mc_embed_signup input.email{
	width: 100%!important;
}

#mc_embed_signup form{
	padding: 0!important;
}

#mc_embed_signup label{
	text-align: left!important;
	
}


#mc_embed_signup .button{
	margin-top: 16px!important;
}

#mc_embed_signup form{
	text-align: left!important;
}

#mc_embed_signup input.email{
	font-family: inherit!important;
}

#mc_embed_signup label{
	font-weight: inherit!important;
}


.contact-footer p:first-child{
	margin-top: 0;
}

.contact-footer h2{
	font-size: 20px;
	line-height: 25px;
}

.logos-footer{
	margin-top: 120px;
	margin-bottom: 20px;

}

.logos-footer img{
	float: left;
	margin-right: 30px;
	margin-bottom: 30px;
}

.logos-footer img.portrait{
	max-width: 50px;
	height: auto;
}

.logos-footer img.landscape{
	max-height: 50px;
	width: auto;
}



/* venue archive */

.venue-post{
	margin-bottom: 70px;
}

.post-type-archive-venues .read-more-post{
	margin-bottom: 20px;
}

.post-type-archive-venues h3{
    font-size: 20px;
    line-height: 25px;	
	
}



li:nth-child(2n+0) .bounce .dot{
    animation-delay: .5s;
	
}
li:nth-child(2n+0) .bounce .dot:nth-child(2){
    animation-delay: .9s;
	
}
li:nth-child(2n+0) .bounce .dot:nth-child(2){
    animation-delay: 1.3s;
	
}









/* read more post  on single page*/
.read-more-post.relationship{
	margin-bottom: 20px;
	
}

.read-more-post.relationship h3{
	margin-bottom: 0;
	
}

.read-more-post.relationship a {
animation-name: none;	
}


.read-more-post p:first-child{
	margin-top: 0;
}

/*
.col2 .read-more-post{
	margin-bottom: 20px;
}
.col2 .read-more-post ul{
	margin-left: 0px;
}

.col2 .read-more-post a{
animation-name: none;
}
*/




.relationship{
	padding: 0;
}
/*
.relationship li{
	margin-bottom: 4px;;
	border: 1px solid black;
	border-radius: 6px;
	padding: 6px;
	display: inline-block;
}
*/


/*

contact
*/
address {
    font-style: normal;
}


.space {
    margin-right: 10px;
}


.page-id-92 main p{
	margin-top: 0;
	
}



/*
extra
*/
@keyframes color {
 0% {
      color: #10449e; 
    }
    
    50% {
      color: green; 

    }
    

    100% {
      color: #10449e; 

    }        
    
}


.postcontent a{
    animation-name: color;

    animation-duration: 5s;

    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

    animation-fill-mode: both;
	
}



@keyframes blink {
    /**
     * At the start of the animation the dot
     * has an opacity of .2
     */
    0% {
      opacity: .2;
      
      	margin-left: 0px;

      
    }
    /**
     * At 20% the dot is fully visible and
     * then fades out slowly
     */
    20% {
      opacity: 1;
      	margin-left: 10px;

    }
    /**
     * Until it reaches an opacity of .2 and
     * the animation can start again
     */
    100% {
      opacity: .2;
     	margin-left: 0px;

    }
}

.bounce .dot {
	
	margin-right: 0px;

    animation-name: blink;

    animation-duration: 1.6s;

    animation-iteration-count: infinite;

    animation-fill-mode: both;
}

.bounce .dot:nth-child(2) {

    animation-delay: .2s;
}

.bounce .dot:nth-child(3) {

    animation-delay: .4s;
}	
	
	
	
.bounce .dot:nth-child(3){
	
	margin-right: 12px!important;
}
		
	
	

/*

high tides
*/

/*
.high-tides .starfish-container{
	position: absolute;
	z-index: -1;
}
*/
/*
.high-tides{
	position: relative;
	
}
*/
/*

.high-tides .tides{
	
		font-family: "AgrandirVariable";
    font-variation-settings: 'wght' 400;

	position: absolute;
	    font-size: 32px;
    line-height: 38px;

}


.kelp-congress{
	    font-variation-settings: 'wght' 600;

}
*/

/*
.high-tides .tides p{
	font-size: 18px;
	line-height: 24px;
    font-variation-settings: 'wght' 650;
    margin-top: 5px;
}

.tides1{
	left: 50%;
    top: 16%;

}

.tides2{
	top: 36%;
    left: 19%;
}


.tides3{
	 right: 0%;
    top: 41%;
}

.tides4 {
    bottom: 19%;
    left: 40%;
}


.tides5{
	bottom: 0%;
    left: 76%;
}
*/

/*
.high-tides #starfish {
    width: 1000px;
    height: 700px;
    margin-left: auto;
    margin-right: auto;

}


.high-tides #starfish{

	width: 100vw;
	height: 100vh;
	
	
}
*/

.high-tides .starfish-container{
}



.moon {
  width: 16px; height: 16px;
  border-radius: 50%;
  border: 1px solid black;
  overflow: hidden;
  display: inline-block;
  margin-right: 20px;
}


.moon1, .moon5{
  border-radius: 50%;
  border: 1px solid black;
  overflow: hidden;
  display: inline-block;
 background: black;
}



.moon2:before{
	content: " ";
  display: inline-block;
  background-color: black;
  height: 18px; width:8px;
  border-right: 1px solid black;
}

.moon2:after{
		content: " ";

  display: inline-block;
  background-color: white;
  height: 18px; width:8px;
}

.moon3{
  border-radius: 50%;
  border: 1px solid black;
  overflow: hidden;
  display: inline-block;
 background: none;
}



.moon4:before{
	content: " ";
  display: inline-block;
  background-color: black;
  height: 18px; width:9px;
  margin-left: 7px;
}

.moon4:after{
		content: " ";

  display: inline-block;
  background-color: black;
  height: 100px; width:50px;
}

/* map */
#gmap {
        position: relative;
        padding-bottom: 75%;  /* This is the aspect ratio */
        height: 0;
        overflow: hidden;
        
        margin-top: 50px;
    }
    #gmap >div {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;

}



/*
#starfish{
	width: 350px;
	height: 350px;
	pointer-events: none;
	z-index: -1;
	
}
*/

.tides #starfish{

	width: 100vw;
	height: 100vh;
	
	
}

.tides .starfish-container{
	overflow: hidden
}



/* starfish */

.half{
	position: relative;
}

 .starfish-wrap{
	 position: relative;

 

} 

.arms{
	display:none;
	position: absolute;
	    font-size: 20px;
    line-height: 25px;
	
}

.arms p{
	    font-size: 20px;
    line-height: 25px;
}

.high-tides .arms{
		    font-size: 32px;
    line-height: 38px;

}

.frontpage .arms p{
	margin: 0;
	font-size: 16px;
	line-height: 19px;
}

.frontpage .half h2:first-of-type{
	margin-top: 0;
}


/*
#starfish{
        pointer-events: none;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;

}
*/


.high-tides .starfish-wrap{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-top: -100px;
	}



.go-to-archive-page{
	padding: 20px;
	
	background: #00e8af;

}

.go-to-archive-page a:hover{
	color: white;
}