body {
	font-family: arial, sans-serif;
	font-size: 14px;
}
       /* Custom sticky offset that respects the top fixed toolbar */
       .custom-sticky {
           position: -webkit-sticky;
           position: sticky;
           top: 0;
           z-index: 1020; /* Sits right below the fixed navbar */
           background-color: #fff; /* Prevents underlying data text from bleeding through */
       }

       /* Ensure the iframe scales nicely */
       .responsive-iframe-container {
           position: relative;
           overflow: hidden;
           width: 100%;
           padding-top: 56.25%; /* 16:9 Aspect Ratio */
       }

       .responsive-iframe-container iframe {
           position: absolute;
           top: 0;
           left: 0;
           bottom: 0;
           right: 0;
           width: 100%;
           height: 100%;
           border: 0;
       }
.header1{
 	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	font-weight: bold;
	color: #990000;   
} 
.selectbutton {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 18px;
	font-weight: bold;
	color: #595620;
}

  .submitbutton  {
	display:inline-block;
    cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
    padding:4px 15px; /*add some padding to the inside of the button*/
	width: 95%;
    -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
	background:-moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:-webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:-o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:-ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9',GradientType=0);
	background-color:#f9f9f9;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	color:#595620;
	font-family:Arial;
	font-weight:normal
	font-size:15px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
    }
    /***NOW STYLE THE BUTTON'S HOVER AND FOCUS STATES***/
    .submitbutton:hover {
	background-color :#565620; /*make the background a little darker*/
	/*reduce the drop shadow size to give a pushed button effect*/
    -webkit-box-shadow: 0 0 1px rgba(0,0,0, .75);
	-moz-box-shadow: 0 0 1px rgba(0,0,0, .75);
	box-shadow: 0 0 2px rgba(0,0,0, .75);
	color:#990034;
	text-decoration: none;
    }
.header,.header-menu {
  display: flex;
  justify-content: center;  /*  center whole block */
  align-items: center;
  flex-wrap: wrap;          /* mobile friendly */
  text-align: center;
}
.header {
  gap: 30px;                /* space between logo + socials + image */

}
/* LEFT GROUP (logo + socials stacked) */
.header-left {
  display: flex;
  flex-direction: column;
  align-items: center; /* center internally */
  gap: 8px;
}

/* socials inline */
.social {
  display: flex;
  gap: 2px;
  justify-content: center;
}

.header-right {
  flex: 0 1 auto;
}
.sponsor{
    width: 65%;
}
.pifflers-img{
  width: 100%;
  max-width: 40em; /* or whatever looks right */
  height: auto;
}
.sponsor-social{
   width: 28px;
  height: 28px;
  object-fit: contain;
}
.img-button{
    width: 22%;
 } 
 
.main-iframe {
  transition: height 0.2s ease;
}
.main-iframe img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.main-iframe {
    width: 100%;
/*    aspect-ratio: 15 / 12;*/
/*    height: auto;*/
    border: 0;
    display: block;
}

.box_text {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 18px;
	color: #333333;
	text-align: left;
  padding-left: 5px;
  padding-right: 5px;
    }

.bottom {
  margin: 0 auto;
  background-position: center;
  background-image: url(images/footer.jpg);
  background-repeat: no-repeat;
  
  /* Use cover or contain depending on how footer.jpg should fit */
  background-size: cover; 
  
  /* Use min-height so it expands if content is taller than 3rem */
  min-height: 3rem; 

}
a:link {
	color: #000000;
	text-decoration: none;
	font-weight: bold;
}
.class1 a:link {
	color: #000000;
	text-decoration: none;
	font-weight: normal;
}
.class1 a:visited {
	text-decoration: none;
	color: #000000;
	font-weight: normal;
}
.class1 a:hover {
	text-decoration: underline;
	color: #990000;
	font-weight: normal;
}
.class1 a:active {
	text-decoration: underline;
	color: #990000;
	font-weight: normal;
	font-family: Geneva, Arial, Helvetica, sans-serif;
}
/* First table inside #slides */
#slides table {
		font-size:3.8vw;
}

#slides .data2 {
    padding-top: 2px;
    padding-right: 0px;
    padding-left: 0px; 
    text-align: right;
    position: relative;
    top: -1.3rem;
}
.data2 td, th {
	border: 1px;
	border-color: #000000;
	border-style: dotted;

}
.frame-padding {
    box-sizing: border-box;
    width: 100%;
    padding: 2px;
    overflow: hidden;
}

.frame-padding img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    display: block;
}
#maincontainer 
{   
top:0px;
left: 0px;
padding:1vw;
position:fixed;
width:100%;
height:80%;
}
input.myButtonL{
     background-image: url('images/lowr/RAL.gif');
     border-style:none;
     width:20px;
     height: 20px;
     background-repeat:no-repeat;
     background-color:transparent;
}
input.myButtonL:hover{
    background-image: url('images/lowr/RAXL.gif');
     width:20px;
          height: 20px;
     background-repeat:no-repeat;
     background-color:transparent;
}
input.myButtonL:active{
    background-image: url('images/RAL.gif');
     width:20px;
          height: 20px;
     background-repeat:no-repeat;
     background-color:transparent;
}
input.myButtonL.disabled{
    background-image:none;
}
input.myButtonR{
     background-image: url('images/lowr/RA.gif');
     border-style:none;
     width:20px;
          height: 20px;
     background-repeat:no-repeat;
     background-color:transparent;
}
input.myButtonR:hover{
    background-image: url('images/lowr/RAX.gif');
     width:20px;
          height: 20px;
     background-repeat:no-repeat;
     background-color:transparent;
}
input.myButtonR:active{
    background-image: url('images/lowr/RA.gif');
     width:20px;
          height: 20px;
     background-repeat:no-repeat;
     background-color:transparent;
}
input.myButtonR.disabled{
    background-image:none;
}
/* All screens */
.ratio-responsive {
  --bs-aspect-ratio:100%

}

@media (min-width: 1024px) { /* bigger than ipad*/

  .main-iframe {
    width: 100%;
    height: 100%;  
 }
 }    
@media (min-width: 992px) { 
    .main{
        width: 80%;
    }
 
   .main.fishing{
       width: 50%; 
    }
  .container{
    gap: 15%; 
} 
 	.main-section.fish{
  width:90%;
	}
}