body {
			margin: 0;
			font-family: Montserrat, Arial, Helvetica, sans-serif;
		}

		h1, h2, h3 { color: rgb(0,143,252); font-weight:600; }

		header {
			margin-bottom: 20px;
			position: fixed;
			z-index: 9999;
			width: 100%;
			background: white;
		}
		header h1 {
			display: inline-block;
			vertical-align: top;
			margin: 0;
			margin-left: 30px;
			padding-top: 10px;
			font-size: 40px;
		}

		.current_user {
		}

		.tagline { margin: 0; margin-left: 5px; color: rgb(0,143,252); }

/*		#content { padding: 20px; padding-top: 105px; } */

		#fullscreen-container { overflow-y: auto; }

		#logo {
			max-height: 60px;
		}

		#logo-block { display: inline-block; }

		#top-buttons {
			float: right;
		}

		#top-buttons button {
			background: #ccc;
			border-radius: 5px;
			border: solid 1px #ccc;
			display: inline-block;
			padding: 6px;
			margin: 5px;
		}

		#top-buttons button.page-specific {
			background: rgb(0,143,252);
			color: white;
		}

		#top-buttons-mobile {
			display: none;
			position: fixed;
			right: 15px;
			top: 15px;
		}

		#top-buttons-mobile img {
			width: 32px;
		}

		.button-block .hamburger {
			width: 32px;
			display: none;
		}

		.button-block button {
			background: #ccc;
			border-radius: 5px;
			border: solid 1px #ccc;
			display: inline-block;
			padding: 6px;
			margin: 5px;
		}

		.button-block.mobile-active .button-list {
			position: fixed;
			z-index: 99999;
			right: 0;
			top: 100px;
			background: #ccc;
			overflow: hidden;
		}

		.button-block.mobile-active .button-cover {
			position: fixed;
			z-index: 99998;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
		}

/*		.mobile-button-block img { display: none; } */

		.button-block.mobile-active button {
			display: block;
			text-align: center;
			font-size: 20px;
			width: 100%;
			background: rgb(0,143,252);
			color: #fff;
			padding: 10px;
			border: none; /* solid 1px white; */
			min-width: 200px;
			margin: 0;
			border-radius: 0;
		}

		#mobile-menu {
			display: none;
			position: fixed;
			right: 0;
			top: 0;
			background: white;
		}

		#mobile-menu button {
			display: block;
			text-align: right;
			font-size: 20px;
			width: 100%;
			background: #888;
			color: #fff;
			padding-top: 15px;
			padding-bottom: 15px;
			padding-left: 40px;
			padding-right: 20px;
			border: none; /* solid 1px white; */
		}

		#mobile-menu button.page-specific {
			background: rgb(0,143,252);
		}

		#mobile-menu .current_user {
			padding: 5px;
			color: #fff;
			display: block;
		}

		#users-table-wrapper, #site-table-wrapper, #groups-table-wrapper {
			max-height: 600px;
			overflow:auto;
		}

		#users-table, #site-table, #groups-table {
			margin: 10px;
			border-collapse: collapse;
		}

		#users-table td, #users-table th, #groups-table th, #groups-table td, #site-table td, #site-table th { padding: 5px; vertical-align:top;}
		#site-table td, #site-table th { border-top: solid 1px #ccc; }

		.table-header-row { background: #ccc; }

		.site-param {
			max-width: 500px;
			overflow-wrap: break-word;
			font-size: 12px;
		}

		#site-param-editor {
			width: 500px;
			min-height: 300px;
			max-height: 500px;
			overflow: auto;
		}

		.page-buttons {
			float: right;
			padding-right: 30px;
			padding-top: 20px;
		}
		.page-buttons button {
			background: #ccc;
			border-radius: 5px;
			border: solid 1px #ccc;
			display: inline-block;
			padding: 6px;
			margin: 5px;
		}

		.scrolltable thead { background: rgb(0,143,252); font-weight:600; color: #fff; }
		.scrolltable th, .scrolltable td { padding: 5px; }

		body, h1, h2, h3, h4, h5, h6 { margin: 0; }

		header { position: fixed; width: calc(100% - 16px); padding: 8px; padding-top:10px; top:0; }

		#mainsection { position: fixed; top: 120px; height: calc(100% - 116px); overflow: auto; width:calc(100% - 16px); margin: 8px; }

		.big_button {
			vertical-align: top;
			text-decoration: none;
			text-align: center;
			width: 150px;
			height: 90px;
			background: rgb(0,143,252);
			color: white;
			padding: 30px;
			border-radius: 10px;
			box-shadow: 10px 10px 10px #888;
			font-size: 16px;
			margin: 10px;
			display: inline-flex;
			justify-content: center;
			align-items: center;
		}

		.back-button { vertical-align: middle; }

		@media screen and (max-device-width: 480px) and (orientation: portrait){
			.current_user { font-size: 11px; }
			.tagline { font-size: 11px; }
			#mainsection { top: 85px ! important; height: calc(100% - 85px) ! important; }
			
			#top-buttons-mobile { display: block ! important; }
			#top-buttons { display: none; }

			header hr { margin: 4px; }
			header .logo-block .tagline { display: none; }

			.big_button_block {
				text-align: center;
			}
			.big_button_block .big_button {
				width: 80%;
				height: 60px;
				font-size: 20px;
			}

			.button-block button {
				display: none ! important;
			}
			.button-block.mobile-active .button-list button {
				display: block ! important;
			}
			.button-block .hamburger {
				display: block;
			}
			
			.scrolltable th, .scrolltable td { padding: 3px; font-size: 12px; }

			.popup { max-width: 300px; overflow: hidden; }

			.scrolltable { width: 100%; }

			.popup ul.menu li {
				font-size: 16px;
				line-height: 20px;
			}

			.popup {
				color: white;
				background: rgb(0,143,252);
				box-shadow: none;
				word-wrap: break-word;
				overflow-y: auto;
			}

			.mobile-unimportant {
				font-size: 80%;
				word-wrap: break-word;
			}
			.mobile-span-3 {
				max-width: 80px;
			}
		}