@font-face {
			font-family: 'theboldfont';
			src: url('../fonts/theboldfont.ttf') format('truetype');
		}

		@font-face {
			font-family: 'Roboto, Helvetica, Arial, Lucinda';
			/*src: url('../fonts/Raphtalia DEMO.ttf') format('truetype');*/
		}

		:root {
					--bsc_blue: #77C6EC;
					--bsc_burgandy: #D82189;
					--bsc_yellow: #F2BB1E;
					--bsc_purple: #8400ad;
					--bsc_grey: #686868;
					--bsc_black: #000000;
					--bsc_white: white;
				}

			* {
				margin: 0;
				padding: 0;
				}

		html, body {
					background-color: var(--bsc_blue);
					box-sizing: border-box;
					height:100%;
					margin:0,0,0,0;
					padding: 0,0,0,0;
					}

		button, input[type="button"], input[type="submit"] { 
					background-color:var(--bsc_burgandy); 
					border:2px solid; 
					border-color: var(--bsc_yellow); 
					color:var(--bsc_yellow); 
					cursor:auto;
					font-family:'Roboto',Helvetica,Arial,Lucida,sans-serif;
					font-weight:bold;
					height:25px;
					text-align:center;
		} 

		button:disabled, input[type="button"]:disabled, input[type="submit"]:disabled, input:disabled{ 
					background-color:var(--bsc_white); 
					border:1px dashed; 
					border-color: var(--bsc_yellow); 
					color:var(--bsc_yellow); 
					cursor:none;
					font-family:'Roboto',Helvetica,Arial,Lucida,sans-serif;
					font-weight:lighter;
					height:25px;
					text-align:center;
		}

			.container {
				height: 100%;
				display: grid;
				/*grid-gap: 3px; */
				grid-template-columns: repeat(12, 1fr);
				grid-template-rows: 40px 105px minmax(600px ,auto) 20px;
				justify-content:center;
			}


			.titleHeaderSpacer {
				background-color: var(--bsc_burgandy);
				color:var(--bsc_white);
				grid-column: 1 / 2;
				grid-row: 1 / 1;
			}

			.titleHeader {
				align-items:center;
				background-color: var(--bsc_burgandy);
				color:var(--bsc_white);
				display:flex;
				font-family:'Roboto',Helvetica,Arial,Lucida,sans-serif;
				font-size:18px;
				font-weight:bold;
				grid-column: 2 / 11;
				grid-row: 1 / 1;
				justify-content:center;
			}

			.titlePlatform {
				align-items:center;
				background-color: var(--bsc_burgandy);
				color:var(--bsc_white);
				display:flex;
				font-family:'Roboto',Helvetica,Arial,Lucida,sans-serif;
				font-size:10px;
				grid-column: 11 / 11;
				grid-row: 1 / 1;
				/*justify-content:center;*/
			}

			.titleVersion{
				align-items:center;
				background-color: var(--bsc_burgandy);
				color:var(--bsc_white);
				display:flex;
				font-family:'Roboto',Helvetica,Arial,Lucida,sans-serif;
				font-size:10px;
				grid-column: 12 / 12;
				grid-row: 1 / 1;
				justify-content:center;
			}


			/*.logoHeader {
				background-color: var(--bsc_white);
				display:flex;
				grid-column: 3 / -1;
				grid-row: 2/2;
			}*/

			.logoSpacer {
				background-color: var(--bsc_white);
				/*display:flex;*/
				grid-column: 1 /1;
				grid-row: 2/2;
			}

			.logoImage {
				background-color: var(--bsc_white);
				/*display:flex;*/
				grid-column: 2 /6;
				grid-row: 2/2;
				height:100%;
			}

			.logoMiddleSpacer {
				background-color: var(--bsc_white);
				/*display:flex;*/
				grid-column: 6 /11;
				grid-row: 2/2;
			}

			.userName {
				align-items:center;
				background-color: var(--bsc_white);
				color:var(--bsc_burgandy);
				display:flex;
				font-family:'Roboto',Helvetica,Arial,Lucida,sans-serif;
				font-size:16px;
				font-weight:bold;
				grid-column: 10 / 12;
				grid-row: 2/2;
				justify-content:flex-end;
				padding-right:5px;
			}

			.userLoginStatusControl {
				align-items:center;
				background-color: var(--bsc_white);
				color:var(--bsc_burgandy);
				display:flex;
				font-family:'Roboto',Helvetica,Arial,Lucida,sans-serif;
				font-size:16px;
				font-weight:bold;
				grid-column: 12 / 12;
				grid-row: 2/2;
				justify-content:flex-end;
				padding-right:45px;
			}

			.menu {
				display:flex;
				grid-column-start:1;
				grid-column-end:-1;
					}

			.content {
				/*display:grid;*/
				grid-column: 2 / -1;
				grid-row:3 / 3;
				/*grid-template-columns: repeat(11,1fr);*/
				/*height:100%;*/
				padding-top: 15px;
				padding-bottom: 5px;
			}

			.PageContent {
				display:grid;
				grid-column: 2 / -1;
				grid-gap: 5px 10px;
				grid-row:3 / 3;
				grid-template-columns: repeat(12,1fr);
				/*height:100%;*/
				/*padding-top: 15px;
				padding-bottom: 5px;*/
			}


			.footer {
				align-items:center;
				background-color: var(--bsc_purple);
				color:var(--bsc_white);
				display:flex;
				font-family:'Roboto',Helvetica,Arial,Lucida,sans-serif;
				grid-column: 1 / -1;
				grid-row: -1 / -1;
				justify-content:center;
			}