
table {
  border-collapse: collapse; /* This ensures that adjacent borders merge into one black line. */
  border: 2px solid black; /* Sets the border for the entire table. */
}

table th, table td {
  border: 2px solid black; /* Sets the border for table headers and table data cells. */
}

.tableGrid{
  text-align: center;
  background-color: rgb(231, 255, 231);
}

#tab1container{
  width: 400px;
  float: left;
}

#switchType{
  width: 300px;
  height: 130px;
  position: absolute;
  top: 0;
  left: 0;
  margin: 10px;
  background-color: lightblue;
  border: 2px solid black;
  padding: 10px;
  color: blue;
}

#showfuturescene{
  background-color: lightblue;
  width: 650px;
  float: left;
  margin-left: 450px;
  margin-top: 30px;
  position: fixed;
  border-radius: 20px;
  border-width: 2px;
  border-color: black;
  border-style: solid;
  cursor: all-scroll;
  padding: 30px;
}

#upreference{
  width: 600px;
  float: left;
  margin-left: 450px;
  position: fixed;
}

.challengeboxes{
  background-color: lightblue;
  margin-top: 10px;
  width: 400px;
  height: 200px;
}

/* .shadow {
-webkit-border-radius: 0% 0% 100% 100% / 0% 0% 8px 8px;
-webkit-box-shadow: rgba(0, 0, 0,.30) 0 2px 3px;
} */

.outercontainer{
  height: 350px;
  width: 400px;
  margin-top: 30px;
}

.outercontainerstep4{
  height: 150px;
  width: 400px;
  margin-top: 30px;
}

.container {
  height: 300px;
  width: 400px;
  background: #F2F2F2;
  border: 1px solid #ccc;
  box-shadow: 1px 1px 2px #fff inset,
              -1px -1px 2px #fff inset;
  border-radius: 3px/6px;
  overflow-y: auto;
}

.step4container {
  height: 100px;
  width: 400px;
  background: #F2F2F2;
  border: 1px solid #ccc;
  box-shadow: 1px 1px 2px #fff inset,
              -1px -1px 2px #fff inset;
  border-radius: 3px/6px;
  overflow-y: auto;
  padding: 5px;
}

.calbiritext{
  font-family: calibiri;
}

.bluetext{
  color: blue;
}

.redtext{
  color: red;
}

.uprefcontainer{
  height: 300px;
  width: 400px;
  background: lightblue;
  overflow-y: auto;
  padding: 5px;
}

#tabs-1{
  height: 7000px;
  background-color: #b3ffb3;
}

#tabs-2{
  height: 7000px;
  background-color: #b3ffb3;
}

#tabs-3{
  height: 7000px;
  background-color: #b3ffb3;
}

#tabs-4{
  height: 7000px;
  background-color: #b3ffb3;
}

#tabs-5{
  height: 7000px;
  background-color: #b3ffb3;
}

#tabs-6{
  height: 7000px;
  background-color: #b3ffb3;
}

#tabs-7{
  height: 7000px;
  background-color: #b3ffb3;
}

.tabs{
  height: 7000px;
  background-color: #b3ffb3;
}

#upconnectionconatiner{
  width: 700px;
  height: 70px;
  margin-bottom: 20px;
}

#connectionheader{
  width: 630px;
}

#connectiontext{
  height: 30px;
  width: 630px;
  background: white;
  border: 1px solid #ccc;
  box-shadow: 1px 1px 2px #fff inset,
              -1px -1px 2px #fff inset;
  border-radius: 3px/6px;
  overflow-y: auto;
}



.headerText{
  margin: 20px;
  margin-top: 50px;
  color: blue;
  font-size: 30px;
}

.step1{
  width: 700px;
  padding: 10px;
  margin: 20px;
  border: 2px solid black;
  border-radius: 25px;
  background-color:rgb(208, 248, 255);
  font-size: 20px;
}