/*.row>* {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) / 2);
    padding-left: calc(var(--bs-gutter-x) / 2);
    margin-top: var(--bs-gutter-y);
}*/
.row > .column {
padding: 0 8px;
}

.row g-3 {
    
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(var(--bs-gutter-y)* -1);
}
.row:after {
  content: "";
  display: table;
  clear: both;
}
.column {
  float: left;
  width: 100%;
}

/* Styles for the first modal */
#myModal {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal .close:hover,
#myModal .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal .mySlides {
    display: none;
}

#myModal .cursor {
    cursor: pointer;
}

#myModal .prev,
#myModal .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

/*#myModal .prev:hover,
#myModal .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}
*/

#myModal .prev,
#myModal .next{
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal img {
    margin-bottom: -4px;
}

#myModal .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal .demo {
    opacity: 0.6;
}

#myModal .active,
#myModal .demo:hover {
    opacity: 1;
}

#myModal img.hover-shadow {
    transition: 0.3s;
}

#myModal .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


/* Styles for the second modal */
#myModal2 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal2 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal2 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal2 .close:hover,
#myModal2 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal2 .mySlides {
    display: none;
}

#myModal2 .cursor {
    cursor: pointer;
}

#myModal2 .prev,
#myModal2 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal2 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal2 .prev,
#myModal2 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal2 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal2 img {
    margin-bottom: -4px;
}

#myModal2 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal2 .demo {
    opacity: 0.6;
}

#myModal2 .active,
#myModal2 .demo:hover {
    opacity: 1;
}

#myModal2 img.hover-shadow {
    transition: 0.3s;
}

#myModal2 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



/* Styles for the third modal */
#myModal3 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal3 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal3 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal3 .close:hover,
#myModal3 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal3 .mySlides {
    display: none;
}

#myModal3 .cursor {
    cursor: pointer;
}

#myModal3 .prev,
#myModal3 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal3 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal3 .prev,
#myModal3 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal3 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal3 img {
    margin-bottom: -4px;
}

#myModal3 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal3 .demo {
    opacity: 0.6;
}

#myModal3 .active,
#myModal3 .demo:hover {
    opacity: 1;
}

#myModal3 img.hover-shadow {
    transition: 0.3s;
}

#myModal3 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}





/* Styles for the fourth modal */
#myModal4 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal4 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal4 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal4 .close:hover,
#myModal4 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal4 .mySlides {
    display: none;
}

#myModal4 .cursor {
    cursor: pointer;
}

#myModal4 .prev,
#myModal4 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal4 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal4 .prev,
#myModal4 .next{
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal4 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal4 img {
    margin-bottom: -4px;
}

#myModal4 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal4 .demo {
    opacity: 0.6;
}

#myModal4 .active,
#myModal4 .demo:hover {
    opacity: 1;
}

#myModal4 img.hover-shadow {
    transition: 0.3s;
}

#myModal4 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}





/* Styles for the fifth modal */
#myModal5 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal5 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal5 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal5 .close:hover,
#myModal5 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal5 .mySlides {
    display: none;
}

#myModal5 .cursor {
    cursor: pointer;
}

#myModal5 .prev,
#myModal5 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal5 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal5 .prev:hover,
#myModal5 .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal5 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal5 img {
    margin-bottom: -4px;
}

#myModal5 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal5 .demo {
    opacity: 0.6;
}

#myModal5 .active,
#myModal5 .demo:hover {
    opacity: 1;
}

#myModal5 img.hover-shadow {
    transition: 0.3s;
}

#myModal5 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}





/* Styles for the sixth modal */
#myModal6 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal6 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal6 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal6 .close:hover,
#myModal6 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal6 .mySlides {
    display: none;
}

#myModal6 .cursor {
    cursor: pointer;
}

#myModal6 .prev,
#myModal6 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal6 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal6 .prev,
#myModal6 .next{
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal6 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal6 img {
    margin-bottom: -4px;
}

#myModal6 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal6 .demo {
    opacity: 0.6;
}

#myModal6 .active,
#myModal6 .demo:hover {
    opacity: 1;
}

#myModal6 img.hover-shadow {
    transition: 0.3s;
}

#myModal6 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}







/* Styles for the seventh modal */
#myModal7 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal7 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal7 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal7 .close:hover,
#myModal7 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal7 .mySlides {
    display: none;
}

#myModal7 .cursor {
    cursor: pointer;
}

#myModal7 .prev,
#myModal7 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal7 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal7 .prev,
#myModal7 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal7 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal7 img {
    margin-bottom: -4px;
}

#myModal7 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal7 .demo {
    opacity: 0.6;
}

#myModal7 .active,
#myModal7 .demo:hover {
    opacity: 1;
}

#myModal7 img.hover-shadow {
    transition: 0.3s;
}

#myModal7 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}





/* Styles for the eighth modal */
#myModal8 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal8 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal8 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal8 .close:hover,
#myModal8 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal8 .mySlides {
    display: none;
}

#myModal8 .cursor {
    cursor: pointer;
}

#myModal8 .prev,
#myModal8 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal8 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal8 .prev,
#myModal8 .next{
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal8 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal8 img {
    margin-bottom: -4px;
}

#myModal8 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal8 .demo {
    opacity: 0.6;
}

#myModal8 .active,
#myModal8 .demo:hover {
    opacity: 1;
}

#myModal8 img.hover-shadow {
    transition: 0.3s;
}

#myModal8 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}





/* Styles for the nineth modal */
#myModal9 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal9 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal9 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal9 .close:hover,
#myModal9 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal9 .mySlides {
    display: none;
}

#myModal9 .cursor {
    cursor: pointer;
}

#myModal9 .prev,
#myModal9 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal9 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal9 .prev,
#myModal9 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal9 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal9 img {
    margin-bottom: -4px;
}

#myModal9 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal9 .demo {
    opacity: 0.6;
}

#myModal9 .active,
#myModal9 .demo:hover {
    opacity: 1;
}

#myModal9 img.hover-shadow {
    transition: 0.3s;
}

#myModal9 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}





/* Styles for the tenth modal */
#myModal10 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal10 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal10 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal10 .close:hover,
#myModal10 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal10 .mySlides {
    display: none;
}

#myModal10 .cursor {
    cursor: pointer;
}

#myModal10 .prev,
#myModal10 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal10 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal10 .prev,
#myModal10 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal10 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal10 img {
    margin-bottom: -4px;
}

#myModal10 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal10 .demo {
    opacity: 0.6;
}

#myModal10 .active,
#myModal10 .demo:hover {
    opacity: 1;
}

#myModal10 img.hover-shadow {
    transition: 0.3s;
}

#myModal10 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



/* Styles for the eleventh modal */
#myModal11 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal11 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal11 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal11 .close:hover,
#myModal11 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal11 .mySlides {
    display: none;
}

#myModal11 .cursor {
    cursor: pointer;
}

#myModal11 .prev,
#myModal11 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal11 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal11 .prev,
#myModal11 .next{
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal11 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal11 img {
    margin-bottom: -4px;
}

#myModal11 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal11 .demo {
    opacity: 0.6;
}

#myModal11 .active,
#myModal11 .demo:hover {
    opacity: 1;
}

#myModal11 img.hover-shadow {
    transition: 0.3s;
}

#myModal11 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}





/* Styles for the twelth modal */
#myModal12 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal12 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal12 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal12 .close:hover,
#myModal12 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal12 .mySlides {
    display: none;
}

#myModal12 .cursor {
    cursor: pointer;
}

#myModal12 .prev,
#myModal12 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal12 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal12 .prev:hover,
#myModal12 .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal12 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal12 img {
    margin-bottom: -4px;
}

#myModal12 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal12 .demo {
    opacity: 0.6;
}

#myModal12 .active,
#myModal12 .demo:hover {
    opacity: 1;
}

#myModal12 img.hover-shadow {
    transition: 0.3s;
}

#myModal12 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



/* Styles for the tirteenth modal */
#myModal13 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal13 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal13 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal13 .close:hover,
#myModal13 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal13 .mySlides {
    display: none;
}

#myModal13 .cursor {
    cursor: pointer;
}

#myModal13 .prev,
#myModal13 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal13 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal13 .prev:hover,
#myModal13 .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal13 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal13 img {
    margin-bottom: -4px;
}

#myModal13 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal13 .demo {
    opacity: 0.6;
}

#myModal13 .active,
#myModal13 .demo:hover {
    opacity: 1;
}

#myModal13 img.hover-shadow {
    transition: 0.3s;
}

#myModal13 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}





/* Styles for the fourteenth modal */
#myModal14 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal14 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal14 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal14 .close:hover,
#myModal14 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal14 .mySlides {
    display: none;
}

#myModal14 .cursor {
    cursor: pointer;
}

#myModal14 .prev,
#myModal14 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal14 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal14 .prev,
#myModal14 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal14 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal14 img {
    margin-bottom: -4px;
}

#myModal14 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal14 .demo {
    opacity: 0.6;
}

#myModal14 .active,
#myModal14 .demo:hover {
    opacity: 1;
}

#myModal14 img.hover-shadow {
    transition: 0.3s;
}

#myModal14 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}




/* Styles for the fifteenth modal */
#myModal15 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal15 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal15 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal15 .close:hover,
#myModal15 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal15 .mySlides {
    display: none;
}

#myModal15 .cursor {
    cursor: pointer;
}

#myModal15 .prev,
#myModal15 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal15 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal15 .prev,
#myModal15 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal15 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal15 img {
    margin-bottom: -4px;
}

#myModal15 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal15 .demo {
    opacity: 0.6;
}

#myModal15 .active,
#myModal15 .demo:hover {
    opacity: 1;
}

#myModal15 img.hover-shadow {
    transition: 0.3s;
}

#myModal15 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}




/* Styles for the sixteenth modal */
#myModal16 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal16 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal16 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal16 .close:hover,
#myModal16 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal16 .mySlides {
    display: none;
}

#myModal16 .cursor {
    cursor: pointer;
}

#myModal16 .prev,
#myModal16 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal16 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal16 .prev:hover,
#myModal16 .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal16 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal16 img {
    margin-bottom: -4px;
}

#myModal16 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal16 .demo {
    opacity: 0.6;
}

#myModal16 .active,
#myModal16 .demo:hover {
    opacity: 1;
}

#myModal16 img.hover-shadow {
    transition: 0.3s;
}

#myModal16 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}




/* Styles for the seventeenth modal */

#myModal17 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal17 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal17 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal17 .close:hover,
#myModal17 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal17 .mySlides {
    display: none;
}

#myModal17 .cursor {
    cursor: pointer;
}

#myModal17 .prev,
#myModal17 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal17 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal17 .prev,
#myModal17 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal17 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal17 img {
    margin-bottom: -4px;
}

#myModal17 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal17 .demo {
    opacity: 0.6;
}

#myModal17 .active,
#myModal17 .demo:hover {
    opacity: 1;
}

#myModal17 img.hover-shadow {
    transition: 0.3s;
}

#myModal17 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}




/* Styles for the eighteenth modal */

#myModal18 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal18 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal18 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal18 .close:hover,
#myModal18 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal18 .mySlides {
    display: none;
}

#myModal18 .cursor {
    cursor: pointer;
}

#myModal18 .prev,
#myModal18 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal18 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal18 .prev,
#myModal18 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal18 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal18 img {
    margin-bottom: -4px;
}

#myModal18 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal18 .demo {
    opacity: 0.6;
}

#myModal18 .active,
#myModal18 .demo:hover {
    opacity: 1;
}

#myModal18 img.hover-shadow {
    transition: 0.3s;
}

#myModal18 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



/* Styles for the nineteenth modal */

#myModal19 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal19 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal19 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal19 .close:hover,
#myModal19 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal19 .mySlides {
    display: none;
}

#myModal19 .cursor {
    cursor: pointer;
}

#myModal19 .prev,
#myModal19 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal19 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal19 .prev:hover,
#myModal19 .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal19 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal19 img {
    margin-bottom: -4px;
}

#myModal19 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal19 .demo {
    opacity: 0.6;
}

#myModal19 .active,
#myModal19 .demo:hover {
    opacity: 1;
}

#myModal19 img.hover-shadow {
    transition: 0.3s;
}

#myModal19 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}




/* Styles for the twenty modal */

#myModal20 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal20 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal20 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal20 .close:hover,
#myModal20 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal20 .mySlides {
    display: none;
}

#myModal20 .cursor {
    cursor: pointer;
}

#myModal20 .prev,
#myModal20 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal20 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal20 .prev:hover,
#myModal20 .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal20 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal20 img {
    margin-bottom: -4px;
}

#myModal20 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal20 .demo {
    opacity: 0.6;
}

#myModal20 .active,
#myModal20 .demo:hover {
    opacity: 1;
}

#myModal20 img.hover-shadow {
    transition: 0.3s;
}

#myModal20 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}






/* Styles for the twenty one modal */

#myModal21 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal21 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal21 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal21 .close:hover,
#myModal21 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal21 .mySlides {
    display: none;
}

#myModal21 .cursor {
    cursor: pointer;
}

#myModal21 .prev,
#myModal21 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal21 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal21 .prev,
#myModal21 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal21 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal21 img {
    margin-bottom: -4px;
}

#myModal21 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal21 .demo {
    opacity: 0.6;
}

#myModal21 .active,
#myModal21 .demo:hover {
    opacity: 1;
}

#myModal21 img.hover-shadow {
    transition: 0.3s;
}

#myModal21 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}




/* Styles for the twenty two modal */

#myModal22 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal22 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal22 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal22 .close:hover,
#myModal22 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal22 .mySlides {
    display: none;
}

#myModal22 .cursor {
    cursor: pointer;
}

#myModal22 .prev,
#myModal22 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal22 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal22 .prev,
#myModal22 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal22 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal22 img {
    margin-bottom: -4px;
}

#myModal22 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal22 .demo {
    opacity: 0.6;
}

#myModal22 .active,
#myModal22 .demo:hover {
    opacity: 1;
}

#myModal22 img.hover-shadow {
    transition: 0.3s;
}

#myModal22 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


/* Styles for the twenty three modal */
#myModal23 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal23 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal23 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal23 .close:hover,
#myModal23 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal23 .mySlides {
    display: none;
}

#myModal23 .cursor {
    cursor: pointer;
}

#myModal23 .prev,
#myModal23 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal23 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal23 .prev:hover,
#myModal23 .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal23 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal23 img {
    margin-bottom: -4px;
}

#myModal23 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal23 .demo {
    opacity: 0.6;
}

#myModal23 .active,
#myModal23 .demo:hover {
    opacity: 1;
}

#myModal23 img.hover-shadow {
    transition: 0.3s;
}

#myModal23 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}




/* Styles for the twenty four modal */
#myModal24 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal24 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal24 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal24 .close:hover,
#myModal24 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal24 .mySlides {
    display: none;
}

#myModal24 .cursor {
    cursor: pointer;
}

#myModal24 .prev,
#myModal24 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal24 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal24 .prev,
#myModal24 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal24 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal24 img {
    margin-bottom: -4px;
}

#myModal24 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal24 .demo {
    opacity: 0.6;
}

#myModal24 .active,
#myModal24 .demo:hover {
    opacity: 1;
}

#myModal24 img.hover-shadow {
    transition: 0.3s;
}

#myModal24 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



/* Styles for the twenty five modal */
#myModal25 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal25 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal25 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal25 .close:hover,
#myModal25 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal25 .mySlides {
    display: none;
}

#myModal25 .cursor {
    cursor: pointer;
}

#myModal25 .prev,
#myModal25 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal25 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal25 .prev,
#myModal25 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal25 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal25 img {
    margin-bottom: -4px;
}

#myModal25 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal25 .demo {
    opacity: 0.6;
}

#myModal25 .active,
#myModal25 .demo:hover {
    opacity: 1;
}

#myModal25 img.hover-shadow {
    transition: 0.3s;
}

#myModal25 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


/* Styles for the twenty six modal */

#myModal26 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal26 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal26 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal26 .close:hover,
#myModal26 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal26 .mySlides {
    display: none;
}

#myModal26 .cursor {
    cursor: pointer;
}

#myModal26 .prev,
#myModal26 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal26 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal26 .prev,
#myModal26 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal26 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal26 img {
    margin-bottom: -4px;
}

#myModal26 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal26 .demo {
    opacity: 0.6;
}

#myModal26 .active,
#myModal26 .demo:hover {
    opacity: 1;
}

#myModal26 img.hover-shadow {
    transition: 0.3s;
}

#myModal26 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/* Styles for the twenty seven modal */
#myModal27 {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
}

#myModal27 .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 1200px;
}

#myModal27 .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
}

#myModal27 .close:hover,
#myModal27 .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
}

#myModal27 .mySlides {
    display: none;
}

#myModal27 .cursor {
    cursor: pointer;
}

#myModal27 .prev,
#myModal27 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
}

#myModal27 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

#myModal27 .prev,
#myModal27 .next {
    background-color: rgba(0, 0, 0, 0.8);
}

#myModal27 .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

#myModal27 img {
    margin-bottom: -4px;
}

#myModal27 .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
}

#myModal27 .demo {
    opacity: 0.6;
}

#myModal27 .active,
#myModal27 .demo:hover {
    opacity: 1;
}

#myModal27 img.hover-shadow {
    transition: 0.3s;
}

#myModal27 .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}