.ff-primary {
    font-family: "Quicksand", sans-serif
}

.ff-secondary {
    font-family: "Montserrat", sans-serif
}

.wrapper, body {
    margin: 0 auto
}

html {
    -webkit-text-size-adjust: 100%
}

.rightcolumn li a, .theatreheader a, .theatreinformation a, footer a, footer a:hover {
    text-decoration: none
}

body {
    background-color: #151A1D;
}

body.randomBg {
    animation: gradientAnimation 140s linear infinite alternate;
    background-image: url(symlink-svg.php?file=masks.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    animation: subtleMove 360s infinite alternate;
    flex-wrap: wrap;
}

@keyframes gradientAnimation {
    0%, 100% {
        background-position: 0% 0%;
    }
    50% {
        background-position: 100% 100%;
    }
}

@keyframes subtleMove {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px); /* Adjust this value for the desired movement */
    }
}

body {
    font-family: "Quicksand", sans-serif
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Montserrat", sans-serif
}

body a {
    color: #00008b
}

body a:hover {
    color: #8b0000
}

::selection {
    background: #af0001;
    color: #fff
}

::-moz-selection {
    background: #af0001;
    color: #fff
}

.menu a, .menu a:hover {
    color: #000
}

.wrapper {
    padding: 0;
    background-color: #efebf0;
    max-width: 850px;
    border-top: .05em solid #000;
    width: 100%;
}

.menu li, .mitheader {
    background-color: #fff
}

.mitheader {
    border-bottom: .75em solid #000;
    height: 4.3em
}

.mitheader img {
    margin: .25em 0 0 .6em
}

.mitheader a img:hover {
    opacity: .7
}

.menu a {
    display: block;
    padding: .6em 1.3em
}

.menu li {
    display: block;
    float: left
}

.menu li ul li {
    box-shadow: -8px 37px 20px 8px rgba(0, 0, 0, .36);
    -webkit-box-shadow: -8px 37px 20px 8px rgba(0, 0, 0, .36);
    -moz-box-shadow: -8px 37px 20px 8px rgba(0, 0, 0, .36);
    float: none;
    margin: 0 0 0 -20px
}

.menu li ul {
    display: none;
    position: absolute;
    z-index: 5;
    margin-left: -187px;
}

.menu li:hover ul {
    display: block;
    width: 300px
}

.menu {
    float: right;
    margin: -3em 2em 0 0
}

.menu li {
    margin-left: -2em
}

.menu li:hover {
    background-color: #d3d3d3;
    color: #fff
}

.menu li .state {
    background-color: #000;
    padding: 0 0 0 12px
}

button {
    background: grey;
    border: .1em solid #000
}

.button:focus, .button:hover, button:focus, button:hover {
    background-color: #8b0000
}

button:disabled, button[disabled=disabled] {
    background: #d3d3d3;
    border: .1em solid grey;
    color: grey;
    pointer-events: none
}

.buytickets {
    background-color: grey;
    text-decoration: none !important;
}

.buytickets a {
    background-color: #8b0000
}

h3 {
    margin: .25em 0 -.35em .05em
}

p.subhead {
    font-size: 1em;
    margin: .25em 0 -1em .25em
}

hr {
    background-color: #a3a3a3;
    height: 10px;
    width: 100%
}

.theatreheader {
    background: linear-gradient(to bottom, #750000, #680000);
    color: #fff;
    height: 3.7em;
    line-height: 3.2em;
    padding: 2px 25px;
    word-spacing: .5em;
    text-shadow: 0 3px 3px rgba(0, 0, 0, .5);
}

.theatreheader a {
    color: #fff
}

.theatreheader a:hover {
    border-bottom: .05em solid #fff;
    color: #fff
}

.theatreheadertext {
    font-family: "Montserrat", sans-serif;
    float: left;
    font-size: 2.5em
}

.facebook svg {
    float: left;
    fill: #fff;
    height: 3em;
    width: 3em
}

div.showtimespage {
    margin: -1em
}

.theatreinfo {
    background: #787878;
    border-bottom: .75em solid #000;
    color: #fff
}

.theatreinformation {
    color: #fff;
    margin: 0;
    position: relative
}

.theatreinformation a {
    color: #fff
}

.theatreinformation a:hover {
    border-bottom: .05em solid #fff;
    color: #fff;
    text-decoration: none
}

.mithometext {
    line-height: 1.3em;
    margin-top: 1em
}

.rightcolumn {
    background: #dcdfe9;
    border-left: 1px #000 solid;
    border-bottom: 1px #000 solid;
    float: right;
    margin: 0 0 1px
}

.rightcolumn ul {
    line-height: 2em;
    list-style: none;
    margin: 0;
    text-align: left;
    text-indent: 1em
}

@media (min-width: 700px) {
    .rightcolumn li a {
        font-size: 1.15rem;
        margin-bottom: .1rem;
    }
}

@media (min-width: 1140px) {
    .rightcolumn li a {
        font-size: 1.4rem;
        margin-bottom: .35rem;
    }
}

.csposterdiv, .descriptioncell, .tab-bar h2, .ticketsinfo, .tickettable td, .tickettable th {
    text-align: center
}

.rightcolumn li a {
    color: #000;
    display: block
}

.rightcolumn li a:hover {
    background-color: #03168f !important;
    color: #fff
}

.rightcolumn img {
    hight: auto;
    width: 6rem;
    margin: .5em 0 1em 1em
}

.rightcolumn a img:hover {
    opacity: .6
}

.facebook svg:hover {
    fill: grey
}

.panel {
    background: #dcdfe9;
    border: 1px solid grey;
    margin: -1.2em 0 1.2em;
    padding: 0
}

.panel p {
    font-size: 1em;
    margin: -1.6em 0 0;
    padding: 1.2em
}

.panel a {
    color: #00008b
}

.panel a:hover {
    background: #8b0000;
    color: #fff
}

.panel.announcement {
    background: #ecc1c9;
    border: none;
    font-size: .75em;
    margin: -20px 0 2em
}

.panel.announcement p {
    color: #8b0000
}

fieldset {
    background: #dfdce0;
    border: 1px solid #000
}

fieldset legend {
    background: #a9a9a9;
    border: 1px solid #000;
    color: #fff
}

fieldset a {
    color: #00008b
}

fieldset a:hover {
    background: #8b0000;
    color: #fff
}

.footerlogo {
    width: 6em
}

footer a {
    color: #fff
}

footer a:hover {
    color: grey
}

.panel.callout {
    background: #d3bdbd;
    border: .1em dashed #8b0000
}

.panel.callout img {
    border: .1em solid #000
}

textarea {
    height: 6em;
    resize: none
}

.help {
    background: #a9a9a9;
    border: 1px solid grey;
    border-radius: 25px;
    color: #fff;
    padding: 0 .5em
}

.menubutt img {
    height: 100%;
    float: right;
}

.tab-bar {
    background: rgba(82, 0, 0, .75) !important;
    border-bottom: 1px #000 solid;
    box-shadow: -5px -10px 5px 13px rgba(0, 0, 0, .75);
    -moz-box-shadow: -5px -5px 5px 13px rgba(0, 0, 0, .17);
    -webkit-box-shadow: -5px -5px 5px 13px rgba(0, 0, 0, .17);
    box-sizing: border-box;
    font-size: 1.25em;
    height: 2.38em;
    line-height: 2.25em;
    position: fixed;
    text-shadow: 2px 2px rgba(0, 0, 0, .5);
    top: 0;
    width: 100%;
    white-space: nowrap;
    z-index: 1
}

.tab-bar h2 {
    font-size: 1em;
    font-weight: 400;
    margin-right: 10px;
    margin-top: 1px
}

.mobilehead {
    background: #8b0000;
    height: 3em;
    border: #000 solid 2px;
    width: 100%
}

.csposterdiv {
    float: left !important;
    line-height: 1.3em;
    padding: 10px 10px 0 0
}

.csposterdiv img, .posterdiv img {
    outline: 1px solid #000 !important;
    aspect-ratio: 1296 / 1920 !important;
}

.csposterdiv img {
    margin: 0 0 .25em;
    width: 125px
}

.print svg {
    background: 0 0;
    height: .75em;
    fill: grey;
    margin: 8px 0 0;
    width: 3em
}

.print svg:hover {
    fill: #8b0000
}

.move-right > .inner-wrap {
    margin-left: 70%;
    transform: none
}

.left-off-canvas-menu, .move-right > .inner-wrap {
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    -webkit-transform: none
}

.left-off-canvas-menu {
    bottom: auto;
    height: 100%;
    left: 0;
    position: fixed;
    right: auto;
    transform: none;
    top: 0;
    width: 0
}

.move-right .left-off-canvas-menu {
    width: 70%
}

footer {
    background-color: #000;
    border-top: 1em #efebf0 solid;
    color: #d6d6d6;
    margin: 0 0 10em;
    padding: 1em
}

footer a img:hover {
    opacity: .4
}

.bottomspace {
    padding-bottom: 1.2em
}

.fi-social-android, .fi-social-apple {
    font-size: 2em;
    line-height: 1em
}

.csposterdiv img:hover,
.posterdiv img:hover {
    filter: brightness(0.4); /* Adjust brightness (0 = black, 1 = normal, >1 = brighter) */
    transition: .25s;
}

@keyframes flash {
    0% {
        opacity: .4
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes flash {
    0% {
        opacity: .4
    }
    100% {
        opacity: 1
    }
}

.tickettable {
    border: 1px solid #000;
    border-collapse: collapse;
    padding: 15px;
    width: 100%
}

.tickettable th {
    background: #000;
    color: #fff;
    font-size: .8em;
    line-height: .5em
}

.tickettable tr {
    border: 2px solid #000
}

.descriptioncol {
    width: 65%
}

.ticketsinfo {
    line-height: 1.5em
}

.dates, .times {
    line-height: 1.2em
}

.linkicon {
    margin: 0 0 5px;
    width: 25px
}

.showtimestable {
    margin: 0;
    word-wrap: unset;
    min-height: 180px
}

.showtimestable table {
    border: 0;
    border-bottom: #000 3px solid;
    border-collapse: collapse;
    width: 100%
}

.showtimes table tr.even, table tr.alt, table tr:nth-of-type(even) {
    background: #c9c9c9
}

.movietitle {
    background: #000;
    color: #fff;
    font-size: .95rem;
    font-weight: 500;
    line-height: 1.75rem;
    padding: .1rem 5.5rem .2rem .5rem
}

.moviesubtitle {
    background: #dcdfe9;
    color: #8b0000;
    font-size: .95rem;
    font-weight: 600;
    padding: 0 .4em;
    line-height: 1.75rem
}

.times {
    font-size: 1.1rem;
    line-height: 1.5em
}

.showtime {
    margin: .5em 0
}

.showtimes table tr th, table tr td {
    color: #222;
    font-size: .95rem;
    padding: .3rem;
    text-align: left
}

.reveal-modal {
    background-color: #dcdfe9;
    border: 5px solid #a9a9a9;
    border-radius: 0
}

.ratings {
    height: 1em;
    margin: -3px .5rem 0 0
}

.close-reveal-modal:hover {
    color: #8b0000
}

a:focus, a:hover {
    color: inherit
}

@media only screen and (max-width: 40.01em) {
    .moviesubtitle, .tickettable th {
        text-align: center
    }

    body {
        background-image: none;
    }

    div.showtimespage {
        padding: 0;
        margin: 0 -1em
    }

    .showtimestable {
        margin: -1em 0
    }

    .pagecontent h3 {
        padding: 0;
        margin: 0 0 -1em 2.2em
    }

    .posterdiv img {
        margin: .5rem 0 .5rem;
        width: 100px;
    }


    .content p {
        max-width: 72ch
    }

    .csposterdiv img {
        border: 1px solid #000;
        margin: 0 0 .25em;
        width: 7em
    }

    .csposterdiv {
        font-size: .95em;
        letter-spacing: -1px
    }


    h3 {
        font-size: 1.3em
    }

    .theatreinfo img {
        width: 100%
    }

    hr {
        border: 1px solid grey;
        height: 5px
    }

    p.subhead {
        font-size: .75em;
        margin: .8em 0 -1.2em
    }

    p.subhead .hideshow a {
        font-size: 1.4em
    }

    .print svg {
        height: .8em;
        margin: 6px -10px 0 0;
        width: 3.4em
    }

    .theatreinfo {
        background: #787878;
        border-bottom: 5px solid #000;
        color: #fff
    }

    form {
        padding: 0 3em
    }

    .tickettable {
        margin: 0 0 1em;
        padding: 0;
        width: 100%
    }

    .tickettable th {
        background: #000;
        color: #fff;
        font-size: .8em;
        line-height: .5em
    }

    .descriptioncol {
        width: 65%
    }

    .facebook svg {
        margin: 2em 0 2.5em
    }
}

@media only screen and (min-width: 640.16px) {
    .theatreinformation p {
        line-height: 1.2;
        padding: .8em 0 0
    }


    form {
        max-width: 20em
    }
}

@media only screen and (max-width: 736px) {
    .theatreinformation p {
        font-size: .8em;
        line-height: 1.2;
        padding: .8em 0 0
    }
}

@media only screen and (min-width: 1024px) {
    .theatreinformation p {
        line-height: 1.4;
        padding: 1.75em 0 0
    }
}

[data-hide] {
    display: none
}

.black-border-top {
    border-top: 3px solid #000
}

.black-border-bottom {
    border-bottom: 3px solid #000
}

.exit-off-canvas {
    display: none;
    background: #fff !important;
    opacity: .5
}

.announcement p {
    line-height: 1.6em;
    color: #8b0000;
    font-weight: 700;
    font-size: 1.1em;
    padding: 1em
}

td.times .notimes, td.times.notimes {
    color: #8b0000;
    font-style: italic;
    word-spacing: normal !important
}

.black-bar {
    font-size: 1.2em;
    text-align: center;
    width: 100%;
    color: #fff;
    background: #181b1d;
    margin-bottom: .5em
}

.lazy {
    background: 0 0 !important
}

tr.today {
    background: rgba(175, 197, 0, .25) !important
}

#content {
    height: 2000px
}

.st.nottoday, .veeziMovie.nottoday {
    display: none !important
}

li.accordion-navigation a {
    background: #787878 !important;
    color: #fff !important
}

li.accordion-navigation a:hover {
    background: #8b0000 !important;
    color: #fff !important
}

p.subhead .button.expand {
    padding: 10px 0;
    margin: 5px 0;
    background-color: gray
}

p.subhead .button.expand:active, p.subhead .button.expand:focus, p.subhead .button.expand:hover {
    background-color: #696969
}

.showtime {
    display: inline-block;
    margin-right: 1rem;
}

.buyModalLink {
    font-size: .75rem;
    position: absolute;
    right: 1.5rem;
    top: .3rem;
    border: 1px solid #dadada !important;
    color: #fff;
    padding: .1rem .25rem;
    font-weight: 400;
    white-space: nowrap;
    line-height: 1rem
}

@media (max-width: 40em) {
    .buyModalLink {
        position: inherit;
        margin: 0 1rem
    }

    .movietitle {
        line-height: 1.75rem;
        padding: .1rem .5rem .2rem
    }
}

.buyModalLink:active, .buyModalLink:focus, .buyModalLink:hover {
    background: #fff;
    color: #000
}

.lazyload, .lazyloading {
    opacity: 0
}

.lazyloaded {
    opacity: 1;
    transition: opacity .3s
}

.darkmodeSideBarLogo {
    display: none
}

.sideBarLogo {
    display: block
}

#mitlogo {
    display: block
}

#mitlogoDark {
    display: none
}

@media (prefers-color-scheme: dark) {
    .wrapper {
        background-color: #2b2b2b
    }

    .subhead, body .center, body a, h1, h2, h3, h4, h5, h6 {
        color: #fff
    }

    body .pagecontent a {
        text-decoration: underline;
        font-weight: 700
    }

    .print svg {
        fill: #fff
    }

    footer {
        border-top: 1em #2b2b2b solid !important
    }

    .moviesubtitle {
        background: #004a6f;
        color: #fff
    }

    tr.today {
        background: #8c7700 !important
    }

    table {
        background: #242424;
        text-shadow: 1px 1px 0 #151515
    }

    table tr td {
        color: #fff
    }

    tr.st {
        display: table-row !important;
    }

    .showtimes table tr.even, table tr.alt, table tr:nth-of-type(2n) {
        background: #464646;
        color: #fff;

        width: 100%;
    }

    .pagecontent .accordion .accordion-navigation > .content.active, .pagecontent .accordion dd > .content.active {
        background: #424242
    }

    td.times .notimes, td.times.notimes {
        color: #ff8a8a;
        font-weight: 700
    }

    .nextweek {
        background: #6f0000 !important
    }

    .reveal-modal {
        background-color: #2b2b2b;
        border-radius: 0;
        color: #fff
    }

    .reveal-modal a {
        font-weight: 700;
        text-decoration: underline
    }

    a.close-reveal-modal {
        text-decoration: none
    }

    .rightcolumn {
        background: #000 !important
    }

    .rightcolumn li a {
        color: #fff;
        display: block
    }

    .darkmodeSideBarLogo {
        display: block
    }

    .sideBarLogo {
        display: none
    }

    .theatreinfo {
        background: #232323
    }

    .mitheader {
        border-bottom: .75em solid #000;
        height: 4.3em
    }

    .menu li, .mitheader {
        background-color: #000
    }

    .menu li a, .mitheader a {
        color: #fff
    }

    li.state {
        background: #404040 !important
    }

    #mitlogo {
        display: none
    }

    #mitlogoDark {
        display: block
    }
    body {
        filter: brightness(90%);

    }

    iframe {
        filter: invert(1);
    }

    .g-recaptcha iframe {
        filter: invert(0);
    }
}

.past-time {
    opacity: .5
}

.dates {
    font-size: .9rem;
    font-stretch: normal;
    font-style: italic;
    width: 7.3rem;
    padding-left: .75rem;
    padding-bottom: .25rem
}


.dates i:first-of-type {
    white-space: nowrap;
    text-decoration: none;
    font-size: .9rem;
    line-height: 1.25rem
}

.dates i:last-of-type {
    white-space: nowrap
}

#print_button {
    display: none !important
}

.showtimestable.discontFilm .posterdiv::after {
    background: #0b4e00;
    height: 1.5rem;
    content: '$4 Film';
    width: 100%;
    display: block;
    color: #fff;
    font-size: 1rem;
    font-family: Open Sans, Arial;
    min-width: 110px
}

@media only screen and (min-width: 832px) {
    .showtimestable.discontFilm .posterdiv::after {
        width: 125px;
        margin-left: 2px
    }


}

@media only screen and (min-width: 1140px) {
    body {
        font-size: 1.25rem
    }

    .large-12.columns.mitheader.show-for-medium-up {
        height: 75px
    }

    .row, .theatreheader, .wrapper {
        max-width: 1230px
    }

    .menu {
        font-size: 1.1rem;
        margin: -3rem 0 0 0
    }

    .menu li {
        white-space: nowrap
    }

    .theatreheadertext a {
        font-size: 3rem !important
    }

    .theatrephoto img {
        max-height: unset !important;
        width: 100%
    }

    .visible-for-medium-up.theatreinformation {
        display: flex;
        justify-content: center;
        align-items: flex-start
    }

    .visible-for-medium-up.theatreinformation p {
        font-size: 1.5rem !important;
        height: 17.3rem;
        margin-right: 4rem;
        margin-top: 1rem
    }

    .visible-for-medium-up.theatreinformation b:last-of-type {
        margin-top: 2rem
    }

    .print svg {
        font-size: 2.2rem
    }

    p.subhead {
        margin-left: 0
    }

    .posterdiv img {
        width: 150px;
        aspect-ratio: 1296 / 1920;
    }

    .movietitle {
        font-size: 1.1rem;
        padding: .25em 7.5rem .5rem .7rem
    }

    .buyModalLink {
        font-size: .9rem;
        margin-top: 3px
    }

    .rightcolumn ul {
        line-height: 2.5rem;
        font-size: 1.25rem !important
    }

    img.darkmodeSideBarLogo, img.sideBarLogo {
        height: auto !important;
        width: 9rem
    }

    a, button, input, li, p, table, ul {
        font-size: 1.15rem
    }

    input:not([type]), input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], textarea {
        height: 3rem
    }

    .showtimes table tr th, table tr td {
        font-size: 1.15rem;
        padding: .5rem;
        line-height: 1.6rem !important
    }

    .dates, .dates i:first-of-type {
        font-size: 1.1rem
    }

    .showtime {
        font-size: 1.2rem;
        margin-right: 1.5rem;
        padding: .35rem
    }

    .csContainer .csposterdiv {
        width: 16rem !important
    }

    td.moviesubtitle span {
        line-height: 2rem;
    }

    td.moviesubtitle {
        font-size: 1.15rem
    }

    @media (prefers-color-scheme: dark) {
        .mitheader img {
            margin: .5em 0 0 .6em
        }
    }
}

.off-canvas-wrap {
    box-shadow: 0 0 100px 50px rgba(0, 0, 0, .99)
}

small {
    font-size: 70%
}

@media only screen and (min-width: 1140px) {
    .menu li ul {
        margin-left: -170px;
    }
}


.showtime.pastTime a, .showtime.soldOut a {
    opacity: .5;
    pointer-events: none;
}


span.showtime a {
    color: #fff;
    background: #707070;
    border: 1px solid #383838;
    font-family: "Montserrat", sans-serif;
    padding: 7px 6px;
    border-radius: 7px;
    transition: .5s;
}


span.showtime a:hover {
    background: #670000;
    border: 1px solid #440606FF;
    transition: .5s;
}


@media only screen and (max-width: 1139.9px) {

    .dates {
        width: 6rem;
    }

    span.showtime a {
        font-size: .9rem;
        padding: 4px 5px;
    }

    span.showtime {
        margin-bottom: .8rem;
        margin-top: .8rem;
    }

    span.showtime a {
        font-size: .9rem;
        padding: 6px 7px;
    }
}

@media only screen and (max-width: 40.01em) {
    .showtimestable.discontFilm .posterdiv {
        margin-bottom: 1.5rem
    }

    .showtimestable.discontFilm .posterdiv::after {
        bottom: -1.2rem;
        position: absolute;
        min-width: 0;
        width: 86px;
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        text-align: center
    }

}

.pastTime.soldOut a:after {
    content: 'SOLD OUT';
    position: absolute;
    font-size: .5rem;
    padding: 2px 5px;
    white-space: nowrap;
    left: 0;
    margin: -8px 0 0 9px;
    background: darkred;
    line-height: 1;
}

.pastTime.soldOut {
    position: relative
}

body.doric .st.closedToday, body.doric .view-more {
    display: none !important;
}

body.doric .showMore {
    height: unset !important;
}


::selection {
    background: #900000
}

::-moz-selection {
    background: #3A4143
}

.menu a {
    color: #000
}

.menu li a:hover,
.menu li:hover {
    background-color: #616767;
    color: #fff !important
}

button:disabled,
button[disabled=disabled] {
    background: #616767;
    color: #fff
}

.theatreheadertext {
    font-size: 2.5em
}

.rightcolumn li a:hover {
    background-color: #151A1C !important
}

.panel {
    background: #e2e2e2
}

.footerlogo {
    width: 9em
}

.tab-bar {
    background: rgba(75, 75, 75, .75)
}

footer {
    border-top: 1em #ededed solid
}

.close-reveal-modal:hover {
    background: #151A1C
}

.nextweek {
    text-align: center;
    background: #8b0000;
    color: #fff;
    margin: 0 1em 1em;
    font-weight: 700;
    border: 1px solid grey
}

@media only screen and (max-width: 641px) {
    .nextweek {
        margin: 0 0 2em
    }
}

button, .button {
    font-family: "Quicksand", sans-serif
}

.reveal-modal-bg {
    display: none !important;
}

@media only screen and (min-width: 1140px) {
    .wrapper {
        width: 1140px
    }
}