@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

		body{
			background-color: rgb(50, 50, 50);
			margin: 0 auto;
			max-width: 700px;
			font-family: "Open Sans", sans-serif;
			font-size: 24px;
			color: white;
		}

		/* Login */
		form{
			display: flex;
			align-items: center;
			justify-content: center;
		}
		.login{
			display: flex;
			flex-direction: column;
			padding: 10px;
			margin: 20px 0 20px 0;
			max-width: 70%;
			background-color: rgb(66, 78, 85);
		}
		.login .message{
			font-size: 15px;
			text-align: center;
			color: rgb(255, 41, 41);
		}
		.login .info{
			text-align: center;
			margin-top: 20px;
			font-size: 15px;
		}
		.login input{
			margin: 5px 0 5px 0;
			font-size: 15px;

		}
		.login button{
			margin: 5px 0 5px 0;
			font-size: 15px;
		}


		/* Header */
		.header{
			display: flex;
			background-color: rgb(127, 31, 31);
		}
		.header .logo{
			padding: 7px 0px 0px 15px;
		}
		.header .title{
			padding: 12px 0px 0px 15px;
            font-size: 17px;
            align-items: center;
  			justify-content: center;
		}
		.header h1{
			font-family: arial, sans-serif;
			font-size: 18px;
			font-weight: normal;
			margin-top: 0px;
			margin-bottom: 1px;
		}
		.header h2{
			font-family: arial, sans-serif;
			font-size: 10px;
			font-weight: normal;
			margin-top: 0px;
			margin-bottom: 0;
		}
		.header .linkstate{
			margin-left: auto;
			padding: 8px 10px 0 0;
		}
		.header .menu{
			margin-left: auto;
		}

		/* Tabs */
		.tabs {
			display: flex;
			flex-wrap: wrap;
		}
		.tabs label{
			order: 1;
			display: flex;
			width: 33.33%;
			padding: 15px 0 15px 0;
            background: rgb(127, 31, 31);
			font-size: 12px;
			text-align: center;
			align-items: center;
			justify-content: center;
			border-top-style: solid;
			border-bottom-width: thin;
			border-top-color: rgb(110, 8, 8);
		}
		@media only screen and (max-width: 360px) {
			.tabs .title {
			  width: min-content;
			}
		}
		.numcircle{
			display: none;
			width: 13px;
			height: 13px;
			line-height: 13px;
			border-radius: 50%;
			text-align: center;
			font-size: 8px;
			margin-left: 10px;
			color: rgb(127, 31, 31);
			border: 2px solid rgb(255, 255, 255);
			background: rgb(255, 255, 255);
		}
		.tabs .panel{
			order: 90;
			flex-grow: 1;
			width: 100%;
			display: none;
			background: rgb(50, 50, 50);
		}
		.tabs input[type="radio"] {
			display: none;
		}
		.tabs input[type="radio"]:checked + label {
			font-weight: bold;
			}
		.tabs input[type="radio"]:checked + label + .panel {
			display: block;
		}


		/* Items */
        .item {
            margin: 7px 5px 0px 5px;
            background-color: rgb(66, 78, 85);
	    	display: flex;
			flex-direction: row;
        }
        .status {
            float: left;
            padding: 3px;
            box-sizing: border-box;
        }
        .s0 {
            background-color: #ff704d;
        }

        .s1 {
            background-color: #00ff00;
        }

        .s2 {
            background-color: #009933;
        }

        .s3 {
            background-color: #FFD700;
        }

        .s4 {
            background-color: #FF0000;
        }

        .s5 {
            background-color: #8c8c8c;
        }

        .s6 {
            background-color: #606060;
        }

        .s7 {
            background-color: #E9967A;
        }

        .s8 {
            background-color: #D69E95;
        }

        .s9 {
            background-color: #D6D6D6;
        }

		.item_na {
			background-color: rgb(66, 78, 85);
			margin: 7px 0 4px 0;
			text-align: center;
			font-size: 17px;
		}

		.item_text{
			float: left;
			padding-left: 8px;
		}
		.item_name{
			box-sizing: border-box;
            font-weight: bold;
			font-size: 15px;
		}

		.item_prop{
			display: flex;
			flex-direction: row;
			box-sizing: border-box;
			font-size: 15px;
		}

		.item_prop_div{
			margin: 0 5px 0 5px;
		}

		.item_opta{
		}

		.item_timesp{
		}
		
		.status_num{
            font-size: 20px;
			text-align: center;
            width: 30px;
			background-color: rgb(93, 104, 110);
			margin: 8px 20px 8px 5px;
			margin-left: auto;
		}
    
    
    .mission {
		}
    
    .mission .heater{
			background-color: rgb(179, 129, 21);
			border-top-left-radius: 8px;
			border-top-right-radius: 8px;
			margin: 7px 0 0 0;
      color: rgb(38, 41, 43);
      font-weight: bold;
			text-align: center;
			font-size: 17px;
		}
    
    .mission .body{
      background-color: rgb(117, 84, 11);
      padding: 1px 0 4px 0;
		}

		
		footer {
			background-color: rgb(127, 31, 31);
			font-family: Helvetica, Arial, Geneva, sans-serif;
			text-align: center;
			font-size: 10px;
			margin-top: 5px;
			padding: 3px 0 3px 0;
			margin-bottom: auto;
		}