﻿@font-face {
    font-family: 'Nunito';
    src: 'nunito.regular.ttf';
    font-weight: 400;
}

@font-face {
    font-family: 'Nunito';
    src: 'nunito.light.ttf';
    font-weight: 300;
}

@font-face {
    font-family: 'Nunito';
    src: 'nunito.semibold.ttf';
    font-weight: 600;
}

@font-face {
    font-family: 'Nunito';
    src: 'nunito.bold.ttf';
    font-weight: 700;
}

body {
    background: url("https://www.burgerberichten.nl/App_Themes/ConsumentEform_855fc81f-b39e-4ccd-b065-b5c28050840e/Images/BackGroundLogo.png");
    background-size: cover; 
    font-family: Arial, 'Nunito';
}

.container {
    background-color: transparent;
}


hr.header {
    background-color: #3152A1; /*HeaderLineColor*/
}

hr.mediumLine {
    background-color: #e1e1e1;
}

hr.baseLine {
    background-color: #e1e1e1;
}

.gemeenteLogo {
	float: left;
}

.progressbarDone, .stDone, .progress-bar {
    background-color: #e7ebe; /*Progressbar*/
}

.primaryButton {
    background-color: #FFCE34; /*ButtonColor*/
    color: #000; /*FontColor*/
    border: 2px solid #0054A6;
}

    .primaryButton:hover, .primaryButton:focus, .primaryButton:active {
        background-color: #b08427;
    }

    .primaryButton.disabled, .primaryButton[disabled], .primaryButton.disabled:focus, .primaryButton[disabled]:focus {
        background-color: #e7ebeb; /*DisabledButtonBackground*/
    }

.secondaryButton {
    background-color: #0054A5; /*ButtonColor*/
    color: #fff; /*FontColor*/
    border: 1.5px solid #FFCE34
}

    .secondaryButton:hover, .secondaryButton:focus, .secondaryButton:active {
        background-color: #00B5AF;
    }

    .secondaryButton.disabled, .secondaryButton[disabled], .secondaryButton.disabled:focus, .secondaryButton[disabled]:focus {
        background-color: #e7ebeb; /*DisabledButtonBackground*/
    }

/*=========================================================================================================*/
/*================================================== PIP ==================================================*/
/*=========================================================================================================*/

.txtColor {
    color: #3152A1; /*MenuColor*/
}

.linkColor {
    color: #3152A1; /*FontTypeLinkColor*/
}

.lightColor {
    color: #979DA6; /*MenuColorInactive*/
}

#cssmenu li.active a {
    border-bottom: solid 4px #3152A1; /*MenuColor*/
    color: #3152A1; /*MenuColor*/
}

#cssmenu li a:hover {
    border-bottom: solid 4px #3152A1; /*MenuColor*/
}

#cssmenu li a {
    color: #979DA6; /*MenuColorInactive*/
}

#cssmenu ul {
    border-bottom: 4px solid #e1e1e1; /*MenuColorInactive*/
}

.stCurrent {
    background-color: #3152A1; /*ProgressbarCurrent*/
}

.stPlain {
    background-color: #D8DBDE; /*ProgressbarInactive*/
}

.mediumBorder {
    border: 1px solid #3D434F; /*LineColor*/
}

.pipButton {
    background-color: #FE9642; /*LoginButtonColor*/
    color: #fff; /*LoginButtonFontColor*/
}

    .pipButton:hover, .pipButton:focus, .pipButton:active {
        background-color: #E5904C;
    }

    .pipButton.disabled {
        background-color: #FE9642; /*LoginButtonDisabled*/
    }

/*=========================================================================================================*/
/*================================================= EFORM =================================================*/
/*=========================================================================================================*/

/*------------------------------- QUESTIONS PDF -------------------------------*/
#questionPdf {
    font-family: sans-serif; /*FONT*/
}

/*------------------------------- COMMON CLASSES -------------------------------*/
#webformName, #formName-xs {
    color: #0054a6; /*FontColor*/
    font-size: 30px;
}

.formFieldHeader {
    color: #0054A6; /*FontColor*/
}

#header .header-buttons,
#header .col-sm-4 .modal{
    display: none !important;
}
#header {
    align-items: center
}

col-sm-4 {
     /*no language*/
     display: ;
     align-items: flex-start;

}

.col-sm-4::before{
    content:"";
    display: block;
    background: url("https://www.burgerberichten.nl/App_Themes/ConsumentEform_855fc81f-b39e-4ccd-b065-b5c28050840e/Images/Aftalogopdf.png") no-repeat left ;
    background-size: contain;
    width: 100%;
    max-width: 220px;
    height: 85px;
}
.question {
    font-size: 15px !important;
    font-weight: 550 !important;
    
}

.summary-text-color {
    color: #0054a6 !important;
}   


/*------------------------------- MASTER PAGE -------------------------------*/
#rightHeaderMenu {
    background: url("images/menu.png") no-repeat right;
}

/*------------------------------- WIZARD -------------------------------*/
.wizard .step {
  background-color: #e7ebeb; /*Unvisited Color*/
  color: #FFF;
  border: 2px solid #0054A6;
}

.wizard .active .step {
  background-color: #00B5AF; /*Active Color*/
  color: #FFCE34;
  border: 1px solid #0054A6;
}

.wizard .visited .step {
  background-color: #0054A6; /*Visited Color*/
  color: #FFCE34;
}

.wizard .stepName {
  color: #e7ebeb; /*Unvisited Color*/
}

.wizard .active .stepName {
  color: #0054A6; /*Active Color*/
}

.wizard .visited .stepName {
  color: #0054A6; /*Visited Color*/
}

#wizardProgressbar, #wizardProgressbar-xs {
  background-color: #e7ebeb; /*Unvisited Color*/
}

  #wizardProgressbar .progress-bar, #wizardProgressbar-xs .progress-bar {
    background-color: #0073bb; /*Visited Color*/
  }

#wizard-xs, #wizardSteps-xs {
  background-color: #F9F9F9;
}

#formName-xs {
  background-color: #DDD;
}

#activeStep-xs {
  color: #ca982c; /*Active Color*/
}

/*------------------------------- VALIDATION, INFORMATION AND ERROR MESSAGES -------------------------------*/
.successAlert {
    color: #; /*SuccessFontColor*/
    background-color: rgba(0, 85, 166, .20); /*SuccessBackgroundColor*/
}

.errorAlert {
    color: #A94442; /*ErrorFontColor*/
    background-color: #F2DEDE; /*ErrorBackgroundColor*/
}

.has-error .form-control {
    border-color: #FF5959; /*ErrorBorderColor*/
}

    .has-error .form-control:focus {
        border-color: #843534; /*ErrorBorderFocusColor*/
    }

.divHasError {
    border: solid 1px #FF5959; /*ErrorBorderColorForDiv*/
}

.popover.error-popover {
    background-color: #FF5959; /*ErrorPopupColor*/
    border-color: #EED3D7;
    color: #FFFFFF; /*ErrorPopupFontColor*/
}

.popover.bottom > .arrow:after {
    border-bottom-color: #FF5959; /*ErrorPopupColor*/
}

.popover.top > .arrow:after {
    border-top-color: #FF5959; /*ErrorPopupColor*/
}

.warningText {
    color: #A94442; /*WarningFontColor*/
}

.errorText {
    color: #FF5959; /*ErrorFontColor*/
}

/*------------------------------- FORM CONTROLS -------------------------------*/
.form-control {
    border: 1px solid #0054A6;
    background-color: #fff; /*FieldBackgroundColor*/
}

    .form-control:focus {
        border-color: #00B5af; /*FocusFieldColor*/
        box-shadow: 0 0 0 .25rem rgba(0, 85, 166, .20); 
    }

/*------------------------------- CSS SPINNER -------------------------------*/
#loadingIndicator .spinner {
    border-top: 6px solid #FFFFFF;
    border-bottom: 6px solid #005a96;
    border-left: 6px solid #005a96;
    border-right: 6px solid #005a96;
}