body {
  padding-top: 3.53rem;
  margin-bottom: 70px; /* Margin bottom by footer height */
}
.starter-template {
  padding: 1rem 0.5rem;
  text-align: center;
}
ol#rules{
  text-align:left;
}
ol#rules li {
  margin:1em 0em 0em 0em;
}

.respBgImg {
  background-size: cover;
  background-position: top center;
  background-repeat: repeat-y;
}

.respBgImg img.hiddenRespBgImg {
  display: none;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
position: relative;
min-height: 100%;
}

@media (min-width: 300px){
  .container {
      max-width: 100%;
  }
  .starter-template{
    min-height:inherit;
  }
  .respBgImg {
    background-image: url("https://res.cloudinary.com/hvunsveuh/image/upload/ar_9:16,c_fill,x_1450,y_900,g_xy_center,w_300/1920_g5tl6u.png");
  }
  }


@media (min-width: 576px){
.container {
    max-width: 100%;
}
.starter-template{
  min-height:inherit;
}
.respBgImg {
  background-image: url("https://res.cloudinary.com/hvunsveuh/image/upload/ar_9:16,c_fill,x_1450,y_900,g_xy_center,w_576/1920_g5tl6u.png");
}
}

@media (min-width: 768px){
.container {
    max-width: 100%;
}
.starter-template{
  min-height:inherit;
}
.respBgImg {
    background-image: url("https://res.cloudinary.com/hvunsveuh/image/upload/ar_16:9,c_fill,x_1450,y_900,g_xy_center,w_991/1920_g5tl6u.png");
}}
@media (min-width: 992px){
.container {
    max-width: 100%;
}
.starter-template{
  min-height:inherit;
}
.respBgImg {
    background-image: url("https://res.cloudinary.com/hvunsveuh/image/upload/ar_16:9,c_fill,x_1450,y_900,g_xy_center,w_1199/1920_g5tl6u.png");
}}
@media (min-width: 1200px){
.container {
    max-width: 100%;
}
.respBgImg {
    background-image: url("https://res.cloudinary.com/hvunsveuh/image/upload/ar_16:9,c_fill,x_1450,y_900,g_xy_center,w_1364/1920_g5tl6u.png");
}
}
@media (min-width: 1365px){
.container {
    max-width: 100%;
}
.respBgImg {
    background-image: url("https://res.cloudinary.com/hvunsveuh/image/upload/ar_16:9,c_fill,x_1450,y_900,g_xy_center,w_1920/1920_g5tl6u.png");
}
}

.footer {
bottom: 0;
width: 100%;
height: 70px; /* Set the fixed height of the footer here */
line-height: 70px; /* Vertically center the text there */
background-color: #661163;
}
/* table padding overrid */
.table td, .table th {
padding: .25rem;
font-size: 0.9rem;
}

table.dataTable thead .sorting:before, table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:before, table.dataTable thead .sorting_desc_disabled:after {
  bottom:0.3em;
  color:#661163;
}

/* Set the size of the div element that contains the map */
#map {
  height: 400px;  /* The height is 400 pixels */
  width: 100%;  /* The width is the width of the web page */
 }



/* Style all font awesome icons */
.fa, .fa-brands {
  padding: 10px;
  font-size: 30px;
  text-align: center;
  text-decoration: none;
  float:right;
  margin: 5px;
}

/* Add a hover effect if you want */
.fa:hover, .fa-brands:hover {
  opacity: 0.7;
}

/* Set a specific color for each brand */

/* Facebook */
.fa-facebook {
  background: #3B5998;
  color: white;
}

/* Twitter */
.fa-twitter {
  background: #55ACEE;
  color: white;
}

/* Instagram */
.fa-instagram {
  background: #125688;
  color: white;
}

.fa-map-location-dot {
  color: black;
  font-size: 1.5em;
  padding-right:1em
}

.add-player-box .fa, .player-box .fa {
  font-size:16px;
  padding:0px;
  position:absolute;
  right:16px;
}

.nominated-container, .reserves-container {
  border-style: dashed !important;
}

.alert {
  height: 100%;
}

.nav-link {
  cursor: pointer;
}

i.fa.fa-ellipsis-v.dropdown-toggle::after {
  content:unset
}

.h-13 {
  height: 13vmin!important;
}

.h-6 {
  height: 6vmin!important;
}
.w-2 {
  width: 2%!important;
}
.odd-fix{
  border-width:1px 1px 0px 0px;
  border-color: black;
  border-style: solid;
}

.even-fix{
  border-width:0px 1px 1px 0px;
  border-color: black;
  border-style: solid;
}

.bracket {
  border-style:solid;
  border-color:black;
  display:block;
  height:50%;
  text-align: right;
}

.bracket.even-fix{
  position:relative;top:-25%;
}
.bracket.odd-fix{
  position:relative;top:25%;
}
.bracket-container .row {
  padding:5px 0px;
  text-align: left;
  font-size:1.8vmin;
}
.other-tooltip {
  position:relative; /* making the .tooltip span a container for the tooltip text */
  border-bottom:1px dashed #000; /* little indicater to indicate it's hoverable */
}
.other-tooltip:before {
  content: attr(data-text); /* here's the magic */
  position:absolute;
  
  /* vertically center */
  top:50%;
  transform:translateY(-50%);
  
  /* move to right */
  left:100%;
  margin-left:15px; /* and add a small left margin */
  
  /* basic styles */
  width:10rem;
  font-size:0.75rem;
  padding:0.25rem;
  border-radius:0.5rem;
  background:#000;
  color: #fff;
  text-align:center;

  display:none; /* hide by default */
}
.other-tooltip:hover:before {
  display:block;
}