body{
    margin: 0%;
}

.containter-fluid{
    margin: 8px;
}
.navbar-brand{
    padding: 40px 20px 40px 18px;
    justify-content: flex-start;
    font-size: 40px !important;
    height: fit-content;
    flex-wrap: wrap;
}

.navbar{
    position: sticky !important;
    top:0%;
    background-color: #fefefe;
    z-index: 100;
    justify-content: center;
    padding: 0px!important;
}
.container-fluid{
    margin: 8px 0px;
}
.navbar-nav{
    width: 100%;
    justify-content: space-between;
}

.navbar-collapse{
    display: flex;
    justify-content: center;
    padding: 0px 22px;
    text-align: center;

}

/* .active{
    text-decoration: underline !important;
} */

#heroImg{
    width: 100%;
    display: flex;
    justify-content: center;
    /* background-image: url(images/the-script.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain; */
}

#heroSection{
    display: flex; 
    flex-direction: column;
    width: auto;
    background-color: #282828;
    padding: 32px 0px 0px 0px;
}
.headerText{
    display: flex;
    justify-content: space-between;
    padding: 0px 32px 0px 32px;
    font-size: 40px;
    line-height: 1;
    align-items: flex-end;
    color: #fefefe;
    
}

.headerContent{
    margin: 0px;
    font-size: 40px;
}

.cdImg{
    width: 100%;
    height: 100%;
    background-size: contain;
    padding: 32px 0px 0px 0px;
    z-index: 1;

}

.btnLine{
    margin: 0px;
    font-size: 16px;
    color:#fefefe;
}


.btnLine2{
    margin: 0px;
    font-size: 24px;
    color:#fefefe;
}


.btnPurchase{
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 60px;
    width: 100%;
    line-height: 1.1;
    background-color: #282828;
    text-decoration: none;
    border: none;
    padding: 0px;

}

.btnPurchase:hover{
    background-color: #fefefe;
    transition-duration: 0.3s ;
    text-decoration: underline #282828;
}

.btnPurchase:hover .btnLine{
    color: #282828;
}

.btnPurchase:hover .btnLine2{
    color: #282828;
}

.btnListen{
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 60px;
    width: 100%;
    line-height: 1.1;
    background-color: #fefefe;
    text-decoration: none;
    border: none;
    padding: 0px;
}

.btnListen:hover{
    background-color: #282828;
    transition-duration: 0.3s ;
    text-decoration: underline #fefefe;
}

.btnListen:hover .btnLine3{
    color: #fefefe;
}

.btnListen:hover .btnLine4{
    color: #fefefe;
}

.btnLine3{
    margin: 0px;
    font-size: 16px;
    color:#282828;
}
.btnLine4{
    margin: 0px;
    font-size: 24px;
    color:#282828;
    
}

.heroBtn{
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
}

#shopSection{
    background-color: #fefefe;
    padding: 0px 0px 64px 0px;
    height: fit-content;
}

.headerPadding{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 32px 0px 32px 0px;
}

.cardShop{
    padding: 0px 32px;
}

.cardHeader{
    font-size: 24px;
    line-height: 1;
    text-align: center;
}

.card{
    padding: 0px 0px 0px 0px;
    border: 4px solid #282828 !important;
    
}

.card:hover{
    background-color: #282828;
    color: #fefefe;
    transition-duration: 0.3s ;
}

.headerText2{
    display: flex;
    justify-content: space-between;
    padding: 0px 32px;
    font-size: 40px;
    line-height: 1;
    align-items: flex-end;
    color: #282828;
}

.card-body{
    min-height: 88px;
}

.col{
    padding: 0px 0px 32px 0px;
}

.cardLink{
    text-decoration: none;
}

#groupImage{
    z-index: 200;
    height: 80vh;
    background-image: url(images/the-script-fam.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

#tours{
    height: fit-content;
    background-color: #282828;
}

.tourDates{
    padding: 32px 0px;
}

.tourCard{
    display: flex;
    flex-direction: column;
    background-color: #fefefe;
    /* min-width: 320px; */
    padding: 24px 24px;
    min-height: 340px;
    justify-content: space-between !important;
}

.tourLocation{
    color: #282828;
    margin: 0%;
}

.tourCard-body{
    line-height: 1;
}

.tourText{
    font-size: 20px;
    color: #282828;
}

.tourDetails{
    color: #282828;
    padding: 0px 0px 24px 0px;
    margin: 0%;
}

.ticketLink{
    color: #282828;
    text-decoration: none;
    padding-top: 24px;
}

.ticketLink:hover{
    text-decoration: underline;
    transition-duration: 1s;
    transition-timing-function: linear;
}

.tourDatesCard{
    padding: 24px 32px;
    width: 100%;
    flex-direction: row;
    margin: 0% !important;
}

.tourCol{
    padding: 8px !important;
    margin: 0% !important;
}

.locationT{
    padding: 0px 0px 24px 0px;
}

#videos{
    height: auto;
    padding: 0px 0px 32px 0px;
}

video{
    width: 100%;
}

.videoPlacement{
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 0px 0px 32px 0px;
}

.videoTextSection{
    display: flex;
    flex-direction: row;
}

footer{
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 32px 32px 8px 32px;
    flex-direction: column;
    background-color: #282828;
}
.footerText{
   font-size: 14vw;
   text-align: center;
   color: #fefefe;
}

.copyright{
    font-size: 8px;
    padding: 64px 0px 0px 0px;color: #fefefe;

}

.footerText2{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    color: #fefefe;
}

.navbarSale{
    display: flex;
    flex-direction: column;
    margin: 0%;
    text-align: center;
}

.winterSale{
    background-color: #282828;
    width: 100%;
}

.saleWhite{
    color: #fefefe;
    margin: 0%;
    padding: 8px 0px;
}

.merchShop{
    padding: 32px 32px;
    background-color: #282828;
}

.merchHeader{
    margin: 0%;
    padding: 32px 0px 0px 0px;
    background-color: #282828;
}

.merchText{
    color: #fefefe;
    text-align: center;
    font-size: 52px;
}

#merchBackground{
    width: 100%;
    height: auto;
    /* background-image: url(images/the-script.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center; */
}

.card-img-top2{
    height: 320px;
    background-image: url(images/sampleProduct.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
/* .card-img-top2:hover{
    background-image: url(images/sampleProduct2.png);
    transition-duration: 0.3s;
    scale: 1;
} */

.card2{
    background-color: #282828;
    border: #fefefe solid 4px;
    border-radius: 8px;
}

.card2:hover{
    background-color: #fefefe;
    transition-duration: 0.3s;
}
.card2:hover .card-img-top2{
    background-image: url(images/sampleProduct2.png);
    transition-duration: 0.3s;
    scale: 1;
}

.card2:hover .card-text2{
    color: #282828;
    opacity: 70%;
}

.card2:hover .merchCardSe{
    border: #282828 1px solid;
    opacity: 80%;
}


.card-text2{
    color: #fefefe;
    text-align: center;
}

.card-body2{
    padding: 16px 16px;
}

.merchCardSe{
    border: #fefefe 1px solid;
    opacity: 80%;
}

.card-text-scale{
    font-size: 18px;
}

.discountedPrice{
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
    gap: 24px;
    padding: 16px 0px;
}

.footerWhite{
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 32px 32px 8px 32px;
    flex-direction: column;
    background-color: #fefefe ;
}
.footerTextBlack{
   font-size: 14vw;
   text-align: center;
   color: #282828;
}

.copyrightBlack{
    font-size: 8px;
    padding: 64px 0px 0px 0px;color: #282822;

}

/* .footerTextBlack{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    color: #282828;
} */