*,
:before,
:after {
	box-sizing: inherit
}

@font-face {
    font-family: 'inter';
    src: url('inter-variablefont_slntwght-webfont.woff2') format('woff2'),
         url('inter-variablefont_slntwght-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

html {
	font-family: inter, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 1.528571429;
	box-sizing: border-box
}

body {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	margin: auto;
	font-family: inter, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	background-color: #FEFEFE;
	color: #03331D
}

img {
	max-width: 100%;
	border: 0
}

[usemap] {
	max-width: unset
}

#header {
	margin-bottom: 15px
}

#wrap_top {
	margin: 0 auto;
	width: 90%;
	background: #fff;
	padding: 0;
	max-width: 100%;
}

#wrap {
	padding-top: 0;
	padding-left: 12px;
	padding-bottom: 0;
	padding-right: 12px;
	overflow: auto
}

a,
.link {
	text-decoration: none;
	color: #166909;
	cursor: pointer;
	font-weight:bold;
}

a:hover,
.link:hover {
	text-decoration: underline
}

a:active {
	outline: 0
}

.navbar-header {
	position: relative;
	z-index: 999;
}

.menuH {
	margin: 0 auto;
	float: none;
	list-style: none;
	padding: 0;
	position: relative;
	z-index: 999;
	background-color: #ccd9bb;
	border-radius:4px;
}

.menuH li {
	padding: 0;
	display: inline-block;
	margin-bottom: 0
}

.menuH li a {
	display: block;
	padding: 0 11px;
	line-height: 3em;
	font-weight: 700;
	font-size: 14px;
	color: #555;
	outline: 0;
	text-decoration: none;
	height: 3em
}

.menuH li a:hover {
	background: #F6F4E1;
	color: #555
}

.menuH li a:hover.gray {
	background: #F6F4E1;
	color: #555 !important
}

.menuH li a.grey {
	color: #555
}

#sidebar_fore, .sidebar_fore {
	float: right;
	width: 30%;
	padding: 10px;
	padding-right:0;
	box-sizing: border-box
}

#sidebar_fore .stack {
	float: none;
	text-align: center
}

#sidebar_fore .stack a {
	background: #ccd9bb;
	background-repeat: no-repeat;
	background-position: center 10px;
	margin-bottom: 20px;
	line-height: 19px;
	padding: 20px 12px;
	font-weight: 400;
	font-size: 17px;
	display: block;
	color:#03331D;
	border-radius:4px;
}

#sidebar_fore .stack a:active,
#sidebar_fore .stack a:focus,
#sidebar_fore .stack a:hover {
	text-decoration: none;
	background: #F6F4E1;
	border-color: #F6F4E1;
	outline: 0
}

#sidebar_fore .stack a>img {
	display: none
}

#sidebar_fore .stack br {
	display: none
}

.banner {
	display: block;
}

#sidebar_fore .stack:first-child a {
	background-image: url(../../images/public/icon-globe.png);
	background-repeat: no-repeat;
	background-position: center 10px;
	background-size: 50px 50px;
	height: 120px;
	padding-top: 65px
}

#sidebar_fore .stack:first-child a:hover {
	background-color: #F6F4E1;
	border-color: #F6F4E1;
}

#sidebar_fore .stack+.clinics a {
	background-image: url(../../images/public/icon-syringe.png);
	background-repeat: no-repeat;
	background-position: center 10px;
	background-size: 50px 50px;
	background-color: #ccd9bb;
	border-color: #ccd9bb;
	height: 90px;
	padding-top: 55px;
	color:#03331D;
}

#sidebar_fore .stack+.clinics a:hover {
	background-color: #F6F4E1;
	border-color: #F6F4E1;
}

#sidebar_fore a,
#sidebar_fore .t-menyrubrik-ljusbla-bold {
	color: #03331D;
}

#sidebar_fore ul {
	list-style: none;
	padding: 0;
	margin: 0;
	background: #fff;
	border-radius:4px;
}

#sidebar_fore ul li {
	padding: 0;
	margin: 0;
	text-indent: 0
}

#sidebar_fore ul li:before {
	font-size: 18px;
	padding: 0;
	content: ""
}

#sidebar_fore ul li:first-child a {
	border-top: 1px solid #eee
}

#sidebar_fore ul li:last-child a {
	border-bottom: 1px solid #eee
}

#sidebar_fore ul li a {
	display: block;
	padding: 5px 10px;
	font-weight: 400;
	border: 1px solid #eee;
	border-top: 0;
	border-bottom: 0;
	word-wrap: break-word;
	hyphens: auto
}

#sidebar_fore ul li a:hover {
	background: #6DA720;
	text-decoration: none;
	background: #ccd9bb;
}

#sidebar_fore h2,
#sidebar_fore .t-styckerubrik-ljusbla-bold20pkt {
	font-size: 18px;
	font-weight: 700;
	color: inherit;
	margin-bottom: 8px
}

.right {
	text-align: right
}

img.right {
	float: right
}

.floatright {
	float: right
}

.illustration {
	float: right;
	margin: 0 0 3px 8px;
	border-radius:3px;
}

.text-center {
	text-align: center
}

.text-muted {
	color: #aaa
}

#content, .content {
	float: left;
	width: 65%;
	padding-top: 10px;
	padding-left: 0;
	padding-right: 10px;
	box-sizing: border-box
}

#footer {
	margin: 10px auto;
	width: 90%;
	font-size: 14px;
	max-width: 100%
}

#footer>.content>div {
	float: left;
	width: 50%;
	box-sizing: border-box;
	padding-right: 2%
}

#footer>.content>div.row {
	clear: both;
	width: 100%
}

#footer ul {
	list-style: none;
	margin: 0;
	padding: 0
}

#footer address {
	font-style: normal
}

.countrytable {
	border: 1px solid #ccc;
	border-collapse: collapse
}

.countrytable td {
	border: 1px solid #ccc
}

#countrylists {
	display: table;
	width: 100%
}

#countrylists>div {
	border: 1px solid #ccc;
	border-left: 0;
	display: table-cell
}

#countrylists>div:first-child {
	border-left: 1px solid #ccc
}

#countrylists>div>div {
	padding-left: .2em
}

.countrycolumn1 {
	width: 25%
}

.countrycolumn3 {
	width: 75%
}

.countrylist a {
	display: inline-block;
	padding: 2px 5px;
	word-wrap: break-word
}

.countrycolumn3>.countrylist {
	column-count: 3;
	column-gap: .2em;
	column-rule: 1px solid #ccc
}

.countrycolumn4 {
	width: 100%;
	display: block
}

.countrycolumn4>.countrylist {
	column-count: 4;
	column-gap: .2em;
	column-rule: 1px solid #ccc
}

.continentheading {
	background-color: #ccd9bb;
	border-bottom: 1px solid #ccc;
	font-weight: 700;
	padding: .2em
}

.section {
	vertical-align: top;
	margin-top: 8px;
	padding: 0;
	overflow: auto
}

.section .left {
	float: left;
	width: 35%;
	font-weight: 700;
	padding: 8px 12px
}

.section .right {
	display: inline-block;
	width: 65%;
	padding: 8px 12px;
	text-align: left
}

#map .left {
	width: 30%
}

#mapwrap.left {
	width: 35%;
	padding: 0
}

.section .row0 {
	background-color: #eee
}

#mapform {
	width: inherit;
	display: block
}

#mapform #worldmap {
	margin: 0 auto;
	margin-top: 20px;
	margin-bottom: 20px;
	display: block;
	text-align:center;
}

#mapform select {
	margin-bottom: 20px;
	background-color: #ccd9bb;
}



.center {
	text-align: center
}

.half {
	width: 50%;
	box-sizing: border-box;
	float: left;
	padding: 0 30px 0 0
}

.half+.half {
	padding: 0
}

.box {
	display: block;
	padding: 15px;
	background: #ccd9bb;
	border: 1px solid #ccd9bb;
	border-radius:4px;
}

.box>strong {
	font-size: 1.2em;
	margin-bottom: 8px
}

.mce-content-body {
	outline: 1px dotted #333;
	min-height: 30px
}

.gray {
	color: #666 !important
}

.clearfloat {
	clear: both;
	height: 0;
	font-size: 0;
	line-height: 0
}

h1 {
	margin: 20px 0 8px;
	color: #03331D;
}
h2, h3, h4, h5, h6 {
	color: #03331D;
}

.t-rubrik-1 {
	font-size: 36px;
	font-weight: 700;
	color: #202429;
	line-height: 1.1
}

.t-normal {
	font-weight: 400;
	color: #333
}

.t-normal-red {
	font-weight: 400;
	color: #e74c3c
}

.t-bold-red {
	font-weight: 700;
	color: #e74c3c;
	font-size: 1.1em
}

.t-bold {
	font-weight: 700;
	color: #333
}

.t-bold-red-center {
	font-weight: 400;
	color: #e74c3c
}

.t-styckerubrik-ljusbla {
	font-weight: 400;
	color: #03331D;
	font-size: 1.2em;
	margin-bottom: 5px
}

.t-rubrik-2 {
	font-size: large;
	font-weight: 700;
	color: red
}

.t-styckerubrik-ljusbla-bold,
.styckerubrik {
	color: #03331D;
	font-size: 18px;
	line-height: 3.1px
}

.t-normal-red-italic-bold {
	font-style: italic;
	font-weight: 700;
	color: red
}

.t-normal-red-italic {
	font-style: italic;
	font-weight: 400;
	color: red
}

.t-menyrubrik-ljusbla {
	font-weight: 400;
	color: #09c
}

.t-normal-bold {
	font-weight: 700;
	color: #333
}

.t-normal-italic {
	font-style: italic;
	font-weight: 400;
	color: #333
}

.t-normal-bold-italic {
	font-style: italic;
	font-weight: 700;
	color: #333
}

.t-normal-vit-bold {
	font-size: 15px;
	font-weight: 700;
	color: #fff
}

.headrow {
	background-color: #00a7d7;
	color: #fff;
	font-weight: 700;
	margin-top: 2em;
	padding: .3em 12px
}

ul>li {
	margin-bottom: 8px
}

#navbar-toggle {
	display: none;
	position: relative;
	float: right;
	padding: 10px 12px;
	margin-top: 7px;
	margin-bottom: 7px;
	background-color: transparent;
	background-image: none;
	border: 0;
	border-radius: 1px;
	cursor: pointer
}

#navbar-toggle:hover {
	background: #ccd9bb;
}

#navbar-toggle:focus {
	outline: 0;
	background: transparent
}

#navbar-toggle .icon-bar {
	background: #03331D;
	display: block;
	width: 20px;
	height: 2px
}

#navbar-toggle .icon-bar+.icon-bar {
	margin-top: 4px
}

.visible-sm {
	display: none !important
}

.btn-lg {
	text-align: center;
	background: #ccd9bb;
	margin-bottom: 20px;
	line-height: 19px;
	padding: 20px 12px;
	font-weight: 400 !important;
	font-size: 17px;
	display: block;
	color: #03331D !important;
	border-radius:4px;
}

.btn-lg:hover {
	text-decoration: none;
	background: #F6F4E1;
	border-color: #F6F4E1
}

.btn-lg.btn-success {
	background-color: #ccd9bb;
	border-color: #ccd9bb
}

.btn-lg.btn-success:hover {
	background-color: #F6F4E1;
	border-color: #F6F4E1
}

.btn-lg.icon {
	text-align: left
}

.btn-lg.icon>img {
	display: inline-block;
	width: 50px !important;
	float: left;
	position: relative;
	top: -15px;
	margin-right: 20px
}

#overlay {
	display: none
}

select {
	padding: 8px 16px;
	margin: 0;
	width: 100%;
	display: block;
	border: 1px solid #ccc;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
	font-size: 14px;
	font-weight: 700;
	outline: 0;
	cursor: pointer;
	border-radius:4px;
}	
	
body#landrek #worldmap {
	display: none
}

#footer a {
	display: block;
	padding-bottom: 3%
}

#searchmobile {
	float: right;
	position: relative;
	padding: 10px 0;
	margin-top: 3px;
}
input:focus {
	outline: 1px solid #03331D;
}

input.search {
	background-repeat: no-repeat;
	background-position: right center;
	border: 0 solid white;
	background-color: transparent;
	border-radius:3px;
	padding: 2px 0;
	background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pjxzdmcgdmlld0JveD0iMCAwIDE2IDE2IiBmaWxsPSIjMTY2OTA5IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Im0xNC40NDEgMTMuNzM0LTQuMDY4LTQuMDY4Yy43MDEtLjg1OCAxLjE0LTEuOTM4IDEuMTQtMy4xMyAwLTIuNzQ0LTIuMjMzLTQuOTc3LTQuOTc3LTQuOTc3UzEuNTU5IDMuNzkyIDEuNTU5IDYuNTM2czIuMjMyIDQuOTc3IDQuOTc3IDQuOTc3YzEuMTkyIDAgMi4yNzItLjQzOCAzLjEzLTEuMTRsNC4wNjggNC4wNjguNzA3LS43MDd6bS03LjkwNS0zLjIyMmMtMi4xOTMgMC0zLjk3Ny0xLjc4NC0zLjk3Ny0zLjk3N3MxLjc4NC0zLjk3NyAzLjk3Ny0zLjk3NyAzLjk3NyAxLjc4NCAzLjk3NyAzLjk3Ny0xLjc4NCAzLjk3Ny0zLjk3NyAzLjk3N3oiPjwvcGF0aD48L3N2Zz4=")
}

.searchform>.searchmobile {
	line-height: 3em;
}

.searchmobile>input {
	width: 26px;
	cursor: pointer;
	color: transparent
}

.searchmobile>input:focus {
	width: 150px;
	cursor: text;
	background-color: #fff;
	color: inherit
}

#navbar form {}

li.searchform {
	float: right;
}
.flex {
  display: flex;
  flex-wrap: nowrap;
}
.navbar-brand {
	display:block;
	margin-top:5px;
}
#payoff {
	width:70%;
	flex-grow: 1;
	text-align: right;
	font-size:2.0rem;
}
#payoff>i { 
	font-weight:100;
}
.ad img {
	border-radius:4px;
	width:100%;
	margin-bottom: 5px;
	}
@media screen and (max-width:1015px) {
	#mapform {
		width: 100%;
		display: block
	}
}

@media screen and (max-width:740px) {

	#content, .content,
	#sidebar_fore {
		width: 100%
	}

	#wrap_top {
		width: 95%
	}

	#content {
		padding-left: 0;
		padding-right: 0
	}

	#content #body .left {
		width: 33.3%
	}

	#footer>xdiv {
		width: 50%;
		padding-bottom: 8px
	}

	#footer>div.tall {
		height: 130px
	}

	#sidebar_fore {
		padding: 0
	}

	#sidebar_fore ul {
		margin-left: -12px;
		margin-right: -12px
	}

	#sidebar_fore ul li a {
		border-left: 0;
		border-right: 0;
		padding: 8px 16px
	}

	.stack {
		float: left
	}

	.visible-sm {
		display: inherit !important
	}

	.hidden-sm {
		display: none !important
	}
}

@media screen and (max-width:570px) {
	#header {
		height: auto;
		background: #fff;
		position: relative;
		z-index: 1000;
		box-shadow: none;
		padding: 0
	}

	#header nav {
		background: #fff;
		margin-left: -12px;
		margin-right: -12px;
		clear: both
	}

	#header {
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		padding: 0 12px;
		margin: 0;
		box-shadow: 0 2px 0 rgba(0, 0, 0, .1)
	}

	.navbar-header {
		background: #fff;
		height: 50px;
		margin-left: -12px;
		margin-right: -12px;
		padding: 0 12px;
		box-shadow: 0 2px 0 rgba(0, 0, 0, .1)
	}

	.navbar-brand {
		float: left;
		display: block;
		background: url(../../images/public/logo-vaccinationsguiden.png) no-repeat left center;
		background-size: contain;
		height: 36px;
		width: 100px;
		margin: 7px 0
	}

	.navbar-brand img, #payoff {
		display: none
	}
	.flex {
		display:block;
	}

	.menuH {
		background: #fff;
		border: 0;
		box-shadow: none;
		overflow: hidden;
		height: 0;
		transition: all .2s ease-in-out
	}

	#navbartoggle:checked+#navbar {
		height: inherit;
		box-shadow: 0 2px 0 rgba(0, 0, 0, .1)
	}

	.menuH li {
		width: 100%;
		border-bottom: 1px solid #fff;
		margin: 0
	}

	.menuH li:last-child {
		border-bottom: 0
	}

	#navbar-toggle {
		display: block
	}

	#wrap_top {
		width: 96%
	}

	#content,
	#myad1 {
		padding-top: 0;
		padding-bottom: 0;
		margin-top: 60px
	}

	#content>h1 {
		margin-top: 8px
	}

	#footer {
		font-size: .9em
	}

	.btn-lg {
		font-size: .9em;
		font-size: 14px
	}

	.half {
		width: 100%
	}

	.countrycolumn4>.countrylist {
		column-count: 3
	}

	.countrycolumn3>.countrylist {
		column-count: 2
	}

	#countrylists.amerika {
		display: block
	}

	#countrylists.amerika .countrycolumn1 {
		display: block;
		float: left;
		width: 50%;
		border: 0
	}

	#countrylists.amerika .continentheading {
		border: 1px solid #ccc
	}

	#navbartoggle:checked~#overlay {
		display: block;
		position: fixed;
		background-color: rgba(0, 0, 0, .4);
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 9
	}
	#myad1 + #content {
		margin-top:0;
	}
}

@media screen and (max-width:500px) {
	#wrap_top {
		width: 100%;
		margin: 0;
	}

	#content {
		padding-left: 0;
		padding-right: 0
	}

	#content img {
		max-width: 50%;
		height: auto
	}

	#content .banner img {
		max-width: 100%;
		height: auto
	}

	#content #body .left {
		width: 33.3%
	}

	#mapform #worldmap,
	#mapwrap {
		display: none
	}

	#content #map .left {
		width: 49%
	}

	.countrycolumn4>.countrylist {
		column-count: 2
	}

	.countrycolumn3>.countrylist {
		column-count: 1
	}

	.section .left,
	.section .right {
		width: 100%
	}

	#mapform select {
		background-color: #ccd9bb;
		color: #000;
	}
}

#sidebar_fore .stack.vaccup>a {
	background-image: url(../../images/public/vaccuplogo.png);
	background-size: 75px 50px;
	height: 130px;
	background-repeat: no-repeat;
	background-position: center 10px;
	padding-top: 65px;
}

.btn-lg.icon>img.vaccup {
	top: -5px;
}

.hidden {
	display: none !important
}

.dt {
	display: none
}

.regions path:hover {
	fill: #86d98e
}






/* VaccinationsGuiden publika sidor */

:root {
    --vg-blue: #08245c;
    --vg-blue-link: #08357e;
    --vg-blue-dark: #0d1b3d;
    --vg-text: #1f2937;
    --vg-card-text: #24364d;
    --vg-muted: #5b6b7f;
    --vg-border: #d7dfe8;
    --vg-border-blue: #d7e3f0;
    --vg-bg: #ffffff;
    --vg-soft-bg: #f8fbff;
    --vg-soft-bg-2: #eef5fc;
    --vg-footer-bg: #f7fafc;
    --vg-radius: 16px;
    --vg-shadow: 0 4px 14px rgba(0,0,0,0.04);
    --vg-shadow-image: 0 12px 32px rgba(0,0,0,0.12);
}

body {
    margin: 0;
    background: #ffffff;
    font-family: Inter, "Open Sans", "DM Sans", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.75;
    color: var(--vg-text);
}

/* Luft före huvudrubriker i artiklar */
h2 {
    margin-top: 60px !important;
    margin-bottom: 24px !important;
}


.vg-about-box {
    width: 100%;
    border: 1px solid var(--vg-border-blue);
    border-radius: var(--vg-radius);
    padding: 28px;
    box-sizing: border-box;
    background: linear-gradient(180deg, var(--vg-soft-bg) 0%, var(--vg-soft-bg-2) 100%);
    box-shadow: 0 3px 12px rgba(0,0,0,0.04);
    margin: 35px 0 60px;
    display: flex;
    align-items: flex-start;
    gap: 24px;
}

.vg-about-image {
    min-width: 120px;
    text-align: center;
}

.vg-about-image img {
    width: 110px;
    height: 110px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

.vg-about-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.15;
    color: var(--vg-blue-dark);
    margin: 0 0 18px;
    text-align: left;
}

.vg-apps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.vg-app {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    background: #ffffff;
    border: 1px solid var(--vg-border);
    border-radius: 14px;
    padding: 14px;
    overflow: hidden;
}

.vg-app-panel {
    flex: 1 1 0;
    min-width: 360px;
    display: block;
}

.vg-app-panel .vg-soft-box {
    margin: 0;
    height: 100%;
}

.vg-app-panel .vg-apps {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.vg-app-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--vg-blue);
    margin-bottom: 5px;
}

.vg-app-title a,
.vg-app-text {
    overflow-wrap: anywhere;
    word-break: normal;
}

.vg-app-text {
    font-size: 13px;
    line-height: 1.55;
    color: var(--vg-card-text);
}

.vg-article-box {
  max-width: 760px;
  margin: 28px auto;
}


.vg-article-box h2 {
    font-size: 34px;
    font-weight: 700;
    line-height: 1.2;
    color: #08245c;
    margin: 60px 0 24px;
}

.vg-article-box > h3 {
    margin-top: 60px;
    margin-bottom: 12px;
}

.vg-article-image {
  float: right;
  margin: 0 0 18px 26px;
}

.vg-article-image img {
  width: 150px;
  height: 152px;
  object-fit: contain;
  display: block;
}

.vg-article-box ul {
    margin-bottom: 40px;
} 

.vg-article-box p {
    font-size: 15px;
    line-height: 1.55;
    color: var(--vg-card-text);
    margin: 0 0 18px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;
}

.vg-badge {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 999px;
    margin-bottom: 14px;
    letter-spacing: 0.4px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
    width: max-content;
}

.vg-badge-blue {
    background: #e8f2ff;
    color: #08357e;
}

.vg-badge-orange {
    background: #fff3d9;
    color: #b06b00;
}

.vg-badge-peach {
    background: #ffeedd;
    color: #b85b00;
}

.vg-badge-red {
    background: #ffe8e8;
    color: #b30000;
}

.vg-box {
    width: 55%;
    min-width: 320px;
    border: 1px solid var(--vg-border);
    border-radius: var(--vg-radius);
    padding: 28px;
    background: var(--vg-bg);
    box-shadow: var(--vg-shadow);
    box-sizing: border-box;
    position: relative;
}

.vg-box-red,
.vg-box-blue,
.vg-box-green,
.vg-box-orange {
    margin-top: 30px;
    margin-bottom: 40px;
}
.vg-box-green {
  border-left: 5px solid #2e7d32;
  background: #f4fbf4;
  padding: 18px 20px;
  border-radius: 12px;
  margin: 35px 0;
}

.vg-box-green h3 {
  color: #1f5f24;
}

.vg-box-blue {
  border-left: 5px solid #0d6efd;
  background: #f4f8ff;
  padding: 18px 20px;
  border-radius: 12px;
  margin: 35px 0;
}

.vg-box-blue h3 {
  color: #08357e;
}

.vg-box-orange {
  border-left: 5px solid #f59e0b;
  background: #fff9ed;
  padding: 18px 20px;
  border-radius: 12px;
  margin: 35px 0;
}

.vg-box-orange h3 {
  color: #b06b00;
}

.vg-box-red {
  border-left: 5px solid #d62828;
  background: #fff5f5;
  padding: 18px 20px;
  border-radius: 12px;
  margin: 26px 0;
}

.vg-box-red h3,
.vg-box-red h4 {
  color: #a61b1b;
}

.vg-card {
    border: 1px solid var(--vg-border);
    border-radius: var(--vg-radius);
    padding: 18px;
    background: var(--vg-bg);
    box-shadow: var(--vg-shadow);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    position: relative;
}

.vg-card-list {
  margin: 8px 0 22px 22px;
  padding: 0;
}

.vg-card-list li {
  font-size: 17px;
  line-height: 1.7;
  color: #24364d;
  margin-bottom: 6px;
}

.vg-card-text {
    font-size: 15px;
    line-height: 1.55;
    color: var(--vg-card-text);
    margin: 0 0 18px;
    flex-grow: 1;
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;
}

.vg-card-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--vg-blue);
    margin: 0 0 12px;
}

.vg-check-box {
  margin: 30px 0;
  padding: 22px 24px;
  background: #fffdf6;
  border-left: 5px solid #f4a100;
  border-radius: 14px;
}

.vg-content p {
    margin-bottom: 22px;
}

.vg-content ul {
    margin-bottom: 36px;
}

.vg-content h2 {
    margin-top: 60px;
    margin-bottom: 24px;
}

.vg-cta {
  margin: 36px 0 10px 0;
  padding: 26px 28px;
  background: #f5f8fc;
  border-radius: 16px;
  border: 1px solid #d7dfe8;
}

.vg-cta h2 {
  font-size: 26px;
  line-height: 1.25;
  color: #08245c;
  margin: 0 0 12px 0;
}

.vg-cta p {
  font-size: 17px;
  line-height: 1.7;
  color: #24364d;
  margin: 0;
}

.vg-danger-box {
    border-left: 5px solid #b30000;
    background: #fff5f5;
    padding: 18px 20px;
    border-radius: 12px;
    margin: 26px 0;
}

.vg-danger-title {
    margin: 0 0 10px;
    color: #8a0000;
    font-size: 21px;
    font-weight: 700;
}

.vg-footer {
    padding: 32px;
    border-top: 1px solid var(--vg-border);
    background: var(--vg-footer-bg);
    margin-top: 0;
}

.vg-footer-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 50px;
}

.vg-footer a {
    font-size: 15px;
    font-weight: 700;
    color: var(--vg-blue);
}

.vg-footer-text {
    font-size: 13px;
    color: var(--vg-muted);
    line-height: 1.4;
    margin-top: 3px;
    text-align: left;
}

.vg-grid-3 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    align-items: stretch;
    margin: 35px 0;
}

.vg-hero {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: stretch;
    margin: 35px 0;
}

.vg-icon-image {
    width: 60px;
    height: 60px;
    object-fit: contain;
    margin-bottom: 12px;
}

.vg-info-item {
    min-width: 0;
}

.vg-hero-title {
    font-size: 33px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--vg-blue-dark);
    margin: 0 0 22px;
}

.vg-hero-image {
    flex: 1;
    min-width: 280px;
    display: flex;
    border-radius: var(--vg-radius);
    overflow: hidden;
    box-shadow: var(--vg-shadow-image);
}

.vg-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.vg-info-box {
  margin: 30px 0;
  padding: 22px 24px;
  background: #f5f8fc;
  border-left: 5px solid #2f7fd1;
  border-radius: 14px;
}

.vg-info-title {
  font-size: 21px;
  line-height: 1.3;
  font-weight: 700;
  color: #08245c;
  margin: 0 0 12px 0;
}

.vg-link,
.vg-card a,
.vg-footer a {
    color: var(--vg-blue-link);
    text-decoration: none;
    font-weight: 700;
}

.vg-link:hover,
.vg-card a:hover,
.vg-footer a:hover {
    text-decoration: underline;
}

.vg-news {
    border-left: 5px solid var(--vg-blue);
}

.vg-news-orange {
    border-left-color: #f59e0b;
}

.vg-news-red {
    border-left-color: #dc2626;
}

.vg-page {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 24px 20px 0;
    box-sizing: border-box;
}

.vg-section-heading {
    font-size: 21px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--vg-blue-dark);
    margin: 0 0 18px;
}

.vg-small-text {
    font-size: 13px;
    color: var(--vg-text);
    line-height: 1.65;
    margin: 0 0 18px;
}

.vg-section-title {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.25;
  color: #08245c;
  margin: 60px 0 24px 0;
}

.vg-soft-box {
    width: 100%;
    border: 1px solid var(--vg-border-blue);
    border-radius: var(--vg-radius);
    padding: 28px;
    box-sizing: border-box;
    background: linear-gradient(180deg, var(--vg-soft-bg) 0%, var(--vg-soft-bg-2) 100%);
    box-shadow: 0 3px 12px rgba(0,0,0,0.04);
    margin: 35px 0;
}

.vg-subtitle {
  margin: 22px 0 10px 0;
  font-size: 18px;
  font-weight: 600;
  color: #08245c;
}

.vg-success-box {
    border-left: 5px solid #2e7d32;
    background: #f4fbf4;
    padding: 18px 20px;
    border-radius: 12px;
    margin: 26px 0;
}

.vg-success-title {
    margin: 0 0 10px;
    color: #1f5f24;
    font-size: 21px;
    font-weight: 700;
}

.vg-text {
    font-size: 15px;
    line-height: 1.6;
    color: var(--vg-text);
    margin: 0 0 32px;
}

.vg-travel-cards-side {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px;
}

.vg-travel-section {
    display: flex;
    gap: 24px;
    align-items: stretch;
    margin: 35px 0;
}

.vg-travel-image {
    flex: 0 0 48%;
}

.vg-travel-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 18px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.08);
    display: block;
}

.vg-yellow-book-box {
  display: flex;
  gap: 24px;
  align-items: center;
  margin: 35px 0;
  padding: 24px;
  background: #fffdf6;
  border: 1px solid #eadfb8;
  border-radius: 16px;
}

.vg-yellow-book-image img {
  width: 140px;
  height: auto;
  display: block;
}

.vg-yellow-book-content {
  flex: 1;
}

.vg-yellow-book-content h3 {
  margin: 0 0 12px 0;
  font-size: 24px;
  font-weight: 700;
  color: #08245c;
}

.vg-yellow-book-content p {
  margin: 0 0 12px 0;
  font-size: 15px;
  line-height: 1.7;
  color: #24364d;
}

.vg-yellow-book-note {
  font-weight: 700;
  color: #c62828;
}


@media (max-width: 980px) {
    .vg-box {
        width: 100%;
    }

    .vg-hero {
        flex-direction: column;
    }

    .vg-hero-image {
        width: 100%;
    }

    .vg-grid-3 {
        grid-template-columns: 1fr;
    }

    .vg-apps {
        grid-template-columns: 1fr;
    }

    .vg-travel-section {
        flex-direction: column;
    }

    .vg-travel-image {
        width: 100%;
        flex: none;
    }

    .vg-travel-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .vg-about-box {
        flex-direction: column;
    }
}

@media (max-width: 600px) {
    .vg-page {
        padding: 18px 14px 0;
    }

    .vg-hero-title {
        font-size: 32px;
    }

    .vg-box,
    .vg-soft-box,
    .vg-card,
    .vg-about-box {
        padding: 20px;
    }

    .vg-footer {
        padding: 24px 20px;
    }

    .vg-footer-grid {
        gap: 24px;
    }
}


@media (max-width: 700px) {
  .vg-yellow-book-box {
    flex-direction: column;
    text-align: center;
  }

  .vg-yellow-book-image img {
    width: 120px;
  }
}



/* Mobil */
@media (max-width: 600px) {
  .vg-article-image {
    float: none;
    margin: 0 0 20px 0;
    text-align: center;
  }

  .vg-article-image img {
    margin: 0 auto;
  }
}


@media (max-width: 980px) {
    .vg-hero {
        flex-direction: column;
    }

    .vg-box,
    .vg-hero-image {
        width: 100%;
    }
}

@media (max-width: 700px) {
  .vg-card-text,
  .vg-card-list li,
  .vg-cta p {
    font-size: 16px;
  }

  .vg-section-title {
    font-size: 24px;
  }

  .vg-cta {
    padding: 22px;
  }

.vg-travel-cards {
        grid-template-columns: 1fr;
    }

 .vg-travel-cards-side {
        grid-template-columns: 1fr !important;
    }
}

  
/* Luft före H3-rubriker i artikeltext */
h3 {
    margin-top: 55px !important;
    margin-bottom: 14px !important;
}

/* Ingen extra toppluft på H3 i färgboxar */
.vg-box-red h3,
.vg-box-blue h3,
.vg-box-green h3,
.vg-box-orange h3,
.vg-info-box h3 {
    margin-top: 0 !important;
}

/* Mindre och jämnare listtext i färgboxar */
.vg-box-green li,
.vg-box-orange li,
.vg-box-blue li,
.vg-box-red li {
    font-size: 15px !important;
    line-height: 1.7;
    margin-bottom: 8px;
}

/* Standard brödtext */
p {
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: var(--vg-card-text);
    margin: 0 0 18px;
}

/* Undantag */
.vg-cta p {
    font-size: 17px !important;
    line-height: 1.7 !important;
}

.vg-footer-text {
    font-size: 13px !important;
}

/* Standardstorlek för listor i artikeltext */
li {
    font-size: 15px !important;
    line-height: 1.55 !important;
}

@media (max-width: 700px) {

  .vg-hero-image,
  .vg-travel-image {
    width: 100% !important;
    max-width: 100% !important;
  }

  .vg-hero-image img,
  .vg-travel-image img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block;
  }
}

.vg-card-title {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
}

/* Kort-rubriker */
.vg-card-title {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
}

/* Sektionsrubriker som "TRE VIKTIGA APPAR" */
.vg-section-heading {
    margin-top: 0 !important;
    margin-bottom: 20px !important;
}
}