*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


#main_div {
    display: flex;
    justify-content: space-between;  
    align-items: center;             
    /* border: 1px solid red; */
    padding: 0 150px;                
    background-color: #263331;
    height: 35px;
    font-size: 20px;
    color: white;
}

#main_div > ul {
    display: flex;
    list-style-type: none;
    gap: 10px;                      
    margin: 0;
    padding: 0;
}
.li-color{
    color: #17b69b;
    text-decoration: none;
}
#main_div > ul > li > i{
    color: #17b69b;
}
#main_div > ul > li > i:hover{
    color: #0d6859;
    cursor: pointer;
}

.li-color:hover{
    color: #0d6859;
    
}

#main_div2{
    display: flex;
    justify-content: space-between; 
    align-items: center;            
    /* border: 1px solid rgb(169, 211, 18); */
    padding: 0 150px;                 
    background-color: #ffffff;
    height: 70px;
    color: white;
    position: sticky;
    top: 0px;
    position: sticky;
    font-size: 20px;
    z-index: 1000;  
}
#mini_div1{
    display: flex;
    gap: 2px;
}
#main_div2 > ul{
    display: flex;
    list-style-type: none;
    gap: 40px;
}
.combo1{
    /* padding-top: 1px; */
    font-size: 28px;
    color: #17b69b;
}
.combo{
    color: #000000;
    font-family: "Quicksand", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";;

}
.li-color1{
    color: black;
    text-decoration: none;
}

.li-color1:hover{
    color: #17b69b;
}
#main_div3 > img{
    width: 100%;  
    position: relative; 
     
}

#mini_div2 {
    position: absolute;
    top: 50% ;
    left: 36%;
    /* transform: translate(50%,50%); */
}

#h3{
    font-size: 34px;
    color: white;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
#p3{
    padding-top: 15px;
    font-size: 23px;
    text-align: center;
    color: white;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
#b3{
    padding: 15px 15px 15px 15px;
    display: block;
    margin: 0px auto;
    font-size: 19px;
    margin-top: 100px;
    background-color: #17b69b;
    border: 1px solid transparent;
    border-radius: 50px;
}
#b3:hover{
    background-color: #0d6859;
}
#h3:hover{
    color: #413322;
}

#p3:hover{
    color: #17b69b;
}

#main_div_poster {
    display: flex;
    justify-content: center;   /* centers all 3 boxes */
    gap: 40px;                 /* equal spacing between boxes */
    margin: 100px auto;        /* centers whole row */
    max-width: 1200px;         /* keeps it neat on wide screens */
}

#left, #mid, #right {
    background-color: #fff;
    border: 2px solid #000;    /* mid will override this below */
    border-radius: 8px;
    width: 320px;
    height: 420px;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    padding: 30px 20px;        /* proper inside spacing */
    box-sizing: border-box;
}

#mid {
    border-color: #17b69b;     /* only middle green */
}

#left img, #mid img, #right img {
    width: 100px;
    margin: 20px auto;
    display: block;
}

#left h1, #mid h1, #right h1 {
    font-size: 32px;
    margin-bottom: 15px;
}

#left p, #mid p, #right p {
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 40px;
    color: #444;
}

#button1, #button2, #button3 {
    padding: 12px 24px;
    border-radius: 25px;
    font-size: 15px;
    width: 200px;
    cursor: pointer;
    border: none;
}

#button1 {
    font-size: 18px;    
    margin-top:1px ;
    background: #000;
    color: #fff;
}
#button1:hover {
    background: #17b69b;
    color: #000;
}

#button2 {
    font-size: 18px;
    margin-top:1px ;
    background: #17b69b;
    color: #000;
}
#button2:hover {
    background: #000;
    color: #fff;
}

#button3 {   
    font-size: 18px;
    margin-top:1px ;
    background: #000;
    color: #fff;
}
#button3:hover {
    background: #17b69b;
    color: #000;
}

::selection {
  color: white; 
  background: rgb(0, 0, 0);
}


.submenu {
  display: none;
  position: absolute;
  background: white;
  padding: 0;
  margin: 0;
  list-style: none;
  border: 1px solid #ddd;
  z-index: 2000;  
}

li:hover .submenu {
  display: block;
}

.submenu li a {
  display: block;
  padding: 8px 12px;
  text-decoration: none;
  color: black;
}

.submenu li a:hover {
  background: #f1f1f1;
  color: #17b69b;
}

