@charset "UTF-8";
/* CSS Document */

/*-------------Laad basis CSS Arda omgeving-------------*/
@import url("https://s3.eu-central-1.amazonaws.com/portal.ardaonline.com/general/css/portal.arda_basis.css");

/*-------------Fonts inladen-------------*/
@import url('https://fonts.googleapis.com/css2?family=Sen:wght@400..800&display=swap');


/*-------------Variables declaration-------------*/
:root {
    /*Logo*/
    --clientLogo: transparent
        url(https://s3.eu-central-1.amazonaws.com/bewustwording.localitheroes.com/media/localitheroes_logo_small.png)
        no-repeat !important;
    
    /*Fonts - load in your font, then apply to variables*/
    --font-family-headers: "Sen", serif;
    --font-family-body: "Sen", serif;
    
    /*Colors*/
    --primaryAccentColor: #f58446;
    --primaryAccentColorHover: #58585a;
    --secondaryAccentColor: #58585a;
    --secondaryAccentColorHover: #4D4D4F;
    --accentColorDark: #58585a;
    
    /*Indien niet van toepassing onderstaande variabelen vullen met dezelfde waarde als primaryAccentColor*/
    --optionalAccentColor: #f58446;
    --optionalAccentColorHover: #58585a;
    
    /*Darkmode/lightmode*/
    --lightdark-bgcolor: #fff;
    --lightdark-text: #58585a;
    --lightdark-bgcolor-RGB: 255,255,255; /*Vul de lightdark-bgcolor als rgb waarden in. Deze wordt gebruikt voor de gradient op de landingspagina header/*
    /*Details*/
    --borderRadius: 1px;
    --borderRadiusButtons: 2px;
    /*--boxShadowsGeneral: 0px 12px 36px -5px rgba(164,164,164,0.80);*/
    --boxShadowsGeneral: 0px 8px 25px rgba(164,164,164,0.50);
    
    /*Img & other*/
    --backgroundImage: url(https://s3.eu-central-1.amazonaws.com/bewustwording.localitheroes.com/media/arda_localitheroes_bg.jpg);
}


 /*Titels font weight & kleuren*/
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, .page-report h1 {
    font-weight:600;
    color: var(--primaryAccentColor);
}
.e-header-s {font-weight: 700; }

 /*Verdiepingvlak andere kleur maken*/
.ardaStepVerdieping, .page-support-support-item {
	background: #f3f3f4;
    border: 1px solid #f3f3f4;
}

 /*Logo rechtsboven formaat aanpassen*/
.login-top {
	padding-top:60px;
    background-size: 70%;
}

.login-top-navigation-wrapper, .app--layout-new .page-course__header, .page-step--normal .page-step__header, .app--layout-new .page-step__header {
    background: none;
}


/* challenge button*/
.memo_start_btn {
    color:White;
}