/* Fonts */
@import url(fonts.css);

.landingpageBackground {
    background-image: url(/assets/backgrounds/B4PFlashbackSHORT.webp);
    background-size: cover;
    height: 100%;
    padding: 18vw;
}

.defaultSection {
    /* background: radial-gradient(#202020, #080808); */
    background-image: url(./assets/backgrounds/updatedB4PbackgroundBLUR.png);
    background-size: cover;
    padding: 5vw;
    padding-bottom: 8vw;
}

.boredPrideLogo {
    background-size: 280%;
    transition: 1s ease;
    width: 50vw;
}

.boredPrideLogo:hover {
    filter: hue-rotate(-100deg);
    scale: 105%;
}

.boredChapsText {
    font-family: "BasementGrotesque", sans-serif;
    text-align: center;
    font-size: 5vw;
    color: white;
    margin: 1%;
}

.baseText {
    font-family: "ITCAvantGarde";
    text-align: center;
    font-size: 1.2vw;
    padding: 0.1vw;
    color: white;
}

.textShadow {
    text-shadow: -0.1vw 0.1vw 0.8vw black;
}

.basicCounter {
    background-image: url(./assets/emptyCounter.png);
    background-size: cover;
    width: 50vw;
    height: 10vw;
}

.counterText {
    font-family: "mssansserifPixel";
    text-align: center;
    font-size:  6vw;
    color: red;
    text-shadow: 0vw 0vw 1vw rgba(255, 58, 58, 0.646);
}


/* Event Boxes */
.event-container {
    transition: 1s ease;
    font-family: "ITCAvantGarde";
    background-color: white;
    margin: 2vw;
    border-radius: 2vw;
    width: 50vw;
    padding: 0.5vw;
}

.event-container:hover {
    scale: 95%;
}

.event-image {
    /* background-image: url(./assets/backgrounds/getover.png); */
    background-size: cover;
    background-color: #222;
    height: 10vw;
    width: 10vw;
    border-radius: 2vw;

    /* Vertical Align */
    align-items: center;
    /* Horizontal Align */
    justify-content: center;
    /* Apply Align Flex */
    display: flex;

    text-align: center;
    color: white;
    margin: 1vw;
}

.event-title {
    font-family: "ITCBold";
    font-size: 2vw;
    margin-left: 8vw;
    margin-top: 1vw;
}

.event-desc {
    margin-left: 8.1vw;
    font-size: 0.8vw;
    margin-right: 1.1vw;
}

.event-time {
    font-family: "ITCAvantGarde";
    font-size: 1.5vw;
    
    /* Vertical Align */
    align-items: center;
    /* Horizontal Align */
    justify-content: center;
    /* Apply Align Flex */
    display: flex;
}

.event-time-box {
    background-color: #FFEE66;
    border-radius: 3vw;
    padding: 1vw;
    margin-top: 1vw;
}

.event-time-section {
    width: 28vw;
    margin-left: 1vw;
}