/* CSS Document */
:root {
	/* ----------------------------------------------------------------------------------------------
	Variables
----------------------------------------------------------------------------------------------*/

	--color-main-text-100: rgba(50,50,50,1.0);
	--color-main-text-75: rgba(101,101,101,1.0);
	--color-main-text-66: rgba(120,120,120,1.0);
	--color-main-text-50: rgba(152,152,152,1.0);
	--color-main-text-33: rgba(187,187,187,1.0);
	--color-main-text-25: rgba(204,204,204,1.0);
	--color-main-text-10: rgba(234,234,234,1.0);
	--color-main-text-0: rgba(256,256,256,1.0);
	--color-dark-text-0: rgba(256,256,256,1.0);
	--color-highlight-100: rgba(2,103,144,1.0);
	--color-highlight-t75: rgba(2,103,144,0.75);
	--color-highlight-75: rgba(66,141,172,1.0);
	--color-highlight-t66: rgba(2,103,144,0.66);
	--color-highlight-66: rgba(89,155,182,1.0);
	--color-highlight-t50: rgba(2,103,144,0.5);
	--color-highlight-50: rgba(129,179,199,1.0);
	--color-highlight-t33: rgba(2,103,144,0.33);
	--color-highlight-33: rgba(172,205,218,1.0);
	--color-highlight-t25: rgba(2,103,144,0.25);
	--color-highlight-25: rgba(192,217,227,1.0);
	--color-highlight-t10: rgba(2,103,144,0.1);
	--color-highlight-10: rgba(229,240,244,1.0);
	--color-highlight-t0: rgba(2,103,144,0.0);
	--color-highlight-0: rgba(256,256,256,1.0);
	--color-dark-100: rgba(64,64,64,1.0);
	--color-dark-t75: rgba(64,64,64,0.75);
	--color-dark-75: rgba(112,112,112,1.0);
	--color-dark-t66: rgba(64,64,64,0.66);
	--color-dark-66: rgba(129,129,129,1.0);
	--color-dark-t50: rgba(64,64,64,0.50);
	--color-dark-50: rgba(159,159,159,1.0);
	--color-dark-t33: rgba(64,64,64,0.33);
	--color-dark-33: rgba(192,192,192,1.0);
	--color-dark-t25: rgba(64,64,64,0.25);
	--color-dark-25: rgba(207,207,207,1.0);
	--color-dark-t10: rgba(64,64,64,0.1);
	--color-dark-10: rgba(236,236,236,1.0);
	--color-dark-t0: rgba(64,64,64,0.0);
	--color-dark-0: rgba(256,256,256,1.0);
	--color-black: #000000;
	--color-white: #FFFFFF;
	--color-red: #FF0000;
	--color-lime: #00FF00;
	--color-blue: #0000FF;
	--color-yellow: #FFFF00;
	--color-cyan: #00FFFF;
	--color-magenta: #FF00FF;
	--color-gray: #808080;
	--color-silver: #C0C0C0;
	--color-orange: #FFA500;
	--color-pink: #FFC0CB;
	--color-purple: #800080;
	--color-brown: #A52A2A;
	--color-green: #008000;
	--color-navy: #000080;
	--color-olive: #808000;
	--color-teal: #008080;
	--color-maroon: #800000;
	--color-light-gray: #D3D3D3;
	--color-dark-gray: #A9A9A9;
	--background-dark: linear-gradient(to right, var(--color-dark-100), var(--color-dark-100), var(--color-dark-100), var(--color-dark-100), var(--color-dark-75), var(--color-dark-66) );
	--background-dark-trans: linear-gradient(to right, var(--color-dark-t50), var(--color-dark-t50), var(--color-dark-t50), var(--color-dark-t50), var(--color-dark-t25), var(--color-dark-33) );
	--background-mid: linear-gradient(to bottom right, var(--color-dark-25), var(--color-dark-10), var(--color-dark-10) );
	--background-light: linear-gradient(to bottom left, var(--color-highlight-t25), var(--color-highlight-t10), var(--color-highlight-t10), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0)), radial-gradient(circle 45vh at -15vh 70%, var(--color-dark-t25), var(--color-dark-t10), var(--color-dark-t0));
	--background-light-sml: linear-gradient(to bottom left, var(--color-highlight-t25), var(--color-highlight-t10), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0), var(--color-highlight-t0)), radial-gradient(circle 45vh at -25vh 70%, var(--color-dark-t25), var(--color-dark-t10), var(--color-dark-t0));
	font-size: 16px;
	
	--branded-text-color: #fff;
	--branded-link-color: #fff;
	--branded-background: var(--background-dark);
	--header-footer-border: 1px;

}

.enciana-ai-avatar {
	background-image:url(../images/ai-avatar.png);
}


*{
	font-family: Segoe UI, Verdana, Arial, Helvetica, sans-serif;
}


body {
	background: var(--background-light-sml);
	background-size: cover;
	background-repeat: no-repeat;
	line-height: 1.5;
}
	
	.header-navigation a:-webkit-any-link {
		color: var(--branded-text-color) !important;
		text-decoration: none !important;
	}
		
	a:-webkit-any-link {
		color: var(--color-main-text-50) !important;
		text-decoration: none !important;
	}
	
h1 {
	color: var(--color-main-text-75);
}

.content > h1 {
	margin-bottom: 0;
}

.content-heading > h1 {
	margin-bottom: 0;
}

.header {
    background: var(--background-dark);
	border-bottom-width: 5px;
	border-bottom-color: var(--color-dark-75);
}

.header.home {
	background: var(--background-dark-trans);
	border-bottom-width: 0px;
	border-bottom-color: var(--color-dark-75);
	min-height:0;
}

.logo {
	aspect-ratio: 678 / 172 !important;
}

.header-logo {
	width: 10em;
}

.header-bar {
	padding: 1.5em;
}

.header-bar.home {
	padding: 0.5em;
	padding-left:1.5em;
	max-width: 1400px;
	margin-left: auto;
	margin-right: auto;
}

.footer {
    background: var(--background-mid);
}

.footer-bar {
    background: var(--background-dark);
	border-bottom-width: 5px;
	border-bottom-color: var(--color-dark-75);
}

.sitemap {
	padding-top: 1.5em;
	padding-bottom: 3.5em;
}

.sitemap-links {
	font-size: 0.8em;
	color: var(--color-main-text-75);
	text-decoration: none !important;
	
}

.sitemap-link
.sitemap-link:hover,
.sitemap-link:visited,
.sitemap-link:active {
	font-size: 0.8em;
	color: var(--color-main-text-75);
	text-decoration: none !important;
}

.sitemap-links > h1 {
	font-size: 1.2em;
	color: var(--color-main-text-50);
	
}

.sitemap-logo {
	width: 11em;
}

.sitemap-info {
	font-size: 0.8em;
	color: var(--color-main-text-75);
}

.hero-image {
	border: solid 1px var(--color-main-text-50);
	border-bottom-left-radius: 1em;
	border-bottom-right-radius: 1em;
	background-image:url(../images/main.png);
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	height:25vh;
	width:99vw;
	max-height:600px;
}

.content-image {
	border: solid 0px var(--color-main-text-50);
	border-radius: 1em;
	width:100%;
	margin: auto;
}



.grid-row-1-1 {
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
}
  

.grid-cell {
	margin: 0em;
	padding: 0rem;
	border-radius: 0.25em;
	border-bottom-left-radius: 1em;
	border-top-right-radius: 1em;
	text-align: center;
}

.grid-cell > p {
	align-self: center;
	vertical-align: center;
	font-size: 1.5em;
	margin-left: 1em;
	margin-right: 1em;
}

.grid-cell.highlight {
	background-color: var(--color-highlight-100);
	color: var(--color-dark-text-0);
	border-bottom: solid 5px #026790;
	border-right: solid 5px #026790;
	border-top: solid 5px #ccc;
	border-left: solid 5px #ccc;
	background: linear-gradient(rgba(23, 86, 162, 1.0), rgba(23, 86, 162, 0.5));
	background: linear-gradient(rgba(2, 103, 144, 1.0), rgba(2, 103, 144, 0.5));
	min-height: 9em;
}

	
	.navigation-options.responsive {
		background: var(--background-dark);
	}
	
	.navigation-options.responsive a.menu-option,
	.navigation-options.responsive a.dropdown-option{
		line-height: 3em;
	}

	
	.header {
		background: var(--branded-background);
		border-bottom-width: var(--header-footer-border);
		border-bottom-color: var(--branded-background-color);
	}
	
	.header.home {
		background: var(--brand-color-main);
		border-bottom-width: 0px;
		border-bottom-color: var(--branded-background-color);
		min-height:0;
	}


	.header-navigation a{
		font-weight: 400;
	}

	.menu-option{
		margin-left: 2rem;
		font-size: 1.0em;
		
	}
	
	.dropdown-option{
		line-height: 2em;
		margin-top:-1px;

	}
	
	.icon{
		font-size:2em;
		
	}


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

}

@media only screen and (min-width: 250px) {

}

@media only screen and (min-width: 320px) {

.header-logo {
	width: 11em;
}

}

@media only screen and (min-width: 360px) {

.header-logo {
	width: 13em;
}

}

@media only screen and (min-width: 375px) {
	
.header-logo {
	width: 15em;
}

}

@media only screen and (min-width: 385px) {

}

@media only screen and (min-width: 390px) {

}

@media only screen and (min-width: 414px) {

}

@media only screen and (min-width: 527px) {

}

@media only screen and (min-width: 640px) {
	
body {
	background: var(--background-light);
	background-size: cover;
	background-repeat: no-repeat;
}

}

@media only screen and (min-width: 768px)  {
.hero-image {
	height:50vh;
}
}

@media only screen and (min-width: 1024px) {

.grid-cell {
	margin: 1em;
	padding: 1.5rem;
}

}

@media only screen and (min-width: 1366px) {

}

@media only screen and (min-width: 1440px) {

}

@media only screen and (min-width: 1680px) {

}

@media only screen and (min-width: 1920px) {

}

@media only screen and (min-width: 2560px)  {

}