@import url('https://fonts.googleapis.com/css?family=Roboto:400,700,900&display=swap');

/* Globals */
html {overflow-y:scroll;}
html, body {height:100%;}
body {
	display:flex;
	flex-direction:column;
	font-family:'Roboto', sans-serif;
	color:#4c838b;
	background-color:#eee;
}

a, button {transition:all 0.50s;}
a:hover {text-decoration:none;}
label {font-weight:700;}
label,
input[type='text'],
input[type='email'] {width:100%;}
.hidden {display:none;}
.disabled {cursor:not-allowed!important;}
.btn,
.form-control {border-radius:0;}
.red {background:lightsalmon!important;}
.blue {background:lightblue!important;}
.green {background:lightgreen!important;}

h1, h2, h3, h4, h5, h6 {color:#48949f; font-weight:700;}

.header-title h1,
.header-title h2,
.header-title h3,
.header-title h4,
.header-title h5,
.header-title h6 {color:#7dabbd; font-weight:900;}



/* ------------------------------ */

/* Content Styles */
header, footer {background:#b9d8e4; padding:20px;}

header, header a,
footer, footer a {color:#4c838b;}
header a, footer a {display:inline-block; padding:5px 10px; background-color:rgba(76, 131, 139, 0.20);}
header a:hover, footer a:hover {color:#000; background-color:rgba(76, 131, 139, 0.40);}

header .logo {font-size:30px;}
header .logo a {font-weight:bold; letter-spacing:1px;}

header #controls {font-size:20px;}

header #location-display-text {border-bottom:5px solid rgba(255, 255, 255, 0.5); transition:all 0.50s; padding-left:10px; padding-right:10px; position:relative; background:rgba(255, 255, 255, 0.1);}
header #location-display-text:hover {cursor:pointer; background:rgba(255, 255, 255, 0.2);}
 
footer {font-size:25px; flex-shrink:0;}
footer .row {width:100%;}

#content {flex:1 0 auto;}

.card {/*background-color:transparent; border:0;*/}

.card h3 {font-size:25px;}

.header-title {background-color:rgba(76, 131, 139, 0.10);}

/* ------------------------------ */

/* Helper Styles */

/* Add-on: Bootstrap 4, hidden-{breakpoint}-{up/down} */
/* taken from Bootstrap 4, alpha 6 */
.hidden-xs-up {display:none!important;}
@media (max-width:575px)	{ .hidden-xs-down {display:none!important;}	}
@media (min-width:576px)	{ .hidden-sm-up {display:none!important;}	}
@media (max-width:767px)	{ .hidden-sm-down {display:none!important;}	}
@media (min-width:768px)	{ .hidden-md-up {display:none!important;}	}
@media (max-width:991px)	{ .hidden-md-down {display:none!important;}	}
@media (min-width:992px)	{ .hidden-lg-up {display:none!important;}	}
@media (max-width:1199px)	{ .hidden-lg-down {display:none!important;}	}
@media (min-width:1200px)	{ .hidden-xl-up {display:none!important;}	}
.hidden-xl-down {display:none!important;}

/* Add-on: Bootstrap 4, hidden-{breakpoint} */
/* taken from Bootstrap 3.3.6, converted to Bootstrap 4 */
@media (max-width:575px)	{ .hidden-xs {display:none!important;} }
@media (min-width:576px) and (max-width:767px)	{ .hidden-sm {display:none!important;} }
@media (min-width:768px) and (max-width:991px)	{ .hidden-sm {display:none!important;} }
@media (min-width:992px) and (max-width:1199px)	{ .hidden-md {display:none!important;} }
@media (min-width:1200px)	{ .hidden-lg {display:none!important;} }

/* ------------------------------ */

/* Select2 styles */

.select2-selection {border-radius:0;}
.select2-results__option--highlighted {background-color:rgba(0, 0, 0, 0.20)!important; color:#eee!important;}

.select2-dropdown,
.select2-container--default .select2-selection--single,
.dropdown .dropdown-menu {background-color:rgba(255, 255, 255, 0.60);}

.select2-dropdown,
.dropdown .dropdown-menu {backdrop-filter:blur(4px); border-radius:0; border:0;}

.select2-dropdown .select2-results__option,
.dropdown .dropdown-item {line-height:30px; color:#555; padding:5px 10px;}

.select2-dropdown .select2-results__option:hover,
.dropdown .dropdown-item:hover {background-color:rgba(0, 0, 0, 0.07); color:#000;}

/*#location-display-text .select2-container {display:none!important;}
#location-display-text .select2-container.show {display:block!important;}*/

/* ------------------------------ */

/* Scrollbar Styles */
body::-webkit-scrollbar			{background-color:#ddd; width:10px;}
body::-webkit-scrollbar-track	{background-color:#ddd;}
body::-webkit-scrollbar-thumb	{background-color:#aaa;}
body::-webkit-scrollbar-button	{display:none;}