/* LANDING PAGE CSS */
/* BEGIN - NAVIGATION BAR */
/* navigation bar background color */
body > header {
background-color: #ffffff !important; /* change the HEX code (ffffff) only */
}
/* navigation bar links */
/* this adjusts font color for the event/organization name */
body > header > div > div > h1 {
color: #542B7B !important; /* change the HEX code (ffffff) only */
}
/* this adjusts font color for other links */
body > header > div > nav > div, body > header > div > nav > div > div.b3.text-\[\#555\] > a {
  color: #000000 !important; /* change the HEX code (ffffff) only */
}
/* this adjusts the menu button colors */
body > header > div > nav > button {
background-color: #A9B140 !important; /* changes button color. change the HEX code (33b5c2) only */
color: #000000 !important; /* changes font color. change the HEX code (ffffff) only */
}
/* END - NAVIGATION BAR */
/* BEGIN - HIDES HERO 1 TEXT (Remove this section if you want the text above the hero 1 banner or for all other hero banners to show) */
#hero-container > div.hero-bg-color.flex.flex-col.items-center.gap-8.py-8.md\:py-16.contrast-background.light-background {
display: none !important;
}
/* END - HIDES HERO 1 TEXT (Remove this section if you want the text above the hero 1 banner or for all other hero banners to show) */
/* BEGIN – ALTERNATE EVENT DATE STYLES – STYLE 3 */
.event-date {
text-align: center;
color: #542b7b; /* Date and time font color */
}
.horizontal-container {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
}

.with-lines::before,
.with-lines::after {
background-color: #542b7b; /* Line decor color */
}
/* END – ALTERNATE EVENT DATE STYLES – STYLE 3 */
#blockA_content h2, #blockB_content h2, #blockC_content h2, #blockD_content h2{
/* landing page: removes the default title from all sections */
display: none !important;
}
#bidder-login{
/* landing page: adds additional spacing under bidder login */
padding-bottom: 100px !important;
}
/* TICKET PAGE CSS */

/* DONATION PAGE CSS */

/* GUEST UPDATE LINK CSS */
/* GENERAL CSS */
a:-webkit-any-link {
/* all pages: changes all link colors to the same color */
/* color: #[HEX CODE-LINK COLOR-ALL PAGE LINKS] !important; */
/* all pages: removes underline from links on all pages */
/* text-decoration: none !important; */
}

/* BEGIN – RESPONSIVE BEHAVIOR (AUTO ADJUST FOR DIFFERENT SCREEN SIZES) */
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {

/* BEGIN – ALTERNATE EVENT DATE STYLES – STYLE 3 */
.font-details {
font-size: 20px !important;
}
.font-desc {
font-size: 20px !important;
}
.font-btn {
font-size: 20px !important;
}
.with-lines {
position: relative;
padding: 0 10px;
}
.with-lines::before,
.with-lines::after {
content: '';
position: absolute;
height: 2px;
width: 110px;
}
.text.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: 0px; /* Extend more on the left */
right: 0px;
margin: auto;
}
.time.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: 0px;
right: 0px; /* Extend more on the right */
margin: auto;
}
.text.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: 0px; /* Extend more on the left */
right: 0px;
margin: auto;
}
.time.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: 0px;
right: 0px; /* Extend more on the left */
margin: auto;
}
.text {
font-size: 12px;
letter-spacing: 3px;
}
.number {
font-size: 48px;
}
.time {
font-size: 12px;
letter-spacing: 3px;
}
.month {
font-size: 20px;
display: block;
margin-top: -8px; /* Adjust this value to make the ‘month’ text closer to the line */
padding-bottom: 0px; /* Add some padding if needed for spacing */
padding-top: 0px; /* Add some padding if needed for spacing */
padding-right: 5px; /* Add some padding if needed for spacing */
}
.month-two {
font-size: 30px;
display: block;
margin-top: -8px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 35px; /* Add some padding if needed for spacing */
padding-top: 50px; /* Add some padding if needed for spacing */
padding-right: 0px; /* Add some padding if needed for spacing */
}
.month-tix {
font-size: 25px;
display: block;
margin-top: 30px; /* Adjust this value to make the ‘month’ text closer to the line */
padding-bottom: 5px; /* Add some padding if needed for spacing */
}
.mobilev {
font-size: 25px;
display: block;
padding-bottom: 35px !important;
}
.mobilevt {
font-size: 30px;
display: block;
padding: 40px 0 0 10px !important;
}

/* END – ALTERNATE EVENT DATE STYLES – STYLE 3 */
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

/* BEGIN – ALTERNATE EVENT DATE STYLES – STYLE 3 */
.font-details {
font-size: 20px !important;
}
.font-desc {
font-size: 20px !important;
}
.font-btn {
font-size: 20px !important;
}
.with-lines {
position: relative;
padding: 0 10px;
}
.with-lines::before,
.with-lines::after {
content: '';
position: absolute;
height: 2px;
width: 180px;
}
.text.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: -70px; /* Extend more on the left */
right: 0px;
margin: auto;
}
.time.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: 0px;
right: -70px; /* Extend more on the right */
margin: auto;
.text.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: -70px; /* Extend more on the left */
right: 0px;
margin: auto;
}
.time.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: 0px;
right: -70px; /* Extend more on the left */
margin: auto;
}
.text {
font-size: 15px;
letter-spacing: 3px;
}
.number {
font-size: 50px;
}
.time {
font-size: 15px;
letter-spacing: 3px;
}
.month {
font-size: 25px;
display: block;
margin-top: -8px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 0px; /* Add some padding if needed for spacing */
padding-top: 0px; /* Add some padding if needed for spacing */
padding-right: 5px; /* Add some padding if needed for spacing */
}
.month-two {
font-size: 30px;
display: block;
margin-top: -8px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 35px; /* Add some padding if needed for spacing */
padding-top: 50px; /* Add some padding if needed for spacing */
padding-right: 0px; /* Add some padding if needed for spacing */
}
.month-tix {
font-size: 25px;
display: block;
margin-top: 30px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 5px; /* Add some padding if needed for spacing */
}
.mobilev {
font-size: 25px;
display: block;
padding-bottom: 35px !important;
}
.mobilevt {
font-size: 30px;
display: block;
padding: 40px 0 0 10px !important;
}
/* END – ALTERNATE EVENT DATE STYLES – STYLE 3 */
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
/* BEGIN – ALTERNATE EVENT DATE STYLES – STYLE 3 */
.font-details {
font-size: 30px !important;
}
.font-desc {
font-size: 30px !important;
}
.font-btn {
font-size: 30px !important;
}
.with-lines {
position: relative;
padding: 0 20px;
}
.with-lines::before,
.with-lines::after {
content: '';
position: absolute;
height: 2px;
width: 250px;
}
.text.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: -50px; /* Extend more on the left */
right: 0;
margin: auto;
}
.time.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: 0;
right: -50px; /* Extend more on the right */
margin: auto;
}
.text.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: -50px; /* Extend more on the left */
right: 0;
margin: auto;
}
.time.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: 0;
right: -50px; /* Extend more on the left */
margin: auto;
}
.text {
font-size: 28px;
letter-spacing: 3px;
}
.number {
font-size: 98px;
}
.time {
font-size: 28px;
letter-spacing: 3px;
}
.month {
font-size: 50px;
display: block;
margin-top: -8px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 0px; /* Add some padding if needed for spacing */
padding-top: 0px; /* Add some padding if needed for spacing */
padding-right: 25px; /* Add some padding if needed for spacing */
}
.month-two {
font-size: 50px;
display: block;
margin-top: -8px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 35px; /* Add some padding if needed for spacing */
padding-top: 50px; /* Add some padding if needed for spacing */
padding-right: 25px; /* Add some padding if needed for spacing */
}
.month-tix {
font-size: 35px;
display: block;
margin-top: 30px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 5px; /* Add some padding if needed for spacing */

}
.mobilev {
font-size: 50px;
display: block;
padding-bottom: 40px !important;
}
.mobilevt {
font-size: 50px;
display: block;
padding: 50px 0 0 10px !important;
}
/* END – ALTERNATE EVENT DATE STYLES – STYLE 3 */
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
/* BEGIN – ALTERNATE EVENT DATE STYLES – STYLE 3 */
.font-details {
font-size: 30px !important;
}
.font-desc {
font-size: 30px !important;
}
.font-btn {
font-size: 30px !important;
}
.with-lines {
position: relative;
padding: 0 20px;
}
.with-lines::before,
.with-lines::after {
content: '';
position: absolute;
height: 2px;
width: 250px;
}
.text.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: -50px; /* Extend more on the left */
right: 0;
margin: auto;
}
.time.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: 0;
right: -50px; /* Extend more on the right */
margin: auto;
}
.text.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: -50px; /* Extend more on the left */
right: 0;
margin: auto;
}
.time.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: 0;
right: -50px; /* Extend more on the left */
margin: auto;
}
.text {
font-size: 28px;
letter-spacing: 3px;
}
.number {
font-size: 90px;
}
.time {
font-size: 28px;
letter-spacing: 3px;
}
.month {
font-size: 50px;
display: block;
margin-top: -8px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 0px; /* Add some padding if needed for spacing */
padding-top: 0px; /* Add some padding if needed for spacing */
padding-right: 25px; /* Add some padding if needed for spacing */
}
.month-two {
font-size: 50px;
display: block;
margin-top: -8px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 35px; /* Add some padding if needed for spacing */
padding-top: 50px; /* Add some padding if needed for spacing */
padding-right: 25px; /* Add some padding if needed for spacing */
}
.month-tix {
font-size: 35px;
display: block;
margin-top: 30px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 5px; /* Add some padding if needed for spacing */
}
.mobilev {
font-size: 50px;
display: block;
padding-bottom: 40px !important;
}
.mobilevt {
font-size: 50px;
display: block;
padding: 50px 0 0 10px !important;
}
/* END – ALTERNATE EVENT DATE STYLES – STYLE 3 */
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
/* BEGIN – ALTERNATE EVENT DATE STYLES – STYLE 3 */
.font-details {
font-size: 30px !important;
}
.font-desc {
font-size: 30px !important;
}
.font-btn {
font-size: 30px !important;
}
.with-lines {
position: relative;
padding: 0 20px;
}
.with-lines::before,
.with-lines::after {
content: '';
position: absolute;
height: 2px;
width: 250px;
}
.text.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: -50px; /* Extend more on the left */
right: 0;
margin: auto;
}
.time.with-lines::before {
top: -10px; /* Adjust this value to position the line above */
left: 0;
right: -50px; /* Extend more on the right */
margin: auto;
}
.text.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: -50px; /* Extend more on the left */
right: 0;
margin: auto;
}
.time.with-lines::after {
bottom: -10px; /* Adjust this value to position the line below */
left: 0;
right: -50px; /* Extend more on the left */
margin: auto;
}
.text {
font-size: 28px;
letter-spacing: 3px;
}
.number {
font-size: 90px;
}
.time {
font-size: 28px;
letter-spacing: 3px;
}
.month {
font-size: 50px;
display: block;
margin-top: -8px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 0px; /* Add some padding if needed for spacing */
padding-top: 0px; /* Add some padding if needed for spacing */
padding-right: 25px; /* Add some padding if needed for spacing */
}
.month-two {
font-size: 50px;
display: block;
margin-top: -8px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 35px; /* Add some padding if needed for spacing */
padding-top: 50px; /* Add some padding if needed for spacing */
padding-right: 25px; /* Add some padding if needed for spacing */
}
.month-tix {
font-size: 35px;
display: block;
margin-top: 30px; /* Adjust this value to make [EVENT MONTH] closer to the line */
padding-bottom: 5px; /* Add some padding if needed for spacing */
}
.mobilev {
font-size: 50px;
display: block;
padding-bottom: 40px !important;
}
.mobilevt {
font-size: 50px;
display: block;
padding: 50px 0 0 10px !important;
}
/* END – ALTERNATE EVENT DATE STYLES – STYLE 3 */
}
/* END - RESPONSIVE BEHAVIOR (AUTO ADJUST FOR DIFFERENT SCREEN SIZES)*/