.zoom {
  zoom: 150%;
}
.imagebanner {
max-width: 100%;
}

.animate-charcter
{
    text-transform: uppercase;
        background-image: linear-gradient(225deg, #000000ba 0%, #586a6d 29%, #231616 67%, #2d2020 100%);
  background-size: auto auto;
  background-clip: border-box;
  background-size: 200% auto;
  color: #fff;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: textclip 5s linear infinite;
  display: inline-block;
      font-size: 8px;
}

@keyframes textclip {
  to {
    background-position: 200% center;
  }
}
.animate-charcters
{
      text-transform: uppercase;
       background-image: linear-gradient(225deg, #000000ba 0%, #586a6d 29%, #231616 67%, #2d2020 100%);
  background-size: auto auto;
  background-clip: border-box;
  background-size: 200% auto;
  color: #fff;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: textclip 5s linear infinite;
  display: inline-block;
      font-size: 10px;
}

@keyframes textclip {
  to {
    background-position: 200% center;
  }
}
/* Bottom left text */
.bottom-left {
  position: absolute;
  bottom: 8px;
  left: 16px;
}

/* Top left text */
.top-left {
  position: absolute;
  top: 8px;
  left: 16px;
}

/* Top right text */
.top-right {
  position: absolute;
  bottom: 8px;
  left: px;
}

/* Bottom right text */
.bottom-right {
  position: absolute;
  bottom: 8px;
  right: 1px;
}

/* Centered text ocean tv +*/
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
width:30px;
height:30px;

}

/* Centered text welcome gabriel*/
.centereds {
  position: absolute;
  top: 80%;
  left: 50%;
  transform: translate(-50%, -50%);
}

form {
text-align: right;
}


#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 80px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #07a8bd1f; /* Set a background color */
  color: #c9ecf1; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
padding-top: 18px;
  padding-left: 18px;
padding-right: 18px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 30px; /* Increase font size */
}

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}



/* Style the button and place it in the middle of the container/image */
.containery .btn {
  position: absolute;
  top: 50%;
  left: 20%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  
  font-size: 10px;
  padding: 8px 12px;
  border: none;
  cursor: pointer;
  border-radius: 5px;
background-color: #0e121adb;
color: white;
}
.containery .log {
  position: absolute;

  top: 50%;
  left: 80%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  background-color: #11161f;
  color: white;
  font-size: 5px;
  padding: 0px 3px;
  border: none;
  cursor: pointer;
 
max-width: 15%;
}

.containery .log:hover {

}
.containery .btn:hover {
background-color: white;
  color: #11161f;
  
}

.border {
border: 2px black solid;
}









/* Create a column layout with Flexbox */
.row {
  display: flex;
}

/* Left column (menu) */
.left {
  flex: 65%;
  padding: 15px 0;
}

.left h2 {
  padding-left: 8px;
}

/* Right column (page content) */
.right {
  flex: 65%;
  padding: 15px;
}

/* Style the search box */
#mySearch {
  min-width: 10%;
max-width: 80%;
  font-size: 12px;
  padding: 4px;
  border: 1px solid  #c0c0c0;;
  border-radius: 10px;
color: white;
background: black;

}

#myMenu li{
  display:none;
}
/* Style the navigation menu inside the left column */

/*background-image: repeating-linear-gradient(90deg, rgb(18 6 18), rgb(95 94 94 / 10%) 1px, #000000 0px, #000000 2px);*/
#myMenu {
  list-style-type: none;
  
  margin: auto;
text-align: center;
 
}

}

#myMenu li a {
  padding: 12px;
  text-decoration: none;
  color: white;
  display: block;
    max-width: 160px;
    max-height: 240px;
margin: 20px;

}

#myMenu li a:hover {
 background-color: #a9a9a9;


}


.logopad{
margin-top: 8px;
margin-bottom: 4px;
width: 25px;
}



.span {
colour: black;
}







.border-button {
  border: solid 1px #1a1a1a;
      transition: border-width 0.6s linear;
    box-shadow: inset 1px -1px 20px 0px rgb(25 16 45 / 69%);
}

.border-button:hover { border-width: 10px; }