html,body {
  margin:0;
  padding:0;
}

h1 {
  font-size: 30px;
}

h2 {
  font-size: 26px;
}

h3 {
  font-size: 22px;
}

h4 {
  font-size: 18px;
}

.page_container {
  margin:auto;
  padding-left: 20px;
  padding-right: 20px;
}

.min900 {
  min-width: 900px;
}


.pointer_cursor {
  cursor: pointer;
}

.collapse_section {
  background-color: #eee;
  color:#229dff;
  font-size: 24px;
  padding-left: 10px;
  margin-top: 15px;
  margin-bottom: 10px;
  text-align: left;
}

.collapse_section:hover {
/*  text-decoration: underline;*/
  background-color: #999;
  color:#fff;
}

.p_font18 {
  font-size:18px;
}

.data_table_frame {
  width: 100%;
  overflow: scroll;
}


.width900 {
  max-width:900px; 
  margin:auto;
}
  
.margin-20 {
  margin: 20px;
}


.info_icon {
  background-color:#4387FD;
  border-radius:20px;
  vertical-align: top;
  border:0px;
  display:inline-block;
  color:#ffffff;
  font-family:"Georgia",Georgia,Serif;
  font-size:12px;
  font-weight:bold;
  font-style:normal;
  width:18px;
  height:18px;
  line-height:18px;
  text-align:center;
}
.info_icon:hover {
  background-color:#5EA1FF;
  color:#0000CC;
}

.info_icon:active {
  position:relative;
  top:1px;
}

/* datatable css */

/* .btn{
  border-radius: 15px;
} */

.btn_select_all{
  /* background-color:#4387FD;  */
  border-radius: 5px !important; 
  height: 30px !important;
} 

.dataTables_wrapper button:hover {
  background-color:#465156 ; 
  color:white;
}

.dataTables_wrapper button {  
  border-radius: 5px;
}

table.dataTable td,th {
  max-width: 500px;
  /* white-space: nowrap; */
  /* text-overflow: ellipsis; */
  /* overflow: hidden; */
  text-align: center;
  vertical-align: middle;
  padding-left: 15px !important;
  padding-right: 15px !important;
  word-break: keep-all;
}

/* species.php */

#species_menu_container {
  margin:auto;
  text-align: justify;
  justify-content: center;
  width: 70%;
}

.species_card {
  min-width:250px;
  color:#333;
  margin: 10px;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 10px 10px 0px;
  transition: transform 0.2s, border-color 0.2s;
}

.species_card a:link {
  color:#333;
}
.species_card:hover {
  color:#333;
  transform: translateY(-5px);
  border-color: rgb(53,58,64);
  text-decoration: none;
}

.species_img {
  height: 200px;
  object-fit: contain;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.species_card-body {
  white-space: nowrap;
  padding: 5px;
}

.sps_card_title {
  color:#b52b27;
  font-size:1.2em;
  line-height:1.2;
  font-style:italic;
  font-weight: 500;
  text-align:center;
}

.sps_card_subtitle {
  text-align:center;
}


/* species_view.php */

#species_container {
  max-width:900px;
  margin:auto;
  text-align: justify;
}

.sps-btn {
  float: left!important;
  margin-right: 10px;
  margin-bottom: 10px;
}

/* blast_input.php */
.blast_attr label, .yellow_col { /*apply with form-group */
  font-weight: bold;
  color: #333;
  margin-top: 15px;
}

.sequence_blast_box { /* apply with form-control */
  width: 200px;
  border-radius: 10px;
  border: 1px solid rgb(53, 58, 64);
  padding: 10px;
  width: 100%;
  font-family: Monospace;
}

.blast_box { /* apply with form-control */
  width: 200px;
  border-radius: 10px;
  border: 1px solid rgb(53, 58, 64);
  /* padding: 10px; */
  width: 100%;
}

#blast-container {
  background-color: #fff;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
  max-width: 900px;
  margin: 0 auto;
}


/* fasta_download.php */
.sequence_attr {
  font-weight: bold;
  color: #333;
  margin-top: 15px;
}

.sequence_box { /* apply with form-control */
  width: 200px;
  border-radius: 20px;
  border: 1px solid rgb(53, 58, 64);
  padding: 10px;
  width: 100%;
}

#sequence-container {
  background-color: #fff;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
  max-width: 900px;
  margin: 50px auto;
}