/*
https://mdbootstrap.com/docs/standard/tools/design/color-schemes/#
#00efdf
#00d4c6
#00baad
#009f95 navbar-accent
#00857c navbar-bg
#006a63 navbar-border
#00504a navbar-hover-bg
#003532
#001b19
*/

/* BIG TITLE */
#bigtitle {
	}
#bigtitle h1 {
	text-shadow : 2px 2px #000;
	margin : 1rem 0.5rem .75rem 0.5rem
	}

/* NAV */
.navbar-brand {
	font-size      : 1.6rem;
	letter-spacing : 0.1rem;
	margin         : -0.1rem auto;
	}

/* NAV WIDTH */
@media (min-width : 768px) {
	.navbar-nav li.dropdown > ul.dropdown-menu {
		min-width : 260px;
		width     : 260px;
		}
	
	.navbar-nav li.dropdown > ul.dropdown-2 {
		width : 520px;
		}
	
	.navbar-nav li.dropdown > ul.dropdown-3 {
		width : 780px;
		}
	}
@media (min-width : 992px) {
	.nav-link-custom {
		min-width : 117px
		}
	}
@media (min-width : 1200px) {
	.nav-link-custom {
		min-width : 140px
		}
	}
@media (min-width : 1400px) {
	.nav-link-custom {
		min-width : 162px
		}
	}

/* NAV COLOR */
:root {
	/*--custom-bg               : #002855;*/
	/*--custom-bg-rgb           : 0, 40, 85;*/
	/*--custom-border           : #001d3d;*/
	/*--custom-hover-bg         : #00122b;*/
	/*--custom-accent           : #003f88;*/
	
	--custom-bg                 : #00508d;
	--custom-bg-rgb             : 0, 80, 141;
	--custom-border             : #00355e;
	--custom-hover-bg           : #002846;
	--custom-accent             : #0077b6;
	--custom-highlight-bg       : #e07a30;
	--custom-highlight-bg-hover : #c96824;
	
	
	--custom-margin-bottom      : 77px;
	--custom-margin-bottom-md   : 61px;
	
	--gradient-start            : hsl(200, 70%, 40%);
	--gradient-end              : hsl(200, 70%, 80%);
	
	}


.navbar-custom {
	background : var(--custom-bg);
	}
.navbar-custom-flat {
	background : var(--custom-bg) !important;
	}

.navbar-custom-border-top {
	border-top : 1px solid var(--custom-border);
	}

.navbar-custom-border-bottom {
	border-bottom : 1px solid var(--custom-border);
	}

.navbar-footer .nav-link-custom {
	border-right : 1px solid var(--custom-border);
	border-left  : 1px solid var(--custom-accent);
	}

.navbar-nav > .active > a, .navbar-footer a.nav-link-custom:hover {
	background : var(--custom-hover-bg);
	}

.navbar-nav > .highlight > a {
	background : var(--custom-highlight-bg);
	}
.navbar-nav > .highlight > a:hover {
	background : var(--custom-highlight-bg-hover);
	}

.navbar-footer.nav-link-custom-border-left,
.navbar-footer .nav-link-custom-border-left {
	border-left : 1px solid var(--custom-border);
	}

.navbar-custom-margin-bottom {
	margin-bottom : var(--custom-margin-bottom);
	}

@media (min-width : 576px) {
	.navbar-custom-margin-bottom {
		margin-bottom : var(--custom-margin-bottom-md);
		}
	}

@media (min-width : 768px) {
	.navbar-custom {
		background-image : linear-gradient(to bottom, var(--custom-border), var(--custom-accent));
		/*background : var(--custom-accent);*/
		}
	}

@media (min-width : 992px) {
	.nav-link-custom-border-left {
		border-left : 1px solid var(--custom-border);
		}
	
	.nav-link-custom {
		border-right : 1px solid var(--custom-border);
		border-left  : 1px solid var(--custom-accent);
		}
	}

.bg-image-mask {
	text-shadow      : 1px 1px #000;
	background-color : rgba(var(--custom-bg-rgb), 0.75);
	border           : 1px solid var(--custom-border)
	}

.bg-mask {
	background-image : linear-gradient(to bottom, var(--custom-border), var(--custom-accent));
	text-shadow      : 1px 1px #000;
	}

.quote-counter-mask {
	text-shadow : 2px 2px #000;
	background  : linear-gradient(0deg, var(--custom-border), var(--custom-accent) 100%);
	}