
html {
  font-size: 16px;
}

body {
    font-family: Verdana, sans-serif;
    color: #B5E61D;
    background-color:black;
}

a {
    /*display: block;*/
    text-decoration: underline;
    line-height: inherit;
    color: inherit;
}

img {
    height: auto;
    max-width: 100vw; /* Ensure the image does not exceed its parent's width */
    width:45vw;
    display: block;
    margin: 0 auto;
}

@media (max-width: 767px) {
    img {
        width:95vw;
    }
}

table {
    width: 100%;
    max-width: 100%;
    background-color: black;
    table-layout: fixed;
    border-collapse: collapse
}

td {
    text-align: center;
    word-wrap: break-word;
    padding: 4px;
    border:none;
}

.mobile-table td {
    text-align: center;
    word-wrap: break-word;
    padding: 4px;
    /*border: 1px solid LemonChiffon;*/
}

.pc-table td {
    text-align: center;
    word-wrap: break-word;
    padding: 4px;
    /*border: 1px solid LemonChiffon; */
}

@media (min-width: 768px) {
    .table-container {
        display: inline-block;
        vertical-align: top;
        text-align: center;
        width: 30%;
    }
    .pc-table {
        width: 80%; /* Reduce table width to 80% */
        margin: 0 auto; /* Center the table */
    }
}

@media (min-width: 768px) {
    .pc-table {
        display: table;
    }
    .mobile-table {
        display: none;
    }
}

@media (max-width: 767px) {
    .pc-table {
        display: none;
    }
    .mobile-table {
        display: table;
    }
}

.content-container {
    display: block;
}

@media (min-width: 768px) {
  .video-frame-container {
    width: 70%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}

.video-container {
    height: 100%;
    width: 85%;
    aspect-ratio: 16/9;
    object-fit: contain;
    display: flex;
    justify-content: center;
    align-items: center;
    /*border: 1px solid LemonChiffon;*/
    margin: 0 auto; /* Center the container */
}

@media (max-width: 767px) {
    .video-container {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .video-container iframe {
        width: 100%;
        height: 100%;
        display: inline-block;
        vertical-align: top;
    }
}

@media (max-width: 767px) {
    .video-container iframe {
        width: 100%;
        display: block;
    }
}

@media (min-width: 768px) {
    .content-container {
        width: 100%;
        display: flex;
    }
}

@media (max-width: 767px) {
    .content-container {
        width: 100%;
    }
}
