/*

Green : #588012;
Green - selected :#46650e;

KK Mørkeblå (primær): 005664
KK Lyseblå (sekundær): 00778C

Forsyningen basis: #005664
Forsyningen alternativ: #00778C

*/

@font-face{
	 font-family:'FontAwesome';
	 src:url('../fonts/fontawesome-webfont.eot?v=4.7.0');
	 src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),
	 url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),
	 url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),
	 url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),
	 url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
	 font-weight:normal;
	 font-style:normal
	 }





@font-face {
	font-family: 'HKNova';
	src: url('../fonts/hinted-HKNova-Regular.eot') format('embedded-opentype'),
    url('../fonts/hinted-HKNova-Regular.woff2') format('woff2'),
	url('../fonts/hinted-HKNova-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'HKNovaLight';
	src: url('../fonts/hinted-HKNova-Light.eot') format('embedded-opentype'),
    url('../fonts/hinted-HKNova-Light.woff2') format('woff2'),
	url('../fonts/hinted-HKNova-Light.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

/*
@font-face {
	font-family: 'HKNovaThin';
	src: url('../fonts/HKNova-Thin.eot') format('embedded-opentype'),
    url('../fonts/HKNova-Thin.woff2') format('woff2'),
	url('../fonts/HKNova-Thin.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'HKNovaRounded';
	src: url('../fonts/HKNova-RegularR.eot') format('embedded-opentype'),
    url('../fonts/HKNova-RegularR.woff2') format('woff2'),
	url('../fonts/HKNova-RegularR.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'HKNovaLightRounded';
	src: url('../fonts/HKNova-LightR.eot') format('embedded-opentype'),
    url('../fonts/HKNova-LightR.woff2') format('woff2'),
	url('../fonts/HKNova-LightR.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'HKNovaThinRounded';
	src: url('../fonts/HKNova-ThinR.eot') format('embedded-opentype'),
    url('../fonts/HKNova-ThinR.woff2') format('woff2'),
	url('../fonts/HKNova-ThinR.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}*/


/*@font-face {
	font-family: 'NeueHansKendrick';
	src: url('../fonts/neuehanskendrick-regular.eot') format('embedded-opentype'),
    url('../fonts/neuehanskendrick-regular.woff2') format('woff2'),
	url('../fonts/neuehanskendrick-regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}*/

/*@font-face {
	font-family: 'HKNovaNarrow';
	src: url('../fonts/HKNova-Narrow.eot') format('embedded-opentype'),
    url('../fonts/HKNova-Narrow.woff2') format('woff2'),
	url('../fonts/HKNova-Narrow.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}*/

/*@font-face {
	font-family: 'HKNovaTTF';
	src: url('../fonts/HKNova-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}*/


/*@font-face {
	font-family: 'HKNovaEOT';
	src: url('../fonts/HKNova-Regular.eot') format('embedded-opentype');
	font-weight: normal;
	font-style: normal;
}*/


/*@font-face {
	font-family: 'HKNovaWOFF';
	src: url('../fonts/HKNova-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}*/


/*.HKRTest{
    font-family: HKNovaRounded;
}

.NHKTest{
    font-family: NeueHansKendrick;
}

.NovaNarrow{
    font-family: HKNovaNarrow;
}

.HKNTTF{
    font-family: HKNovaTTF;
}

.HKNEOF{
    font-family: HKNovaEOT;
}

.HKNWOFF{
    font-family: HKNovaWOFF;
}*/



/*@font-face {
  font-family: "FontAwesome";
  src: url("../fonts/fontawesome-webfont.eot");
  src: url("../fonts/fontawesome-webfont.eot?#iefix") format("embedded-opentype"),
       url("../fonts/fontawesome-webfont.woff") format("woff"),
       url("../fonts/fontawesome-webfont.ttf") format("truetype"),
       url("../fonts/fontawesome-webfont.svg#fontcustom") format("svg");
  font-weight: normal;
  font-style: normal;
}*/


body{
    background-color: #f5f5f5;
    overflow-y: scroll;
    font-family: 'HKNova', Arial, sans-serif;
    color: #555555;
}

/*body.is-reveal-open { overflow: auto; }*/
body.is-reveal-open {
overflow: visible;
}

.reveal-overlay {

overflow-y: hidden;
}

.reveal{
    outline: none;
}

.SS_MainBody
{
    /*background: linear-gradient(135deg, rgba(220,240,220,0.5), rgba(255,255,255,1));*/
    /*font-family: 'Montserrat', Arial, sans-serif;*/
    font-family: 'HKNova', Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    background-color: #f5f5f5;
    /*color: #555555;*/
}

.receiptBody{
    font-family: 'HKNova', Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
}

.BioSmallText{
    font-size: 0.7rem;
    color: #555555;
}

h1, h2, h3, h4, h5, h6{
    
    /*font-family: 'Montserrat', Arial, sans-serif;*/
    font-family: 'HKNova', Arial, sans-serif;
    font-weight: 100;
    color: #555555;
}

h1{
    font-family: HKNova, Arial, sans-serif;
    font-size: 1.5rem;
    font-weight: 400;
    color: #555555;
    /*color:red;*/
    
}

h3{
    font-size: 26px;
    font-weight: 300;
    color: #555555;
}


button, input, optgroup, select, textarea{
    /*font-family: 'Montserrat', Arial, sans-serif;*/
    font-family: 'HKNova', Arial, sans-serif;
    font-weight: 300;
    font-size: 14px;
    color: #555555;
}

ul{
    margin-bottom: 0px;
}


.subHeadLineBold{
    font-weight: 600;
    font-size: 14px;
    padding-top: 1rem;
    padding-bottom: 0.5rem;
    
}

.subHeadLine{
    
    font-size: 14px;
    padding-top: 1rem;
    padding-bottom: 0.5rem;
    
}

.footer{
    opacity: 0; 
    height: 3.0rem; 
    margin-top: 1rem; 
    position: relative; 
    background-color: #f5f5f5; 
    color: #005664; 
    text-align: center; 
    border-top: 1px solid #b5b5b5;
}

.footerHRTop{
    opacity: 100;
    margin: 0.5rem 0rem 0.5rem 0rem;
}

.footerHRBottom{
    opacity: 0;
    margin: 0rem 0rem 0.5rem 0rem;
}

.headerLogo
{
    max-width: 270px;
}

.fakeTextBox
{
    padding: 0px 0px 0px 0px;
    line-height: 2rem;
    font-size: 1rem;
    margin-bottom: 1rem;
    
}

.NemLoginHeaderInvisible{
    visibility: hidden;
    
}

.NemLoginHeaderElement{
    line-height: 1.5rem;
    min-height: 1.5rem;
    font-size: 1.5rem;
    font-weight: 400;
    
}

.NemLoginButton{
    position: relative;
    cursor: pointer;
}

.NemLoginLogoutButton{
    padding-right: 2.2rem;
    /*background-color: teal;*/
    cursor: pointer;
}

.NemLoginBackButton{
    padding-left: 2.2rem;
    
    /*background-color: maroon;*/
}

.NemLoginButton:hover {
    text-decoration: underline;
}

.NemLoginBackButton::before{
    padding-top: 0.0rem;
    position: absolute;
    display: block;
    content: '';
    cursor: pointer;
    /*background-size: 1.19rem 1.19rem;*/
    /*height: 1.19rem;
    width: 1.19rem;*/
    background-size: 1.4rem 1.4rem;
    height: 1.4rem;
    width: 1.4rem;
    background-image: url('../resources/icons/backLeft.svg');
    background-repeat: no-repeat;
    /*content: "\f10c";
    font-family: FontAwesome;*/
    /*font-size: 1.2rem;*/
    left: 0.0rem;
    top: 0.1rem;
    /*color: #005664;*/
    /*background-color: yellow;*/
    /*border: 1px solid blue;*/
    
}

.NemLoginLogoutButton:before{
    position: absolute;
    display: block;
    content: '';
    cursor: pointer;
    background-size: 1.4rem 1.4rem;
    height: 1.4rem;
    width: 1.4rem;
    background-image: url('../resources/icons/close.svg');
    background-repeat: no-repeat;
    top:0.1rem;
    right: 0.0rem;
}

.mainContent
{
    background-color: #f5f5f5;
    /*background-color: #ffffff;*/
    /*border-left: 1px solid #e3e3e3;*/
    /*border-right: 1px solid #e3e3e3;*/
}


.mainContentBottomMost
{
    /*border-bottom: 1px solid #e3e3e3;*/
}

.callout{
    border-radius: 0.4rem;
    font-size: 0.9rem;
}

[type='text'] {
    border-radius: 0.4em;
    box-shadow : none;
}

[type='search'] {
    border-radius: 0.4em;
    box-shadow : none;
}


[type='select'] > option {
    background-color: #005664;
}

textarea {
    border-radius: 0.4em;
    box-shadow : none;
}

.input-group {
    border-radius: 0.4em;
    box-shadow : none;
}

.input-group > :first-child {
    border-radius: 0.4em 0em 0em 0.4em; 
}

.input-group > :last-child > * {
    border-radius: 0em 0.4em 0.4em 0em; 
}

.input-group-button {
  padding-top: 0;
  padding-bottom: 0;
  text-align: center;
  width: 1%;
  height: 100%; }
  .input-group-button a,
  .input-group-button input,
  .input-group-button button,
  .input-group-button label {
    height: 2.5rem;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 0.9rem; }

.minWidth100{
    
    min-width: 100px;
}


.progress
{
    height: 0.4rem;
    color: #005664;
    background-color: #cacaca;
    border-radius: 1.4em;
    /*border: 1px solid #dadada;*/
}

.progress-bar-container{
    padding-top: 0.5rem;
}



.uploadedPhoto
{
    width: auto; 
    height: 7rem; 
    padding-right: 2rem;
}


.radioSingle{
    /*border: 1px solid yellow;*/
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}


.radioSingle > input[type='checkbox']
{
    position: absolute;
    left: -5000px;
    
}

.radioSingle > input[type="checkbox"] ~ label{
    line-height: 1.6rem;
    /*border: 1px solid blue;*/
}

.radioSingle > input[type="checkbox"]:focus ~ label{
    /*border: 1px solid blue;*/
}


.radioSingle > input[type='checkbox'] ~ label::before{
    font-family: FontAwesome;
    font-size: 2rem;
    color: #005664;
    content: "\f096";
    display: inline-block;
    vertical-align: middle;
    width: 2rem;
    
}




.radioSingle > input[type='checkbox'] ~ label:hover{
    /*text-decoration: underline;*/
}

.radioSingle > input[type='checkbox']:checked ~ label::before{
    font-family: FontAwesome;
    font-size: 2rem;
    color: #005664;
    content: "\f046";
    display: inline-block;
    vertical-align: middle;
    
    width: 2rem;
}

.radioSingle > input[type='checkbox'] ~label:hover::before{
    color: #00778C;
}

.radioSingle > input[type="checkbox"]:focus ~ label{
    /*text-decoration: underline;*/
    
}

.radioSingle > input[type="checkbox"]:focus ~ label::before{
    /*color: blue;*/
    
}

.radioSingle > input[type="checkbox"]:focus ~ label::before{
    /*color: blue;*/
}


/*.radioSingle::before{
    font-family: FontAwesome;
    font-size: 1.6rem;
    color: #005664;
    content: "\f096";
    display: inline-block;
    vertical-align: middle;
    width: 2rem;
}*/




.radioBinary
{
    position: relative;
    width: 2.4rem;
    display: inline-block;
    margin-bottom: 0.7rem;
}


.radioBinary > input[type='radio']
{
    /*visibility: hidden;*/
    position: absolute;
    left: -5000px;
}

.radioBinary > input[type='radio'] ~ label::before
{
    /*font-family: 'Montserrat', Arial, sans-serif;*/
    font-family: 'HKNova', Arial, sans-serif;
    position: absolute;

    margin-left: 0;
    margin-right: 0;
    display: inline-block;
    height: 2.5em;
    background-color: white;
    color: #005664;
    /*color: white;*/
    text-align: center;
    vertical-align: top;
    padding-top: 0.35em;
    padding-right: 0.5em;
    padding-bottom: 0.65em;
    padding-left: 0.5em;
    border: none;
    min-width: 3em;
    
    font-size: 0.9rem;
    font-family: Arial;
    left: 0.6em;
    top: 0.0em;
    
    text-align: center;
    border: 1px solid #858585;   
    /*padding-left: 0.8em;*/
    
    
}


.radioBinaryLeft > input[type='radio'] ~label::before{
    /*font-family: 'Montserrat', Arial, sans-serif;*/
    font-family: 'HKNova', Arial, sans-serif;
    content: "Ja";
    left: 0rem;
    border-top-left-radius: 0.4em; 
    border-bottom-left-radius: 0.4em;
}



.radioBinary > input[type='radio']:checked ~ label::before {
    background-color: #005664;
    color: white;
}

.radioBinary > input[type='radio']:focus ~ label::before {
    padding-top: 0.3em;
    border: 2px solid #A0C2F9;
}

.radioBinary > input[type='radio'] ~ label:hover::before {
    /*padding-top: 0.2em;*/
    background-color: #00778C;
    color: white;
    /*border: 3px solid blue;*/
}


/*.radioBinaryLeft > input[type='radio']:checked ~label::before{
    content: "Ja";
    left: 0rem;
    
    border-top-left-radius: 0.4em; 
    border-bottom-left-radius: 0.4em;
}*/



.radioBinaryRight > input[type='radio'] ~label::before{
    /*font-family: 'Montserrat', Arial, sans-serif;*/
    font-family: 'HKNova', Arial, sans-serif;
    content: "Nej";
    left: 0rem;
    border-top-right-radius: 0.4em; 
    border-bottom-right-radius: 0.4em;
}

/*.radioBinaryQuestion{
    position: relative;
    display: inline-block; 
    margin-left: 0rem; 
    top: 0.0rem;
}*/

.radioBinaryQuestionText{
    margin-top: -1.5rem;
    padding-left: 6rem;
    font-size: 0.9rem;
    z-index: -1;
}


.radioBinaryIllegal > input[type='radio']:checked ~ label::before{
    background-color: red;
    color: white;
    /*width: 200px;*/
}

.radioBinaryIllegal > input[type='radio']:focus ~ label::before {
    padding-top: 0.3em;
    border: 2px solid #A0C2F9;
}

.radioBinaryIllegal > input[type='radio'] ~ label:hover::before {
    /*padding-top: 0.2em;*/
    background-color: red;
    color: white;
    /*border: 3px solid blue;*/
}

.ppInfo {
    padding-top: 0.5rem;
}


/*.radioBinaryRight > input[type='radio']:checked ~label::before{
    content: "Nej";
    left: 1.25rem;
    border-top-right-radius: 0.4em; 
    border-bottom-right-radius: 0.4em;
}*/



.checkButton
{
    margin-left: 0;
    margin-right: 0;
    display: inline-block;
    height: 2.5em;
    background-color: white;
    /*background-color: white;*/
    color: #959595;
    text-align: center;
    vertical-align: top;
    padding-top: 0.65em;
    padding-right: 0.5em;
    padding-bottom: 0.65em;
    padding-left: 0.5em;
    border: none;
    min-width: 3em;

}


.checkButton-left
{
    text-align: center;
    border: 1px solid #858585;   
    /*padding-left: 0.8em;*/
    border-top-left-radius: 0.4em; border-bottom-left-radius: 0.4em;
}

.checkButton-left + label
{
    background-color: red;
    margin-left: 0px;
    margin-right: 0px;
}

.checkButton-right
{
    border: 1px solid #858585;   
    border-left: none;
    /*padding-right: 0.8em;*/
    border-top-right-radius: 0.4em; border-bottom-right-radius: 0.4em;
}


.checkButton:hover
{
    border: 1px solid #858585;   
    background-color:#00778C;
}

.checkButton:focus
{
    border: 3px solid #858585;   
    background-color:#00778C;
}



.checkButton-selected
{
    border-color: #005664;
    background-color: #005664;
    color: white;
}

.checkButton-selected:focus, .checkButton-selected:hover
{
    border-color: #005664;
    background-color: #00778C;
    color: white;
}


.checkButton-error:hover
{
    /*border-color: #858585;*/
    background-color: #cc4b37;
    color: white;
}


.checkButton-selected.checkButton-error
{
    border-color: #858585;
    background-color: #cc4b37;
    color: white;
}

.checkButton-selected.checkButton-error:focus
{
    border-color: #858585;
    background-color: #cc4b37;
    color: white;
    border: 3px solid #858585;   
}




.progress.success .progress-meter
{
    background-color: #005664;
    border-radius: 0.4em;
}

.leftNavButtonContainer
{
    /*intentionally blank*/
}

.rightNavButtonContainer
{
    text-align: right;
}

.navButton
{
    border-radius: 0.4em;
    font-weight: 400;
    font-size: 1.0em;
    height: 2.8rem;
    min-width: 10rem;
}

.navButton[disabled]
{
    background-color: #aeaeae;
    opacity: 0.5;
}

.navButton[disabled]:hover
{
    background-color: #cecece;
    opacity: 0.6;
}

.navButtonNext
{
    border:1px solid #e9e9e9;
    background-color:#005664;
    color: white;
}

.navButtonNext:hover
{
    background-color:#00778C;
    font-weight: 400;
}

.navButtonNext:focus
{
    background-color:#00778C;
    font-weight: 400;
}

.navButtonPrev
{
    border:1px solid #005664;
    background-color: white;
    color: #005664;
}

.navButtonPrev:hover
{
    background-color:#005664;
    color: white;
    font-weight: 400;
}

.navButtonPrev:focus
{
    background-color:#005664;
    color: white;
    font-weight: 400;
}



.whiteButton
{
    display: inline-block;
    margin-top: 0.3em;
    /*border:1px solid #e9e9e9;*/
    /*background-color:#005664;*/
    /*color: white;*/
    /*border-radius: 0.4em;*/


    border:1px solid #ffffff;
    background-color:#ffffff;
    color: #005664;
    border-radius: 0.4em;
    font-weight: 600;
    font-size: 1em;

}

.whiteButton:hover, .whiteButton:focus
{
    background-color: #005664;
    border-color: white;
    color: white;
    font-weight: 600;
}

.greenButtonBorder{
    border:1px solid #005664;
}

.greenButtonBorder:hover, .greenButtonBorder:focus{
    border:1px solid #00778C;
}

.colorButtonBorder{
    border:1px solid #0062a4;
}

.colorButtonBorder:hover, .colorButtonBorder:focus{
    border:1px solid #0062a4;
}


.colorButton {
    border:1px solid #ffffff;
    background-color:#005664;
    color: #ffffff;
    border-radius: 0.4em;
    font-weight: 400;
    font-size: 0.9rem;
}

.colorButtonNoBorder {
    border: none;
    background-color:#005664;
    color: #ffffff;
    border-radius: 0.4em;
    /*font-weight: 400;
    font-size: 1em;*/
}

.colorButton:hover
{
    background-color: #0062a4;
    color: #ffffff;
    font-weight: 400;
}

.colorButton.disabled {
    border:1px solid #ffffff;
    background-color:grey;
    color: #ffffff;
    /*border-radius: 0.4em;*/
    font-weight: 400;
    font-size: 0.9rem;
    cursor: not-allowed;
}

.colorButtonNoBorder.disabled {
    border: none;
    background-color: grey;
    color: #ffffff;
    /*border-radius: 0.4em;*/
    /*font-weight: 400;
    font-size: 1em;*/
    
}

.colorButton:hover.disabled {
    background-color: grey;
    color: #ffffff;
    font-weight: 400;
}




.greyButton{
    display: inline-block;
    margin-top: 0.3em;
    
    /*border:1px solid #ffffff;*/
    background-color:#aaaaaa;
    color: #ffffff;
    border-radius: 0.4em;
    font-weight: 600;
    font-size: 1em;
}

.greyButton:hover, .greyButton:focus{
    display: inline-block;
    margin-top: 0.3em;
    
    /*border:1px solid #ffffff;*/
    background-color:#808080;
    color: #ffffff;
    border-radius: 0.4em;
    font-weight: 600;
    font-size: 1em;
}


.greenButton {
    border:1px solid #ffffff;
    background-color:#005664;
    color: #ffffff;
    border-radius: 0.4em;
    font-weight: 600;
    font-size: 1em;
}

.greenButtonNoBorder {
    border: none;
    background-color:#005664;
    color: #ffffff;
    border-radius: 0.4em;
    /*font-weight: 400;
    font-size: 1em;*/
}

.greenButton:hover
{
    background-color: #00778C;
    color: #ffffff;
    font-weight: 600;
}


/*@media screen and (min-width: 900px) {
    .calendar-mainTable {
        width: 80%;
    }
}

.calendar-date-arrow{
    width: 0px; 
    height: 0px; 
    border-left: 15px solid transparent; 
    border-right: 15px solid transparent; 
    border-bottom: 22px solid #1779ba;
}*/


.photoOKText
{
    position: relative;
    padding-left: 1.5em;
    margin-top: 0.5em;
    width: 445px;
    /*background-color: red;*/
    float:right;
}

.photoOKText::before
{
    content: "\f00c";
    font-family: FontAwesome;
    position: absolute;
    font-size: 1.3rem;
    top: -0.2em;
    left: 0em;
    color: #005664;
    text-rendering: optimizeLegibility;
}

.photoFailText
{
    position: relative;
    padding-left: 5.5em;
    margin-top: 0.5em;
    width: 482px;
    /*background-color: red;*/
    float:right;
}



.photoDivider{
    display: inline-block;    
    position: relative;
    width: 4.3em;
    background-color: red;
    margin-left: 2em;
    margin-right: 2em;
}

.photoDivider::before{
    content: "\f061";
    font-family: FontAwesome;
    font-size: 5rem;
    color: #005664;
    position: absolute;
    /*background-color: green;*/
    left: 0.0em;
    /*margin: 1em 1em 1em 1em;*/
    text-rendering: optimizeLegibility;

}

.printButton{
    position: relative;
    padding-top: 0.2em;
    padding-left: 2em;
    border-radius: 0.4em;
    height: 40px;
    text-decoration: underline;
    cursor: pointer;
}

.printButton::before
{
    position: absolute;
    content: "\f02f";
    font-family: FontAwesome;
    font-size: 1rem;
    top: 0.2em;
    left: 0.2em;
    text-rendering: optimizeLegibility;
}

.customLink{
    text-decoration: underline;
    color: #0a0a0a;
    font-weight: 400;

}

.customLink:active {
    color: #0a0a0a;
    /*font-weight: 400;*/
}

.customLink:hover {
    color: #0a0a0a;
    /*text-decoration: underline;*/
    /*font-weight: 400;*/
}

.customLink:visited {
    /*color: #005664;*/
    /*font-weight: 400;*/
}


.whiteLink{
    color: white;
    font-weight: 400;
    text-decoration: underline;
}

.whiteLink:active {
    color: white;
    font-weight: 400;
    text-decoration: underline;
}

.whiteLink:hover {
    color: white;
    text-decoration: underline;
    font-weight: 400;
}

.whiteLink:visited {
    color: white;
    font-weight: 400;
    text-decoration: underline;
}




/*.checkBoxBig{
    position: relative;
}*/

/*.checkBoxBig > input[type='checkbox']{
    position: absolute;
    left: -5000px;
}*/

/*.checkBoxBig > input[type='checkbox'] ~ label {
    padding-top: 0.76rem;
    padding-left: 3.5rem;
    font-size: 1em;
    height: 3.0em;

}*/

/*.checkBoxBig > input[type='checkbox']:checked ~ label {
}*/

/*.checkBoxBig > input[type='checkbox']:focus ~ label {
}*/


/*.checkBoxBig > input[type='checkbox'] ~ label::before {
    padding-top: 0.0em;
    position: absolute;
    content: "\f096";
    font-family: FontAwesome;
    font-size: 3.0rem;
    left: 0.15em;
    top: 0.0em;
    color: #005664;
    cursor: pointer;
    line-height: 1.1em;
    margin-top: 0.0em;
    height: 1.0em;
    text-rendering: optimizeLegibility;
}*/

/*.checkBoxBig > input[type='checkbox']:checked ~ label::before {
    padding-top: 0.0em;
    position: absolute;
    content: "\f14a";
    font-family: FontAwesome;
    font-size: 2.730rem;
    left: 0.17em;
    top: 0.05rem;

    color: #005664;
    cursor: pointer;
    
    line-height: 1.1em;
    margin-top: 0.0em;
    height: 1.0em;
    text-rendering: optimizeLegibility;
}*/

.radioSimple
{
    position: relative;
    
}

.radioSimple > input[type='radio'] 
{
    /*visibility: hidden;*/
    position: absolute;
    left: -5000px;
    
}

.radioSimple > input[type='radio'] ~ label, .radioSimple > input[type='radio']:checked ~ label, .radioSimple > input[type='radio']:focus ~ label
{
    padding-top: 0.0rem;
    padding-left: 2.4rem;
    font-size: 0.9rem;
    height: 2.0rem;
    /*width: 100%;*/
    
}

/*.radioSimple > input[type='radio']:checked ~ label
{
    padding-top: 0.4rem;
    padding-left: 2.4rem;
    font-size: 0.9rem;
    height: 2.0rem;

}

.radioSimple > input[type='radio']:focus ~ label
{
    padding-top: 0.4rem;
    padding-left: 2.4rem;
    font-size: 0.9rem;

}*/

.radioSimple > input[type='radio'] ~ label::before, .radioSimple > input[type='radio']:focus ~ label::before
{
    padding-top: 0.0rem;
    position: absolute;
    display: block;
    content: '';
    background-size: 1.19rem 1.19rem;
    height: 1.19rem;
    width: 1.19rem;
    background-image: url('../resources/icons/circle-o.svg');
    background-repeat: no-repeat;
    /*content: "\f10c";
    font-family: FontAwesome;*/
    /*font-size: 1.2rem;*/
    left: 1.0rem;
    top: 0.1rem;
    /*color: #005664;*/
    /*background-color: yellow;*/
    /*border: 1px solid blue;*/
    text-rendering: optimizeLegibility;
    
}

/*.radioSimple > input[type='radio']:focus ~ label::before
{
    padding-top: 0.0rem;
    position: absolute;
    content: "\f10c";
    font-family: FontAwesome;
    font-size: 1.2rem;
    left: 1.0rem;
    top: 0.0rem;
    
}*/

.radioSimple > input[type='radio']:checked ~ label::before
{
    padding-top: 0.0rem;
    position: absolute;
    display: block;
    content: '';
    background-size: 1.2rem 1.2rem;
    height: 1.2rem;
    width: 1.2rem;
    background-image: url('../resources/icons/dot-circle-o.svg');
    background-repeat: no-repeat;
    /*content: "\f10c";
    font-family: FontAwesome;*/
    /*font-size: 1.2rem;*/
    left: 1.0rem;
    top: 0.1rem;
    /*color: #005664;*/
    /*background-color: yellow;*/
    /*border: 1px solid blue;*/
    text-rendering: optimizeLegibility;


    /*padding-top: 0.0rem;
    position: absolute;
    content: "\f192";
    font-family: FontAwesome;
    left: 1.0rem;
    top: 0.0rem;
    font-size: 1.2rem;
    color: #005664;*/
    /*text-rendering: optimizeLegibility;*/
    
}




.radioSimpleSubText
{
    padding-left: 2.7em;
}

/*.radioButton
{
    position: relative;
    margin-top: 0.5em;
    
}*/

/*.radioButtonSubText
{
    padding-top: 0.5rem;
    padding-left: 3.4em;
    padding-right: 3.4em;
}*/

/*.radioButton > input[type=radio] 
{
    visibility: hidden;
}*/

/*.radioButton > input[type='radio'] ~ label 
{
    padding-left: 2.0em;
    padding-top: 0.45em;
    padding-bottom: 1em;
    font-size: 1em;
}*/

/*.radioButton > input[type='radio'] ~ label::before
{
    position: absolute;
    content: "\f096";
    font-family: FontAwesome;
    font-size: 3.0rem;
    color: #005664;

    left: 0.0em;
    top: -0.45em;

    width: 0px;
    height: 0px;
    
}*/

/*.radioButton > input[type='radio']:checked ~ label::before
{
    position: absolute;
    content: "\f14a";
    font-family: FontAwesome;
    font-size: 2.75rem;
    color: #005664;
    left: 0.0em;
    top: -0.45em;
    text-rendering: optimizeLegibility;
}*/

/*.radioButtonSmall
{
    position: relative;
    margin-top: 0.2em;
    
}*/

/*.radioButtonSmallSubText
{
    padding-left: 3.55em;
    padding-right: 3.55em;
}*/

/*.radioButtonSmall > input[type=radio] 
{
    visibility: hidden;
}*/

/*.radioButtonSmall > input[type='radio'] ~ label 
{
    padding-left: 0.4em;
    padding-top: 0.0em;
    padding-bottom: 0.4em;
    font-size: 1em;
}*/

/*.radioButtonSmall > input[type='radio'] ~ label::before
{
    position: absolute;
    content: "\f096";
    font-family: FontAwesome;
    font-size: 1.9rem;
    color: #005664;
    top:-0.4em;
    left: 0.0em;
    text-rendering: optimizeLegibility;
    left: 0.0em;
    top: -0.45em;

    width: 0px;
    height: 0px;
    
}*/

/*.radioButtonSmall > input[type='radio']:checked ~ label::before
{
    position: absolute;
    content: "\f14a";
    font-family: FontAwesome;
    font-size: 1.75rem;
    color: #005664;
    left: 0.0em;
    top: -0.45em;
    text-rendering: optimizeLegibility;
}*/

.timeReservationDayDiv
{
    font-weight: 700;
    display: block;
    border-bottom: 1px solid #005664;
    border-top: 1px solid #005664;
    padding-bottom: 0.5em;
    padding-top: 0.5em;

    position: relative;
    padding-left: 3.3em;
}

.timeReservationDayDivClosed
{
    opacity: 0.25;
    

}

.timeReservationTimeSlotDiv
{
    display: inline-block;
    font-size: 1em;
    width: 4.3rem;
    /*background-color: lightgrey;*/
    background-color: #005664;
    color: white;
    text-align: center;
    margin: 0.3em 0.3em 0.3em 0.3em;
    padding: 0.2em 0.2em 0.2em 0.2em;
    cursor: pointer;
    border-radius: 0.4em;
    font-weight: 400;

}

.timeReservationTimeSlotDiv:hover
{
    background-color: darkgrey;
    
}

.timeReservationTimeSlotDiv_Selected
{
    background-color: #005664;
    color: white;
}

.timeReservationTimeSlotDiv_Selected:hover
{
    background-color: #00778C;
    color: white;
}

/*.tsdd-opener
{
    position: relative;
    padding-left: 3.3em;
}*/

/*.tsdd-opener::before
{
    position: absolute;
    content: "\f0fe";
    font-family: FontAwesome;
    font-size: 2.0rem;
    top: -0.75em;
    left: 0.5em;
    padding-left: 0.0em;
    padding-top: 0.65em;
    padding-bottom: 1.0em;
    color: #005664;
}*/

/*.tsdd-closer::before
{
    position: absolute;
    content: "\f146";
    font-family: FontAwesome;
    font-size: 2.0rem;
    top: -0.75em;
    left: 0.5em;
    padding-left: 0.0em;
    padding-top: 0.65em;
    padding-bottom: 1.0em;
    color: #005664;
}*/

.ProductIconContainer
{
    /*background-color: red;*/
    padding: 0.2rem 0.2rem 0.2rem 0.2rem;
    
}

.FrontPageButton{
    font-weight: 100;
    font-size: 22px;
    height: 86px;
    line-height: 56px;
    padding-left: 0.8rem;
    padding-right: 0.8rem;
    padding-top: 0.7rem;
    padding-bottom: 0.8rem;
    color: white;
    background-color: #005664;
    border-radius: 0.4em;
}


.FrontPageButton:hover, .FrontPageButton:focus
{
    background-color: #00778C;
}


.FrontPageButtonPassport::before{
    content: url('../resources/images/pas.png');
    float:left;
}

.FrontPageButtonChildPassport::before{
    content: url('../resources/images/Boernepas.png');
    float:left;
}

.FrontPageButtonDriversLicense::before{
    content: url('../resources/images/Koerekort.png');
    float:left;
}

.FrontPageButtonCalendar::before{
    content: url('../resources/images/Tidsbestilling.png');
    float:left;
}

.cookieHeader {
    text-align: center;
    background-color: #005664;
    padding-bottom: 1rem;
    padding-top: 0.5rem;
    color: white;
    font-family: 'HKNova', Arial, sans-serif;
}

.cookieButton
{
    margin: 0.5rem 0.5rem 0.5rem 0.5rem;
}


/*.productListLeftmostDiv
{
    height: 2.4em;
    padding-top: 0.35em;
    padding-left: 0.5em;
    border-top: 2px solid #005664;
    border-bottom: 2px solid #005664;
    border-left: 2px solid #005664;
    border-bottom-left-radius: 0.4em;
    border-top-left-radius: 0.4em;
}

.productListCentralDiv
{
    height: 2.4em;
    padding-top: 0.35em;
    border-top: 2px solid #005664;
    border-bottom: 2px solid #005664;
}


.removeProductDiv
{
    height: 2.4em;
    padding-top: 0.35em;
    padding-right: 2.1em;
    cursor: pointer;
    border-top: 2px solid #005664;
    border-bottom: 2px solid #005664;
    border-right: 2px solid #005664;
    border-bottom-right-radius: 0.4em;
    border-top-right-radius: 0.4em;
    position: relative;
}

.removeProductDiv::after{
    position: absolute;
    top:-0.12em;
    left: 3.1em;
    content: "\f00d";
    font-family: FontAwesome;
    color: #bb5050;
    font-size: 1.7rem;
    padding-left: 0.3em;

    padding-right: 0.3em;
}*/


.accordion {
  margin-left: 0;
  background: #f5f5f5;
  list-style-type: none;
  /*border-radius: 0.4em;*/ 
}


.accordion-item.is-active {
    /*background-color: #00778C;*/
    /*background-color: #d5d5d5;*/
}

.accordion-title {
    position: relative;
    display: block;
    padding: 1.0rem 1.25rem 1.0rem 2.7rem;
    border: none;/*1px solid #0000ff;*/
    border-top: 1px solid #005664;
    font-size: 1rem;
    line-height: 1;
    font-weight: 400;
    color: #005664; 
    /*border-radius: 0.4rem;*/ 
}

:last-child:not(.is-active) > .accordion-title 
{
border-bottom: inherit;
/*border-radius: inherit;*/ 
/*border-radius: 0.4rem;*/

}
    
.accordion-title:focus {
    background-color: #f5f5f5; 
    color: #005664;
    /*border-radius: 0.4em;*/
}
.accordion-title:hover {
    background-color: #d5d5d5;
    color: #005664;
    /*background-color: #005664;*/
    /*color: white;*/
    
}
    
    
.accordion-title::before {
    position: absolute;
    top: 1.5em;
    left: 0.5rem;
    margin-top: -0.5rem;
    content: "\002B"; /* + */
    /*content: "\f0fe";
    font-family: FontAwesome;*/
    font-size: 1.0rem; 
    color: #005664;    
    /*border-radius: 0.4em;*/
}

.is-active > .accordion-title {
    
    background-color: #005664;
    color: white;
    /*background-color: #005664;*/
    /*color: white;*/
}

.is-active > .accordion-title::before {
    top: 1.4em;
    content: "\2013"; /* - */
    /*content: "\f146";
    font-family: FontAwesome;*/
    font-size: 1.0rem; 
    color: #005664; 
}

.accordion-title.disabled{
    color: #808080;
    /*background-color: #ff0000;*/
    cursor: not-allowed;
}

.accordion-title.disabled::before{
    color: #f5f5f5;
    position: absolute;
    top: 0.5em;
    left: 0.5rem;
    margin-top: -0.5rem;
    content: "";
    
    font-size: 2.0em; 
    

}


.accordion-content {
    display: none;
    padding: 0rem 0rem 0rem 0rem;
    border: none;
    /*border-bottom: 1px solid #005664;*/
    background-color: #f5f5f5;
    color: #0a0a0a;
    margin-left: 2.4rem;

    }
    :last-child > .accordion-content:last-child {
    border: none; }



.SelectedTimeSlotOverlayContainer
{
    background-color: #005664; 
    border: 1px solid #005664;
}

.SelectedTimeSlotOverlay{
    text-align: center; 
    /*border: 1px solid #005664;*/ 
    color: #ffffff; 
    padding-top: 0.5em;
}

.SelectedTimeSlotOverlayText{
    font-weight: 600;
}




.paymentTotalText{
    font-size: 30px;
    font-weight: 400;
    color: #555555;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.paymentSmallText{
    font-size: 0.8rem;
    position: relative;
    margin: 0 0 1rem 0;
    padding: 1rem;
    border: 1px solid rgba(10, 10, 10, 0.25);
    background-color: #fff3d9;
    color: #0a0a0a;
    border-radius: 0.4em;
}

.paymentDottedDivider{
    border: 1px dotted #d5d5d5; 
    margin-bottom: 0.4em;
    margin-top: 0.3em;
}

.paymentSolidDivider{
    border: 1px solid #d5d5d5; 
    margin-bottom: 0.3em;
    margin-top: 0.3em;
}


#payOuterFrameDiv, #payOuterFrameDiv2{
    padding-left: 0.65rem;
    /*height: 10px;*/ 
    /*width: 400px;*/
}



.paymentFrame{
    /*border: 1px solid green;*/
    width: 350px;
    height: 185px;
    overflow: hidden;
    -ms-overflow-style: none; /*does nothing!*/
    /*padding-top: -100px;*/
    
}

.paymentFrame iframe {
    margin-top:-50px;
    /*margin-bottom:-130px;*/
    padding-left: 1rem;
    /*border: 1px solid yellow;*/
    overflow: hidden;
    -ms-overflow-style: none; /*does nothing!*/
    /*position: absolute;*/
    height: 220px;
}

.FeeText{
    font-family: 'Lucida Sans', Arial, sans-serif;
    font-weight: 500;
    font-size: 0.8rem;
    padding-left: 1.2rem;
}


.SignatureButton{
    font-weight: 400;
    color: white;
    background-color: #005664;
}
.SignatureButton:hover, .SignatureButton:focus{
    font-weight: 400;
    color: white;
    background-color: #00778C;
}

.SignatureButton:disabled{
    opacity: 0.5;
    background-color: #005664;

    font-weight: 400;
}

.SignatureButton:disabled:hover{
    opacity: 0.5;
    background-color: #005664;
    font-weight: 400;
}



.SignatureRemoveButton{
    position: relative;
    border-radius: 0.4em;
    float:right;
    display: inline;
    padding-left: 100px;
    padding-right: 100px;

    font-weight: 400;
    margin: 0px 0px 0px 0px;
    height: 2.45rem;
    color: #005664;
    background-color: white;
    border: 1px solid #005664;
}

.SignatureRemoveButton:hover{
    color: white;
    background-color: #005664;
    border: 1px solid #005664;
}

.SignatureRemoveButton:focus{
    color: white;
    background-color: #005664;
    border: 1px solid #005664;
}


.Signatur_received_text{
    position: relative;
    padding-left: 2em;
    padding-top: 8px;
    float:left;
}

.Signatur_received_text::before{
    content: "\f00c";
    font-family: FontAwesome;
    position: absolute;
    color: #005664;
    font-size: 1.3rem;
    font-weight: 400;
    top: 0.0rem;
    left: 0rem;
    text-rendering: optimizeLegibility;
}
.mxValidating {
    border-color: #cacaca !important;
    background-color: #fefefe !important;
}




@keyframes lds-spinner {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes lds-spinner {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.lds-spinner {
    position: relative;
}

    .lds-spinner div {
        left: 94px;
        top: 48px;
        position: absolute;
        -webkit-animation: lds-spinner linear 1s infinite;
        animation: lds-spinner linear 1s infinite;
        background: #005664;
        width: 12px;
        height: 24px;
        border-radius: 40%;
        -webkit-transform-origin: 6px 52px;
        transform-origin: 6px 52px;
    }

        .lds-spinner div:nth-child(1) {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
            -webkit-animation-delay: -0.916666666666667s;
            animation-delay: -0.916666666666667s;
        }

        .lds-spinner div:nth-child(2) {
            -webkit-transform: rotate(30deg);
            transform: rotate(30deg);
            -webkit-animation-delay: -0.833333333333333s;
            animation-delay: -0.833333333333333s;
        }

        .lds-spinner div:nth-child(3) {
            -webkit-transform: rotate(60deg);
            transform: rotate(60deg);
            -webkit-animation-delay: -0.75s;
            animation-delay: -0.75s;
        }

        .lds-spinner div:nth-child(4) {
            -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
            -webkit-animation-delay: -0.666666666666667s;
            animation-delay: -0.666666666666667s;
        }

        .lds-spinner div:nth-child(5) {
            -webkit-transform: rotate(120deg);
            transform: rotate(120deg);
            -webkit-animation-delay: -0.583333333333333s;
            animation-delay: -0.583333333333333s;
        }

        .lds-spinner div:nth-child(6) {
            -webkit-transform: rotate(150deg);
            transform: rotate(150deg);
            -webkit-animation-delay: -0.5s;
            animation-delay: -0.5s;
        }

        .lds-spinner div:nth-child(7) {
            -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
            -webkit-animation-delay: -0.416666666666667s;
            animation-delay: -0.416666666666667s;
        }

        .lds-spinner div:nth-child(8) {
            -webkit-transform: rotate(210deg);
            transform: rotate(210deg);
            -webkit-animation-delay: -0.333333333333333s;
            animation-delay: -0.333333333333333s;
        }

        .lds-spinner div:nth-child(9) {
            -webkit-transform: rotate(240deg);
            transform: rotate(240deg);
            -webkit-animation-delay: -0.25s;
            animation-delay: -0.25s;
        }

        .lds-spinner div:nth-child(10) {
            -webkit-transform: rotate(270deg);
            transform: rotate(270deg);
            -webkit-animation-delay: -0.166666666666667s;
            animation-delay: -0.166666666666667s;
        }

        .lds-spinner div:nth-child(11) {
            -webkit-transform: rotate(300deg);
            transform: rotate(300deg);
            -webkit-animation-delay: -0.083333333333333s;
            animation-delay: -0.083333333333333s;
        }

        .lds-spinner div:nth-child(12) {
            -webkit-transform: rotate(330deg);
            transform: rotate(330deg);
            -webkit-animation-delay: 0s;
            animation-delay: 0s;
        }

.lds-spinner {
    width: 91px !important;
    height: 91px !important;
    -webkit-transform: translate(-45.5px, -45.5px) scale(0.455) translate(45.5px, 45.5px);
    transform: translate(-45.5px, -45.5px) scale(0.455) translate(45.5px, 45.5px);
}