
.image-button img {
  max-width: 100%;
  height: auto;
}

table {
  width: 100%;
}

tr {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

td {
  flex: 1;
  text-align: center;
  padding: 10px; /* adjust as needed */
}

.page-home { 
  background: url(BelowTheOcean/DiverBig-lo.jpg) no-repeat center center fixed; 
  background-size: cover;
}

.page-bto { 
  background: url(BelowTheOcean/bg-diver2.jpg) no-repeat center center fixed; 
  background-size: cover;
  font-family:Verdana, Geneva, Tahoma, sans-serif;
}

.page-about { 
  background: url(bgAboutRetroCasual.jpg) no-repeat center center fixed; 
  background-size: cover;
  font-family:Verdana, Geneva, Tahoma, sans-serif;
}

.page-tuttle { 
  background: url(Tuttle/tuttleBg.png) no-repeat center center fixed; 
  background-size: cover;
  font-family:Verdana, Geneva, Tahoma, sans-serif;
}



.connect
{
  display: inline-block;
}

.container
{
    max-width: 960px;
    background: ffffff;
    background-color: white;
    margin-top: -58px;
}

.containerT {
  max-width: 960px;
  background: #ffffff;
  background-color: white;
  margin-top: -58px;
  margin-left: auto;
  margin-right: auto;
}

.btocontainer
{
    max-width: 960px;
    background: ffffff;
    background-color: black;
    font-size: 16px;
    padding: 32px;
    margin: auto;
}

.post
{
    max-width: 960px;
    background: ffffff;
    background-color: white;
    padding: 32px;

    font-size: 32px;
}

.awards
{
    max-width: 960px;
    background: ffffff;
    background-color: white;
    align-items: center;
    align-content: center;
}

.btobullets
{
  display: block;
  margin-left:auto;
  margin-right:auto;
  max-width: 650px;
  font-size: 24px;
}

.btotitle
{
    background: url('BelowTheOcean/bto-Logo.png') no-repeat center;
    background-size: contain;
    height: 150px;
}

.btodive
{
    background: url('BelowTheOcean/bto-3840x1240.png') no-repeat center;
    background-size:cover;
    background-attachment:local ;
    height: 600px;
}

  .image 
  {
    width: 100%;
    overflow: hidden;
  }

  .image-colorize img 
  {
    transition: transform .5s, filter 0.5s ease-in-out;
    filter: grayscale(100%);
    transform: scale(0.9);
  }

  .image-colorize:hover img 
  {
    filter: grayscale(0);
    transform: scale(1.0);
  }

  .image-button img 
  {
    transition: transform .5s, filter 0.5s ease-in-out;
    transform: scale(1.0);
    position: relative;
    z-index: 0;
    top: 0;
    filter: drop-shadow(4px 4px 4px #000000);
  }

  .mini
  {
    max-width: 150px;
    display: inline-block;
  }

  .big
  {
    transform: scale(1.5);

  }

  .image-button:hover img 
  {
    transform: scale(1.1);
    top: -10;
    z-index: 10000;
  }

  @keyframes slideInFromLeft 
  {
    0% {
      transform: translateX(-100%);
    }
    100% {
      transform: translateX(0);
    }
  }

  @keyframes slideInFromRight
  {
    0% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(0);
    }
  }

  @keyframes slideInFromTop
  {
    0% {
      transform: translateY(-10%);
    }
    100% {
      transform: translateX(0);
    }
  }

  @keyframes slideInFromBottom
  {
    0% {
      transform: translateY(10%);
    }
    100% {
      transform: translateX(0);
    }
  }

  .button1 
  {
    animation: 1s ease-out 0s 1 slideInFromBottom; 
    animation-delay: 0.5s, 480ms;
  }
  
  .button2
  {
    animation: 1s ease-out 0s 1 slideInFromBottom; 
    animation-delay: 0.25s;
  }

  :root 
  {
    --animation-time: 1s;
  }

