.modal-componnet {
  position: fixed;
  background: rgba(200, 200, 200, 0.5);
  width: 100%;
  height: 100%;
  top: 0%;
  left: 0%;
  z-index: 50;
}

.modal-componnet .content {
  position: fixed;
  background: #efefef;
  width: 100%;
  max-width: 1000px;
  top: 5%;
  left: 50%;
  margin-left: -500px;
  padding: 50px;
  border-radius: 20px;
  padding-top: 90px;
  box-shadow: 8px 8px 12px #00000029;
}

.modal-componnet .content h2 {
  position: absolute;
  top:0;
  left:0;
  width: 100%;;
  color: #ff9024;
  padding: 20px;
  margin-bottom: 20px;
  background: #efefef;
  border-bottom: solid 3px #ff9024;
}


.modal-componnet .fechar {
  position: absolute;
  top: -15px;
  right: -15px;
  border-radius:50px;
}

.modal-componnet table {
  width: 100%;
  margin-bottom: 40px;
  margin-top: 40px;
}

.modal-componnet table thead tr th {
  background: #ff9024;
  color: #fff;
  font-weight: bold;
  padding: 5px;
  border: solid 1px #ff9024;
  text-align: center;
  border-bottom: solid 1px #fff;
}

.modal-componnet table tbody tr td {
  padding: 5px;
  border: solid 1px #ccc;
  text-align: center;
}

.modal-componnet .box-table{
  height:100%;
  margin-bottom: 0px;
  position: relative;
}


.modal-componnet .box-table.h290{
  max-height: 290px;
}

@media only screen and (min-height: 890px) {
  .modal-componnet .box-table.h290{
    max-height: 400px;
  }
}

@media only screen and (max-width: 999px) {
  .modal-componnet .content{
    margin-left: 0;
    left: 2%;
    width: 96%;
    padding: 75px 5px 20px 20px;
  }
  .modal-componnet .fechar {
    right:-1%;
  }
}