/* CSS Document */
.breadcrumb {
	color: #6c757d;
}
.breadcrumb li a {
	color: #6c757d;
	text-decoration: none;
}
.footer-links {
	text-decoration: none;
}
/* Styling indicators to be more visible against white backgrounds */
.carousel-indicators [data-bs-target] {
    background-color: #000;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: invert(100%);
}
.bg-ycf-main-background { background-color: #F4EBD2; }
.bg-ycf-yellow { background-color: #F3B84F; }
.bg-ycf-blue { background-color: #203A62; }
.bg-ycf-brown { background-color: #4A3F36; }
.bg-ycf-red { background-color: #8C1D1A; }
.bg-denim-blue { background-color: #4682b4; }

.text-color-ycf-main-background { color: #F4EBD2; }
.text-color-ycf-yellow { color: #F3B84F; }
.text-color-ycf-blue { color: #203A62; }
.text-color-ycf-brown { color: #4A3F36; }
.text-color-ycf-red { color: #8C1D1A; }
.text-color-dark-wood { color: #3e2723; }
	
.event-blue { color: #0f77c4; }
.event-green { color: #00af50; }
.event-red { color: #ff0000; }
.event-darkred { color: #c00000; }
.event-orange { color: #ff6600; }
.event-pink { color: #ff3399; }
.event-purple { color: #6f2f9f; }
.event-black { color: #000000; }
	
.full-width-bg-image {
    background-image: url('https://yatescountyfair.org/2026/images/panorama-1d-colored.png');
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat; 
    min-height: 300px; 
}

.full-width-footer-bg-image {
    background-image: url('images/silhouette-footer-v2.png');
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat; 
	margin-top: 50px;
    min-height: 832px;
	opacity: 1.0;
}
	
.hero-section-text {
	color: #F4EBD2;
    font-family: "Bebas Neue", sans-serif;
    font-optical-sizing: auto;
	font-size: 36px;
    font-weight: 800; 
    font-style: normal;
    margin-bottom: 20px;
    text-align: center;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
}
	
.fair-title-line {
    /* Font size of 20px for small devices and 40px for desktop */
    color: #F4EBD2; 
    font-size: calc(20px + (40 - 20) * ((100vw - 300px) / (1600 - 300)));
    font-family: "Bebas Neue", sans-serif;
    font-weight: 400;
    font-style: normal;
	padding-top: 8px;
}
	
.montserrat-countdown {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-size: 36px;
    font-weight: 800; 
    font-style: normal;
    margin-top: 10px;
    text-align: center;
}
.countdown-text {
    font-optical-sizing: auto;
    font-size: 36px;
    font-weight: 400; 
    font-style: normal;
    margin-top: 10px;
    text-align: center;		
}
.countdown-spacing {
    padding-bottom: 10px;
    padding-top: 10px;
}
.ycf-nav {
    background-color: #1A1A1D; /*#203A62;*/
}
	
.ycf-nav div .row {
    padding-top: 4px;
}
	
.ycf-nav p {
    margin-bottom: 4px;
}
	
.ycf-nav-link {
	color: #F4EBD2;
	text-decoration: none;
}
	
.banner-menu {
	padding-top: 0px;
}


.dropdown-item {
    background-color: #203A62;
	color: #F4EBD2;
}.dropdown-item > li {
	background-color: #203A62; 
	color: #F4EBD2;
}
.dropdown-item > li > a {
	background-color: #203A62; 
	color: #F4EBD2;
}
.dropdown-item > li > a:hover {
	background-color: #4682b4; 
	color: #F4EBD2;
}
.dropdown-item > li > a:active {
	background-color: #203A62; 
	color: #F4EBD2;
}
.dropdown-item > li > a:visited {
	background-color: #203A62; 
	color: #F4EBD2;
}

.dropdown-menu {
    background-color: #203A62;
	color: #F4EBD2;
}
.dropdown-menu > li {
	background-color: #203A62; 
	color: #F4EBD2;
}
.dropdown-menu > li > a {
	background-color: #203A62; 
	color: #F4EBD2;
}
.dropdown-menu > li > a:hover {
	background-color: #4682b4; 
	color: #F4EBD2;
}
.dropdown-menu > li > a:active {
	background-color: #203A62; 
	color: #F4EBD2;
}
.dropdown-menu > li > a:visited {
	background-color: #203A62; 
	color: #F4EBD2;
}
	
.navbar {
	padding: 0;
}
	
/* --------------------------------------------------------------- */
/* Media Queries                                                   */
/* --------------------------------------------------------------- */

/*
Extra small devices (portrait phones, less than 576px)
No media query since this will be our default settings
*/

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
	.hero-section-text { 
		font-size: 48px;
	}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.hero-section-text { 
		font-size: 60px; 
	}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
	.hero-section-text { 
		font-size: 72px; 
	}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
	.hero-section-text { 
		font-size: 96px; 
	}
}
	
/* Giant devices */
@media (min-width: 1800px) { 
	.hero-section-text { 
		font-size: 128px; 
	}
}