@charset "utf-8";
/* CSS Document */
/* If you have set your body tag or a wrapper div with class='wrapper' in your desktop styles.css
   to a specific width then you will want to change it to width: auto;
   You may also have set a min-width in styles.css.  Best to change that to 0px
*/

/* denne udgave til album-menuer er baseret på http://www.w3schools.com/howto/howto_js_topnav.asp Udfordingen har været at få den til at sameksistere med menu_tur.css, således at desk- og laptop viser siden som altid. - Dette indebære slukning af divs både på menu_tur.css og i nærværende css, samt at der igen tændes for ul.topnav, når mobile_albummer_rel2.css tager over ved mindre end 854px. JRJ 7/7 2016*/
body, #wrap, #wrap2
{
	width: auto;
	/* max-width: 320px; */ /* max_width works with iPhones, but doesn't format well with new Android phones and devices that are wider than 320px */
	min-width: 0px;
	background-image: none; /*nødv. for at undgå spiralryggen*/
	margin: 0px;
	/*background-color: #006633;	/*sikrer grønn baggrundsfarve på responsive menu-sider */
}

body {
	margin: 3px;
	background-color: #ffffcc;
}

#wrap{
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	padding: 0px;
}
/* følgende fjerner menubilleder o. lign.*/
#forside{
	background-image: none;
	background-color: #ffffcc;
}

.basictab {display:none;} /*tilf 13 april 2022 vedr cykelberetninger 2005-2009*/
#navcontainer {display:none;} /*tilf 13 april 2022 vedr cykelberetninger 2005-2009*/

#header{
	display: none;
}

h2{margin: 0px;}

.home{
	display: none;
}

#main{
	display: none;
	margin: 0px;
	padding: 0px;
	height: 0px;
	width: 0px;
}

#main2{
	display: block !important;
	margin-top: 8px; /* giver luft mellem topnav og billede*/
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#main2 img{ /* OBS: Tilpasser menubilledet i responsive. OBS: Undgå .img/class="img"*/
	width:100% !important;
	height:auto;
}


#navLodret{
	display: none;
}

#innner{
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 3px;
	margin-left: 7px; /*rettet fra 0px 14. april 2022 */
	padding: 0px;
}

.rcorners2 { /* css3 selektor, som giver runde hjørner på elementet. OBS ændret 15/7 2020 #->. */
	border-radius: 15px;
	border: 2px solid #73AD21;
	width: auto;
	height: auto;
	margin-bottom: 0px;
	background-color: #FFF;
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 5px;
	margin-top: 5px;
}
.rcorners3 { /* css3 selektor, som giver runde hjørner på elementet. Tilf. 18/11 2017 som class selector pga. hyppige genbrug */
	border-radius: 15px;
	border: 2px solid #73AD21;
	width: auto;
	height: auto;
	margin-bottom: 0px;


	background: 
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 5px;
	margin-top: 5px;
	background-color: #FFFFFF;
}

#container {
	position: relative;
	padding-bottom: 71.4%;
	padding-top: 0px; /*ændret fra 35px*/
	height: 0;
	overflow: hidden;
	clear: left; /*OBS - OBS - OBS: Når maps er indsat th for lodret menu, vil denne left-clear flytte kortet ned under menusøjlen på mobile enheder!!!*/
	margin-bottom: 8px;
	margin-top: 8px;
}
 
h2 img { /* ellers forsvinder hom-ikonet også i mobil-versionen*/
	display: block !important;
}

/* følgende to form-deklarationer gør indlejerede google-kort responsive, dvs. de tilspasser sig automatisk til vinduets bredde. Tilsvarende er tilføjet i spiralryg2.css.
Kilde: http://www.labnol.org/internet/embed-responsive-google-maps/28333/*/

.google-maps {
	position: relative;
	padding-bottom: 75%; /*/ This is the aspect ratio*/
	height: 0;
	overflow: hidden;
	margin-top: 10px;
	margin-bottom: 10px;
    }
.google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}


/* følgende tilpasser billedstørrelse til håndholdte platforme (i hvert fald Android) Kilde: https://stackoverflow.com/questions/11736363/responsive-images-with-css*/
.albummer img{
	max-width:100% !important;
	height:auto;
	display:block;
}

.albummer{
	display: block !important; /* "important er nødvendig for at få billedet frem igen i responsive!!!!!*/
	margin-right: 0px;
}

/* Ved brug af billeder i f.eks. dagbog.html tilpasser følgende class billedstørrelse til håndholdte platforme (i hvert fald Android) */
.billedmarginL img{
	max-width:100% !important;
	height:auto;
	display:block;
}

.billedmarginR img{
	max-width:100% !important;
	height:auto;
	display:block;
}

/*herfra specs fra w3school*/

ul.topnav {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: #003916; /* ændret fra #333;*/
	display: block; /*tilføjet for at vise mobil-menuen igen, efter at der er slukket for den i menu_tur.css*/
}

ul.topnav li {float: left;}

ul.topnav li a {
	display: inline-block;
	color: #f2f2f2; /*ændret fra #f2f2f2; */
	text-align: center;
	text-decoration: none;
	transition: 0.3s;
	font-size: 17px;
	padding-top: 5px;
	padding-right: 5px; /*ændret fra 16px*/
	padding-bottom: 5px;
	padding-left: 16px;
	font-family: Verdana, Geneva, sans-serif;
}

ul.topnav li a:hover {background-color: #111;}
ul.topnav li.icon {display: none;}


@media screen and (max-width:500px) {
  ul.topnav li:not(:first-child) {display: none;}
  ul.topnav li.icon {
	float: right;
	display: inline-block;
  }
}

@media screen and (max-width:854px) { /*opr. 854*/
  ul.topnav.responsive {position: relative;}
  ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  ul.topnav.responsive li {
    float: none;
    display: inline;
  }
  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }	
}