.main-title {
  font-size: 2.5rem; /* Adjust the size to make it large */
  font-weight: 700; /* Make the text bold */
  text-transform: uppercase; /* Ensure the text is uppercase */
  color: #2C3E50; /* A strong, dark color for readability */
  text-align: center; /* Center the text */
  letter-spacing: 2px; /* Add space between letters for a more refined look */
  padding: 20px 0; /* Add padding above and below the header */
  background-color: #ECF0F1; /* Light background color to help it stand out */
  border-radius: 5px; /* Soft rounded corners */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
  }
  
.tile {
    width: 100%;
    display: inline-block;
    box-sizing: border-box;
    background: #fff;
    padding: 20px;
    margin-bottom: 10px;
  }
  .tile .title {
    margin-top: 0px;
  }
  .tile.purple, .tile.blue, .tile.red, .tile.orange, .tile.green {
    color: #fff;
  }
  .tile.purple {
    background: #5133ab;
  }
  .tile.purple:hover {
    background: #3e2784;
  }
  .tile.red {
    background: #ac193d;
  }
  .tile.red:hover {
    background: #7f132d;
  }
  .tile.green {
    background: #00a600;
  }
  .tile.green:hover {
    background: #007300;
  }
  .tile.blue {
    background: #2672ec;
  }
  .tile.blue:hover {
    background: #125acd;
  }
  .tile.orange {
    background: #dc572e;
  }
  .tile.orange:hover {
    background: #b8431f;
  }

  .tile > h3{
    text-align:center;
  }

  .tile{
    min-height:80px;
  }

  .list {
    display: flex;
    flex-wrap: wrap;
  }

  .list-item {
    display: flex; 
    padding: 0.5em;
    width: 100%;
  }

  .snapshot{
    background-color:gainsboro;
  }

  .snapshot-item-today{
    background-color: linen;
  }

  .color-nebraska{
    background-color:#D00000;
    color:white;
    padding:10px;

  }

  .color-usda{
    background-color:#005440;
    color:white;
    padding:10px;
    
  }

  .color-office{
    background-color:#Fe5c00;
    color:white;
    padding:10px;
    
  }

  .row-btns-links-usmarc{   
    background-color: rgba(0,84,64,0.5);
    text-align:center;
  }

  .color-iowa{
    background-color:#FFCD00;
    color:black;
    padding:10px;
  }
  .row-btns-links-iowa{   
    background-color: rgba(255,205,0,0.2);
    text-align:center;
  }


  .color-china,.color-jpl{
    background-color:#D00000;
    color:white;
    padding:10px;
  }

  .row-with-buttons .btn{
    color:#000000;
  }

  .row-btns-links-jpl{   
    background-color: rgba(208,0,0,0.2);
    text-align:center;
  }

  .row-btns-links-office{   
    background-color: rgba(208,0,0,0.2);
    text-align:center;
  }



  .hdr_feed{
    font-size:1.6em;
  }

  .top-hdr{
    text-shadow: 1px 1px #000000;
    letter-spacing: 2px;
    margin-bottom:10px;
  }

  .bottom-info{
    color:brown;
  }

  .flag-green,.flag-green .bottom-info{
    color:green !important;

  }

  
  .flag-red,.flag-red .bottom-info{
    color:red !important;

  }
  /*pop up form related*/

  /* The popup form - hidden by default */
.form-popup {
  display: none;
  position: fixed;
  bottom: 0;
  right: 15px;
  border: 3px solid #f1f1f1;
  z-index: 9;
}

/* Add styles to the form container */
.form-container {
  max-width: 300px;
  padding: 10px;
  background-color: white;
}

/* Full-width input fields */
.form-container input[type=text], .form-container input[type=password] {
  width: 100%;
  padding: 15px;
  margin: 5px 0 22px 0;
  border: none;
  background: #f1f1f1;
}

/* When the inputs get focus, do something */
.form-container input[type=text]:focus, .form-container input[type=password]:focus {
  background-color: #ddd;
  outline: none;
}

/* Set a style for the submit/login button */
.form-container .btn {
  background-color: #04AA6D;
  color: white;
  padding: 16px 20px;
  border: none;
  cursor: pointer;
  width: 100%;
  margin-bottom:10px;
  opacity: 0.8;
}

/* Add a red background color to the cancel button */
.form-container .cancel {
  background-color: red;
}

/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
  opacity: 1;
}



.myalert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}



.myalert-danger {
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
}



.alert-white {
    background-image: linear-gradient(to bottom,#FFFFFF,#F9F9F9);
    border-top-color: #d8d8d8;
    border-bottom-color: #bdbdbd;
    border-left-color: #cacaca;
    border-right-color: #cacaca;
    color: #404040;
    padding-left: 61px;
    position: relative;
}

.alert-white .icon {
    text-align: center;
    width: 45px;
    height: 100%;
    position: absolute;
    top: -1px;
    left: -1px;
    border: 1px solid #bdbdbd;
}

.alert-white .icon:after {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    display: block;
    content: '';
    width: 10px;
    height: 10px;
    border: 1px solid #bdbdbd;
    position: absolute;
    border-left: 0;
    border-bottom: 0;
    top: 50%;
    right: -6px;
    margin-top: -5px;
    background: #fff;
}




.alert-white .icon i {
    font-size: 20px;
    color: #FFF;
    left: 12px;
    margin-top: -10px;
    position: absolute;
    top: 50%;
}

.alert-white.myalert-danger .icon,.alert-white.myalert-danger .icon:after {
    border-color: #ca452e;
    background: #da4932;
}

.expand-status{
  color:red !important;
  text-decoration:none;
}

.not-found{
  color:red;
}

.make_cyan{
  background-color:cyan !important;
}