body, html { height: 100%; margin: 0; font-family: Arial; } .wrapper { height: 100%; display: flex; flex-direction: column; margin: 0; } .tci { flex-grow: 1; border: none; margin: 0; padding: 0; } .footer { } table, th, td { border: 1px solid black; border-collapse: collapse; background-color: #ddd } td#caption { text-align: center; background-color: #aaa; font-weight: bold; } td#sfreq { background-color: #ccc; } .tab { overflow: hidden; border: 1px solid #ccc; } .tab button { background-color: inherit; float: left; border: none; outline: none; cursor: pointer; padding: 10px 10px; width: 16vw; transition: 0.3s; } .tab button:hover { background-color: #ddd; } .tab button.active { background-color: #ccc; } .content { display: flex; flex: 1; flex-direction: column; overflow: auto; height: 100%; } .tabcontent { display: none; flex: 1; padding: 6px 12px; border: 1px solid #ccc; border-top: none; flex-direction: column; overflow: auto; } html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center; } h1{ color: #0F3376; font-size: 24px } p{ font-size: 1.5rem; } .canberemoved_button { display: inline-block; background-color: #008CBA; border: none; border-radius: 4px; color: white; padding: 16px 40px; text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer; } .button2 { background-color: #f44336; } .save { background-color: #0F3376; border: black; border-width: 1; color: white; padding: 8px 30px; text-align: center; text-decoration: none; display: block; font-size: 14px; margin: 0 } .ctlbtn { background-color: #ccc; border: black; border-width: 1; color: black; padding: 4px 30px; text-align: center; text-decoration: none; display: block; margin: 2; font-size: 4vh; } .update { margin: 0; display: block; }