body
{
	margin: 0;
	padding: 0;
	font-family: Arial, 'arial rounded MT bold', Helvetica, sans-serif;
	background-color: #ffffff;
	color: #ffffff;
}

#maincontainer
{
	position: relative;
	margin: 0 auto;
	min-height: 600px;
	width: 1000px;
	background-color: #0099cc;
	background-image: url(../images/dots.png);
	background-position: center bottom;
	background-repeat: no-repeat;
	/*
	-moz-box-shadow: 0px 4px 10px #000;
	-webkit-box-shadow: 0px 4px 10px #000;
	box-shadow: 0px 4px 10px #000;
	*/
}

#maincontainermobile
{
	position: relative;
	margin: auto;
	min-height: 300px;
	height:100%;
	width: 100%;
	/*max-width: 400px;*/
	background-color: #0099cc;
}

#loginform
{
	position: absolute;
	left: 350px;
	top: 30px;
	color: #000000;
}

#maincontainermobile .input
{
	margin: 5px 0;
	background: white;
	float: left;
	clear: both;
}
#maincontainermobile .input span
{
	position: absolute;
	padding: 5px;
	margin-left: 3px;
	color: #888;
}
#maincontainermobile .input input, #maincontainermobile .input textarea, #maincontainermobile .input select
{
	position: relative;
	margin: 0;
	border-width: 1px;
	padding: 5px;
	background: transparent;
	font: inherit;
	width: 240px;
}
/* remove Safari's extra padding */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    #maincontainermobile .input input, #maincontainermobile .input textarea, #maincontainermobile .input select { padding: 4px; }
}

#maincontainermobile form .submit
{
	background: none;
	background-image: url(../images/button-arrow.png);
	background-position: left top;
	background-repeat: no-repeat;
	width: 33px;
	height: 33px;
	cursor:pointer;
	text-indent: -999em;
	border:none;
	position: absolute; bottom:13px;
	margin-left: 5px;
}
#maincontainermobile form .submit:hover
{
	background-position: left bottom;
}


#maincontainermobile form
{
	color: #ffffff;
	padding: 10px;
	position:relative;
}

#maincontainermobile #registersubmit
{
	background: none;
	background-image: url(../images/knop_registreer.png);
	background-position: left top;
	background-repeat: no-repeat;
	width: 105px;
	height: 31px;
	cursor:pointer;
	text-indent: -999em;
	border:none;
}


#loginmessage
{
	color: #d00;
}
#bigheader,#bigheadermobile
{
	position: relative;
	padding: 0;
	margin: 0;
	clear: both;
	background-color: #ffffff;
}
#bigheader
{
	width: 1000px;
	height: 85px;
}
#bigheadermobile
{
	width: 100%;
	height: 40px;
}
#bigheader #banner
{
	position: absolute;
	left: 0px;
	top: 17px;
	height: 50px;
	background-color: #0099cc;
}
#bigheader .textlogo
{
	font-family: 'arial rounded MT bold',arial;
	font-size: 34px;
	color: #000;
	text-decoration: none;
	display: inline-block;
	margin-top: 15px;
	margin-left: 10px;
}

#bigheadermobile #bannermobile
{
	width:50%;
	max-width:257px;
	margin-top:0px;
	margin-left:5px;
}
#bigheader #bar
{
	position: absolute;
	left: 0px;
	top: 85px;
}
#bigheader a
{
	margin-left: 0px;
}

#bigheader #produced-by {
    height: 85px;
    position: absolute;
    top: 0;
    right: 10px;
    line-height: 85px;
    color: #003366;
}

#bigheader #produced-by img {
    vertical-align: top;
    margin-left: 10px;
    max-height: 80px;
}

#navigationbar
{
	position: relative;
	width: 1000px;
	height: 30px;
	background-color: #333;
	padding: 0;
	margin: 0;
	clear: both;
}

#timer, #timerdial
{
	position: absolute;
	top: 0;
	padding: 0;
	margin: 0;
}

#timer
{
	color: #fff;
	line-height: 32px; /* same height as points-image */
	left: 515px;
	width: 50px;
	text-align: center;
	display: none;
}
.time_elapsed
{
	color: red;
	font-weight: bold;
}

#timerdial
{
	left: 480px;
	width: 30px;
	height: 30px;
}

#timeoutmessage
{
	display:none;
	position:absolute;
	left: 0px;
	top: 30px;
	width: 980px;
	padding:10px;
	background-color: #333;
	color: white;
	z-index: 10;
}
#timeoutlink
{
	text-decoration:underline;
	cursor:pointer;
}

.headerbarmobile
{
	height:30px;
	background-color:#1f3664;
	font-weight:bold;
	color: #0099cc;
	overflow: hidden;
	font-size: 0.90em;
}
.headerbarmobile span
{
	color: #ffffff;
}
.headerbarmobile,.headerbarmobile2
{
	padding-left: 10px;
	padding-right: 10px;
}

.headerbarmobile2
{
	color: #1f3664;
	font-size: 1.5em;
	font-weight: bold;
	height: 30px;
}

#category
{
	position: absolute;
	left: 0px;
	top: 125px;
	width: 265px;
	height: 39px;
}
#coach, #coachlarge
{
	position: absolute;
	left: 0px;
	top: 175px;
	width: 269px;
}
#coach
{
	height: 87px;
	background: #0099cc url(../images/coach.png) no-repeat left top;
}
#coachlarge
{
	height: 117px;
	background: #0099cc url(../images/coachlarge.png) no-repeat left top;
}
#coach p,#coachlarge p
{
	margin-top: 10px;
	margin-left: 10px;
	color: #ffffff;
}

#coach p span,#coachlarge p span
{
	width: 100px;
	color: #0099cc;
}

#maincontainer #caption
{
	position: absolute;
	left: 300px;
	top: 125px;
}
h1
{
	margin-top: 0;
	color: #1f3664;
	font-size: 1.5em;
}


#closebutton
{
	position: absolute;
	top: 4px;
	right: 10px;
	height: 30px;
	width: 94px;
	background: #fff url(../images/knop_stop.png) no-repeat;
	padding: 0;
	margin: 0;
	text-transform: capitalize;
	cursor: pointer;

	border: 0;
	text-indent: -9999px;
}


#logout-button, #logout-button:visited, #helpdesk-button, #helpdesk-button:visited {
    background: url("../images/button-long.png") no-repeat scroll left top transparent;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: bold;
    width: 98px;
    height: 23px;
    line-height: 18px;
    position: absolute;
    left: 10px;
    top: 46px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;

}
#logout-button:hover, #helpdesk-button:hover {
    background-position: left bottom;
}
#helpdesk-button
{
	top: 84px;
}

a#helpdesk
{
	color: #fff;
	font-size: 0.8em;
	margin-left: 10px;
}
a#helpdesk div {
    background: none repeat scroll 0 0 #35A9D9;
    float: left;
    height: 20px;
    margin-right: 3px;
    width: 20px;
}


#stopbutton
{
	position: absolute;
	top: 4px;
	right: 10px;
	width: 98px;
	height: 22px;
	padding: 0;
	margin: 0;
	text-transform: capitalize;
	cursor: pointer;

	border: 0;
	text-indent: -9999px;
	background: #333 url(../images/bttn_stoppen_on.png) no-repeat;
}
#stopbutton:hover
{
	background-image: url(../images/bttn_stoppen_hl.png);
}

#stopbutton.result
{
	background-image: url(../images/bttn_verder_on.png);
}
#stopbutton.result:hover
{
	background-image: url(../images/bttn_verder_hl.png);
}

body.en #stopbutton
{
	background-image: url(/public/images/exams/bttn_stoppen_engels_on.png);
	width: 70px;
}
body.en #stopbutton:hover
{
	background-image: url(/public/images/exams/bttn_stoppen_engels_hl.png);
}
body.en #stopbutton.result
{
	background-image: url(../images/bttn_verder_engels_on.png);
	width: 78px;
}
body.en #stopbutton.result:hover
{
	background-image: url(../images/bttn_verder_engels_hl.png);
}

body.pl #stopbutton
{
	background-image: url(/public/images/exams/polish/bttn_stoppen_on.png);
	width: 108px;
}
body.pl #stopbutton:hover
{
	background-image: url(/public/images/exams/polish/bttn_stoppen_hl.png);
}
body.pl #stopbutton.result
{
	background-image: url(/public/images/exams/polish/btn_resultaten_on.png);
	width: 78px;
}
body.pl #stopbutton.result:hover
{
	background-image: url(/public/images/exams/polish/btn_resultaten_hl.png);
}

body.tr #stopbutton
{
	background-image: url(/public/images/exams/turkish/bttn_stoppen_on.png);
	width: 83px;
}
body.tr #stopbutton:hover
{
	background-image: url(/public/images/exams/turkish/bttn_stoppen_hl.png);
}
body.tr #stopbutton.result
{
	background-image: url(/public/images/exams/turkish/btn_resultaten_on.png);
	width: 87px;
}
body.tr #stopbutton.result:hover
{
	background-image: url(/public/images/exams/turkish/btn_resultaten_hl.png);
}

#btnExtracredit,#upgraded
{
	position: absolute;
	left: 0;
	background-color: #1F3664;
	background-image: url(/public/images/exams/coach.png);
	padding: 15px 0px 5px 10px;
	width: 259px;
	color: #ffffff;
    top: 300px;
    height:30px;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}
#btnExtracredit
{
    cursor:pointer;
}

#extracredit
{
    position:fixed;
    display:none;
    width:100%;
    height:100%;
}

#extracredit #content
{
    position:absolute;
    display:none;
    left:250px;
    top:50px;
    width:480px;
    height:330px;
    padding: 20px 30px 0 30px;
    background-color:white;
    color:#000;
    z-index:1001;

	-webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	border-radius: 5px;
}
#extracredit #content td
{
	color: #000;
}

#extracredit.extracredit
{
	position: fixed;
	display: none;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	font-family: "Ubuntu", Sans-serif;
	line-height: 1.3;
	overflow-y: auto;
}
#extracredit .overlay
{
    background: #000;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 50;
    position:fixed;
    width:100%;
    height:100%;
    opacity:0.5;
}
#extracredit.extracredit #content.extracredit-content
{
	position:absolute;
	display:none;
	background-color:white;
	color:#000;
	z-index:1001;
	grid-template-areas:
	". . . . . ."
		". . . title-image . ."
		". . title title-image . ."
		". . products products . ."
		". . . . . ."
		". . close close . ."
		". . close close . ."
		". . . . . .";
	grid-template-columns: 30px 30px 1fr 10% 30px 30px ;
	grid-template-rows: 15px 15px minmax(100px, max-content) minmax(max-content, 1fr) 15px 30px 15px 15px;
	align-items: center;
	justify-items: center;
	min-height: 100%;
	width: 100%;
	height: auto;
	top: 0;
	left: 0;
	max-width: 100%;
	border-radius: 0;
	padding: 0;
}

#extracredit.extracredit #content img {
	max-width: 100%;
	max-height: 100%;
	display: block;
}

#extracredit.extracredit #content .extracredit-background {
	background: linear-gradient(#0DAEF5, #0574EC);
	grid-row: 3 /span 4;
	grid-column: 2 /span 4;
	width: 100%;
	height: 100%;
	border-radius: 18px;
}

#extracredit.extracredit #content .extracredit-title {
	grid-area: title;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: white;
	font-family: "Patua One", Sans-serif;
}

#extracredit.extracredit #content .extracredit-title .chapeau {
	font-size: 35px;
	text-align: center;
}

#extracredit.extracredit #content .extracredit-title .main-title {
	font-size: 70px;
	text-align: right;
	text-shadow: 0 3px 6px rgb(0 0 0 / 36%);
	margin: 0 20px 20px 0;
	line-height: 75px;
}

#extracredit.extracredit #content .extracredit-title-image {
	grid-area: title-image;
	height: 100%;
	width: calc(100% - 24px);
	margin-right: 24px;
	display: flex;
	justify-items: start;
	align-items: end;
	background-image: url(/public/images/exams/extracredit-popup-image.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom right;
}

#extracredit.extracredit #content .extracredit-products {
	grid-row: 4 /span 2;
	grid-column: 3 /span 2;
	background-color: white;
	border-radius: 12px;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: row;
	box-shadow: 0px 3px 6px #00000029;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem-container {
	flex: 1 1 0;
	border-right: 2px solid #269FEF;
	margin: 20px 0 30px 0;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem-container:last-child {
	border: none;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem {
	display: grid;
	grid-template-areas:
		"product-image"
		"product-title"
		"product-type"
		"product-price"
		"."
		"product-order"
		"product-info"
		"product-highlights";
	margin: 0 24px;
	grid-template-rows: 120px 56px auto auto 25px auto auto minmax(auto, 1fr);
	height: 100%;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem > div{
	padding: 0 10px;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-image {
	grid-area: product-image;
	justify-self: center;
	padding: 0;
	display: flex;
	height: 100%;
	align-items: center;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-title {
	grid-area: product-title;
	font-size: 24px;
	line-height: 28px;
	color: #2C2D2B;
	font-family: "Patua One", Sans-serif;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-type {
	grid-area: product-type;
	font-size: 13px;
	color: #7A7A7A;
	display: flex;
	align-items: center;
	gap: 10px;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-price {
	grid-area: product-price;
	font-size: 31px;
	color: #02B903;
	font-family: "Patua One", Sans-serif;

}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-order {
	grid-area: product-order;
	padding: 10px 0;
	width: 100%;
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	color: #FFFFFF;
	border-radius: 31px;
	background-color: #02B903;
	cursor: pointer;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-order:hover {
	background-color: #039903;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-info {
	grid-area: product-info;
	justify-self: center;
	font-size: 15px;
	font-weight: 600;
	color: #7A7A7A;
	cursor: pointer;
	padding: 10px;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-highlights {
	grid-area: product-highlights;
	font-size: 15px;
	color: #000000;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-highlights .product-highlight {
	display: flex;
	align-items: center;
	gap: 15px;
}

#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-highlights .product-highlight .highlight-icon {
	flex: 0 0 19px;
}

#extracredit.extracredit #content .extracredit-close {
	grid-row: 5 /span 3;
	grid-column: 3 /span 2;
	color: white;
	background-color: #f0932c;
	padding: 15px 50px;
	border-radius: 25px;
	font-size: 20px;
	line-height: 20px;
	font-weight: 600;
	cursor: pointer;
	text-align: center;
}

#extracredit.extracredit #content .extracredit-close:hover {
	background-color: #d1812a;
}

#extracredit #content p
{
    font-weight:bold;
}
#extracredit #content p.info
{
    font-weight:normal;
	font-size:0.9em;
}
#extracredit #content table
{
    margin-top: 20px;
}
#extracredit #content td
{
    vertical-align: middle;
    height:50px;
}

#extracredit #content td button
{
    width: 80px;
	height:30px;
    font-weight:bold;
    background: #0a0;
    color: #fff;
	cursor:pointer;
}
#extracredit #content #ideallogo,
#extracredit #content #paypallogo,
#extracredit #content #bancontactlogo
{
	position: absolute;
	bottom: 10px;
}
#extracredit #content #ideallogo
{
	right: 10px;
}
#extracredit #content #paypallogo
{
	right: 70px;
}
#extracredit #content #bancontactlogo
{
	right: 130px;
}

#extracredit #bttn_close
{
    background:#fff url(/exams/images/bttn_close_on.png) no-repeat;
    position:absolute;
    width: 32px;
    height:32px;
    top:10px;
    right:8px;
    padding: 0;
    margin: 0;
    text-transform: capitalize;
    cursor: pointer;
    border: 0;
    text-indent: -9999px;
}
#extracredit #bttn_close:hover {
    background-image:url(/exams/images/bttn_close_hl.png);
}

@media screen and (max-width: 1450px) {

	#extracredit #content .extracredit-title .chapeau {
		font-size: 30px;
	}
	
	#extracredit #content .extracredit-title .main-title {
		font-size: 55px;
    line-height: 60px;
	}

	#extracredit #content .extracredit-products .extracredit-productitem {
    grid-template-rows: 100px 56px auto auto 25px auto auto minmax(auto, 1fr);
	}
}

@media screen and (max-width: 1350px) {
	#extracredit.extracredit #content .extracredit-title .chapeau {
		font-size: 25px;
	}
	
	#extracredit.extracredit #content .extracredit-title .main-title {
		font-size: 50px;
    line-height: 55px;
	}

	#extracredit.extracredit #content .extracredit-products .extracredit-productitem {
    grid-template-rows: 100px 56px auto auto 15px auto auto minmax(auto, 1fr);
	}

	#extracredit.extracredit #content .extracredit-products .extracredit-productitem .product-info {
    padding: 5px;
}
}

@media screen and (max-width: 1150px) {
	#extracredit.extracredit #content.extracredit-content
	{
		grid-template-columns: 30px 40px 4fr 1fr 40px 30px ;
		grid-template-rows: 15px 15px minmax(100px, max-content) 1fr 15px 20px 15px 15px;
	}

	#extracredit.extracredit #content .extracredit-products .extracredit-productitem {
    grid-template-rows: 100px 91px auto auto 15px auto auto minmax(auto, 1fr);
	}

}

/* responsive for small screens */
@media screen and (max-width: 1023px) {xdiv{border: 1px solid red}
	#maincontainer,
    #navigationbar,
    #bigheader,
    #container,
    #container #continuebutton,
    #container #restartbutton,
    #logo,
    #logo img,
    #examtrainingnavbar,
    ul#chapters,
    #scoreinfo
    {
        max-width: 100%;
    }
    #examtraining img:first-child
    {
        position: relative;
    }
    #scoreinfo
    {
        width: auto;
        margin-top: 10px;
    }

    #examtraining article #legenda,
    #examtraining article img[alt='legenda'],
    .coachleft,
    .selector,
    #btnExtracredit,
    #translate
    {
        max-width: calc(100% - 10px);
    }
    #examtraining article
    {
        max-width: calc(100% - 20px);
    }

    #examtraining #breadcrumbs
    {
        max-width: calc(100% - 180px);
    }
    #breadcrumbs li
    {
        display: inline-block;
    }
    /* category-image */
    #examtraining > img:first-of-type
    {
        position: relative!important;
        top: auto !important;
        left: auto !important;
    }

    #examtraining article
    {
        margin-left: 0;
        padding-left: 10px;
    }
    #examtrainingnavbar
    {
        height: auto;
        min-height: 30px;
    }
    #breadcrumbs
    {
        height: auto;
        min-height: 19px;
        margin: 0;
    }
    #maincontainer #category,
    #maincontainer #coachlarge,
    #maincontainer #caption,
   	#timer,
   	#timerdial,
    .coachleft,
    #btnExtracredit,
    #translate,
    #passedinfo,
    #scoreinfo,
    #container #passedinfo,
    #classesbutton,
    #termsbutton,
    #termspdfbutton,
    .selector
    {
        position: relative !important;
        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
    }
    #classesbutton,
    #termsbutton
    {
        display: block;
        margin-top: 10px;
    }
    h1.dark-blue
    {
        font-weight: bold;
        margin: 10px 0 10px 0px;
    }
    #maincontainer #coachlarge,
    #btnExtracredit
    {
        margin-bottom: 5px;
    }

    #examtraining #banner_studietips,
    #examtraining #alertchoice
    {
        position: relative;
        left: auto;
        top: auto;
    }


    /* correction for article left padding */
    article #btnExtracredit,
    #translate,
    .selector,
    #banner_studietips,
    #scoreinfo
    {
        margin-left: -10px;
    }
    #banner_studietips
    {
        margin-top: 10px;
    }

    .title
    {
        text-align: left;
        max-height: 24px;
        max-width: calc(100% - 60px);
        padding-right: 60px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* resultterms (studieadvies) */
    table.resultterms
    {
        font-size: 80%;
    }
    table.chapters.resultterms td, table.chapters.resultterms th
    {
        padding: 2px;
    }
    table.resultterms div.termtitle
    {
        width: auto !important;
    }
    table.chapters.resultterms div.termtitle.singleline
    {
        white-space: normal;
    }
    table.chapters.resultterms td img
    {
        width: 23px;
    }

    #extracredit
    {
    	width: 100%;
    	height: 100%;
    	top: 0;
    	left: 0;
    }
	#extracredit #content
	{
		left: 0;
		top: 10px;
		max-width: calc(100% - 60px);
		max-height: calc(100% - 20px);
		height: auto;
	}
    #maincontainer #coachlarge
    {
    	padding-top: 1px;
    }

    #navigationbar
    {
    	display: flex;
    }

    #maincontainer h1#caption,
    #maincontainer #exams,
    #maincontainer > #passedinfo
    {
    	margin-left: 10px
    }

	#extracredit.extracredit
	{
		overflow: hidden;
	}

	#extracredit.extracredit #content .extracredit-products {
		flex-direction: column;
		overflow-y: auto;
	}

	#extracredit.extracredit #content .extracredit-products .extracredit-productitem-container {
		border-right: none;
		border-bottom: 2px solid #269FEF;
		margin: 0 30px;
	}

	#extracredit.extracredit #content .extracredit-products .extracredit-productitem {
		display: grid;
		grid-template-areas:
			"product-title product-image"
			"product-type product-image"
			"product-price product-image"
			". ."
			"product-order product-order"
			"product-info product-info"
			"product-highlights product-highlights";
		margin: 40px 0;
		grid-template-rows: auto auto auto 45px auto auto minmax(auto, 1fr);
		grid-template-columns: auto minmax(80px, 200px);
	}

	#extracredit.extracredit #content .extracredit-products-overlay {
		background: linear-gradient(rgba(255, 255, 255, 1), rgba(255, 255, 255, 0) 50px, rgba(255, 255, 255, 0) calc(100% - 50px), rgba(255, 255, 255, 1) 100%);
		grid-row: 4 /span 2;
		grid-column: 3 /span 2;
		border-radius: 12px;
		width: 100%;
		height: 100%;
		pointer-events: none;
	}

}

@media screen and (max-width: 900px) {
	#extracredit.extracredit #content.extracredit-content
	{
		grid-template-columns: 30px 40px 1fr 0 40px 30px ;
	}

	#extracredit.extracredit #content .extracredit-title-image img {
		display: none;
	}

	#extracredit.extracredit #content .extracredit-title .main-title {
		text-align: center;
		margin: 0 0 38px 0;
	}
}

@media screen and (max-width: 600px) {
	#bigheader #produced-by
	{
		text-align: right;
	}
	#bigheader #produced-by img
	{
		max-width: calc(100% - 140px);
	}

	#extracredit.extracredit #content.extracredit-content
	{
		max-height: 100%;
	}

	#extracredit.extracredit #content .extracredit-title .chapeau {
		font-size: 20px;
	}

	#extracredit.extracredit #content .extracredit-title .main-title {
		font-size: 45px;
		line-height: 50px;
	}

	#extracredit.extracredit #content .extracredit-title .main-title {
		margin: 0 0 20px 0;
	}

	#extracredit.extracredit #content.extracredit-content {
		grid-template-columns: 20px 20px 1fr 0 20px 20px;
		grid-template-rows: 10px 10px minmax(100px, max-content) 1fr 10px 35px 10px 10px;
	}

	#extracredit.extracredit #content .extracredit-close {
		padding: 15px 40px;
	}
}

@media screen and (max-width: 470px) {
	#extracredit #content {
		padding-bottom: 53px;
	}
	#extracredit #content #ideallogo
	{
		right: calc(50% - 82px);
	}
	#extracredit #content #paypallogo
	{
		right: calc(50% - 22px);
	}
	#extracredit #content #bancontactlogo
	{
		right: calc(50% + 42px);
	}

	#extracredit.extracredit #content .extracredit-title .chapeau {
		font-size: 18px;
	}

	#extracredit.extracredit #content .extracredit-title .main-title {
		font-size: 34px;
		line-height: 40px;
	}
}

@media screen and (max-width: 450px) {
	header
	{
		height: auto;
		max-height: 85px;
		min-height: 40px;
	}
	#logo
	{
		height: auto;
		max-width: 60%;
	}
	header #produced-by
	{
		max-width: 40%;
	}
	header #produced-by img
	{
		width: 100%;
	}
	body.zorgeloos #logo,
	body.wegrijden #logo
	{
		display:none;
	}
	body.zorgeloos header #produced-by,
	body.wegrijden header #produced-by
	{
		position: relative;
		max-width: initial;
		text-align: right;
		height: auto;
		line-height: 1;
		text-align: right;
	}
	body.zorgeloos header #produced-by img,
	body.wegrijden header #produced-by img
	{
		width: auto;
		max-width: 100%;
	}
}