/*.vEventNavImage {*/
/*    max-height: 3.5rem;*/
/*    width: auto;*/
/*    height: auto;*/
/*    margin-top: 0.3rem;*/
/*    margin-left: 1vw;*/
/*    margin-right: 1vw;*/
/*    margin-bottom: 0.5rem;*/
/*}*/

.vEventProgressBarCol {
    margin-top: 0.4rem;
    padding-right: 0;
    padding-left: 1vw;
    margin-right: 1vw;
}

.eventLiveContainer {
    margin-bottom: 0;
    margin-top: 0px;
    padding-top: 0;
    padding-bottom: 45px;
}

.eventMainContentBlock {
    margin-top: 1rem;
}

.campaignCard {
    box-shadow: none;
    background-color: transparent;
}

.auctionBody {
    min-height: 31vmax;
    padding: 0px;
}

/*.carousel-caption.auctionText {*/
/*    bottom: auto;*/
/*    top: 20px;*/
/*    padding-top: 0;*/
/*    !*max-height: calc(100% - 55px);*!*/
/*    !*overflow-y: scroll;*!*/
/*}*/


.noActionBody {
    padding: 0px;
}

.noActionBkImage {
    width: 100%;
    z-index: 99;
}

.auctionBodyCampaignDetailRow {
    position: absolute;
    top: 0;
    z-index: 100;
    color: white;
    margin-top: 1vmax;
    margin-right: 0.1vmax;
    padding: 1rem;
    width: 100%;
}

.auctionBodyCampaignDetailName{
    font-size: 1vmax;
    font-weight: 200;
}

.auctionBodyCampaignDetailOptionName {
    font-size: 1.6vmax;
    font-weight: 800;
    word-spacing: -0.1rem;
}

.auctionBodyCampaignDetailOptionDesc {
    font-size: 0.9vmax;
    font-weight: 200;
}

.actionButton {
    border-radius: 0.7em;
    font-weight: 800;
    white-space: nowrap;
}

.actionButtonRow{
    margin-top: 10px;
    margin-bottom: 10px;
}

.auctionAddImageCol {
    z-index:99;
    background: linear-gradient(0deg,rgba(0, 0, 0, 0.1),rgba(0, 0, 0, 0.9))!important;
    margin-left: 0px!important;
    margin-right: 0px!important;
}

.pledgeAddImageCol {
    z-index:99;
    background: linear-gradient(0deg,rgba(0, 0, 0, 0.1),rgba(23, 162, 184, 0.9))!important;
    margin-left: 0px!important;
    margin-right: 0px!important;
}

.auctionAddImageScroll {
    overflow: auto;
    position: absolute;
    bottom: 0;
    margin-bottom: 0;
}

.auctionAddImage {
    margin-right: 0.3rem!important;
    margin-left: 0.3rem!important;
    padding: 0;
    min-width: 5vmax;
    max-width: 20vmax;
}

.emailSetting > .inputLabel {
    margin-top: -14px;
}

.progress{
    margin: 0;
    overflow: visible;
    border-radius: 1rem;
    height: 1.5rem;
}

.progress .progress-bar {
    background-color: #57e14e;
    border-radius: 1rem;
    height: 1.5rem;
}

.progress .progress-value{
    position: relative;
    margin-top: -1.2rem;
    letter-spacing: 0.05rem!important;
    white-space: nowrap;
    font-size: 12px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    opacity: 50%;
}
.progress-bar.active{
    animation: reverse progress-bar-stripes 0.40s linear infinite, animate-positive 2s;
}
@-webkit-keyframes animate-positive{
    0% { width: 0%; }
}
@keyframes animate-positive {
    0% { width: 0%; }
}


.pledgeCartWithBadge .fa-stack[data-count]:after{
  position:absolute;
  right:0%;
  top:1%;
  content: attr(data-count);
  font-size:50%;
  padding:.6em;
  border-radius:999px;
  line-height:.75em;
  color: white;
  background:rgba(255,0,0,.85);
  text-align:center;
  min-width:2em;
  font-weight:bold;
}


.actionView {
/*    border-top-left-radius: 1.5rem;
    border-top-right-radius: 1.5rem;
*/
}

.recentActivityTable {
/*
    border-bottom-left-radius: 1.5rem;
    border-bottom-right-radius: 1.5rem;
*/
    border: 0.5px solid rgb(221, 221, 221);
}

.vEventBlockLegend {
    width:inherit;
    padding:0 10px;
    border-bottom:none;
    font-size: 0.9rem;
    color: gray;
}

.vEventBlockFS {
    border: #8080804a 1px solid;
    padding: 0.5rem;
    margin-bottom: 1rem;
}


.eventNameStart {
    font-size: 1.5rem;
    font-weight: 900;
}

/*.eventStartTime {*/
/*    background-color: black;*/
/*    color: white;*/
/*    padding: 10px 30px 10px 30px;*/
/*    border-radius: 20px;*/
/*    font-size: 1rem;*/
/*    font-weight: 500;*/
/*}*/

/*new CSS from sketch*/

.navBackground {
  box-shadow: 0 7px 20px 0 rgba(0, 0, 0, 0.06), 0 0.5px 0 0 #ededed;
  background-color: #ffffff;
}

.eventTitle {
  font-size: 13px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #3d3d3d;
}

.runStatus {
  font-size: 12px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  text-transform: uppercase;
  line-height: normal;
  letter-spacing: normal;
}

.eventStartSponsorImage {
    width: auto;
    max-height: 7vh;
}

.eventLiveSponsorImage {
    width: 12vmax;
}

.eventLiveSponsorImageCol {
    max-width: 12vmax;
}

/*chat related classes*/
.chatContainerModal {
    margin: 0;
    left: 0;
    height: 40vh;
    width: 58.33vw;
}

@media (max-width: 576px){
    .chatContainerModal {
        margin: 0;
        left: 0;
        height: 40vh;
        width: 100vw;
    }
}



.chatContainerModal.not-live{
    margin: 0;
    left: 0;
    height: 60vh;
    width: 30vw;
}

@media (max-width: 991.98px){
    .chatContainerModal.not-live {
        margin: 0;
        left: 0;
        height: 60vh;
        width: 45vw;
    }
}

@media (max-width: 767.98px){
    .chatContainerModal.not-live {
        margin: 0;
        left: 0;
        height: 70vh;
        width: 40vw;
    }
}

@media (max-width: 575.98px){
    .chatContainerModal.not-live {
        margin: 0;
        left: 0;
        height: 50vh;
        width: 100vw;
    }
}

.chatCard {
    height: 100%;
    background-image: linear-gradient(to top,#cec9c9 0,#ffffff 100%);
    border-radius: 0;
    box-shadow: none;
}

.chatCard.not-live {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
}


.chatContainerModalAdmin {
    height: 70%;
    width: 30vmax !important;
}

@media (max-width: 767.98px){
    .chatContainerModalAdmin {
        height: 70%;
        width: 100%;
    }
}

.messageInput {
    font-weight: 300;
    border: 0px;
}

.messageInput:focus {
/*  border-color: #FF0000;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 0, 0, 0.6);
  */
    /* border: 1px solid #57e14e78; */
    box-shadow: none;
}

.msg_card_body {
    overflow-y: auto;
}

.send_btn{
    background-color: #57e14e !important;
    border:0 !important;
    color: white !important;
    cursor: pointer;
}

.user_img_msg{
    height: 40px;
    width: 40px;
    padding-left: 8px;
    padding-top: 6px;
    border:1.5px solid #f5f6fa;

}
.img_cont_msg{
    height: 40px;
    width: 40px;
}

.msg_container {
    margin-top: auto;
    margin-bottom: 7px;
    border-radius: 7px;
    background-color: white;
    padding: 5px 10px 5px 10px;
    position: relative;
}

.msg_container.admin {
    background-color: #00800026;
}

.msg_container.blocked {
    background-color: #f443361f;
}

.msg_time{
    position: absolute;
    left: 0;
    bottom: -15px;
    color: #e83e8c;
    font-size: 10px;
}

.msg_time_send {
    color: #a9a9a9;
    font-size: 0.8rem;
    min-width: 10rem;
    font-weight: 400;
}

.msg_head{
    position: relative;
    padding: 1px!important;
}

.msgSender {
    font-weight: bold;
    font-size: 14px;
}

.msgMessage {
    color: #000000!important;
    font-size: 14px;
}

.msgMessage span {
    color: #000000!important;
    font-size: 24px;
}



/*Admin*/
/*virtual event run classes*/

.virtualCampaignWidgets {
    max-width: 100%;
}

.virtualCampaignWidgetCard {
    margin-bottom: 1rem;
}

.btn.btn-status.active {
    background-color: #186860!important;
}

.btn.btn-status.active{
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
}

.btn.btn-status {
    background-color: #808080a6;
    color: #fff;
}

.vEventStatusTitle {
    font-variant-caps: petite-caps;
    color: gray;
}
.vEventStatusSubTitle{
    font-size: 0.8rem!important;
    color: var(--cyan)!important;
}

.playListItem {

}

.playListItem.campaignName {
    font-variant-caps: petite-caps;
    color: white;
}

.playListItem.optionName {
    font-variant-caps: petite-caps;
    font-size: 0.8rem!important;
    color: white!important;
}

.playListItem.presentButton {

}

.playListItem.buttonCol {
    border-top: #ffffff8c 1px solid;
    margin-left: 15px;
    margin-right: 15px;
}

.playListItem.presenting {
    font-variant-caps: petite-caps;
}

.vEventRunTopNav {
    border-bottom: 1px solid #8080803d;
    margin-bottom: 1rem;
    padding: 0.5rem;
    box-shadow: 0 7px 20px 0 rgba(0, 0, 0, 0.06), 0 0.5px 0 0 #ededed;
    background-color: #ffffff;
    margin-left: -6rem;
    margin-right: -6rem;
    margin-top: -1rem;
}

@media (max-width: 992px){
    .vEventRunTopNav {
        margin-left: -2rem;
        margin-right: -3rem;
    }
}

.vEventPresentBlock {
    margin-left: -5rem;
}
@media (max-width: 992px){
    .vEventPresentBlock {
        margin-left: -2.5rem;
    }
}

.vEventLiveBlock {
    margin-right: -5rem;
}

@media (max-width: 768px){
    .vEventLiveBlock {
        margin-right: -2.5rem;
    }
}

.virtualEventActionBlocks {
    border: #80808030 1px solid;
    padding: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
    margin-bottom: 1rem;
    border-bottom: none;
}

.virtualEventActionBlockLegend {
    width: inherit;
    padding: 0 10px;
    border-bottom: none;
    font-size: 0.9rem;
    color: gray;
    font-variant-caps: petite-caps;
    font-weight: 500;
}

.v-event-invite-btn {
    font-weight: 500;
    font-size: .81rem;
}


/*.toggle{
    display: flex;
    justify-content: space-between;
    position: relative;
    width: 130px;

    color: white;
    font-size: 16px;
    font-family: Verdana;
    font-weight: bold;

    cursor: pointer;
    user-select: none;

    overflow: hidden;


    -webkit-box-shadow: 1px 1px 5px -1px rgba(0,0,0,0.75);
    -moz-box-shadow: 1px 1px 5px -1px rgba(0,0,0,0.75);
    box-shadow: 1px 1px 5px -1px rgba(0,0,0,0.75);

    transition: background-color 0.2s;
}

.toggle .toggleGreen {
    background-color: green;
}

.toggle .toggleRed {
    background-color: red;
}

.toggleText {
    position: relative;
    padding: 2px;
    z-index: 1;
    opacity: 0.7;
    text-align: center;
    flex: 1;
    transform: translatey(1px);
    transition: transform 0.2s, opacity 0.2s;
}

.toggle:hover{
    background-color: rgb(13, 89, 156);
}
.toggle:hover > .toggleText{
    opacity: 1;
    transform: translatey(-1px);
}
.toggleFrame{
    position: absolute;
    z-index: 10;
    width: 65px;
    height: 40px;
    background: black;
    bottom: 0px;
    left: 0px;
    transform-origin: bottom;

    transition: 0.2s left;
}

.toggleCheckbox:checked + .toggleFrame{
    left: 66px;
}

.toggleCheckbox{
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
*/
.virtualEventBottomNav {
    height:40px;
    padding-top: 0px;
    padding-bottom: 0px;
    background-color: #eaeaea;
}

/*fire works*/
.pyro > .before, .pyro > .after {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  box-shadow: -120px -218.66667px blue, 248px -16.66667px #00ff84, 190px 16.33333px #002bff, -113px -308.66667px #ff009d, -109px -287.66667px #ffb300, -50px -313.66667px #ff006e, 226px -31.66667px #ff4000, 180px -351.66667px #ff00d0, -12px -338.66667px #00f6ff, 220px -388.66667px #99ff00, -69px -27.66667px #ff0400, -111px -339.66667px #6200ff, 155px -237.66667px #00ddff, -152px -380.66667px #00ffd0, -50px -37.66667px #00ffdd, -95px -175.66667px #a6ff00, -88px 10.33333px #0d00ff, 112px -309.66667px #005eff, 69px -415.66667px #ff00a6, 168px -100.66667px #ff004c, -244px 24.33333px #ff6600, 97px -325.66667px #ff0066, -211px -182.66667px #00ffa2, 236px -126.66667px #b700ff, 140px -196.66667px #9000ff, 125px -175.66667px #00bbff, 118px -381.66667px #ff002f, 144px -111.66667px #ffae00, 36px -78.66667px #f600ff, -63px -196.66667px #c800ff, -218px -227.66667px #d4ff00, -134px -377.66667px #ea00ff, -36px -412.66667px #ff00d4, 209px -106.66667px #00fff2, 91px -278.66667px #000dff, -22px -191.66667px #9dff00, 139px -392.66667px #a6ff00, 56px -2.66667px #0099ff, -156px -276.66667px #ea00ff, -163px -233.66667px #00fffb, -238px -346.66667px #00ff73, 62px -363.66667px #0088ff, 244px -170.66667px #0062ff, 224px -142.66667px #b300ff, 141px -208.66667px #9000ff, 211px -285.66667px #ff6600, 181px -128.66667px #1e00ff, 90px -123.66667px #c800ff, 189px 70.33333px #00ffc8, -18px -383.66667px #00ff33, 100px -6.66667px #ff008c;
  -moz-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -webkit-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -o-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  -ms-animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards;
  animation: 1s bang ease-out infinite backwards, 1s gravity ease-in infinite backwards, 5s position linear infinite backwards; }

.pyro > .after {
  -moz-animation-delay: 1.25s, 1.25s, 1.25s;
  -webkit-animation-delay: 1.25s, 1.25s, 1.25s;
  -o-animation-delay: 1.25s, 1.25s, 1.25s;
  -ms-animation-delay: 1.25s, 1.25s, 1.25s;
  animation-delay: 1.25s, 1.25s, 1.25s;
  -moz-animation-duration: 1.25s, 1.25s, 6.25s;
  -webkit-animation-duration: 1.25s, 1.25s, 6.25s;
  -o-animation-duration: 1.25s, 1.25s, 6.25s;
  -ms-animation-duration: 1.25s, 1.25s, 6.25s;
  animation-duration: 1.25s, 1.25s, 6.25s; }

@-webkit-keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
@-moz-keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
@-o-keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
@-ms-keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
@keyframes bang {
  from {
    box-shadow: 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white, 0 0 white; } }
@-webkit-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0; } }
@-moz-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0; } }
@-o-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0; } }
@-ms-keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0; } }
@keyframes gravity {
  to {
    transform: translateY(200px);
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    opacity: 0; } }
@-webkit-keyframes position {
  0%, 19.9% {
    margin-top: 10%;
    margin-left: 40%; }

  20%, 39.9% {
    margin-top: 40%;
    margin-left: 30%; }

  40%, 59.9% {
    margin-top: 20%;
    margin-left: 70%; }

  60%, 79.9% {
    margin-top: 30%;
    margin-left: 20%; }

  80%, 99.9% {
    margin-top: 30%;
    margin-left: 80%; } }
@-moz-keyframes position {
  0%, 19.9% {
    margin-top: 10%;
    margin-left: 40%; }

  20%, 39.9% {
    margin-top: 40%;
    margin-left: 30%; }

  40%, 59.9% {
    margin-top: 20%;
    margin-left: 70%; }

  60%, 79.9% {
    margin-top: 30%;
    margin-left: 20%; }

  80%, 99.9% {
    margin-top: 30%;
    margin-left: 80%; } }
@-o-keyframes position {
  0%, 19.9% {
    margin-top: 10%;
    margin-left: 40%; }

  20%, 39.9% {
    margin-top: 40%;
    margin-left: 30%; }

  40%, 59.9% {
    margin-top: 20%;
    margin-left: 70%; }

  60%, 79.9% {
    margin-top: 30%;
    margin-left: 20%; }

  80%, 99.9% {
    margin-top: 30%;
    margin-left: 80%; } }
@-ms-keyframes position {
  0%, 19.9% {
    margin-top: 10%;
    margin-left: 40%; }

  20%, 39.9% {
    margin-top: 40%;
    margin-left: 30%; }

  40%, 59.9% {
    margin-top: 20%;
    margin-left: 70%; }

  60%, 79.9% {
    margin-top: 30%;
    margin-left: 20%; }

  80%, 99.9% {
    margin-top: 30%;
    margin-left: 80%; } }
@keyframes position {
  0%, 19.9% {
    margin-top: 10%;
    margin-left: 40%; }

  20%, 39.9% {
    margin-top: 40%;
    margin-left: 30%; }

  40%, 59.9% {
    margin-top: 20%;
    margin-left: 70%; }

  60%, 79.9% {
    margin-top: 30%;
    margin-left: 20%; }

  80%, 99.9% {
    margin-top: 30%;
    margin-left: 80%; } }




.link-title {
    font-weight: bold;
    font-size: 14px;
    color: black;
    min-width: 70px;
}

.link-url {
    font-weight: 400;
    font-size: 13px;
    color: black;
    word-break: break-word;
 }

.qr-code {
    max-width: 150px;
    width: 100%;
 }

.current-event-link-desc {
    font-weight: 500;
    font-size: 14px;
    padding-bottom: 10px;
}

#joinLine, #rsvpLine, #bigScreenLine, #partyLine, #eventPageLine {
    display: flex;
}

.delivery-button {
    font-size: 12px;
    /*padding: 5px;*/
    border: 1px solid #dfdfdf;
    font-weight: 400;
    margin-top: 5px;
    cursor: pointer;
    border-radius: 5px;
    width: 150px;
}

.delivery-button.delivered {
    color: green;
}

.delivery-button.delivered::after {
    display: block;
    padding: 5px;
    content: 'Delivered'
    /*color: green;*/
}

.delivery-button.delivered:hover::after {
    display: block;
    padding: 5px;
    content: 'Mark as Not Delivered';
    background: #efefef;
    color: red;
    border-radius: 5px;
    cursor: pointer;
}

.delivery-button.pending {
    color: red
}

.delivery-button.pending::after {
    display: block;
    padding: 5px;
   content: 'Not Delivered';
    border-radius: 5px;
}

.delivery-button.pending:hover::after {
    display: block;
    content: 'Mark as Delivered';
    padding: 5px;
    background: #efefef;
    color: green;
    cursor: pointer;
}