/* Melleruds kommun 2012-2024 */
:root {
    --mk-blue: #005eb8;
    --mk-blue-light: #b8ccea;
    --mk-blue-dark: #003a5c;
    --mk-viola: #be84a3;
    --mk-viola-dark: #82526b;
    --mk-sidecar: #f1e6b2;
    --mk-jungle-green: #27998a;
    --mk-algae-green: #9be3bf;
    --mk-rolling-stone: #75787b;
    --mk-quill-gray: #d0d0ce;
    --mk-sunset-orange: #f9443a;
    --mk-sunglow: #ffc72c;
    --bs-nav-link-font-size: 1rem;    
    --bs-nav-link-font-weight: inherit;
    --bs-nav-link-padding-x: 1rem;
    --bs-nav-link-padding-y: .5rem;
    --step-progress-circle-size: 16px;
    --step-progress-left: 0px;
    --step-progress-line-width: 2px;
}
body {
    font-family: 'Open Sans', Verdana;
    color: #000;
    background-color: #fff;
}

a, .block-link .text-kommun, .text-kommun, span.fa.toggle, .pushpin {
    color: var(--mk-blue);
}

h1, .h1 {font-size:2rem;}
h2, .h2 {font-size:1.5rem;}
h3, .h3 {font-size:1.125rem;}

input {
    line-height: normal;
}

td {
    vertical-align: top;
}

iframe {
    border: 0;
}

fieldset td {
    padding: .125rem;
}

legend {
    font-size: .875rem;
    font-weight: bold;
    margin-bottom: .5rem;
    border-bottom: 0;
}

video {
    max-width: 100%;
}
.d-contents {
    display: contents;
}
@media (min-width: 768px) {
    .d-md-contents {
        display: contents!important;
    }
}
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.btn-search:focus {
    border: var(--mk-blue) solid 2px;
}
.block-link h2 {
    font-size: 1.25rem;
}
.block-link p, .block-link span, .block-link li {
	color: #000;
}
.block-link a {
    text-decoration: none;
}
.block-link a:hover {
	text-decoration: none;
}
.block-link a:active {
	text-decoration: none;
}
.block-link a:hover h5 {
	text-decoration: underline;
}
.bg-blue {
    background-color: var(--mk-blue)!important;
}
.bg-blue-light {
    background-color: var(--mk-blue-light);
}
.bg-blue-dark {
    background-color: var(--mk-blue-dark);
}
.bg-viola, .bg-viola:hover {
    background-color: var(--mk-viola);
}
.bg-viola-dark, .bg-viola-dark:hover {
    background-color: var(--mk-viola-dark);
}
.bg-sidecar {
    background-color: var(--mk-sidecar);
}
.bg-jungle-green {
    background-color: var(--mk-jungle-green);
}
.bg-algae-green {
    background-color: var(--mk-algae-green);
}
.bg-rolling-stone {
    background-color: var(--mk-rolling-stone);
}
.bg-quill-gray {
    background-color: var(--mk-quill-gray);
}
.bg-sunset-orange {
    background-color: var(--mk-sunset-orange);
}
.bg-sunglow {
    background-color: var(--mk-sunglow);
}
.fg-black, .fg-black:hover, .fg-black p {
    color: #000;
}
.fg-white, .fg-white:hover, .fg-white p {
    color: #fff;
}
.text-blue {
    color: var(--mk-blue);
}
.font-weight-bold {
    font-weight: 700!important;
}
.breadcrumb-item+.breadcrumb-item:before {font-family:'Font Awesome 6 Free';font-weight:900;content:"\f054";}
.breadcrumb-item:nth-child(2):before {display:none;}

.carousel-fade .carousel-item {
    transition: opacity ease-in 1s;    
}

.card-header .event-toggle .toggle:after {
    font-family: 'Font Awesome 6 Free';
    content: "\f056";
    float: right;
}

.card-header .event-toggle.collapsed .toggle:after {
    content: "\f055";
}

.top-right-1rem {
	top: 1rem;
	right: 1rem;
}

.top-right-corner {
	top: 1rem;
	right: .5rem;
}

#__ba_panel {
    display:none;
}

#cookiebar {
    position: sticky;
    z-index: 2000;
    top: 0;
    max-width: calc(100% - 24px);
}
.navbar-toggler {
    font-size: 1rem;
}
#offcanvasNavbar button:hover {
    background-color: var(--mk-blue);
}
div[id^="eventheader"] a {
	text-decoration: none;
}
.col-badge {
	min-width: 6rem;
	max-height: 2.5rem;
}
.badge-kommun {
	color: #fff;
	background-color: var(--mk-blue);
	min-height: 2.75rem;
}
.border-left-transparent {
	border-left: .25rem solid transparent;
}
.pre-scrollable {
    max-height: 400px;
}

.far fa-file-pdf {color:#d00;}

#content {
    min-height: 600px;
    /*overflow: hidden;*/
}

#content img:not(.gm-svpc img), .container-fluid img, .umb-grid img {
    max-width: 100%;
    height: auto !important;
}
/* Pegman */
.gm-svpc img {
    max-width:inherit!important;
    height:30px!important;
}
.img-event {
    max-width: 14rem!important;
}

.selected {
    font-weight: bold;
}

.btn-kommun {color: #fff;background-color: var(--mk-blue);}
.btn-kommun a {color: inherit;text-decoration: none;}

.btn-outline-kommun {color: var(--mk-blue);background-color: transparent;background-image: none;border-color: var(--mk-blue);}
.btn-outline-kommun a {text-decoration: none;}
.btn-outline-kommun:hover {border-color:inherit;}

.btn-outline-info-kommun {color:var(--mk-blue-dark);border-color:var(--mk-blue-dark);}
.btn-outline-info-kommun:hover {border-color:inherit;}

.iconRightDown {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}
.iconRightDown:before {
    content: "\f078";
    line-height: normal;
}
.collapsed .iconRightDown:before {
    content: "\f054";
}
.iconPlusMinus {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}
.iconPlusMinus:before {
    content: "\f068";
    line-height: normal;
}

.collapsed .iconPlusMinus:before {
    content: "\f067";
}
.fa-file-pdf:before {
    color: #d00;
}
.offcanvas-body .mk-border-bottom {
    border-bottom: var(--bs-border-width) var(--bs-border-style) rgba(255, 255, 255, 0.75);
    border-top: inherit;
    opacity: inherit;
}
button .expandIcon:before {
    content: "\f106";
    line-height: normal;
}

button.collapsed .expandIcon:before {
    content: "\f107";
}

/* Workaround for IE not handling max-width */
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
    video {
        width: 100%;
    }
}

table.grid {
    border-width: 1px;
    border-spacing: 0;
    border-style: solid;
    border-color: gray;
    border-collapse: collapse;
    background-color: white;
}

table.grid th {
    border-width: 1px;
    padding: 2px;
    border-style: inset;
    border-color: gray;
    background-color: white;
}

table.grid td {
    border-width: 1px;
    padding: 2px;
    border-style: inset;
    border-color: gray;
    background-color: white;
}

/* NEWS */
#accordionnews img {
	max-width: 100%;
	height: auto;
}

.dashed {
    border-bottom: #718c9d 1px dashed;
    margin-top: .25rem;
    margin-bottom: .25rem;
}
/* EVENTS LIST */
.event-pic-div {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-bottom: calc(550/1200*100%);
    background-position: 0 30%;
    background-size: cover;
    border-radius: .25rem;
}
.event-list-button {
    position: absolute;
    bottom: 2px;
    left: 1rem;
    right: 1rem;
    z-index: 1;
}

.event-date::before {
    font-family: 'Font Awesome\ 6 Free';
    font-weight: 400;
    content: "\f073 \202F";
}
.event-time::before {
    font-family: 'Font Awesome\ 6 Free';
    font-weight: 400;
    content: "\f017 \202F";
}

/* Toggle divs */
.btn-toggle {color:var(--mk-blue);}
.btntoggle {text-align: left;font-weight: bold;line-height: 1.875rem;background-color: var(--mk-blue);}
.btntoggle:after {font-family: 'Font Awesome 6 Free';font-size: 1.25rem;content: "\f056";float: right;}
.btntoggle.collapsed:after {font-family: 'Font Awesome 6 Free';font-size: 1.25rem;content: "\f055";float: right;}
.divcontent {margin-bottom: 3px;}
.divtoggle {border: 2px solid;border-color: #eee;border-bottom-left-radius: .25rem;border-bottom-right-radius: .25rem;border-top: hidden;margin-bottom: .125rem;padding: .25rem;}
.divtoggle p {margin-bottom: .5rem;}

/* Google translate */
#translateDlg {font-size: .75rem;display: none;position: absolute;right: 8vw;top:5rem;background-color: #fff;padding: .5rem;border: 1px solid #cccdce;width: 14rem;z-index: 1200;}
#translateDlg p {white-space: normal;text-align: left;}

.goog-te-gadget,
.goog-te-combo {
    font-family: inherit!important;
}

/* Google Maps */
.gm-style-iw {
    max-height: 180px !important;
    font-size: 14px !important;
}
.gm-style-iw-ch {
    font-weight: bold;
}

/* Ung i kommunen */
.youngitem {float: left;margin: .3125rem;height: 2rem;width: 100%;}
.youngitem img {float: left;margin: 5px;height: 32px;width: 32px;}

/* Stegprocess */
.StepProgress-Wrapper {
    font-size: var(--step-progress-circle-size);
    border: 1px solid #dee2e6;
    border-radius: .5rem;
    padding: 1rem;
}

.StepProgress {
    position: relative;
    padding-left: calc(var(--step-progress-left) + 45px);
    list-style: none;
}

.StepProgress li:last-child:before {
    border-left: none;
}

.StepProgress-item {
    position: relative;
}

.StepProgress-item button {
    position: relative;
    top: -4px;
}

.StepProgress-item:not(:last-child) {
    padding-bottom: 20px;
}

.StepProgress-item::before {
    display: inline-block;
    content: '';
    position: absolute;
    left: -28px;
    height: 100%;
    border-left: var(--step-progress-line-width) solid #ccc;
}

.StepProgress-item::after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0;
    left: -37px;
    width: var(--step-progress-circle-size);
    height: var(--step-progress-circle-size);
    border: var(--step-progress-line-width) solid #ccc;
    border-radius: 50%;
    background-color: #fff;
    box-sizing: content-box;
}

.StepProgress-item.is-done::before {
    border-left: var(--step-progress-line-width) solid var(--mk-jungle-green);
}

.StepProgress-item.is-done::after {
    content: "✔";
    font-size: calc(var(--step-progress-circle-size) - 6px);
    color: #fff;
    text-align: center;
    border: var(--step-progress-line-width) solid var(--mk-jungle-green);
    background-color: var(--mk-jungle-green);
}

.StepProgress-item.current::before {
    border-left: var(--step-progress-line-width) solid var(--mk-jungle-green);
}

.StepProgress-item.current::after {
    width: calc(var(--step-progress-circle-size) + 4px);
    height: calc(var(--step-progress-circle-size) + 4px);
    top: -2px;
    left: -39px;
    color: green;
    border: var(--step-progress-line-width) solid var(--mk-jungle-green);
    background-color: #fff;
}

.StepProgress strong {
    display: block;
}

/* CSS3 Treeview */
.css-treeview ul,
.css-treeview li {padding: 0;margin: 0;list-style: none;font-size: .875rem;}
.css-treeview input {position: absolute;opacity: 0;}
.css-treeview a {color: #00f;display:inline!important;}
.css-treeview a:hover {text-decoration: underline;}
.css-treeview input + label + ul {margin: 0 0 0 22px;}
.css-treeview input ~ ul {display: none;}
.css-treeview label,
.css-treeview label:before {color: #0000ff;cursor: pointer;}
.css-treeview input:checked:not(:disabled) ~ ul {display: block;}
.css-treeview label,
.css-treeview label:before {background: url("/images/icons/folders.png") no-repeat;}
.css-treeview label,
.css-treeview a,
.css-treeview label:before {display: inline-block;height: 16px;line-height: 16px;vertical-align: middle;}
.css-treeview label {background-position: 0 0;}
.css-treeview label:before {content: "";width: 16px;margin: 0 6px 0 0;vertical-align: middle;background-position: 0 -32px;}
.css-treeview input:checked + label:before {background-position: 0 -16px;}

#skattekollenwidget-input p,
#skattekollenwidget-input input,
#skattekollenwidget-input label,
#skattekollenwidget-input #inputIncome,
#skattekollenwidget-result .detail-name,
#skattekollenwidget-result .detail-sum,
#skattekollenwidget-result .zummationcontainer span {background:inherit!important;color:inherit!important;font-family:inherit!important;font-size:inherit!important;font-weight:inherit!important;max-width:inherit!important;}

/* List (organisationsträd) */
.tree li {list-style-type: none;margin: .5rem 0 .5rem .5rem;position: relative;}
.tree li::before {content: "";position: absolute;top: -8px;left: -20px;border-left: 1px solid #ccc;border-bottom: 1px solid #ccc;border-radius: 0 0 0 0;width: 18px;height: 21px;}
.tree li::after {position: absolute;content: "";top: 12px;left: -20px;border-left: 1px solid #ccc;border-top: 1px solid #ccc;border-radius: 0 0 0 0;width: 18px;height: 100%;}
.tree li:last-child::after {display: none;}
.tree li:last-child:before {border-radius: 0 0 0 5px;}
ul.tree > li:first-child::before {display: none;}
ul.tree > li:first-child::after {border-radius: 5px 0 0 0;}
.tree li a {border: 1px #ccc solid;border-radius: 5px;padding: 2px 5px;}

@media print
{
	.noPrint{display:none;}
	.noScreen{}
}

@media screen
{
	.noPrint{}
	.noScreen{display:none;}
}