/*

Theme Name: Twenty Twenty Child Custom
Theme URL: https://dbjob.dk/
Description: Twenty Twenty Child Custom Theme
Author: SR
Author URL: https://dbjob.dk/
Template: twentytwenty
Version: 1.0.5
Text Domain: twentytwenty-child
*/


:root {
    --dbjTxtPrimary: #0000ff;
    --dbjTxtSecondary: white;
    --dbjGray: #EDEDEB;

    /* --dbjPrimarySecondary: #F5F0EB;
    --dbjTxtThird: white;
    --dbjPrimary: #C83241; */

    --padding: 25px;
    --width: 880px;
    --largefont: 28px;
    --smallwidth: 343px;

    --defaultFont-family: Saans,SaansW,Saansttf, Calibri, sans-serif;
}

/*** woff2 ********************/
@font-face {
    font-family: 'Saans';
    src: url('fonts/SaansRegular.woff2') format('woff2');
    font-weight: normal;
}
@font-face {
    font-family: 'Saans';
    src: url('fonts/SaansRegular.woff2') format('woff2');
    font-weight: 380;
}
@font-face {
    font-family: 'Saans';
    src: url('fonts/SaansMedium.woff2') format('woff2');
    font-weight: 670;
}
@font-face {
    font-family: 'Saans';
    src: url('fonts/SaansBold.woff2') format('woff2');
    font-weight: 790;
}


@font-face {
    font-family: 'Saans';
    src: url('fonts/SaansRegularItalic.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Saans';
    src: url('fonts/SaansRegularItalic.woff2') format('woff2');
    font-weight: 380;
    font-style: italic;
}
@font-face {
    font-family: 'Saans';
    src: url('fonts/SaansMediumItalic.woff2') format('woff2');
    font-weight: 670;
    font-style: italic;
}
@font-face {
    font-family: 'Saans';
    src: url('fonts/SaansBoldItalic.woff2') format('woff2');
    font-weight: 790;
    font-style: italic;
}


/*** woff ********************/
@font-face {
    font-family: 'Saansttf';
    src: url('fonts/SaansRegular.woff') format('woff');
    font-weight: normal;
}
@font-face {
    font-family: 'Saansttf';
    src: url('fonts/SaansRegular.woff') format('woff');
    font-weight: 380;
}
@font-face {
    font-family: 'Saansttf';
    src: url('fonts/SaansMedium.woff') format('woff');
    font-weight: 670;
}
@font-face {
    font-family: 'Saansttf';
    src: url('fonts/SaansBold.woff') format('woff');
    font-weight: 790;
}


@font-face {
    font-family: 'Saansttf';
    src: url('fonts/SaansRegularItalic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Saansttf';
    src: url('fonts/SaansRegularItalic.woff') format('woff');
    font-weight: 380;
    font-style: italic;
}
@font-face {
    font-family: 'Saansttf';
    src: url('fonts/SaansMediumItalic.woff') format('woff');
    font-weight: 670;
    font-style: italic;
}
@font-face {
    font-family: 'Saansttf';
    src: url('fonts/SaansBoldItalic.woff') format('woff');
    font-weight: 790;
    font-style: italic;
}

/****** ttf ****************************/
@font-face {
    font-family: 'Saansw';
    src: url('fonts/ttf/Saans-Regular-1.ttf') format('ttf');
    font-weight: normal;
}
@font-face {
    font-family: 'Saansw';
    src: url('fonts/ttf/Saans-Regular-1.ttf') format('ttf');
    font-weight: 380;
}
@font-face {
    font-family: 'Saansw';
    src: url('fonts/ttf/Saans-Medium-1.ttf') format('ttf');
    font-weight: 670;
}
@font-face {
    font-family: 'Saansw';
    src: url('fonts/ttf/Saans-Bold-1.ttf') format('ttf');
    font-weight: 790;
}


@font-face {
    font-family: 'Saansw';
    src: url('fonts/ttf/Saans-RegularItalic-1.ttf') format('ttf');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Saansw';
    src: url('fonts/ttf/Saans-RegularItalic-1.ttf') format('ttf');
    font-weight: 380;
    font-style: italic;
}
@font-face {
    font-family: 'Saansw';
    src: url('fonts/ttf/Saans-MediumItalic-1.ttf') format('ttf');
    font-weight: 670;
    font-style: italic;
}
@font-face {
    font-family: 'Saansw';
    src: url('fonts/ttf/Saans-BoldItalic-1.ttf') format('ttf');
    font-weight: 790;
    font-style: italic;
}



/****** K U R S U S **********************/


body{
    font-family: var(--defaultFont-family);
	background-color:white !important;
    font-size:18px;
    letter-spacing: 0;
}

h1, h2, h3, h4, h5, h6, .faux-heading
{
    letter-spacing: 0;
}

h2{
    font-size: 20px;
    font-weight: 790;
    margin-top: 0;
    font-family: var(--defaultFont-family) !important;
}

.modal-menu > li > a,
.modal-menu > li > .ancestor-wrapper > a
{
    letter-spacing: 0;
}

.entry-content
{
    font-family: var(--defaultFont-family);
}

input, textarea{
    font-size:18px !important;
    font-family: var(--defaultFont-family);
}


.site-logo img
{
    max-height: none;
    width:132px;
    min-width: 132px;
}






.dbj_moreBtn
{
    text-align: center;
}
.dbj_moreBtn a{
    background-color: black;
    color: white;
    padding-top: 22px;
    padding-bottom: 22px;
    border-radius: 37px;
    width: 174px;
    display: inline-block;
    font-size: 14px;
    font-weight: 670;
    text-decoration: none;
    line-height: 100%;
}

/****** K U R S U S  items **********************/
.kursusItems
{
    margin-top: var(--padding);
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 25px;
    max-width: 1080px !important;
    margin-left: auto;
    flex-wrap: wrap;
    margin-right: auto;
}
.kursusItem
{
    height: auto;
    width: var(--smallwidth) !important;
    min-width: var(--smallwidth);
    background-color: var(--dbjGray);
    border-radius: 10px;
}

.kursusItem .kursusForhaandsgodkendt
{
    margin-top: auto;
}

.kursusItem a{
    text-decoration: none;
    color:black;
    display: flex;
    flex-direction: column;
    justify-content: start;
    height: 100%;
}

.kursusItem a >div:first-child img
{
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    object-fit: cover;
    height: 193px;
    width: var(--smallwidth);
}

.kursusItem a >div
{
    padding-top:25px;
    padding-left: 25px;
    padding-right: 25px;
    flex:1,1,0px;
}
.kursusItem a >div:first-child
{
    padding:0;
    height: 193px;
}
.kursusItem a >div:last-child
{
    padding-bottom: 33px;
    padding-top: 33px;
    /* color:yellow; */
}

.kursusItem div h2,
.kursus h2
{
    margin:0;
    font-size: 24px;
    line-height: 27px;
    font-weight: 790;
}


.kursus h2{
    margin-bottom:20px;
}

.kursusTitel
{
    margin-top: 10px;
}
.kursus .kursusTitel h2{
    margin-bottom: 0;
}

.kursusItemDetailsContainer{
    display:flex;
    column-gap: 20px;
    /* font-weight: 670; */
}

.kursusItemDetailsContainer >div:first-child,
.kursusImageContainer >div:first-child
{
    flex-basis: 80px;
    min-width: 80px;
    background-color: #0000ff;
    padding: 10px;
    border-radius: 10px;
    height: 80px;
    color: white;
    font-size: 14px;
    font-weight: 790;
    
}

.kursusItemDetailsContainer >div:first-child
{
    display:flex;
    flex-direction: column;
    justify-content: space-between;
    line-height: normal;
}



.kursusItemDetailsContainer >div>div:first-child
{
    /* font-size: 16px; 2025-03-27 blå boks */
    font-size: 23px; 
    font-weight: 790;
    line-height: 21px;
}

.kursusImageContainer >div>div:first-child
{
    font-size: 23px;
    line-height: 21px;
}

.kursusItemDetails{
    display: flex;
    flex-direction: column;
    height: 138px;
    justify-content: space-between;
    font-size: 16px;;
}

.kursusItemDetails >div:first-child
{
    font-size: 18px !important;
}

.kursusForhaandsgodkendt{
    background-image: url("images/forhaandsgodkendt.svg");
    background-repeat: no-repeat;
    background-size: 50px;
    /* background-position-y: center;
    background-position-x: 25px; */
    background-position: 25px center;
    font-size: 14px;
    color: #648f3e;
    font-weight: 670;
    padding-left: 85px !important;
}

.kursusForhaandsgodkendtPlus .kursusForhaandsgodkendt{
    background-image: url("images/forhaandsgodkendt.svg"), url("images/plusgroen.svg");
    /* background-image: url("data:image/svg+xml,%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2050%2050%22%3E%0A%20%20%3C!--%20Generator%3A%20Adobe%20Illustrator%2029.3.0%2C%20SVG%20Export%20Plug-In%20.%20SVG%20Version%3A%202.1.0%20Build%20146)%20%20--%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3Cstyle%3E%0A%20%20%20%20%20%20.st0%2C%20.st1%20%7B%0A%20%20%20%20%20%20%20%20fill%3A%20none%3B%0A%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20.st1%20%7B%0A%20%20%20%20%20%20%20%20stroke%3A%20%23fff%3B%0A%20%20%20%20%20%20%20%20stroke-linecap%3A%20round%3B%0A%20%20%20%20%20%20%20%20stroke-linejoin%3A%20round%3B%0A%20%20%20%20%20%20%20%20stroke-width%3A%202px%3B%0A%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20.st2%20%7B%0A%20%20%20%20%20%20%20%20fill%3A%20%23648f3e%3B%0A%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20.st3%20%7B%0A%20%20%20%20%20%20%20%20clip-path%3A%20url(%23clippath)%3B%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%3C%2Fstyle%3E%0A%20%20%20%20%3CclipPath%20id%3D%22clippath%22%3E%0A%20%20%20%20%20%20%3Crect%20class%3D%22st0%22%20width%3D%2250%22%20height%3D%2250%22%2F%3E%0A%20%20%20%20%3C%2FclipPath%3E%0A%20%20%3C%2Fdefs%3E%0A%20%20%3Cg%20class%3D%22st3%22%3E%0A%20%20%20%20%3Cg%3E%0A%20%20%20%20%20%20%3Cpath%20class%3D%22st2%22%20d%3D%22M25%2C33.3c13.8%2C0%2C25-3.7%2C25-8.3s-11.2-8.3-25-8.3S0%2C20.4%2C0%2C25s11.2%2C8.3%2C25%2C8.3Z%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20class%3D%22st2%22%20d%3D%22M25%2C50c4.6%2C0%2C8.3-11.2%2C8.3-25S29.6%2C0%2C25%2C0s-8.3%2C11.2-8.3%2C25%2C3.7%2C25%2C8.3%2C25Z%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20class%3D%22st2%22%20d%3D%22M30.9%2C30.9c9.8-9.8%2C15-20.3%2C11.8-23.6-3.3-3.3-13.8%2C2-23.6%2C11.8-9.8%2C9.8-15%2C20.3-11.8%2C23.6%2C3.3%2C3.3%2C13.8-2%2C23.6-11.8Z%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20class%3D%22st2%22%20d%3D%22M42.7%2C42.7c3.3-3.3-2-13.8-11.8-23.6C21.1%2C9.3%2C10.6%2C4.1%2C7.3%2C7.3c-3.3%2C3.3%2C2%2C13.8%2C11.8%2C23.6%2C9.8%2C9.8%2C20.3%2C15%2C23.6%2C11.8Z%22%2F%3E%0A%20%20%20%20%3C%2Fg%3E%0A%20%20%3C%2Fg%3E%0A%20%20%3Cpath%20class%3D%22st1%22%20d%3D%22M34%2C25c0%2C5-4%2C9-9%2C9s-9-4-9-9%2C4-9%2C9-9%2C2.7.3%2C3.9.9M32.3%2C19.4l-7.9%2C7.9-2.2-2.2%22%2F%3E%0A%3C%2Fsvg%3E"); */
    background-repeat: no-repeat;
    background-size: 50px, 13px;
    /* background-position-y: center;
    background-position-x: 25px; */
    background-position: 25px center, right 25px center;
    
}

.kursusForhaandsgodkendtPlus .kursusForhaandsgodkendtClose{
    background-image: url("images/forhaandsgodkendt.svg"), url("images/krydsgroen.svg");
    
}

.kursusForhaandsgodkendt::before {
    content: "Kurset er forhåndsgodkendt til Kompetencefonden";
}

.kursusForhaandsgodkendtPlus{
    background-color: #D8E8CA;
    border-radius: 10px;
    margin-top: 30px;
}

.kursusForhaandsgodkendtTxt{
    display: none;
    font-size: 18px;
    color: #648f3e;
    font-weight: 380;
    padding: 0 25px 25px;
}

@media (min-width: 930px) {
    .kursusForhaandsgodkendtPlus{
        margin-top: 0;
    }
}

/***************** kursusdetaljer **********************/

.kursus{
    display: flex;
    flex-direction: column;
    /* gap: 10px; 2025-03-27 */
}
.kursusHeader{
    text-align: right;
    margin-top: 35px;
}

.kursustilmeld_small
{
    width:174px;
}

.kursusHeader .kursustilmeld_small,
.kursus .kursustilmeld_large
{
    background-color: #0000ff;
    padding: 11px 20px;
    border-radius: 20px;
    color:white;
    text-decoration: none;
    font-size: 16px;
    font-weight: 670;
    text-transform: none;
    
    /* display:flex;
    justify-content: space-between; */
}
.kursusImageContainer{
    position:relative;
    margin-top: 20px;
    margin-top: 20px;
}
.kursusImageContainer >div:first-child{
    width:80px;
    position: absolute;
    left: 10px;
    top: -50px;
    text-align: left;
    line-height: 26px;
}

.kursusDetaljerContainer{
    display: flex;
    flex-direction: column;
    gap: var(--padding);
}

.kursusBillede img,
.kursusDetaljerContainer,
.kursusNyttig,
.KursusContentContainer .kursusForhaandsgodkendt
{
    border-radius: 10px;
}

.kursusBillede img
{
    object-fit: cover;
    /* height: 193px; */
    /* width: 343px; */
    aspect-ratio: 343 / 193;
    width:100%;
}

.UdbyderLogoDetail
{
    width: 174px;
    margin-top: 15px;
}


.kursusDetaljerContainer,
.kursusNyttig
{
    background-color:var(--dbjGray);
    padding:var(--padding);
}

.KursusContentContainer >div{
    display:flex;
    gap:10px;
    flex-direction: column;
}

.KursusContentContainer .kursusForhaandsgodkendt
{
    background-color: #D8E8CA;
    padding:var(--padding);
}

.kursusDetaljerContainer h3
{
    margin:0;
    color:#0000ff;
    font-size: 22px;
}

.kursusDetaljerFrist{
    padding-top: 10px;
    font-weight: 670;
    color:#F00;
}
.kursusDetaljerFristData
{
    color:#F00;
}

.kursusPris
{
    margin-bottom: var(--padding);
}

.kursusWhen,
.kursusWhere,
.kursusKontakt,
.kursusPris
{
    display:flex;
    gap:10px;
    line-height: 20px;
}

.kursusWhen .kursusicon{
    background-image: url("images/kursuswhen.svg");
}
.kursusWhere .kursusicon{
    background-image: url("images/geo.svg");
}
.kursusKontakt .kursusicon{
    background-image: url("images/kursuskontakt.svg");
}
.kursusPris .kursusicon{
    background-image: url("images/kursuspris.svg");
}

.kursusicon{
    width:24px;
    height:24px;  
    min-width: 24px;
    background-repeat: no-repeat; 
}

.kursusWhen >div>div:first-child,
.kursusWhere >div>div:first-child,
.kursusKontakt >div>div:first-child,
.kursusPris >div>div:first-child
{
    font-weight: 670;
}

.KursusContentContainer
{
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.KursusContentContainer .kursusDescription article h3{
    font-size: 22px; /* 2025-03-27*/
}

.kursusDescription
{
    font-size: 22px;
    font-weight: 670;
}

.kursusDescription div:last-child
{
    font-size: 18px;
    font-weight: normal;
}

.kursusDescription section{
    padding: 15px 0 !important;
}

.kursus .kursustilmeld_large
{
    width:100%;
    background-image: url(images/pil.svg);
    background-repeat: no-repeat;
    background-position-x: right;
    background-size: 11px 16px;
    background-position-y: center;
    background-origin: content-box;
    display:none;
}

.kursusHeader .kursustilmeld_small::after
{
    width:11px;
    height:16px;
    display: inline-block;
    content:url("images/pil.svg");
    margin-left: 20px;
}

@media (min-width: 930px) {
    .kursusBillede
    {
        width:100%;
    }
    .kursusHeader{
        display: flex;
        flex-direction: column-reverse;
        gap: 25px;
        margin-top: 0;
    }
    .kursusImageContainer
    {
        display:flex;
        gap:var(--padding);
    }
    .kursusImageContainer >div:first-child
    {
        position: static;
    }
    .kursustilmeld_small
    {
        width:fit-content;
        align-self: flex-end;;
    }

    .kursusTitel
    {
        margin-bottom: -120px;
        /* background-color: yellow; */
        margin-top: 0;
        
    }
    .kursusTitel h2
    {
        background-color: white;
        position: relative;
        top:-120px;
        padding-right: 50px;
        padding-top: 50px;
        width:665px;
        border-top-right-radius: 30px;
        font-size: 58px;
        line-height: normal;
    }

    .KursusContentContainer{
        flex-direction: row-reverse;
        margin-top:70px;
    }
    .KursusContentContainer >div:first-child
    {
        width: var(--smallwidth);
        min-width: var(--smallwidth);
    }

    .kursusHeader .kursustilmeld_small, 
    .kursus .kursustilmeld_large
    {
        padding: 22px 20px;
        border-radius: 40px;
        font-size: 14px;
        
    }
    .kursus .kursustilmeld_large
    {
        width:300px ;
        align-self: center;
        display:block;
        margin-left: auto;
        margin-right: 25px;
    }
    
    .kursusHeader .kursustilmeld_small
    {
        align-self: end;
        width:174px;
        display:flex;
        justify-content: space-between;
    }

}


/***************************/
/********* header **********/
.header-inner,
.dbj_frontpageHeaderImage,
.kursus
{
    width: calc(100% - 50px) !important;
    max-width:930px !important;
    margin-left: auto;
    margin-right: auto;
}

.dbj_frontpageHeaderContent
{
    display:flex;
    flex-direction: column;
}





.dbj-nav-toggle
{
    /* right: 2rem;
    position: absolute; */
    background-color:transparent;
    padding:0;
}
.dbj-nav-toggle .toggle-inner
{
    height:auto;
}

.toggle-inner
{
    justify-content: end;
}

#site-header
{
    background-color:transparent;
}

#site-header .header-titles{
    justify-content: center;
}
.dbj_frontpageHeaderImage
{
    border-radius: 10px;
    margin-top: -35px;
    display:flex;   
    justify-content: center;
    overflow: hidden;
    
}

.dbj_frontpageHeaderImage img{
    /* min-height: 275px; */
    max-width: none;

    height: 250px;
    object-fit: cover;
    object-position: 0 0px;
}


.header-inner
{
    padding:0;
    padding-top: 10px;
}


/****************************************/
/********* søgebox på forsiden **********/

.dbj_searchBox,
#site-footer.dbj-footer
{
    background-color: var(--dbjTxtPrimary);
    border-radius: 30px 30px 0 0;
    padding: var(--padding);
    width:100%;
    
    margin-left: auto;
    margin-right: auto;
}

.dbj_searchBox
{
    max-width: var(--width);
    margin-top: -25px;
}

.dbj_searchBox input{
    padding: 20px;
    border-radius: 35px;

    
}

.dbj_searchBox input[type=text]{
    padding-left: 62px;
    background-image: url(images/soeg.svg);
    background-repeat: no-repeat;
    background-position: left var(--padding) top 50%;
    background-size: 20px auto;
    font-style: italic;
}

.dbj_searchBox input[type=text]::placeholder{
    color:#989595;
}

.dbj_searchCriteriaArea
{
    background-color: var(--dbjTxtPrimary);
    max-width: var(--width);
    margin-left: auto;
    margin-right: auto;
    border-radius: 0 0 100px 100px;
    display: flex;
    justify-content: center;
}

.dbj_searchBox input[type=submit]
{
    margin-top: 10px;
    background-color: black;
    border-radius: 58px;
    text-decoration: none;
    max-width: var(--width);
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    font-weight: 670;
    text-transform: capitalize;
    font-size: 16px !important;
}


.dbj_searchBox input[type=submit]
{
    display:none;
}

.dbj_searchCriteriaSelect{
    display: flex;
    flex-direction: column;
    margin-top: 30px;
}

.dbj_searchCriteriaArea >div
{
    border-radius: 30px;
    background-color: var(--dbjGray);
    padding: var(--padding);
    display: flex;
    flex-direction: column;
    
}
@media (max-width: 1727px) {
    .dbj_searchCriteriaArea >div
    {
        min-width: calc(100vw - 50px);
    }
}
@media (min-width: 1728px) {
    .dbj_searchCriteriaArea >div
    {
        max-width: 1678px;
        min-width: 1678px;
    }
}

.dbj_searchCriteriaArea select,
.dbj_searchCriteriaArea input[type=date]
{
    padding: 11px;
    border-radius: 22px;
    font-size: 16px !important;
    margin-bottom: 10px;
    font-weight: 670;
    color: var(--dbjTxtPrimary);
    border:none;
}


.dbj_searchCriteriaArea select
{
    

    appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg id='Layer_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 9.5 10.7'> <!-- Generator: Adobe Illustrator 29.3.0, SVG Export Plug-In . SVG Version: 2.1.0 Build 146) --> <defs> <style> .st0 { fill: blue; } </style> </defs> <path class='st0' d='M9.5,6l-4.8,4.8L0,6l1.1-1.1,1.3,1.3c1,1,1.6,1.8,1.6,1.8,0,0,0-1,0-2.4V0h1.7v5.5c0,1.4,0,2.4,0,2.4,0,0,.7-.8,1.6-1.8l1.3-1.3,1.1,1.1Z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 11px top 50%;
    background-size: 11px auto;
}

.dbj_searchdims_smal
{
    margin-left: 0 !important;
}

.dbj_searchdims_bred .dbj_searchCheck
{
    display:none;
}

.dbj_searchCheck
{
    color: #648F3E;
    display:flex;
    font-weight: 670;
    max-width: var(--width) !important;
    width: 100%;
    margin-top: 20px;
}
.dbj_searchCheck input{
    height: 23px;
    max-width: 23px;
    width:23px;
    flex: 1;
    background-color:#DBEBCA;
    border-radius: 6px;
    border:solid #648F3E 1px;
}
.dbj_searchCheck label{
    flex: 2;
    font-size: 14px;
    font-weight: 670 !important;
    margin-left:8px !important;
}

.dbj_searchCheck input[type="checkbox"]:checked::before {
    height: 100%;
    width: 100%;
    margin: 0;
}


.dbj_searchCriteriaArea .dbj_minilink
{
    display:flex;
    justify-content: end;
}
.dbj_searchCriteriaArea .dbj_minilink a
{
    font-size:14px;
    color: #787878;
    font-weight: 670;
}

 .dbj_searchCriteriaArea div p{
    margin-bottom: 0;
    max-width: var(--width);
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    line-height: 100%;
} 

@media (min-width: 1055px) {
    .dbj_searchCheck
    {
        align-self: center;
    }
}



.dbj_searchCriteriaArea >div >div{
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
}


.dbj_searchBox
    {
        display:flex;
        gap:10px;
    }

@media (min-width: 930px) {
    .dbj_searchCriteriaArea >div >div{
        max-width: 1165px;
    }

    
    .dbj_searchBox input[type=submit]
    {
        display:block;
        margin-top: 0;
        flex-basis:150px;
    }

    

    .dbj_searchdims_bred
    {
        display:flex;
        max-width: var(--width) !important;
        width: 100%;
        margin-top:11px;
    }
    .dbj_searchdims_bred .dbj_searchCheck
    {
        display:flex;
        margin-top:0
    }
    .dbj_searchdims_bred .dbj_minilink
    {
        white-space: nowrap;
    }
    .dbj_searchdims_smal
    {
        display:none;
    }
}






/****************************************/
/********* footer **********/

#site-footer.dbj-footer
{
    color:white;
    padding-bottom: 50px !important;
    padding:32px;
    min-height: 632px;
    max-height: 651px;
    justify-content: space-between;
    display: flex;
    flex-direction: column;
}

#site-footer.dbj-footer a{
    color:var(--dbjTxtSecondary);
}

p.dbjFooterItem,
.site-logo.dbjFooterItem
{
    margin-left: auto;
    margin-right: auto;
}
.dbjFooterItem
{
    display:flex;
    justify-content: center;
    text-align: center;
    max-width: 507px;
    /* margin-left: auto;
    margin-right: auto; */
    margin-bottom: 0;

    font-weight: 380;
    font-size: 16px !important;
    /* leading-trim: Cap height; */
}

.dbj_logoII
{
    width:100%;
}
.dbj_logoII svg{
    margin-top: 28px;
    min-width: 130px;
    max-width: 148px !important;
    width:100%;
}
    

    

div.dbj_logolaererforening
    {
        display: flex;
        flex-direction: column;
        font-size: 10px !important;
        font-weight: 380;

        width: 100%;
    }
    .dbj_logolaererforening svg
    {
        margin-top: 10px;
        min-width: 88px;
        max-width: 130px !important;
        width: 100%;
    }

   

.dbj_footerItemEvery .site-logo svg
{
    width: 120px;

}


/* .dbj_footerItemEvery:nth-child(2){
    margin-top:30px;
} */
/* .dbj_footerItemEvery:nth-child(3){
    margin-top:113px;
}
.dbj_footerItemEvery:nth-child(4){
    margin-top:22px;
}
.dbj_footerItemEvery:nth-child(5){
    margin-top:52px;
} */

.dbj_footerItemEvery
{
    /* margin-top:55px; */
    max-width: var(--width);
    margin-left: auto;
    margin-right: auto;
}

.dbj_footermultilogo{
    display:flex;
    align-items: center;
    justify-content: space-between;
    gap:26px;
}

.dbjFootertxtI
{
    display:flex;
    flex-direction: column;
    align-items: center;
    font-weight: 670;
    line-height: 30px;
}

.dbj_footer_smalltxt
{
    display: flex;
    flex-direction: column;
    gap:14px;
    font-size: 12px;
    font-weight: 380;
    line-height: 100%;
    text-align: center;
}

@media (min-width: 375px) {
    .dbj_footermultilogo
    {
        justify-content: center;
        gap:30px;
    }

    #site-footer.dbj-footer
    {
        padding:35px
    }

}

/********************* guides ***********************************/

.guides{
    max-width: 1080px !important;
    margin-left: auto;
    margin-right: auto;
    
    margin-top:100px;
}

.guides h2{
    margin-top: 10px;
    margin-bottom: var(--padding);
    font-size: 24px;
    width:100%;
}

.dbj_guidesList
{
    display:flex;
    justify-content: flex-start;
    
    column-gap: 10px;
	overflow-x: auto;
}

.dbj_guidesList >div{
    width:240px;
    min-width: 240px;
}

.guideImage img{
    width:240px;
    height:240px;
    object-fit: cover;
}

.guideHeader
{
    position:relative;
}
.guideTag
{
    background-color:#00ff00;
    padding: 5.1px 9.35px;
    position:absolute;
    top:-12px;
    font-size: 12px;
    font-weight: 670;
}

.guideText
{
    padding-top:var(--padding);
    font-size: 22px;
    font-weight: 670;
    background-color: white;
}

@media (min-width: 740px) {
    .dbj_guidesList >div{
        width:auto;
        max-width: 345px;
        min-width: 240px;

        display: flex;
        flex-direction: column;
        align-items: center;
        flex-basis: 33%;
    }

    
}

@media (min-width: 1055px) {
    .dbj_guidesList 
    {
        gap:var(--padding);
    }
    .guideImage img{
        width:345px;
        height:345px;
    }

    .guideHeader
    {
        position:relative;
        width: 296px;
        align-self: end;
        top: -50px;
    }

    .guideTag
    {
        left:var(--padding);
    }

    .guideText
    {
        font-size: var(--largefont);
        padding:var(--padding);
        padding:var(--padding);
        line-height: normal;
    }

    .guides h2{
        margin-top: var(--padding);
    }
}

.guides_separator
{
    width:100% !important;
    max-width: 1080px !important;
    display:flex;
    align-items: center;
    gap:var(--padding);
}
.guides_separator svg
{
    width:100px;
}

.guides_separator div
{
    width: 100%;
    border-top: solid black 1px;
}


/**************** jobs ruller ******************/

.jobsRullerContainer
{
    background-color: var(--dbjGray);
    padding: var(--padding);
    max-width: none !important;
    width:100% !important;
}

.jobsRullerContainer > div:first-child,
.seogsaakurser
{
    max-width: 1080px;
    margin: 0 auto;
    padding-bottom: var(--padding);
}

.seogsaakurser
{
    margin-top: 100px;
}

.jobsRuller{
    display:flex;
    column-gap: 10px;
}

.jobsRuller>div{
    background-color: white;
    padding: var(--padding);
    min-width: 198px;
    width:198px;
    border-radius: 10px;
    height:317px;
}

.jobsRuller p{
    margin-top: var(--padding);
    font-size: 16px;
    font-weight: 790;
    line-height: 110%;
    height: 169px;
    overflow: hidden;
    text-align: left;
}

/******************** jos rulle ny uden owl *******************************/
.slider-wrapper {
  overflow: hidden;
  width: 100%;
  position: relative;
}

.slider {
  display: flex;
  transition: transform 2s ease;
}

.slider-item {
  width: 200px; /* Fast bredde */
  flex-shrink: 0;
  text-align: center;
  padding: 10px;
  box-sizing: border-box;
}

.slider-item a {
  text-decoration: none;
  color: inherit;
  display: block;
}

.slider-item img {
  width: 100%;
  height: auto;
  border-radius: 6px;
}

/*.slider-item p {
  margin-top: 8px;
  font-size: 14px;
  color: #333;
}*/


/*******************************************************************/


@media (min-width: 930px) {
    .header-inner {
        display:block;
    }

    .header-titles-wrapper {
         margin-right: 0;
         max-width: none;
    }

    .mobile-nav-toggle {
        display: flex !important;
    }

    .site-logo img
    {
        width:147px;
        min-width: 147px;
    }
    
    .dbj_logolaererforening
    {
        width: 78px;
        min-width: 78px;
    }


    .dbj_frontpageHeaderImage
    {
        margin-top: -39px;
    }

    .dbj_searchCriteriaSelect
    {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 19px;
    }
    .dbj_searchCriteriaSelect select,
    .dbj_searchCriteriaArea input[type=date],
    .tstmulti
    {
        margin-bottom: 0;
        flex: 1 1 0px;
        min-width: 0;
    }


    .dbj_searchCriteriaArea
    {
        width: 100%;
    max-width: 100%;
    background-color: var(--dbjGray);
    border-radius: 0;
    }

    #site-footer.dbj-footer
    {
        padding:var(--padding);
    }

}



/*************** annoncer *********************/
 .kun_mellem, .kun_stor
    {
        display:none;
    }



@media (min-width: 730px) {
    .kun_lille
    {
        display:none;
    }
    .kun_mellem
    {
        display:block;
    }
}

@media (min-width: 1120px) {
    .kun_mellem
    {
        display:none;
    }

    .kun_stor{
        display:block;
    }
}

/************* multi select checkboxes **********************/
/* The checkbox */

.tstmulti{
    width:600px;
    /* width:var(--smallwidth); 2025-03-27 */
    max-width: 100%;
    
}

.tstmulti .hidden-checkbox {
    display: none;
  }
  
  
  /* The element to show/hide */
  
  .tstmulti .toggle-content {
    display: none;
    z-index: 2;
    position: absolute;
    background-color: #373737;
    color: white;
    border-radius: 20px;
    padding: 20px 20px 0 20px;
    margin-top: 0;
    width: var(--smallwidth);
    /* max-width: 100%; 2025-03-28 */
    max-width: calc(100vw - 65px);
    width: 600px;
  }
  
  
  /* The label that controls the element */
  
  .tstmulti .label-toggle {
    cursor: pointer;

    padding: 12px 20px 12px 20px;
    border-radius: 22px;
    font-size: 16px !important;
    margin-bottom: 10px;
    font-weight: 670;
    color: var(--dbjTxtPrimary);
    border: none;
    appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg id='Layer_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 9.5 10.7'> <!-- Generator: Adobe Illustrator 29.3.0, SVG Export Plug-In . SVG Version: 2.1.0 Build 146) --> <defs> <style> .st0 { fill: blue; } </style> </defs> <path class='st0' d='M9.5,6l-4.8,4.8L0,6l1.1-1.1,1.3,1.3c1,1,1.6,1.8,1.6,1.8,0,0,0-1,0-2.4V0h1.7v5.5c0,1.4,0,2.4,0,2.4,0,0,.7-.8,1.6-1.8l1.3-1.3,1.1,1.1Z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 24px top 50%;
    background-size: 11px auto;
    background-color: white;
  }

  .tstmulti .dbj_TogglerFill
  {
    background-color: black;
    /* background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' id='Layer_2' viewBox='0 0 15 15'> <!-- Generator: Adobe Illustrator 29.3.0, SVG Export Plug-In . SVG Version: 2.1.0 Build 146) --> <defs><style> .cls-1 { fill: white; } </style></defs><g id='Layer_1-2'><circle class='cls-1' cx='7.5' cy='7.5' r='7.5'/><path d='M9.73,10.96l-3.47-3.46,1.22-1.2,1.2,1.2-3.47,3.46-1.2-1.2,2.25-2.25-2.25-2.25,1.2-1.2,2.27,2.25,2.25-2.25,1.22,1.2-2.27,2.25,2.27,2.25-1.22,1.2Z'/></g></svg>"); */
    background-size: 15px auto;
    overflow: hidden;
    white-space: nowrap;
    color:white;
  }

  .closebox{
    position: relative;
    display:none;
  }

  .closeboxDisplayBlock{
    display:block ;
  }
  .closebox div {
    position: absolute;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' id='Layer_2' viewBox='0 0 15 15'> <!-- Generator: Adobe Illustrator 29.3.0, SVG Export Plug-In . SVG Version: 2.1.0 Build 146) --> <defs><style> .cls-1 { fill: white; } </style></defs><g id='Layer_1-2'><circle class='cls-1' cx='7.5' cy='7.5' r='7.5'/><path d='M9.73,10.96l-3.47-3.46,1.22-1.2,1.2,1.2-3.47,3.46-1.2-1.2,2.25-2.25-2.25-2.25,1.2-1.2,2.27,2.25,2.25-2.25,1.22,1.2-2.27,2.25,2.27,2.25-1.22,1.2Z'/></g></svg>");
    background-repeat: no-repeat;
    background-size: 15px auto;
    width: 15px;
    height: 15px;
    /* background-color: red; */
    right: 23px;
    top: -38px;
}

  .tstmulti .dbj_TogglerFillPilop
  {
    background-image: url("images/pilop.svg");
    background-color: #d7d7d7;
  }
  

  .cls-1{fill:#fff;}

  /* .tstmulti .hidden-checkbox:checked-.label-toggle
  {
    background-color:red;
  } */
  
  /* Show the element when the checkbox is checked */
  
  .tstmulti .hidden-checkbox:checked+.toggle-content {
    display: block;
  }
  
  .tstmulti ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    overflow-y: auto;
    padding-right: 10px;
    max-width: var(--smallwidth);
  }
  
  .tstmulti li {
    padding-bottom: 20px;
    display:flex;
    margin:0;
    
  }
  
  /* .tstmulti li:hover {
    background-color: darkgrey;
  } */

  .tstmulti input[type=checkbox]
  {
    border-radius: 12px;
    width: 21px;
    height: 21px;
    border: solid #d7d7d7 5px;
    background-color: #d7d7d7;
    cursor:pointer;
  }
  .tstmulti input[type=checkbox]:checked
  {
    background-color: black;
  }
  .tstmulti input[type="checkbox"]:checked::before
  {
    content:none;
  }


  .tstmulti ul li label{
    margin-left:11px;
    cursor:pointer;
    font-weight: 670;
  }


  @media (min-width: 930px) {
    .tstmulti ul
    {
        max-width: 100%;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        max-height: 377px;
    }

    .tstmulti .toggle-content{
        max-width: 1165px;
        width: calc(100vW - 100px);
        margin: 0 auto;
        left: 0;
        right: 0;
    }

  }

  /******* kursusfod ************************/
  .klikoghent{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 50px;
  }

  .klikoghent .klikoghentretur,
  .klikoghent .klikoghentop
  {
    font-size: 14px;
    font-weight: 670;
    text-decoration: none;
    color:black;
    background-repeat: no-repeat;
    background-size: 60px;
    height:60px;
    align-content: center;
  }

  .klikoghent .klikoghentretur
  {
    background-image: url("images/klikretur.svg");
    padding-left: 70px;
    
  }
  .klikoghent .klikoghentop
  {
    background-image: url("images/klikop.svg");
    padding-right: 70px;
    background-position: right;
    text-align: right;
  }

  @media (min-width: 930px) {
    .klikoghent .klikoghentop
    {
        width: var(--smallwidth);
        min-width: var(--smallwidth);
    }
  }