.menu{
	border:none;
	border:0px;
	margin:0px;
	padding:0px;
	color:  #ffffff;
	font-size: 12px;
	font-family: Verdana;
	text-decoration: none;
	
	}
.menu ul{
	list-style:none;
	margin:0;
	padding:0;
	}
	.menu li{
		float:left;
		padding:0px;
		}
	.menu li a{
		color:#cccccc;
		display:block;
		font-weight:normal;
		line-height:25px;
		margin:0px;
		padding:0px 16px;
		text-align:center;
		text-decoration:none;
		}
		.menu li a:hover, .menu ul li:hover a{
			background: #2580a2 url("http://ccimgs.nl/hover.gif") bottom center no-repeat;
			color:#FFFFFF;
			text-decoration:none;
			}
	.menu li ul{
		background:#333333;
		display:none;
		height:auto;
		padding:0px;
		margin:0px;
		border:0px;
		position:absolute;
		width:225px;
		z-index:100;
		/*top:1em;
		/*left:0;*/
		}
	.menu li:hover ul{
		display:block;
		
		}
	.menu li li {
		background:url('http://ccimgs.nl/sub_sep.gif') bottom left no-repeat;
		display:block;
		float:none;
		margin:0px;
		padding:0px;
		width:215px;
		}
	.menu li:hover li a{
		background:none;
		
		}
	.menu li ul a{
		color:  #ffffff;
	font-size: 12px;
	font-family: Verdana;
	text-decoration: none;
	text-align:left;
	padding:0px 11px 0px 16px;
		text-align:left;
		}
		.menu li ul a:hover, .menu li ul li:hover a{
			background:#2580a2 url('http://ccimgs.nl/hover_sub.gif') center left no-repeat;
			border:0px;
			color:#ffffff;
			text-decoration:none;
			}
	.menu p{
		clear:left;
		}	

a {
	color:  #ffffff;
	font-size: 12px;
	font-family: Verdana;
	text-decoration: none;
}

body {
	margin: 0px;
	background-color: #6b696b;
	font-size: 12px;
	font-family: Verdana;
	color: #FFFFFF;
}

td.menu {
	background-color: #4a656b;
	padding: 2px;
	padding-left: 3px;
}

td.menutop {
	background-color: #4a656b;
	background-image: url('IMG/menu_pattern.jpg');
	font-weight: bold;
	padding: 5px;
	text-align: center;
}

td.header {
	background-image: url('IMG/header_pattern.jpg');
	text-align: left;
}

td.subheader {
	background-image: url('IMG/subheader_pattern.jpg');
	text-align: left;
	padding: 5px;
}
td.tab {

	background-color: #464646;

	text-align: center;

	padding-top: 12px;

	padding-bottom: 12px;

	vertical-align: middle;

}

td.inhoud_p {

	background-color: #606060;

	text-align: center;

	padding-top: 12px;

	padding-bottom: 12px;

	vertical-align: middle;

}

td.tab_on {

	background-color: #3e3e3e;

	text-align: center;

	padding-top: 12px;

	padding-bottom: 12px;

	vertical-align: middle;

}

td.top {
	background-image: url('IMG/top_pattern.jpg');
	text-align: center;
	padding: 5px;
	font-weight: bold;
}

td.subtop {
	background-image: url('IMG/subtop_pattern.jpg');
	text-align: center;
	padding: 5px;
	font-weight: bold;
}

td.subtop_l {
	background-image: url('IMG/subtop_pattern.jpg');
	text-align: left;
	padding: 5px;
	font-weight: bold;
}

td.inhoud {
	background-color: #464646;
	text-align: left;
	padding: 3px;
	padding-left: 4px;
}
td.inhoud_rood {
	background-color: #8B0000;
	text-align: left;
	padding: 3px;
	padding-left: 4px;
}
div.missie1 {
	background-image: url('/pmissie/images/benodigheden/missie1.png'); width: 635px; height: 375px;
}
td.container {
	background-color: #464646;
	text-align: center;
	padding: 10px;
	vertical-align: top;
}


td.inhoud_c {
	background-color: #464646;
	text-align: center;
	padding: 3px;
	vertical-align: top;
}

td.inhoud_cm {
	background-color: #464646;
	text-align: center;
	padding: 3px;
	vertical-align: middle;
}

td.inhoud_r {
	background-color: #464646;
	text-align: right;
	padding: 3px;
	vertical-align: top;
	padding-right: 4px;
}

select {
	background-color: #373737;
	color: #ffffff;
	border: 1px dotted #010101;
	font-size: 12px;
	font-family: Verdana;
}

input {
	background-color: #373737;
	color: #ffffff;
	border: 1px dotted #010101;
	font-size: 12px;
	font-family: Verdana;
}
input.code {
	background-color: #373737;
	color: #ffffff;
	border: 1px dotted #010101;
	font-size: 12px;
	font-family: Verdana;
	width: 65px;
}
input.field {
		background:url("/images/field.png") no-repeat scroll left top transparent;
		color:#000000;
		font-size:12px;
		font-weight:bold;
		padding:2px 5px;
                border:medium none;
		font-family:Arial;
		font-size:12px;
	}

textarea {
	background-color: #373737;
	color: #ffffff;
	border: 1px dotted #010101;
	font-size: 12px;
	font-family: Verdana;
	width: 450px;
	height: 120px;
	overflow:auto;
}

input.code {
	background-color: #373737;
	color: #ffffff;
	border: 1px dotted #010101;
	font-size: 12px;
	font-family: Verdana;
	width: 65px;
}


input.roulette {
	background-color: #373737;
	color: #ffffff;
	border: 1px dotted #010101;
	font-size: 12px;
	font-family: Verdana;
	width: 80%;
}


span.nieuws {
	font-size: 20px;
	color: #4db5d6;
}

span.update {
	font-size: 20px;
	color: #f7ff15;
}
span.informatie {
	font-size: 20px;
	color: #39de00;
}

span.aanpassing{
	font-size: 20px;
	color: #ff0000;
}

span.nieuwsitem {
	font-size: 20px;
	color: #adadad;
}

span.descMissie {
	color: #a8a4a3;
}

option.done {
	background-color: #047f03;
}

option.hurtList {
    background-color: red;
}
/* kleuren */
span.red {
	color: #f00;
}

span.green {
	color: #0f0;
}
.admin {
	color: #f00;
}

.gamemod {
	color: #ffa502
}

.forummod {
	color: #adadad;
}

.helpdesk {
	color: #39de00;
}

.goldmember {
	color: #f56d23;
}

.vip {
	color: #42a6c6;
}

.donator {
	color: #f7ff15;
}

.banned {
	color: #000;
}

/* crimes */
ol.crimes {
	list-style-type: none; margin: auto; padding: 0px; width: 90%; margin-top: 15px; margin-bottom: 15px;
}
li.crime_active {
	display: block; height: 1%; overflow: hidden; background-color: #3f3f3f; border: 1px solid #000; border-bottom: 0px;
}
li.crime_inactive {
	display: block; height: 1%; overflow: hidden; background-color: #323232; border: 1px solid #000;
}
p.crimeinfo {
	margin-top: 25px; font-size: 13px; float:left;
}
p.executecrime {
	margin-top: 35px; float: right; margin-right: 20px;
}
input.crimeExecButton {
	height: 25px; background-image: url('/images/button_green_bar.jpg'); background-repeat: repeat-x; border: 1px solid #000; font-weight: bold; padding-left: 15px;padding-right: 15px;
}
/**/
div.levelshield {
	background-image: url('/images/levels/shield_small_blue.png'); width: 62px; height: 58px; margin-top: 16px; margin-left: 13px; margin-right: 15px; margin-bottom: 16px; float: left;
}
div.crime_level_num {
	padding-top: 17px; font-size: 18px; font-weight: bold; text-align: center; width: 58px;
}
/**/
div.crimes_scroller {
	height: 92px; width: 70px; float: right;
}
/**/
div.big_levelshield {
	background-image: url('/images/levels/shield_blue.jpg'); width: 160px; height: 151px; margin: auto;
}
div.big_level_num {
	margin: auto; padding-top: 73px; font-size: 30px; font-weight: bold;
}
/**/
div.scroll_arrow_up {
	margin-top: 17px; height: 29px; width: 31px; background-image: url('/images/levels/arrow_up_off.jpg');
}
div.scroll_arrow_up_on {
	margin-top: 17px; height: 29px; width: 31px; background-image: url('/images/levels/arrow_up_on.jpg'); cursor: pointer;
}
div.scroll_arrow_down {
	height: 29px; width: 31px; background-image: url('/images/levels/arrow_down_off.jpg');
}
div.scroll_arrow_down_on {
	height: 29px; width: 31px; background-image: url('/images/levels/arrow_down_on.jpg'); cursor: pointer;
}
/* showroom */
div.small_vehicle_examples {
	width: 740px; margin: auto;
}
div.smallVehicleExample {
	border: 4px solid #464646; width: 120px; height: 76px; float: left;
}
div.smallVehicleExampleHover {
	border: 4px solid #7c7c7c; cursor: pointer; width: 120px; height: 76px; float: left;
}
div.smallVehicleSliderLeft {
	width: 50px; background-color: #363636; height: 76px; float: left;
}
div.smallVehicleSliderRight {
	width: 50px;background-color: #363636; height: 76px; float: left;
}
a.showroomScrollLeft {
	display: block; background-image: url('/images/showroom/scroll_left_off.jpg'); width: 33px; height: 47px; margin-right: 10px;
}
a.showroomScrollLeft:hover {
	display: block; background-image: url('/images/showroom/scroll_left_on.jpg'); width: 33px; height: 47px; cursor: pointer; margin-right: 10px;
}
a.showroomScrollRight {
	display: block; background-image: url('/images/showroom/scroll_right_off.jpg'); width: 33px; height: 47px; margin-left: 10px;
}
a.showroomScrollRight:hover {
	display: block; background-image: url('/images/showroom/scroll_right_on.jpg'); width: 33px; height: 47px; cursor: pointer; margin-left: 10px;
}
a.showroomSmallScrollLeft {
	display: block; background-image: url('/images/showroom/scroll_left_off.jpg'); width: 33px; margin-right: 10px; float: left; height: 76px; background-position: left center;background-repeat: no-repeat;
}
a.showroomSmallScrollLeft:hover {
	display: block; background-image: url('/images/showroom/scroll_left_on.jpg'); width: 33px; cursor: pointer; margin-right: 10px; float: left; height: 76px; background-position: left center;background-repeat: no-repeat;
}
a.showroomSmallScrollRight {
	display: block; background-image: url('/images/showroom/scroll_right_off.jpg'); width: 33px; margin-left: 10px;  float: left; height: 76px; background-position: left center;background-repeat: no-repeat;
}
a.showroomSmallScrollRight:hover {
	display: block; background-image: url('/images/showroom/scroll_right_on.jpg'); width: 33px; cursor: pointer; margin-left: 10px; float: left; height: 76px; background-position: left center;background-repeat: no-repeat;
}
#ibox_footer_wrapper {
	font-weight:bold;height:20px;line-height:20px;
} 

#ibox_footer_wrapper a {
	text-decoration:none;background:#888;border:1px solid #666;line-height:16px;padding:0 5px;color:#333;font-weight:bold;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:10px;
}
#ibox_footer_wrapper a:hover {
	background-color:#bbb; color:#111;
} 
#ibox_footer_wrapper {
	font-size:12px;font-family:Verdana, Arial, Helvetica, sans-serif;color:#111;
}
#ibox_wrapper {
	border:1px solid #ccc;
}
#ibox_wrapper {
	background-color:#999;
	margin-top: -50px;
}
#ibox_content {
	background-color:#ededed;
	border:1px solid #666;
	color: #000;
	padding: 4px;
} 
#ibox_loading {
	padding:50px; background:#000;color:#fff;font-size:16px;font-weight:bold;
}
div.counter_view {
	width: 212px;
	height: 64px;
	background-image: url('/images/counter_bg.jpg');
	margin: 0px;
	margin-right: 40px;
	float: right;
	padding-left: 20px;
	padding-top: 6px;
}
/* showroom */
div.small_vehicle_examples {
	width: 740px; margin: auto;
}
div.smallVehicleExample {
	border: 4px solid #464646; width: 120px; height: 76px; float: left;
}
div.smallVehicleExampleHover {
	border: 4px solid #7c7c7c; cursor: pointer; width: 120px; height: 76px; float: left;
}
div.smallVehicleSliderLeft {
	width: 50px; background-color: #363636; height: 76px; float: left;
}
div.smallVehicleSliderRight {
	width: 50px;background-color: #363636; height: 76px; float: left;
}
a.showroomScrollLeft {
	display: block; background-image: url('/images/showroom/scroll_left_off.jpg'); width: 33px; height: 47px; margin-right: 10px;
}
a.showroomScrollLeft:hover {
	display: block; background-image: url('/images/showroom/scroll_left_on.jpg'); width: 33px; height: 47px; cursor: pointer; margin-right: 10px;
}
a.showroomScrollRight {
	display: block; background-image: url('/images/showroom/scroll_right_off.jpg'); width: 33px; height: 47px; margin-left: 10px;
}
a.showroomScrollRight:hover {
	display: block; background-image: url('/images/showroom/scroll_right_on.jpg'); width: 33px; height: 47px; cursor: pointer; margin-left: 10px;
}
a.showroomSmallScrollLeft {
	display: block; background-image: url('/images/showroom/scroll_left_off.jpg'); width: 33px; margin-right: 10px; float: left; height: 76px; background-position: left center;background-repeat: no-repeat;
}
a.showroomSmallScrollLeft:hover {
	display: block; background-image: url('/images/showroom/scroll_left_on.jpg'); width: 33px; cursor: pointer; margin-right: 10px; float: left; height: 76px; background-position: left center;background-repeat: no-repeat;
}
a.showroomSmallScrollRight {
	display: block; background-image: url('/images/showroom/scroll_right_off.jpg'); width: 33px; margin-left: 10px;  float: left; height: 76px; background-position: left center;background-repeat: no-repeat;
}
a.showroomSmallScrollRight:hover {
	display: block; background-image: url('/images/showroom/scroll_right_on.jpg'); width: 33px; cursor: pointer; margin-left: 10px; float: left; height: 76px; background-position: left center;background-repeat: no-repeat;
}
div.counter_view {
	width: 173px;
	height: 64px;
	background-image: url('images/icons/counter_bg.jpg');
	margin: 0px;
	margin-right: 40px;
	float: right;
	padding-left: 20px;
	padding-top: 6px;
	
}
div.scroll_arrow_up {
	margin-top: 17px; height: 29px; width: 31px; background-image: url('/images/levels/arrow_up_off.jpg');
}
div.scroll_arrow_up_on {
	margin-top: 17px; height: 29px; width: 31px; background-image: url('/images/levels/arrow_up_on.jpg'); cursor: pointer;
}
div.scroll_arrow_down {
	height: 29px; width: 31px; background-image: url('/images/levels/arrow_down_off.jpg');
}
div.scroll_arrow_down_on {
	height: 29px; width: 31px; background-image: url('/images/levels/arrow_down_on.jpg'); cursor: pointer;
}

/* ===== 3-11-2026: leesbaarheid en uitlijning ===== */
td.menu { padding: 3px 4px; line-height: 1.45; }
td.inhoud, td.inhoud_c, td.inhoud_r, td.inhoud_cm, td.container { padding: 5px 6px; line-height: 1.45; }
td.top, td.subtop, td.subtop_l { padding: 6px; }
a:hover { text-decoration: underline; }
a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible { outline: 2px solid #f7b400; outline-offset: 1px; }
input[type=submit], input[type=button], button { cursor: pointer; padding: 3px 9px; min-height: 24px; }

/* tabbalk (vervangt de afbeeldingen uit IMG/tab) */
td.cc-tabs { vertical-align: middle; padding: 4px 0; }
a.cc-tab { display: inline-flex; align-items: center; gap: 6px; height: 28px; box-sizing: border-box; padding: 0 12px; margin: 2px 5px 2px 0;
	vertical-align: middle; background: linear-gradient(#5d5d5d, #3d3d3d); border: 1px solid #1f1f1f; border-radius: 4px;
	color: #fff; font: bold 12px Verdana, sans-serif; white-space: nowrap; text-decoration: none; box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
a.cc-tab:hover { background: linear-gradient(#6d6d6d, #4a4a4a); text-decoration: none; }
a.cc-tab img { width: 16px; height: 16px; flex: 0 0 16px; }
a.cc-tab.cc-tab-nieuw { border-color: #f7b400; }
.cc-tab-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #ff4040; }
td.cc-statuscel { text-align: right; vertical-align: middle; white-space: nowrap; padding: 4px 6px; background: none !important; }
form.cc-statusform { display: inline-flex; align-items: center; gap: 5px; margin: 0; }
form.cc-statusform select, form.cc-statusform input { height: 28px; box-sizing: border-box; margin: 0; }

/* profielblok: Rank en Leven onder elkaar met dezelfde labelbreedte */
table.cc-balken { margin: 0; border-collapse: collapse; }
table.cc-balken td { padding: 2px 0; vertical-align: middle; }
td.cc-balklabel { width: 62px; white-space: nowrap; }

/* ===== 4-11-2026: contrast in de menu's ===== */
td.menu a { color: #ffffff; }
/* vergrendelde onderdelen (cc-dicht, uit includes/_groei.php): leesbaar, met slotje en label */
td.menu .cc-dicht, td.menu a .cc-dicht { color: #d3dfe1 !important; font-style: italic; }
td.menu .cc-dicht::before { content: "\1F512"; font-style: normal; font-size: 10px; margin-right: 4px; opacity: .85; }
td.menu .cc-dicht small { font-style: normal; font-size: 10px; color: #ffe08a; background: rgba(0,0,0,.28); border-radius: 3px; padding: 0 4px; margin-left: 3px; white-space: nowrap; }
td.menu a:hover .cc-dicht { color: #ffffff !important; }
/* rode accenten (Nieuw, Refferal actie, rode namen) helderder op de blauwgroene achtergrond */
td.menu font[color="#ff0000"], td.menu font[color="#FF0000"], td.menu font[color="red"] { color: #ff8f8f !important; font-weight: bold; text-shadow: 0 1px 0 rgba(0,0,0,.55); }
td.menu font[color="#ff0000"] b, td.menu font[color="#FF0000"] b { color: inherit; }
td.menu span[style*="color: #ff0000"], td.menu span[style*="color: #FF0000"], td.menu span[style*="color:#ff0000"] { color: #ff8f8f !important; text-shadow: 0 1px 0 rgba(0,0,0,.55); }

/* ===== 4-11-2026: zachter rood voor waarschuwingsblokken (was #9a0008 / #8B0000) ===== */
table[bgcolor="#9a0008"], table[bgcolor="#9A0008"] { background-color: #a3504f !important; border-color: #7d3b3a !important; }
table[bgcolor="#9a0008"] td, td.inhoud_rood { background-color: #a3504f !important; }
table[bgcolor="#9a0008"], table[bgcolor="#9A0008"] { margin: 16px auto !important; }
table[bgcolor="#9a0008"] td { padding: 14px 18px !important; line-height: 1.6; }

/* ===== 4-11-2026: nette formulieren (o.a. Bank) ===== */
td.cc-bankkaart { padding: 12px 14px !important; }
.cc-kaartkop { display: block; font-weight: bold; font-size: 13px; color: #ffffff; margin: 0 0 10px; padding-bottom: 6px; border-bottom: 1px solid #5a5a5a; }
table.cc-formgrid { width: 100%; border-collapse: collapse; margin: 0; }
table.cc-formgrid td { padding: 5px 0; vertical-align: middle; }
table.cc-formgrid td.cc-lbl { width: 80px; padding-right: 10px; color: #d8d8d8; white-space: nowrap; }
table.cc-formgrid input[type=text], table.cc-formgrid input[type=password], table.cc-formgrid select {
	width: 100%; max-width: 280px; box-sizing: border-box; height: 28px; padding: 3px 8px;
	background: #2d2d2d; color: #ffffff; border: 1px solid #777; border-radius: 3px; font-size: 13px; }
table.cc-formgrid input[type=text]:focus { border-color: #f7b400; outline: none; }
table.cc-formgrid input::placeholder { color: #8c8c8c; }
table.cc-formgrid label { cursor: pointer; white-space: nowrap; }
table.cc-formgrid input[type=radio] { vertical-align: -2px; margin: 0 4px 0 0; }
table.cc-formgrid input[type=submit] { height: 28px; padding: 0 14px; margin-top: 2px; }
.cc-uitleg { margin-top: 10px; padding-top: 8px; border-top: 1px solid #555; color: #cfcfcf; font-size: 12px; line-height: 1.6; }
.cc-uitleg-plain { color: #e0e0e0; font-size: 12px; line-height: 1.6; }

/* icoontjes en kluisoverzicht in de kaarten (4-11-2026) */
.cc-kaartkop img, table.cc-formgrid td.cc-lbl img { width: 16px; height: 16px; vertical-align: -3px; margin-right: 7px; }
table.cc-overzicht { width: 100%; border-collapse: collapse; }
table.cc-overzicht td { padding: 6px 0; vertical-align: middle; }
table.cc-overzicht td.cc-ico { width: 60px; padding-right: 12px; }
table.cc-overzicht td.cc-ico img { width: 52px; height: auto; border: 1px solid #222; border-radius: 4px; display: block; }
.cc-lbl2 { color: #cfcfcf; font-size: 12px; }
.cc-waarde { color: #ffffff; font-size: 15px; font-weight: bold; }

/* overzichtslijsten in kaarten (Financieel, 4-11-2026) */
table.cc-lijst { width: 100%; border-collapse: collapse; }
table.cc-lijst td { padding: 6px 0; border-bottom: 1px solid #555; vertical-align: middle; }
table.cc-lijst td img { width: 16px; height: 16px; vertical-align: -3px; margin-right: 8px; }
table.cc-lijst td.cc-bedrag { text-align: right; white-space: nowrap; padding-left: 10px; color: #ffffff; }
table.cc-lijst tr.cc-totaal td { border-bottom: 0; border-top: 2px solid #777; font-weight: bold; padding-top: 8px; }
table.cc-lijst tr.cc-totaal td.cc-bedrag { color: #39de00; }
.cc-grijs { color: #a8a8a8; font-size: 11px; }

/* losse blokken met een eigen kop (Financieel) */
td.cc-blokkop img { width: 16px; height: 16px; vertical-align: -3px; margin-right: 7px; }

/* logboektabellen (4-11-2026) */
tr.cc-logrij td { padding: 6px 8px; vertical-align: middle; }
tr.cc-logrij:hover td { background-color: #4f4f4f; }
.cc-plus { color: #39de00; font-weight: bold; }
.cc-min { color: #ffb27a; font-weight: bold; }
.cc-label { display: inline-block; font-size: 11px; padding: 1px 7px; border-radius: 10px; }
.cc-label-dona { background: #2f5d73; color: #dff3ff; }
.cc-label-schenk { background: #5d4a2f; color: #ffeed6; }
td.cc-leeg { text-align: center; color: #cfcfcf; padding: 14px !important; font-style: italic; }

/* ===== 4-11-2026: menu Informatie (Nieuws, Status, Gevangenis, Eerpunten, Logs, ...) ===== */
img.cc-mini { width: 16px; height: 16px; vertical-align: -3px; margin-right: 6px; }
td.cc-nieuwsitem { border-bottom: 0; }
.cc-nieuwstitel { font-size: 15px; font-weight: bold; color: #ffffff; margin-left: 4px; }
.cc-nieuwstekst { line-height: 1.6; }
.cc-label-nieuws { background: #2f5d73; color: #dff3ff; }
.cc-label-update { background: #5d5a2f; color: #fffbd6; }
.cc-label-informatie { background: #2f5d36; color: #defde3; }
.cc-label-aanpassing { background: #6b3a39; color: #ffe3e2; }
table.cc-lijst td.cc-rechts { text-align: right; padding-left: 10px; color: #ffffff; }
table.cc-lijst td.cc-rechts table { margin-left: auto; }
.cc-rood { color: #ff8f8f; font-weight: bold; }
td.cc-melding { line-height: 1.6; }
table.cc-formgrid input.cc-reflink { max-width: 100%; font-size: 12px; }
table.cc-overzicht td.cc-ico-groot { width: 170px; vertical-align: top; padding-right: 16px; }
table.cc-overzicht td.cc-ico-groot img { width: 160px; }

/* ===== 6-11-2026: DE voortgangsbalk van de site: cc_balk() in includes/_functions.php (zie STIJLGIDS.md) =====
   Zelfde maat en opmaak als de goedgekeurde balk van 4-11-2026: 16px hoog (14px binnenin), donkere rand, afgerond,
   percentage of tekst gecentreerd in wit. Kleur alleen per betekenis. Geldt ook in /app/ (mobile.css past niets aan). */
.cc-balk { position: relative; display: inline-block; vertical-align: middle; box-sizing: border-box; width: 100px; max-width: 100%; min-width: 40px;
	height: 16px; margin: 0; padding: 0; overflow: hidden; background: #2c2c2c; border: 1px solid #141414; border-radius: 8px;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.6); text-align: center; line-height: 14px; }
.cc-balk-breed { display: block; width: 100%; margin: 4px 0 2px; }
.cc-balk-vul { position: absolute; left: 0; top: 0; bottom: 0; max-width: 100%; border-radius: 0; background: linear-gradient(180deg, #74d86f 0%, #3fae3c 55%, #2f8f2e 100%); }
.cc-balk-tekst { position: relative; display: block; padding: 0 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	font: bold 10px/14px Verdana, Arial, sans-serif; color: #ffffff; text-shadow: 0 1px 1px rgba(0,0,0,.8); letter-spacing: 0; }
.cc-balk-groen .cc-balk-vul  { background: linear-gradient(180deg, #74d86f 0%, #3fae3c 55%, #2f8f2e 100%); } /* voortgang, leven */
.cc-balk-goud .cc-balk-vul   { background: linear-gradient(180deg, #ffd45e 0%, #e0a800 55%, #b88600 100%); } /* rank, ster, seizoen */
.cc-balk-rood .cc-balk-vul   { background: linear-gradient(180deg, #c97372 0%, #a3504f 55%, #86403f 100%); } /* leven laag, gevaar */
.cc-balk-oranje .cc-balk-vul { background: linear-gradient(180deg, #f2ab5c 0%, #d9822b 55%, #b5681d 100%); } /* opletten */
.cc-balk-blauw .cc-balk-vul  { background: linear-gradient(180deg, #74bde3 0%, #3f8fbf 55%, #2f6f99 100%); } /* info */
.cc-balk-grijs .cc-balk-vul  { background: linear-gradient(180deg, #9a9a9a 0%, #747474 55%, #5c5c5c 100%); } /* afgerond */
.cc-balk-levels { width: 80%; margin: 10px auto 0; }
.cc-balk-levels .cc-balk { margin: 0; }
td.cc-rechts .cc-balk { vertical-align: middle; }

/* ===== 4-11-2026: wachttijden rechtsboven in de kop (compact, blijft binnen de kop) ===== */
div.counter_view { width: auto !important; height: auto !important; background: rgba(0,0,0,.28) !important; background-image: none !important;
	border: 1px solid rgba(255,255,255,.08); border-radius: 6px; padding: 3px 6px !important; margin: 10px 24px 0 0 !important; box-shadow: none; }
div.counter_view > table > tbody > tr > td { width: auto !important; padding: 1px 2px !important; }
div.counter_view > table > tbody > tr > td > table { background: none; border: 0; border-radius: 0; padding: 0 4px; min-width: 54px; }
div.counter_view > table > tbody > tr > td > table td { padding: 0 1px; vertical-align: middle; font-size: 11px; line-height: 18px; height: 18px; }
div.counter_view img { width: 14px; height: 14px; vertical-align: middle; }
div.counter_view a { color: #7be176 !important; font-weight: bold; }
div.counter_view span[id^="cd"] { color: #ffd257; font-weight: bold; font-variant-numeric: tabular-nums; }

/* ===== 4-11-2026: moderne paginakop (tekstlogo i.p.v. IMG/header_image.jpg) ===== */
td.header.cc-kop { background: linear-gradient(180deg, #3d3d3d 0%, #2b2b2b 100%) !important; background-image: linear-gradient(180deg, #3d3d3d 0%, #2b2b2b 100%) !important; height: 78px; }
td.header.cc-kop > table > tbody > tr > td { vertical-align: middle !important; }
td.cc-logocel { padding: 10px 0 10px 22px !important; white-space: nowrap; text-align: left; }
a.cc-logo { display: inline-block; font: 800 32px/1 "Trebuchet MS", Verdana, Arial, sans-serif; letter-spacing: 1px; color: #f2f2f2 !important;
	text-decoration: none !important; text-shadow: 0 2px 3px rgba(0,0,0,.6); }
a.cc-logo span { color: #f7b400; }
a.cc-logo:hover { text-decoration: none !important; color: #ffffff !important; }
span.cc-logo-sub { display: block; margin-top: 4px; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: #9a9a9a; }
td.header.cc-kop div.counter_view { margin: 0 20px 0 0 !important; float: right; }