@font-face {
    font-family: 'Druk,sans-serif';
    src: url('./../assets/fonts/druk-bold/DrukWide-Bold.eot');
    src: url('./../assets/fonts/druk-bold/DrukWide-Bold.woff2') format('woff2'), url('./../assets/fonts/druk-bold/DrukWide-Bold.woff') format('woff'), url('./../assets/fonts/druk-bold/DrukWide-Bold.ttf') format('truetype'), url('./../assets/fonts/druk-bold/DrukWide-Bold.svg') format('svg');
}

body {
    padding: 0px;
    margin: 0px;
    font-family: 'Druk,sans-serif';
    font-weight: 400;
    font-style: normal;
    color: #fff;
    text-align: center;
    letter-spacing: 0px;
    background: url(../assets/Mahalia-IRLalbum.jpg) no-repeat fixed center center;
    background-size: cover;
    height: 100vh;
}

.art-work-wrapper .listen-now-button,
.art-work-wrapper .watch-the-video-button {
    font-size: .9vw;
}

img {
    width: 100%;
    height: 100%;
}

a {
    text-decoration: none;
    transition: all 0.5s ease-in-out;
    color: #D02012;
}

a:hover {
    opacity: 0.6;
}

h2.release-title {
    color: #fff;
    text-transform: uppercase;
    font-size: 2vw;
}

.copyrights {
    width: 70%;
    display: inline-block;
    text-align: center;
}

.copyrights a {
    color: #fff;
}

.mob-footer {
    display: none;
}

.socials {
    width: 20%;
    text-align: right;
    display: inline-block;
}

.leftWrapper .socials {
    position: absolute;
    bottom: 1vw;
    left: 0;
    width: 100%;
}

.leftWrapper .socials a {
    display: block;
    width: 100%;
    text-align: center;
}

.leftWrapper {
    position: fixed;
    width: 4vw;
    height: 100vh;
    top: 0;
    left: 0;
    background: #D02012;
}

.leftWrapper .name-logo {
    position: relative;
    top: 22px;
    width: 35%;
    height: 100%;
    margin: 0 auto;
}

.socialicon {
    margin: 6px;
    width: 25px;
    height: 25px;
    opacity: 1;
    transition-duration: 0.2s;
}

span.line {
    height: 2px;
    width: 8vw;
    background-color: #D02012;
    display: inline-block;
    /* vertical-align: super; */
    vertical-align: middle;
}

.footer a {
    color: #fff;
}

.socials a:hover {
    opacity: 0.3;
    color: #7f589ba8;
}

.ipadAdjust {
    top: calc(100vh - 50%) !important;
}

.iphoneAdjust {
    top: calc(100vh - 65%) !important;
}

.logo-description {
    padding: 0px 0px 2vw;
    text-transform: uppercase;
    color: #fff;
}

.store-button a {
    color: #fff;
}

.listen-now-button,
.watch-the-video-button {
    padding: 1.5vw;
    line-height: 1vw;
    font-size: 1vw;
    background: #fff;
    color: #D02012;
    margin: 0px 10px;
    cursor: pointer;
    text-transform: uppercase;
    transition: all ease-in-out 0.3s;
    display: inline-block;
    border: 1px solid #D02012;
    font-size: 1.5vw;
}

.top-section {
    width: 96%;
    position: fixed;
    padding: 1vw 0px;
    text-align: right;
    margin: 0 auto;
}

.signup-button,
.tour-button,
.store-button,
.presents,
.enter-site {
    display: inline-block;
    cursor: pointer;
    margin: 0px 16px;
    font-size: 1.2vw;
    text-transform: uppercase;
}

.fleft {
    float: left;
}

.fleft.enter-site {
    padding-left: 3vw;
}

.fleft.presents.menu {
    padding-left: 3vw;
}

.enter-site a {
    color: #fff;
}

.listen-now-button:hover,
.watch-the-video-button:hover {
    opacity: 0.6;
}

.closeicon {
    width: 20px;
    height: 20px;
    position: absolute;
    right: 2%;
    top: 16px;
    cursor: pointer;
    z-index: 1;
    transition: 0.5s ease-in-out;
}

.closeicon:hover {
    opacity: 0.7;
}

.mlist-message-description {
    margin-bottom: 20px;
    font-size: 1.3vw;
}

.footer {
    width: 100%;
    bottom: 12px;
    font-size: 0.705vw;
    padding-bottom: 1vw;
    line-height: 1vw;
}

.footer a {
    font-size: 0.705vw;
}

.mlist-wrapper {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50vw;
    height: 75vh;
    background: #000;
    z-index: 1;
    border: 1px solid #D02012;
}

.terms a {
    color: #fff;
}

.tour-wrapper {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60vw;
    height: 90vh;
    background: #000;
    z-index: 1;
    border: 1px solid #D02012;
    overflow: scroll;
}

.presents-wrapper {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60vw;
    height: 90vh;
    background: #000;
    z-index: 1;
    border: 1px solid #D02012;
    /* overflow: scroll; */
}

.tour-wrapper::-webkit-scrollbar {
    display: none;
}

.tour-inner-wrapper {
    width: 100%;
    height: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    /* overflow: scroll; */
}

#presents-section .tour-inner-wrapper {
    height: 100%;
}

.tour-details {
    /* overflow-x: hidden; */
}

.tour-details1::-webkit-scrollbar {
    /* display: none;*/
}

.tour-details::-webkit-scrollbar {
    width: 4px;
}


/* Track */

.tour-details::-webkit-scrollbar-track {
    background: transparent
}


/* Handle */

.tour-details::-webkit-scrollbar-thumb {
    /*   background: #D02012;*/
}

.sign-up-wrapper {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

.sign-up-and-icon {
    position: relative;
    padding: 25px 0;
}

.sign-up-and-icon:before,
.sign-up-and-icon:after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: calc(42.3% - 125px);
    border: 1px solid #ebebeb;
}

.sign-up-and-icon:before {
    left: 7.3%;
}

.sign-up-and-icon:after {
    right: 7.3%;
}

.sign-up-text {
    font-size: 28px;
    letter-spacing: 5px;
    margin-right: 10px;
}

.mlist-message {
    font-family: 'Druk,sans-serif';
    font-weight: 400;
    font-size: 2.25vw;
    padding: 0px 0 30px;
    text-transform: uppercase;
    text-align: left;
    max-width: 25vw;
    margin: 0 auto;
    text-align: center;
    color: #D02012;
}

.plain-ml-wrapper {
    width: 100%;
}

form {
    font-size: 0;
    max-width: 420px;
    width: 100%;
    margin: 0 auto;
}

.message-description {
    font-size: 26px;
    color: #fff;
    text-align: center;
}

.sub-message-description {
    font-size: 20px;
    color: #fff;
    text-align: center;
    padding: 15px 0 35px;
}

.fieldWrap {
    padding-bottom: 1.5vw;
}

.fieldWrap {
    position: relative;
}

.fieldWrap input,
.fieldWrap select,
input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: #fff;
    background: rgb(36, 34, 34);
    border: none;
    height: 60px;
    font-size: 1.4vw;
    line-height: 60px;
    box-sizing: border-box;
    border-radius: 0;
    outline: none;
    width: 100%;
    text-align: left;
    font-family: 'Druk,sans-serif';
    font-weight: 400;
}

input[type="submit"] {
    background: #D02012;
    border-bottom: none !important;
    cursor: pointer;
    color: #fff;
    text-align: center;
}

.fieldWrap select {
    background: rgba(235, 235, 235, 0.44) url("../img/arrow-down.png") no-repeat scroll center right 15px;
    padding-right: 35px;
}

.input-error {
    position: absolute;
    bottom: 0px;
    width: 100%;
    left: 0;
    color: #ff0000;
    font-size: 16px;
    text-align: left;
    padding: 0;
    text-transform: uppercase;
}

input[type="submit"]:hover {
    background: #fff;
    color: #5b4d69;
}

input.errored {
    border: 1px solid red;
}

.fadeOut {
    display: none;
}

.fadeIn {
    display: block;
}

.terms-wrapper {
    padding-bottom: 30px;
    text-align: left;
}

.signup-button:hover,
.tour-button:hover,
.store-button:hover,
.presents:hover,
.enter-site:hover {
    opacity: 0.6;
}

.mlist-outer-wrapper,
.tour-outer-wrapper {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: #000000a6;
}


/* tour stylings */

#tour-widget .widget_row {
    font-family: 'Druk,sans-serif';
    text-transform: uppercase;
    line-height: 1;
}

.songkick-widget-container .plain_text {
    color: #fff !important;
}

.widget_row>div {
    width: 100% !important;
    padding-left: 0% !important;
}

.widget_row {
    flex-direction: column;
    align-items: center;
    border-bottom: none !important;
}

.widget_row div.event_date {
    width: 100% !important;
    font-size: 2vw;
    padding: 10px 0px;
}

.special-event.plain_text {
    font-size: 1.5vw;
    padding: 4px 0px;
    text-transform: uppercase;
}

.widget_row .event_links {
    display: flex;
    align-items: center;
}

.venue.plain_text {
    font-size: 1.5vw;
    padding: 4px 0px;
}

.location.plain_text {
    font-size: 1.5vw;
    padding: 4px 0px;
}

.event_location>div {
    /* height: 0.7vw !important; */
}

.featuring-artists.plain_text {
    display: none;
}

.widget_row .event_links {
    width: 24% !important;
    color: #D02012;
    text-transform: uppercase;
    font-size: 1.3vw;
    margin: 20px 0px 40px;
}

.link_text {
    color: #D02012 !important;
    text-transform: uppercase;
}

.event_links a {
    background-color: transparent !important;
    background: transparent !important;
    padding: 8px 10px !important;
}

.Wrapper {
    display: flex;
    align-items: center;
    height: 100%;
    justify-content: space-between;
    flex-direction: column;
}

.terms {
    font-weight: 500;
    font-family: 'Druk,sans-serif';
    font-size: 0.735vw;
    color: #ebebeb;
    padding: 15px 0 0;
    line-height: 1vw;
    text-align: center;
}

.letter_logo {
    width: 42vw;
    margin: 0 auto;
    padding-bottom: 30px;
}

.terms a {
    display: inline-block;
    border-bottom: 1px solid #ebebeb;
}

.terms a:hover {
    border-color: rgba(235, 235, 235, 0.44);
}

.tour-title {
    font-size: 3vw;
    text-transform: uppercase;
    margin: 40px 0px 60px;
    color: #D02012;
}

.presents-title {
    margin: 2vw 0;
}

#presents-section .tour-wrapper {
    width: 100vw;
    height: 100vh;
    border: none;
}

.tour-content {
    margin: 20px auto;
}

.date {
    font-size: 1.5vw;
    margin: 20px 0px;
    text-transform: uppercase;
}

.widget_row div.event_date {
    font-size: 1.5vw;
}

.venue {
    font-size: 1.5vw;
    /* margin: 20px 0px; */
    text-transform: uppercase;
}

.venue.plain_text {
    display: inline-block;
    width: auto;
    text-align: right;
}

.location.plain_text {
    display: inline-block;
    width: auto;
    text-align: left;
}

.venue.plain_text::after {
    content: ',';
    padding-right: 4px;
}

.ticket-button {
    color: #D02012;
    text-transform: uppercase;
    font-size: 1.3vw;
    margin: 10px 0px 40px;
}

.thankyou {
    font-size: 20px;
    color: #ebebeb;
    padding: 50px 0;
    text-transform: uppercase;
    letter-spacing: 3px;
}

::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #fff;
    text-align: center;
}

::-moz-placeholder {
    /* Firefox 19+ */
    color: #fff;
    text-align: center;
}

:-ms-input-placeholder {
    /* IE 10+ */
    color: #fff;
    text-align: center;
}

:-moz-placeholder {
    /* Firefox 18- */
    color: #fff;
    text-align: center;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff;
    -webkit-box-shadow: 0 0 0px 1000px rgb(36, 34, 34) inset;
}

footer {
    font-size: 14px;
    padding-bottom: 25px;
    letter-spacing: 1px;
}

.enter-site-wrapper {
    font-size: 16px;
    letter-spacing: 4px;
}

.enter-site-wrapper:after {
    content: "";
    width: 100px;
    height: 1px;
    display: block;
    margin: 25px auto;
    background: #ebebeb;
}

.copyright-text,
.copyright-links {
    line-height: 1.4;
}

.logo-description {
    font-size: 4.25vw;
}

.desktop_logo {
    display: block;
}

.mobile_logo {
    display: none;
}

.desktop {
    display: block;
}

.mobile {
    display: none;
}

.popup {
    display: none;
}

.presents-image {
    width: 30vw;
    margin: 0 auto;
}

.presents-content {
    width: 90%;
    margin: 0 auto;
    padding: 0;
    margin-bottom: 6vw;
}

.inner-content-wrapper {
    width: 50%;
    margin: 0 auto;
}

.art-work-image-wrapper {
    width: 30vw;
    margin: 0 auto;
    padding-bottom: 0vw;
}

#rightWrapper {
    padding-top: 20vw;
}

.art-work-wrapper {
    padding: 16vw 0;
    display: flex;
    display: grid;
    gap: 2vw;
    grid-template-columns: 1fr 1fr;
}

body.hidden {
    overflow: hidden;
}

.mobile-menu-list {
    display: none;
}

@media only screen and (max-width: 1024px) {
    .closeicon {
        right: 4%;
        top: 8vh;
    }
    .tour-inner-wrapper {
        padding-top: 10vh;
    }
    .tour-details {
        padding-bottom: 10vh;
    }
    .mobile-menu-list {
        display: block;
        padding-bottom: 5vw;
    }
    #rightWrapper {
        padding-top: 25vw;
    }
    .presents-image {
        width: 60vw;
        margin: 0 auto;
    }
    .inner-content-wrapper {
        width: 100%;
        margin: 0 auto;
    }
    .desktop {
        display: none;
    }
    .mobile {
        display: block;
    }
    .fieldWrap {
        padding-bottom: 4vw;
    }
    .leftWrapper .socials {
        display: none;
    }
    .mobile-footer-wrap {
        width: 100%;
        padding-bottom: 20px;
    }
    .inner-wrapper {
        height: 100%;
    }
    .desktop_logo {
        display: none;
    }
    .mlist-wrapper {
        width: 85vw;
        height: 55vh;
    }
    .tour-wrapper {
        width: 85vw;
        height: 60vh;
    }
    .mlist-message-description {
        font-size: 10px;
    }
    .mobile_logo {
        display: block;
    }
    .leftWrapper .name-logo {
        width: 80%;
        height: 30%;
        margin: 0 auto;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    /* tour stylings */
    .widget_row div.event_date {
        font-size: 14px !important;
    }
    .special-event.plain_text {
        font-size: 12px;
        padding: 8px 0px;
    }
    .venue.plain_text {
        font-size: 12px;
        padding: 8px 0px;
    }
    .location.plain_text {
        font-size: 12px;
        padding: 8px 0px;
    }
    .event_location>div {
        height: 0.7vw !important;
    }
    .featuring-artists.plain_text {
        display: none;
    }
    body .widget_row .event_links {
        width: 50% !important;
        color: #D02012;
        text-transform: uppercase;
        font-size: 16px;
        margin: 10px 0px 40px;
    }
    .widget_row .event_links {
        float: none !important;
        position: unset !important;
        top: unset !important;
        right: unset !important;
        width: 30% !important;
        transform: unset !important;
        margin: 0 auto;
        padding: 10px 0px;
    }
    .leftWrapper {
        width: 100vw;
        height: 10vh;
    }
    .top-section {
        width: 100%;
        text-align: center;
        padding: 10px 0px 30px;
        position: relative;
    }
    .socialicon {
        width: 20px;
        height: 20px;
    }
    .tour-title {
        font-size: 20px;
        margin: 5vw 0px;
    }
    .date {
        font-size: 12px;
        margin: 4px auto;
    }
    .venue {
        font-size: 12px;
        margin: 4px auto;
    }
    .ticket-button {
        font-size: 12px;
        margin: 4px auto;
    }
    .tour-content {
        width: 80%;
        margin: 30px auto;
    }
    .mob-footer {
        display: block;
        width: 100%;
        margin: 0 auto;
        position: relative;
        bottom: 0px;
        font-size: 10px;
    }
    .signup-button,
    .tour-button,
    .store-button,
    .presents {
        font-size: 18px;
        margin: 0px 8px;
    }
    .socialicon {
        margin: 8px;
    }
    .mob-footer a,
    body .copyrights,
    .copyrights a {
        font-size: 10px;
    }
    .footer {
        display: none;
    }
    .socials,
    .copyrights {
        width: 100%;
        text-align: center;
    }
    .logo {
        width: 70%;
        margin: 0 auto;
        padding-bottom: 10px;
    }
    .listen-now-button,
    .watch-the-video-button {
        /* width: 150px; */
        height: 20px;
        line-height: 20px;
        font-size: 10px;
        padding: 1.3vw;
        margin: 0px 4px;
    }
    .footer {
        position: relative;
        bottom: 10px;
    }
    .footer a {
        font-size: 10px;
    }
    .footer {
        font-size: 10px !important;
        flex-direction: column;
    }
    .copyrights {
        text-align: center;
        line-height: 14px;
    }
    .logo-description {
        font-size: 20px;
    }
    .mlist-message {
        font-size: 59px;
    }
    .fieldWrap input,
    .fieldWrap select,
    input[type="submit"] {
        font-size: 23px;
        height: 45px;
        font-size: 2.4vw;
        line-height: 45px;
    }
    .terms {
        font-size: 10px;
        line-height: 1.4;
    }
    .fieldWrap {
        padding-bottom: 4vw;
    }
    .mlist-message,
    form {
        font-size: 24px;
        font-weight: 700;
        width: 60vw;
        max-width: 100%;
    }
}

@media only screen and (max-width: 1024px) and (orientation: landscape) {
    .tour-title {
        font-size: 26px;
        padding: 5vw 0 5vw;
        margin: 0;
    }
    .fieldWrap {
        padding-bottom: 3vw;
    }
    body {
        overflow: scroll;
    }
    .tour-inner-wrapper {
        top: 50%;
    }
    .mlist-wrapper,
    .tour-wrapper {
        overflow: scroll;
    }
    .mlist-wrapper,
    .tour-wrapper {
        width: 85vw;
        height: 85vh;
    }
    .sign-up-wrapper {
        top: unset;
        transform: translate(-50%, 0%)
    }
    .closeicon {
        top: 20px;
    }
    .tour-inner-wrapper,
    .sign-up-wrapper {
        height: 100%;
    }
    .leftWrapper {
        height: 20vh;
    }
    body {
        height: auto;
    }
    .leftWrapper .name-logo {
        width: 50%;
    }
    .Wrapper {
        flex-direction: column;
        justify-content: space-around;
    }
}

@media only screen and (max-width: 767px) and (orientation: portrait) {
    .art-work-wrapper {
        padding: 9vw 0;
        flex-direction: column;
        grid-template-columns: 1fr;
        gap: 6vw;
    }
    .art-work-image-wrapper {
        width: 50vw;
        padding-bottom: 3vw;
    }
    .fieldWrap input,
    .fieldWrap select,
    input[type="submit"] {
        font-size: 16px;
    }
    .mlist-message,
    form {
        width: 300px;
    }
    .terms {
        line-height: 2.5vw;
        font-size: 8px;
    }
    .input-error {
        font-size: 8px;
        bottom: 4px;
    }
    .copyrights,
    .copyrights a {
        font-size: 8px;
        width: 90%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 480px) {
    body .widget_row .event_links {
        float: none !important;
        position: unset !important;
        top: unset !important;
        right: unset !important;
        width: 50% !important;
        transform: unset !important;
        margin: 0 auto;
        padding: 10px 0px;
    }
}

@media only screen and (max-width: 1500px) {
    .socialicon {
        width: 20px;
        height: 20px;
    }
    .socials,
    .copyrights {
        width: 100%;
        text-align: center;
        text-transform: uppercase;
        font-size: 0.705vw;
    }
}

@media only screen and (min-width: 1025px) and (orientation: portrait) {
    .mob-footer {
        display: block;
        width: 100%;
        margin: 0 auto;
        position: fixed;
        bottom: 5px;
        font-size: 10px;
    }
    .footer {
        display: none;
    }
    .socials,
    .copyrights {
        width: 100%;
        text-align: center;
    }
    .mob-footer a,
    .copyrights a {
        font-size: 10px;
    }
    .socialicon {
        width: 20px;
        height: 20px;
    }
    .copyrights {
        text-align: center;
    }
}

@media only screen and (min-width: 1600px) {
    .socialicon {
        width: 1.5vw;
        height: 1.5vw;
    }
    .mlist-message,
    form {
        max-width: 30vw;
    }
    .fieldWrap input,
    .fieldWrap select,
    input[type="submit"] {
        font-size: 1.4vw;
        height: 3vw;
    }
    .input-error {
        font-size: 0.7vw;
        bottom: 0.3vw;
    }
    .mlist-message {
        font-size: 2.25vw;
        padding: 0px 0 2vw;
    }
    .terms {
        padding: 1vw 0 0;
        line-height: 1vw;
    }
    .closeicon {
        width: 2vw;
        height: 2vw;
    }
    .thankyou {
        font-size: 1vw;
    }
    .mlist-wrapper {
        height: 60vh;
    }
    .inner-content-wrapper p {
        font-size: 1.1vw;
    }
}

.art-work-image-wrapper a:hover,
.presents-image a:hover {
    opacity: 1;
    transition: none;
}

.back-cover {
    max-width: 64%;
    margin: 0 auto;
    padding-top: 5vw;
    padding-bottom: 3vw;
}

.fleft a,
.top-section div.menu,
.mobile-menu-list div,
div.store-button {
    text-shadow: 2px 2px #D02012;
}

body .seated-event-row {
    border: none;
    padding: 0;
    padding-bottom: 60px;
    display: block;
    text-transform: uppercase;
}

body .seated-event-description-cells {
    width: 100%;
}

body .seated-event-venue-cell {
    display: block;
    padding: 20px 0;
}

body .seated-event-venue-name {
    width: 100%;
}

body .seated-event-venue-location {
    width: 100%;
}

body .seated-event-link-cells {
    display: block;
}

body .seated-event-link-cell {
    align-items: center;
    display: flex;
    justify-content: center;
}

body .seated-event-link,
body .seated-event-link:visited,
body .seated-event-link1,
body .seated-event-link1:visited,
body .seated-event-link2,
body .seated-event-link2:visited,
body .seated-event-link3,
body .seated-event-link3:visited,
body .seated-event-link:hover,
body .seated-event-link1:hover,
body .seated-event-link2:hover,
body .seated-event-link3:hover {
    color: #D02012;
    border: none;
    padding: 0;
    background: transparent;
    margin: 0;
    font-size: 16px;
}

body .seated-events-table {
    border: none;
}

body .seated-event-date-cell,
body .seated-event-venue-cell {
    font-size: 18px;
}