[id] {
	scroll-margin-top: 20rem;
}

/* [id]:target {
	outline: 2px solid var(--blue2);
	background-color: #04ec78;
	transition: background-color 0.3s ease;
} */
.scroll-big {
	scroll-margin-top: 70rem;
}
.highlight {
	animation: highlightFlash 4s ease-out;
}
@keyframes highlightFlash {
	from {
		background-color: var(--gold_frame); /* ljusgul t.ex. */
	}
	to {
		background-color: transparent;
	}
}

.container-AO {
	width: 90%;
	height: auto;
	margin: 1rem auto 15rem auto;
	/* background-color: rgb(172, 241, 116); */
}

.content-AO-section {
	width: 90%;
	margin: 0 auto;
	height: auto;
	padding: 0 0 5rem 0;
	/* background-color: aqua; */
}
.a-till-o {
	margin-top: 15rem;
}
@media (300px <= width <=767px) {
	.a-till-o {
		margin-top: 7rem;
	}
}
.AO-header-kontakt {
	font-size: var(--header-span);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 4rem 0;
	animation: myAnim 2s ease 0.7s 1 normal forwards;
	/* @media (320px <= width <= 767px) {
		& {
			display: flex;
			flex-direction: column;
			align-items: center;
		}
	} */
}

@keyframes myAnim {
	0% {
		transform: scale(0.3);
	}

	100% {
		transform: scale(1);
	}
}
/* END OF ANIMATION */
.AO-header-kontakt span {
	font-size: var(--header-span);
	font-family: "montserrat", sans-serif;
	font-weight: 600;
	padding-left: 5rem;
	font-style: italic;
	color: var(--blue2);
	text-align: center;
	text-shadow: 1px 2px 5px rgb(139, 138, 138);
	letter-spacing: 0.1rem;
}

@media (320px <= width <= 767px) {
	.AO-header-kontakt span {
		padding-left: 0rem;
		margin-top: 1rem;
	}
	.AO-header-kontakt {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
}

.AO-header-kontakt i.fa-solid.fa-circle-info {
	font-size: var(--header-span);
	/* 4rem*/
	/* color: #5e5d5d; */
}
/* pdf-texten på varje section */
.pdf-text {
	width: 100%;
	display: flex;
	flex-direction: column;
	/* font-size: 1.6rem; */
	font-size: var(--p_fontZ);
	font-style: italic;
	/* margin: 2rem; */
	justify-content: center;
	align-items: center;
}
.container-AO-sidan {
	width: 100%;
	margin: 0 auto;
	/* background-color: rgb(168, 186, 196); */
}
/* .AO-intro-text p {
	font-size: var(--p_fontZ);
	font-weight: 600;
	font-style: italic;
	margin: 0 auto 1rem auto;
	text-align: center;
} */
.AO-intro {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	font-size: var(--p_fontZ);
	font-style: italic;
	margin: 3rem 0;
	line-height: 2.5rem;
	font-weight: 600;
}
/************************  menyn för bokstäver **********/
/************************                      **********/
/************************                      **********/
/************************  menyn för bokstäver **********/

.AO-letters-wrap {
	width: 30vw;
	margin: 3rem auto;
	height: 300px;
}
.AO-menu-letters {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: minmax(1.9rem, 0.3fr);
	justify-content: center;
	grid-template-columns: repeat(6, 0.3fr);
	-ms-grid-rows: auto;
	grid-template-rows: auto;
	grid-gap: 0.3rem;
	height: 100%;
}

ul.AO-menu-letters li {
	font-size: var(--header-span);
	height: auto;
	text-align: center;
	padding-bottom: 0;
}

.AO-menu-letters {
	/* width: 60vw; */
	margin: 0 auto;
	padding: 2rem;
	align-items: center;
}

.AO-menu-letters li {
	list-style-type: none;
}

.AO-menu-letters li {
	font-size: 2rem;
	height: auto;
	text-align: center;
	padding-bottom: 0;
}

.AO-menu-letters li a {
	text-decoration: none;
	color: var(--blue2);
	transition: all 0.5s ease;
}

.AO-menu-letters li a:hover {
	color: var(--light_gray);
	background-color: var(--blue2Link);
	padding: 0.3rem;
	border-radius: 0.5rem;
}

@media (min-width: 768px) {
	.AO-menu-letters {
		display: grid;
		grid-template-columns: repeat(6, 0.3fr);
	}

	.AO-menu-letters {
		width: 30vw;
	}

	.AO-menu-letters ul {
		padding: 0;
	}

	.AO-menu-letters ul li {
		font-size: 5rem;
		width: 2rem;
		height: auto;
		text-align: center;
		padding: 0;
	}

	.AO-letters-wrap {
		width: 30vw;
		margin: 4rem auto;
	}
}

@media screen and (min-width: 769px) {
	.AO-menu-letters {
		grid-template-columns: repeat(6, 0.3fr);
	}
}

/* BUTTON */
.AO-button-wrap {
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
}

.AO-buttonBa {
	font-size: var(--p_fontZ);
	color: var(--white);
	padding: 1rem 2rem;
	letter-spacing: 0.5rem;
	text-align: center;
	text-decoration: none;
	border-radius: 1rem;
	background: var(--linear_gradient);
	width: 50vw;
	height: 6rem;
	cursor: pointer;
	line-height: 2rem;
	margin-bottom: 1rem;
	border: none;
	outline: none;
}
.AO-buttonBa:hover {
	color: var(--light_gray);
	background: var(--blue2Link);
	transition: scale 0.5s ease;
}
.fa-solid.fa-arrows-left-right {
	margin: 0;
	padding: 0;
	font-size: var(--p_fontZ);
}
/* här ovan css för alla #sökord  A - Ö      */
nav.AO-hidden {
	display: none;
	/* display: block; */
	height: auto;
}
ul.AO-hidden-texter {
	display: flex;
	flex-wrap: wrap;
	padding-right: 1rem;
	margin-top: 3rem;
	row-gap: 1rem;
}
section.bokstav {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	/* line-height: 1.4rem; */
	row-gap: 1rem;
}
section.bokstav li {
	margin-right: 1rem;
}
section.bokstav li a {
	margin-right: 1rem;
	/* color: var(--black); */
	color: var(--blue2);
	font-size: var(--p_fontZ);
}
section.bokstav li a:hover {
	color: var(--light_green);
}
li.bokstav-en {
	color: var(--red);
	font-size: var(--h3_fontZ);
}

/* STYLING AV INNEHÅLLET */

.AO-textEr {
	/* width: 88vw; */
	max-width: 90%;
	margin: 0 auto;
}
.AO-textEr h2 h4 p {
	font-family: "Roboto", sans-serif;
}
.AO-big-letter {
	display: flex;
	border: 0.1rem solid black;
	border-radius: 0.5rem;
	font-size: var(--header-span);
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 5rem;
	margin-bottom: 1.25rem;
	/* margin-top: 20rem; */
}
.AO-textEr h2 {
	font-size: var(--h2_fontZ);
	/* padding-left: 1rem; */
	letter-spacing: 0.1rem;
	color: var(--black);
	margin: 2rem 0;
	line-height: 1.8rem;
	/* background-color: aqua; */
}
.AO-textEr h5 {
	font-size: var(--p_fontZ);
	padding-left: 1.4rem;
	padding-bottom: 0.5rem;
	font-weight: 700;
}
.AO-textEr p {
	margin: 0;
	font-size: var(--p_fontZ);
	padding-left: 1.8rem;
	line-height: 2rem;
	/* background-color: burlywood; */
	margin-bottom: 1rem;
	line-height: 1.5;
}
.AO-textEr p a {
	font-size: var(--p_fontZ);
}
.AO-gallery {
	max-width: 80vw;
	display: flex;
	flex-flow: row wrap;
	margin: 2rem auto 1rem auto;
}
figure.AO-gallery__item {
	/* box-sizing: border-box; */
	padding: 0.5rem;
	box-shadow: 0.0625rem 0.125rem 0.25rem 0.125rem
		rgba(160, 160, 160, 0.7);
	/* flex-basis: 100; */
	margin: 0.3rem auto;
}
img.AO-gallery__image {
	/* max-width: 300px; */
	height: auto;
	display: block;
	margin: 0 auto;
	transition: all 0.3s;
	width: min(100%, 350px);
}

img.AO-gallery__image:hover {
	scale: 102%;
	box-shadow: 4px 4px 10px var(--grey);
}
figcaption.gallery__image-caption {
	margin-top: 1rem;
	font-size: 0.95rem;
}

/* HÄR BÖRJAR BLANKETTER */
.blanketter {
	display: flex;
	width: 80vw;
	height: auto;
	background-color: var(--color-items);
}
.left-blank {
	width: 50%;
	/* height: 90%; */
}
/* .left-blank p,
.right-blank p {
	background-color: bisque;
} */

.right-blank {
	width: 50%;

	/* background-color: rgb(30, 129, 210); */
	/* height: 90%; */
}
.right-blank p {
	margin: 0;
}
.right-blank p a {
	font-size: var(--p_fontZ);
}

.left-blank p {
	padding-left: 2rem;
	margin-bottom: 0;
}
div.rubrik {
	font-size: var(--h3_fontZ);
	margin: 1rem 0;
}

/* ************ @media ****************** */

@media (320px <= width <= 425px) {
	.scroll-big {
		scroll-margin-top: 140rem;
	}
	ul.AO-hidden-texter {
		row-gap: 0.4rem;
	}
}

@media (426px <= width <= 768px) {
	.scroll-big {
		scroll-margin-top: 100rem;
	}
	ul.AO-hidden-texter {
		row-gap: 0.7rem;
	}
}

@media (320px <= width <= 768px) {
	section.bokstav {
		/* line-height: 1rem; */
		row-gap: 0.5rem;
	}
	section.bokstav li a {
		margin-right: 0;
	}
	section.bokstav ul li {
		padding: 0.5rem;
	}
}
@media (max-width: 425px) {
	.blanketter {
		flex-direction: column;
		max-width: 100%;
	}
	.left-blank,
	.right-blank {
		width: 80%;
	}
}

@media screen and (min-width: 768px) {
	figure.AO-gallery__item {
		/* flex-basis: 50%; */
		padding: 0.5rem;
		margin: 1rem auto;
	}
}
/* @media screen and (max-width: 767px) {
	figure.AO-gallery__item {
		flex-basis: 50%;
	}
} */
@media only screen and (min-width: 1023.98px) {
	figure.AO-gallery__item {
		flex-basis: calc((100% / 4) - 2rem);
	}
}

@media (320px <= width <= 767px) {
	.AO-buttonBa {
		max-width: 80%;
		height: auto;
	}
}

/* @media (320px <= width <= 767px) {
	.AO-header-kontakt span {
		padding-left: 2rem;
		font-size: var(--header-span);
	}
} */

/* COLUMS */
@media (min-width: 1440px) {
	.AO-textEr p {
		columns: 2 auto;
		column-rule: 0.1rem solid var(--blue2);
		column-gap: 3rem;
		margin-bottom: 2rem;
		line-height: 1.3;
	}
	img.AO-gallery__image {
		max-width: 400px;
	}
}
@media (min-width: 1900px) {
	.AO-textEr p {
		columns: 3 auto;
		column-rule: 0.1rem solid var(--blue2);
		column-gap: 3rem;
		margin-bottom: 3rem;
		line-height: 1.3;
	}
	.blanketter .left-blank p,
	.blanketter .right-blank p {
		columns: 1;
	}
}
@media (min-width: 2600px) {
	.AO-textEr p {
		columns: 4 auto;
		column-rule: 0.1rem solid var(--blue2);
		column-gap: 3rem;
		margin-bottom: 1rem;
	}
	.blanketter .left-blank p,
	.blanketter .right-blank p {
		columns: 1;
	}
}
/*
.AO-letters-wrap {
	display: flex;
	justify-content: center;
	width: 90%;
	margin: 3rem auto;
}

.AO-menu-letters {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
	align-content: flex-start;
	width: 90%;
	height: auto;
	overflow: auto;
	flex-direction: row;
	gap: 1rem;
	margin-bottom: 2rem;
}

ul.AO-menu-letters li {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: 50px;
	background-color: lightblue;
	font-size: var(--header-span);
	padding: 0;
	margin: 0;
}

ul.AO-menu-letters li:hover {
	background-color: blue;
}

@media (min-width: 425px) {
	.AO-menu-letters {
		width: 70%;
	}
}

@media (min-width: 768px) {
	.AO-letters-wrap {
		width: 50%;
	}
}
@media (min-width: 1024px) {
	.AO-letters-wrap {
		width: 40%;
	}
}
@media (min-width: 1440px) {
	.AO-letters-wrap {
		width: 35%;
	}
}
@media (min-width: 1600px) {
	.AO-letters-wrap {
		width: 25%;
	}
}
@media (min-width: 1920px) {
	.AO-letters-wrap {
		width: 25%;
	}
	.AO-menu-letters {
		gap: 2rem;
	}
} */

/*@media only screen and (max-width: 600px) and (min-width: 400px) */