<dashboard version="1.1" theme="light" hideTitle="true">
	<!-- Author: Tom de Bruijn ... or uhm... AI... chatGPT/DALL-E !-->
	<!-- LinkedIn: https://www.linkedin.com/in/tcdebruijn/ !-->
	<!-- Prompt 1 : generate the header !-->
	<row>
		<panel>
			<html>
				<style>
					/* set panels to transparent */
					.dashboard-row .dashboard-panel {
						background-color: transparent;
						margin-top: 0;
					}
					/* set top bar header to 0 */
					.dashboard-header {
					  	min-height: 0px;
					}
					/* set padding beteween html rows to 0 */
					.dashboard-row .dashboard-panel .panel-body.html, .dashboard-row .dashboard-panel .panel-body.splunk-html {
						padding: 0px;
					}
					.header-container {
						border-radius: 10px; /* Rounded corners */
						display: flex;
						justify-content: space-between;
						align-items: center;
						background-color: white;
						padding: 20px;
					}
					.header-left, .header-right {
						display: flex;
						flex-direction: column;
						align-items: center;
					}
					.header-left {
						align-items: flex-start;
					}
					.header-right {
						align-items: flex-end;
						padding-right: 20px;
					}
					.company-name {
						color: #575756;
						font-size: 48px;
						font-weight: bold;
						padding-bottom: 12px;
						padding-right: 80px;
					}
					.company-tagline {
						color: #ABABAB;
						font-size: 26px;
					}
					.data-text {
						color: #575756;
						font-size: 24px;
						font-weight: bold;
						margin-left: 20px;
					}
					.img-logo {
				  	display: inline-block; /* Display images inline */
				  	margin-right: 10px;    /* Spacing between images */
					}
					.img-logo:last-child {
				  	display: inline-block; /* Display images inline */
				  	margin-right: 10px;    /* Spacing between images */
				  	margin-left: 25px; /* No left margin for the first tile */
					}
					.data-text .separator_1 {
						margin-left: 10px;
						margin-right: 10px;
						color: #F39201;
					}
					.data-text .separator_2 {
						margin-left: 5px;
						margin-right: 5px;
						color: #F39201;
					}
				</style>
				<div class="header-container">
					<div class="header-left">
						<div class="img-logo">
					  	<!-- Prompt Optional : Generated Images !-->
					  	<img src="/static/app/search/Data.png" width="100px" height="100px" alt="Data - DALL E Generated - Tom de Bruijn" />
					  	<img src="/static/app/search/DevOps.png" width="100px" height="100px" alt="DevOps - DALL E Generated - Tom de Bruijn" />
					  	<img src="/static/app/search/Development.png" width="100px" height="100px" alt="Development - DALL E Generated - Tom de Bruijn" />
						</div>
						<span class="data-text">Data   <span class="separator_1"> | </span> DevOps <span class="separator_2"> | </span> Development</span>
					</div>
					<div class="header-right">
						<span class="company-name">CINQ ICT</span>
						<span class="company-tagline">Net iets meer | net iets anders</span>
					</div>
				</div>
			</html>
		</panel>
	</row>
</dashboard>