<style>
          * {box-sizing: border-box;}
          body {font-family: Verdana, sans-serif;}
          .mySlides {display: none;}
          img {vertical-align: middle;}
          
          /* Slideshow container */
          .slideshow-container {
            max-width: 50vw;
            position: relative;
            margin: auto;
            
          }
          
          /* Caption text */
          .text {
            color: #A0A0A0;
            font-size: 10px;
            padding: 8px 12px;
            position: absolute;
            bottom: 8px;
            width: 100%;
            text-align: center;
          }
          
          /* Number text (1/3 etc) */
          .numbertext {
            color: #f2f2f2;
            font-size: 9px;
            padding: 8px 12px;
            position: relative;
            top: inherit;
            display:block;
            margin:auto;
            text-align:center;
          }
          
          /* The dots/bullets/indicators */
          .dot {
            height: 8px;
            width: 8px;
            position:absolute;
            margin: 0 2px;
            background-color: #646464;
            border-radius: 50%;
            display: inline-block;
            transition: background-color 0.6s ease;
          }
          
          .slideractive {
            background-color: #FFBB00;
          }
          
          /* Fading animation */
          .fade {
            -webkit-animation-name: fade;
            -webkit-animation-duration: 1.5s;
            animation-name: fade;
            animation-duration: 1.5s;
          }
          
          @-webkit-keyframes fade {
            from {opacity: .4} 
            to {opacity: 1}
          }
          
          @keyframes fade {
            from {opacity: .4} 
            to {opacity: 1}
          }
          
          /* On smaller screens, decrease text size */
          @media only screen and (max-width: 300px) {
            .text {font-size: 11px}
          }
          
          
          
          
           /* MENU STYLE!!!!!!!!!!! */
          
          /*the container must be positioned relative:*/
.custom-select {
  position: relative;
  font-family: Arial;
 border-color: #ffffff;
    border-style: solid;
    border-width: 0px;
    border-radius: 2px;
    cursor:pointer;
    font-size:0.8em;

}
.custom-select select {
  display: none; /*hide original SELECT element:*/
}
.select-selected {
  background-color: black;
  
}

/*style the arrow inside the select element:*/
.select-selected:after {
  position: absolute;
  content: "";
  top: 14px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #fff transparent transparent transparent;
}
/*point the arrow upwards when the select box is open (active):*/
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}
.select-selected.select-arrow-active{
border-top: 1px solid;
border-left:1px solid;
border-right:1px solid;
border-color: white;
 }
/*style the items (options), including the selected item:*/
.select-items div,.select-selected {
  color: #ffffff;
  padding: 8px 16px;
 
  
  cursor: pointer;
  user-select: none;
    
    border-left: 1px solid;
    border-right: 1px solid;
 
}
.select-items:last-child{
border-bottom:1px solid white;
 }
.select-selected{
border: 1px solid white;
 }
/*style items (options):*/
.select-items {
  position: absolute;
  background-color: #000;
  color:#FFbb00;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
  
  
}
/*hide the items when the select box is closed:*/
.select-hide {
  display: none;
}
.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}
          
          
          
          </style>