.hero-image{
    position: relative;
    min-height: 300px;
    background-image: url('/public/home/hero.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
}




.display-select-item{
    min-width:32px;
}

.display-select-item.active{
    color: var(--sgt-red);
}


.display-select-item{
    border-bottom: 2px solid transparent;
}

.display-select-item.active{
    border-bottom: 2px solid var(--sgt-red);
}


#squads-data-container{
    overflow-x:auto;
}


.player-avatar-wrapper{
    height:32px;
    width:32px;
    margin-right:9px;
  }

  .player-avatar{
    width:32px;
    height:32px;
    border-radius:50%;
    overflow: hidden;

  }

  .player-avatar img{
    width: 100%;
    height:auto;
  }

  .player-flag{
    position: absolute;
    bottom:0;
    right:-9px;
    height:18px;
    width: 18px !important;;
    border-radius: 50%;
  }



  @media (max-width:768px){


    .standings-table{
        font-size: 60%;
    }

    .standings-table .three-quarter-font{
        font-size: 75% !important;
    }




    .player-avatar-wrapper:not(.no-shrink){
        height:24px;
        width:24px;
        margin-right:6px;
      }
    
      .player-avatar:not(.no-shrink){
        width:24px;
        height:24px;
        border-radius:50%;
        overflow: hidden;
    
      }
    
      .player-avatar:not(.no-shrink) img{
        width: 100%;
        height:auto;
      }
    
      .player-flag:not(.no-shrink){
        position: absolute;
        bottom:0;
        right:-6px;
        height:12px;
        width: 12px !important;;
        border-radius: 50%;
      }
    


}





  .included{
    color: var(--sgt-white);
  }

  .excluded{
    color: var(--sgt-light);
    text-decoration: line-through;
  }

  .squad-card-button {
    height: 36PX;
    width: 36PX;
    line-height: 36PX;
}


.modal-fullscreen {
    width: calc(100vw - 40px) !important;
    height: calc(100% - 40px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 20px !important;
}


.standings-table-wrapper{
    width:100%;
    max-width: 100%;
    overflow-x: auto;
}


.standings-table tbody tr:nth-child(odd) {
    background-color: var(--sgt-md-gray);
}


.standings-table tbody tr:nth-child(odd) td:first-child {
    border-top-left-radius: 1rem;
    border-bottom-left-radius: 1rem;
}


.standings-table tbody tr:nth-child(odd) td:last-child {
    border-top-right-radius: 1rem;
    border-bottom-right-radius: 1rem;
}


.standings-table tbody tr:nth-child(even) td:first-child {
    border-right:1px solid var(--sgt-md-gray);
}


.standings-table tbody tr:nth-child(even) td:last-child {
    border-left:1px solid var(--sgt-md-gray);
}

.expand-cell{
    width:99%;
}



#squad-edit-form input[type=text]:focus,
#squad-edit-form input[type=date]:focus{
  color: var(--sgt-dark-gray);
  background-color: #fff;
  border-color: var(--sgt-red);
  outline: 0;
  box-shadow: 0 0 0 1px rgba(208, 63, 37, 1.0);
}


.form-check-input:checked {
  background-color: var(--sgt-red) !important;
  border-color: var(--sgt-red) !important;
}

.form-check-input:focus {
  border-color: var(--sgt-red);
  outline: 0;
  box-shadow: 0 0 0 1px rgba(208, 63, 37, 1.0);
}


.delete-member-btn{
  width:73px;
}

.member-invite-wrapper{
  max-width: 500px;
  margin:auto;
}

#send-invite-button{
  width:75px;
}


#clear-member-select {
  position: absolute;
  top: 5px;
  right: 5px;
  font-size: 20px;
  color: var(--sgt-red);
}


.autocomplete-suggestions{
  background-color:white;
  border-radius: 0.375rem;
  padding-left:10px;
  padding-right:10px; 
  overflow-y:hidden;
}

.autocomplete-suggestion{
  cursor: pointer;
}


#member-select:focus {
  border-color: var(--sgt-red);
  outline: 0;
  box-shadow: 0 0 0 1px rgba(208, 63, 37, 1.0);
}