.millennium-container {position: relative;}
.millennium-box {
    float: right;
    max-width: auto;
    opacity: 0;
}
.millennium-box img{
    max-width: 100%;
    margin-left: 15px;
}
.millennium-img {
    margin: auto;
    float: right;
}
.millennium-img img {
    opacity: 0;
    position: absolute;
    margin-left: 15px;
    animation: slideShowFive 45s infinite;
}
.millennium-img img:nth-child(1) {
    animation-delay: 0s;
}
.millennium-img img:nth-child(2) {
    animation-delay: 9s;
}
.millennium-img img:nth-child(3) {
    animation-delay: 18s;
}
.millennium-img img:nth-child(4) {
    animation-delay: 27s;
}
.millennium-img img:nth-child(5) {
    animation-delay: 36s;
}
@keyframes slideShowFive {
    0% { opacity: 0; }
    2.22%  { opacity: 1; }
    18.22%  { opacity: 1; }
    26.04%  { opacity: 0; }
    100% { opacity: 0; }
}

@keyframes slideShowThree {
    0% { opacity: 0; }
    3.7%  { opacity: 1; }
    33.33%  { opacity: 1; }
    37.04%  { opacity: 0; }
    100% { opacity: 0; }
}

.m-package-img {
    position: relative;
}
.m-package-img .background-img { 
    margin: auto;
    width: 100%;
    top: 0;
    left: 0;
}
.m-package-img-slideshow {
    margin: auto;
    top: 0;
}
.m-package-img-slideshow img {
    position: absolute;
    opacity: 0;
    animation: slideShowThree 27s infinite;
}
.m-package-img-slideshow img:nth-child(1) {
    animation-delay: 0s;
}

.m-package-img-slideshow img:nth-child(2) {
    animation-delay: 9s;
}

.m-package-img-slideshow img:nth-child(3) {
    animation-delay: 18s;
}
.m-package-img .foreground-img {
    width: 100%;
    height: auto;
    z-index: 1;
}

.dhcepp .m924-package::before {content: "Mephisto"}
.dhcepp .m924-package::after {content: "Phoenix + Tournament eBoard"}
.dhcepp .m924-package {background: #097909;}

.table .m924-package {width: 100%; height: 2px; margin: 35px 0; position:relative; text-align: center;}
.table .m924-package::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m924-package::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}

.dhcep .m922-package::before {content: "Mephisto"}
.dhcep .m922-package::after {content: "Phoenix + Exclusive eBoard"}
.dhcep .m922-package {background: #097909;}

.table .m922-package {width: 100%; height: 2px; margin: 35px 0; position:relative; text-align: center;}
.table .m922-package::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m922-package::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}

.dhcepp .m920-package::before {content: "Mephisto"}
.dhcepp .m920-package::after {content: "Phoenix Computer Module"}
.dhcepp .m920-package {background: #097909;}

.table .m920-package {width: 100%; height: 2px; margin: 35px 0; position:relative; text-align: center;}
.table .m920-package::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m920-package::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}

.dhcepp .m822-package::before {content: "ChessLink Module"}
.dhcepp .m822-package::after {content: ""}
.dhcepp .m822-package {background: #097909;}

.table .m822-package {width: 100%; height: 2px; margin: 35px 0; position:relative; text-align: center;}
.table .m822-package::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m822-package::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}

.hcep .m828-package::before {content: "Chess";}
.hcep .m828-package::after {content: "Classics Exclusive"}
.hcep .m828-package {background: #87cefa;}

.table .m828-package {width: 100%; height: 2px; margin: 35px 0; position:relative; text-align: center;}
.table .m828-package::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m828-package::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}

.hcep .m831-package::before {content: "King";}
.hcep .m831-package::after {content: "Competition"}
.hcep .m831-package {background: #87cefa;}

.table .m831-package {width: 100%; height: 2px; margin: 35px 0; position:relative; text-align: center;}
.table .m831-package::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m831-package::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}

.hcep .m841-package::before {content: "Millennium";}
.hcep .m841-package::after {content: "EONE"}
.hcep .m841-package {background: #87cefa;}

.table .m841-package {width: 100%; height: 2px; margin: 35px 0; position:relative; text-align: center;}
.table .m841-package::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m841-package::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}

.dhcep .m843-package::before {content: "Millennium"}
.dhcep .m843-package::after {content: "Exclusive Luxe Edition"}
.dhcep .m843-package {background: #a26bfa;}

.table .m843-package {width: 100%; height: 2px; margin: 35px 0; position:relative; text-align: center;}
.table .m843-package::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m843-package::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}

.dhcepp .m850-package::before {content: "Millennium"}
.dhcepp .m850-package::after {content: "Supreme Tournament 55"}
.dhcepp .m850-package {background: #097909;}

.table .m850-package {width: 100%; height: 2px; margin: 35px 0; position:relative; text-align: center;}
.table .m850-package::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m850-package::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}

.chess-piece-page-break {
    text-align: center;
}
.chess-piece-page-break img {
    max-width: 100%;
}

.lang-icons {
    position: absolute;
    top: 130px;
    right: 10px;
}
.lang-divider {
    display: inline-block;
    height: 21px;
    width: 1px;
    background-color: #000000;
    margin: 0 5px;
}

#landscape-options-container {width: 100%; margin: auto; display: flex; flex-wrap: wrap; justify-content: space-between;}
#landscape-options-container .table {background-color: #fff; width: 100%; padding: 15px 15px; position: relative; box-shadow: 0 5px 10px rgba(0,0,0,0.1);}
#chesslink {float: left; max-width: 460px;}
#chesslink-features {position: relative; margin-top: 0;}
.m822-package-chesslink::before {content: "ChessLink Module"}
.m822-package-chesslink::after {content: ""}
.m822-package-chesslink {background: #097909;}
.table .m822-package-chesslink {width: 100%; height: 2px; margin: 25px 0; position:relative; text-align: center; }
.table .m822-package-chesslink::before {position: absolute; top: 50%; left: 50%; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px; transform: translate(-50%, -50%);}
.table .m822-package-chesslink::after {position: relative; top: 15px; font-size: 24px; font-weight: 500; background: #fff; padding: 0 15px;}
#portrait-options-container {display: none;}

@media (max-width: 1225px) {#portrait-options-container {display: flex;} #landscape-options-container {display: none;}.options-container .table {margin: auto; width: 50%; margin-bottom: 40px;} .main-options-container .main-table {margin: auto; width: 42%; margin-bottom: 40px;} }
@media (max-width:698px) {.options-container .table {width: 100%;} }
@media only screen and (max-width: 653px) {
    .millennium-img {position: absolute; top: 0; width: 100%; display: flex; justify-content: center;}
    .millennium-img img {margin: 0;max-width: 100%;}
    .millennium-box {display:block; opacity: 0;margin: auto; float: none;}
    .lang-icons {top: 50px;right: 20px;}
}
@media (max-width: 767px) {.lang-divider {display: none;} .lang-icons img {display: block; margin-bottom: 7px;}}
@media (max-width: 390px) {.lang-icons {top: 80px;right: 20px;}}