html { scroll-behavior: smooth !important; }

.navbar {
  background: rgba(0, 0, 0, 0.5) !important;
}

.navbar .navbar-collapse:after { background-color: rgba(0, 0, 0, 1) !important; border-left: 1px solid rgba(0, 0, 0, 1) !important; }


.navbar-nav .dropdown-menu:before { border-bottom: 11px solid #0b1011; border-left: 11px solid transparent; border-right: 11px solid transparent; content: ""; display: inline-block; position: absolute; right: 12px; top: -11px; }
.dropdown-menu-dark { background-color: #0b1011 !important; }
.dropdown-menu.dropdown-danger .dropdown-item:hover, .dropdown-menu.dropdown-danger .dropdown-item:focus {
    background-color: #b31b1b;
}

.navbar-nav-btn-sm { padding: 10px 10px; }

@media (max-width: 1199px) {
	
	.navbar-collapse { background-color: rgba(0, 0, 0, 1) !important; border-left: 1px solid rgba(0, 0, 0, 1) !important; }
	.navbar-collapse::after { background-color: rgba(0, 0, 0, 1) !important; border-left: 1px solid rgba(0, 0, 0, 1) !important; }
	.justify-content-end {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
}
    .navbar-expand-lg .navbar-nav { -ms-flex-direction: row; flex-direction: row; }
	.navbar-expand-lg .navbar-collapse { display: -ms-flexbox!important; display: flex !important; -ms-flex-preferred-size: auto; flex-basis: auto; }
	.navbar-expand-lg .navbar-toggler { display: block !important; }
	.navbar-expand-lg .navbar-nav { -ms-flex-direction: column; flex-direction: column; }
	.toggled .bar1 { top: 6px; -webkit-animation: topbar-x 500ms linear 0s; -moz-animation: topbar-x 500ms linear 0s; animation: topbar-x 500ms 0s; -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; animation-fill-mode: forwards; }
	.toggled .bar2 { opacity: 0; }
	.toggled .bar3 { bottom: 6px; -webkit-animation: bottombar-x 500ms linear 0s; -moz-animation: bottombar-x 500ms linear 0s; animation: bottombar-x 500ms 0s; -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; animation-fill-mode: forwards; }
	
	@keyframes topbar-x {
		0% { top: 0px; transform: rotate(0deg); }
		45% { top: 6px; transform: rotate(145deg); }
		75% { transform: rotate(130deg); }
		100% { transform: rotate(135deg); }
	}
	@-webkit-keyframes topbar-x {
		0% { top: 0px; -webkit-transform: rotate(0deg); }
		45% { top: 6px; -webkit-transform: rotate(145deg); }
		75% { -webkit-transform: rotate(130deg); }
		100% { -webkit-transform: rotate(135deg); }
	}
	@-moz-keyframes topbar-x {
		0% { top: 0px; -moz-transform: rotate(0deg); }
		45% { top: 6px; -moz-transform: rotate(145deg); }
		75% { -moz-transform: rotate(130deg); }
		100% { -moz-transform: rotate(135deg); }
	}
	@keyframes bottombar-x {
		0% { bottom: 0px; transform: rotate(0deg); }
		45% { bottom: 6px; transform: rotate(-145deg); }
		75% { transform: rotate(-130deg); }
		100% { transform: rotate(-135deg); }
	}
	@-webkit-keyframes bottombar-x {
		0% { bottom: 0px; -webkit-transform: rotate(0deg); }
		45% { bottom: 6px; -webkit-transform: rotate(-145deg); }
		75% { -webkit-transform: rotate(-130deg); }
		100% { -webkit-transform: rotate(-135deg); }
	}
	@-moz-keyframes bottombar-x {
		0% { bottom: 0px; -moz-transform: rotate(0deg); }
		45% { bottom: 6px; -moz-transform: rotate(-145deg); }
		75% { -moz-transform: rotate(-130deg); }
		100% { -moz-transform: rotate(-135deg); }
	}
	@-webkit-keyframes bottombar-back {
		0% { bottom: 6px; -webkit-transform: rotate(-135deg); }
		45% { -webkit-transform: rotate(10deg); }
		75% { -webkit-transform: rotate(-5deg); }
		100% { bottom: 0px; -webkit-transform: rotate(0); }
	}
	@-moz-keyframes bottombar-back {
		0% { bottom: 6px; -moz-transform: rotate(-135deg); }
		45% { -moz-transform: rotate(10deg); }
		75% { -moz-transform: rotate(-5deg); }
		100% { bottom: 0px; -moz-transform: rotate(0); }
	}
	
}

.navbar-brand img { transition: height 0.3s ease; vertical-align: middle; }

#channelNameImage { opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; vertical-align: middle; }
#channelNameImage.visible { opacity: 1; visibility: visible; }

#video_background { position: fixed; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: 1; overflow: hidden; transform: translate(-50%, -50%); background-position: center center; background-size: cover; }

@media (max-width: 768px) {
	#video_background { display: none; }
}

.yt-video-background { position: fixed; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; z-index: -100; }
.yt-video-foreground, .yt-video-background iframe { position: absolute; top: 50%; left: 50%; width: 100vw; height: 56.25vw; min-height: 100vh; min-width: 177.77vh; transform: translate(-50%, -50%); }

.section-LatestVideo { position: relative; width: 100%; overflow: hidden; }
.section-LatestVideo::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('/appLibrary/themes/custom/assets/images/LatestVideo-Thumbnail.jpg') center/cover no-repeat; filter: blur(25px); z-index: -2; }
.section-LatestVideo::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: -1; }

@media (min-width: 768px) {
	.section-fullscreen { 
    min-height: 100vh;
    max-height: 999px;
    display: flex;
    align-items: center;
		justify-content: center; }
}

@media (max-width: 767px) {
	.mt-custom-video { margin-top: 40px; }
	.mt-custom-about { margin-top: 80px; }
	.mt-custom-merchandise { margin-top: 40px; }
	.mt-custom-donate { margin-top: 40px; }
	.mt-custom-sponsors { margin-top: 40px; }
}

.btn-danger-yt { background-color: #b31b1b !important; border-color: #C60808 !important; }
.btn-danger-yt:hover { background-color: #C60808 !important; border-color: #C60808 !important; }
.btn-default-yt { color: #FFFFFF !important; border-color: #fefdfa !important; }
.btn-default-yt:hover { background-color: #C60808 !important; border-color: #C60808 !important; }
.btn-default-yt-reverse { color: #C60808 !important; background-color: transparent !important; border-color: #C60808 !important; }
.btn-default-yt-reverse:hover { color: #FFFFFF !important; background-color: #C60808 !important; border-color: transparent!important; }
.btn-default-yt-dark { color: #FFFFFF !important; background-color: transparent !important; border-color: #fefdfa !important; }
.btn-default-yt-dark:hover { background-color: #0b1011 !important; border-color: #0b1011 !important; }
.btn-default-yt-dark2 { color: #FFFFFF !important; background-color: transparent !important; border-color: #fefdfa !important; }
.btn-default-yt-dark2:hover { color: #0b1011 !important; background-color: #FFFFFF !important; border-color: #FFFFFF !important; }
.txt-danger-yt { color: #C60808 !important; }
.section-yt { background-color: #C60808 !important; }
.section-grey { background-color: #e5e5e5 !important; }

p { font-weight: 400; }

.embed-responsive .embed-responsive-item, .embed-responsive embed, .embed-responsive iframe, .embed-responsive object, .embed-responsive video { height: 97% !important; }

.drop-shadow-custom { box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .5) !important; }

/* About me image carousel */
.fade-carousel { position: relative; min-height: 200px; }
.fade-image { width: 100%;  opacity: 0;  transition: opacity 2s ease-in-out; position: absolute; top: 0; left: 0; }
.fade-image.active { opacity: 1; position: relative; }    
@media (max-width: 991.98px) {
	.mobile-fade-container { position: relative; min-height: 150px; margin: 0 auto; max-width: 50%; }
	.mobile-fade-container .fade-image { position: absolute; top: 0; left: 0; }
	.mobile-fade-container .fade-image.active { position: relative; }
}

.img-grayscale { filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); }

/* Card styling */
.card:not(.card-plain):hover { transform: translateY(0px); -webkit-transform: translateY(0px); -ms-transform: translateY(0px); -moz-transform: translateY(0px); }
.card-product { border-radius: 8px; overflow: hidden; box-shadow: 0 4px 8px rgba(0,0,0,0.1); height: 300px; position: relative; background: #fff; }
.card-image { background-position: center; background-size: cover; height: 100%; width: 100%; transition: transform 0.5s ease; }
.card-img-overlay { background: rgba(0,0,0,0.4); display: flex; flex-direction: column; justify-content: flex-end; padding: 20px; height: 100%; }
.card-product:hover .card-image { transform: scale(1.05); }
.card-title { color: white; margin-bottom: 15px; text-shadow: 1px 1px 3px rgba(0,0,0,0.8); }
.owl-carousel .owl-nav button { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,0.8) !important; color: #333 !important; border-radius: 50% !important; width: 40px; height: 40px; font-size: 20px !important; line-height: 40px !important; }
.owl-carousel .owl-nav button.owl-prev { left: -20px; }
.owl-carousel .owl-nav button.owl-next { right: -20px; }
.owl-prev:focus, .owl-next:focus { outline: 0 !important; }

.mouseScroll { display: block; margin: 0 auto; width: 24px; height: 100px; margin-top: 55px; }
.mouseScroll-arrows { display: block; width: 5px; height: 5px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); border-right: 2px solid white; border-bottom: 2px solid white; margin: 0 0 3px 4px; width: 16px; height: 16px; }
.mouseScroll-arrows-dark { border-color: #0b1011; }
.mouseScroll-arrows-grey { border-color: #c4c4c4; }
.mouseScroll-arrow1 { margin-top: 1px; }
.mouseScroll-arrow1, .mouseScroll-arrow2, .mouseScroll-arrow3 { -webkit-animation: mouse-scroll 1s infinite; -moz-animation: mouse-scroll 1s infinite; animation: mouse-scroll 1s infinite; }
.mouseScroll-arrow1 { -webkit-animation-delay: .1s; -moz-animation-delay: .1s; -webkit-animation-direction: alternate; animation-direction: alternate; animation-delay: alternate; }
.mouseScroll-arrow2 { -webkit-animation-delay: .2s; -moz-animation-delay: .2s; -webkit-animation-direction: alternate; animation-delay: .2s; animation-direction: alternate; margin-top: -6px; }
.mouseScroll-arrow3 { -webkit-animation-delay: .3s; -moz-animation-delay: .3s; -webkit-animation-direction: alternate; animation-delay: .3s; animation-direction: alternate; margin-top: -6px; }
.mouseScroll-mouse { height: 42px; width: 24px; border-radius: 14px; transform: none; border: 2px solid white; top: 170px; }
.mouseScroll-mouse-dark { border-color: #0b1011; }
.mouseScroll-mouse-grey { border-color: #c4c4c4; }
.mouseScroll-wheel { height: 5px; width: 2px; display: block; margin: 5px auto; background: white; position: relative; height: 4px; width: 4px; border: 2px solid #fff; -webkit-border-radius: 8px; border-radius: 8px; }
.mouseScroll-wheel-dark { border-color: #0b1011; }
.mouseScroll-wheel-grey { border-color: #c4c4c4; }
.mouseScroll-wheel { -webkit-animation: mouse-wheel 0.6s linear infinite; -moz-animation: mouse-wheel 0.6s linear infinite; animation: mouse-wheel 0.6s linear infinite; }
@-webkit-keyframes mouse-wheel{
	0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
	100% { opacity: 0; -webkit-transform: translateY(6px); -ms-transform: translateY(6px); transform: translateY(6px); }
}
@-moz-keyframes mouse-wheel {
	0% { top: 1px; }
	25% { top: 2px; }
	50% { top: 3px;}
	75% { top: 2px;}
	100% { top: 1px;}
}
@-o-keyframes mouse-wheel {
	0% { top: 1px; }
	25% { top: 2px; }
	50% { top: 3px;}
	75% { top: 2px;}
	100% { top: 1px;}
}
@keyframes mouse-wheel {
	0% { top: 1px; }
	25% { top: 2px; }
	50% { top: 3px;}
	75% { top: 2px;}
	100% { top: 1px;}
}
@-webkit-keyframes mouse-scroll {
	0%   { opacity: 0;}
	50%  { opacity: .5;}
	100% { opacity: 1;}
}
@-moz-keyframes mouse-scroll {
	0%   { opacity: 0; }
	50%  { opacity: .5; }
	100% { opacity: 1; }
}
@-o-keyframes mouse-scroll {
	0%   { opacity: 0; }
	50%  { opacity: .5; }
	100% { opacity: 1; }
}
@keyframes mouse-scroll {
	0%   { opacity: 0; }
	50%  { opacity: .5; }
	100% { opacity: 1; }
}