/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/


body{
margin: 0;
padding: 0;
font-family: 'Montserrat', sans-serif;
}

.noselect{
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */ /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.navigation{
background-color: rgba(0,0,0,.4);
border-bottom: 1px solid rgba(255,255,255,0.15);
color: white;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
    -ms-flex-pack: end;
        justify-content: flex-end;
padding: 20px 30px;
position: relative;
z-index: 10;
}

.navigation a{
list-style: none;
border: 1px solid rgba(255,255,255,0.15);
padding: 6px 12px;
color: white;
background-color: rgba(255,255,255,0.03);
margin: 0 4px;
text-decoration: none;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
} 

.navigation a.navlink{
height: 32px;
}

.navigation a:hover{
background-color: #b32727;
border: 1px solid rgba(255,255,255,0.48);
}

.heroimage{
margin-top: -83px;
background-image: url(../images/britbasketball/dunk.jpg);
height: 80vh;
width: 100%;
background-size: cover;
background-position: center center;
background-repeat: no-repeat; /* Prevents the background from repeating */
position: relative;
}

.spacer{
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
}

.navigation a.headerlogo{
background: none;
border: none;
border-right: 1px solid rgba(255,255,255, .6);
padding-right: 40px;
}

.mobilemenu{
display: none;
}

.mobilemenu .fa-bars{
font-size: 20px;
margin-top: 10px;
color: rgba(255,255,255,.75);
}

.mobilemenu .fa-bars:hover{
cursor: pointer;
color: rgba(255,255,255,1);
} 

.noselect{
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */ /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.britexpanded{
font-size: 14px;
padding-top: 2px;
margin-left: 5px;
}

.headerlogo img{
width: 70px;
height: auto;
}

.heropanel{
background-color: rgba(255,255,255,0.3);
color: white;
display: inline-block;
width: 450px;
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
position: absolute;
right: 100px;
bottom: 90px;
padding: 50px;
border-radius: 10px;
opacity: 0;
-webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
        transform: translateY(30px);
-webkit-transition: opacity .9s ease, -webkit-transform .9s ease;
transition: opacity .9s ease, -webkit-transform .9s ease;
-o-transition: transform .9s ease, opacity .9s ease;
transition: transform .9s ease, opacity .9s ease;
transition: transform .9s ease, opacity .9s ease, -webkit-transform .9s ease;
}

.heropanel.darkheropanel{
background-color: rgba(0,0,0,0.6);
}

.heropanel.showheropanel{
opacity: 1;
-webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
        transform: translateY(0px);
}

.heropanelheading{
font-size: 20px;
 font-weight: 700;
margin-bottom: 5px;
}

.heropaneltext{
font-size: 13px;
margin-bottom: 30px;
}

.herobutton,
.heropaneltext2{
font-size: 16px;
}

#comm_submit_btn,
div.herobutton,
a.herobutton{
margin-top: 30px;
background-color: #b32727;
display: inline-block;
padding: 7px 15px;
border-radius: 4px;
text-decoration: none;
color: white;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
text-decoration: none;
color: white;
}

#comm_submit_btn:hover,
div.herobutton:hover,
.herobutton:hover{
background-color: #9f150d;
cursor: pointer;
}

.socialicons{
width: calc( 100% - 40px );
color: black;
text-align: right;
margin-top: 40px;
padding-right: 40px;
z-index: 1;
position: relative;
}

.socialicons a{
text-decoration: none;
margin: 0 10px 0 0;
}

.socialicons a i{
font-size: 22px;
margin-right: 10px;
color: black;
}

.navigation .fa-bars{
display: none;
}

.socialicons a:hover i{
color: #9f150d;
}



/* 1. Define the blinking animation */
@-webkit-keyframes blinker {
0% { opacity: 1; }
50% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes blinker {
0% { opacity: 1; }
50% { opacity: 0; }
100% { opacity: 1; }
}

/* 2. Apply it to your existing class */
.live-dot {
height: 10px;
width: 10px;
background-color: white; /* Ensure this contrasts with your button color */
border-radius: 50%;
display: inline-block;

/* Adds space between the dot and the text "Watch Live" */
margin-right: 1px; 

/* The Animation settings */
-webkit-animation: blinker 2s infinite ease-in-out;
        animation: blinker 2s infinite ease-in-out;
}

.navlink .live-dot{
background-color: red;
}

.navlink:hover .live-dot{
background-color: white;
}

@media (max-width: 1100px) {
	
	.navigation a.navlink{
	display: none;
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
	}

	.headerlogo img {
	width: 60px;
	margin-top: 2px;
	}

	.britexpanded{
	font-size: 12px;
	margin-top: 2px;
	}

	.navigation a.headerlogo{
	padding-right: 25px;
	}

	.navigation{
	padding: 10px 10px;
	}	

	.navigation .fa-bars{
	padding: 8px;
	font-size: 20px;
	display: block;
	}

	.mobilemenu{
	margin-top: 47px;
	display: block;
	text-align: right;
	position: absolute;
	left: 0;
	background-color: rgba(0,0,0,1);
	width: 100%;		
	z-index: 10;
	}

	.navigation .mobilemenu a.navlink {
	display: block;	
	border-top: none;
	}

	.mobilemenulinks{	
	display: none;
	}

	.navigation .mobilemenu a{
	margin: 0;
	padding: 20px 40px;	
	padding-bottom: 40px;
	}

	.mobilemenulinks.openmenu{
	display: block;
	height: 640px;
	width: 100%;
	padding: 0;
	}

	.heroimage{
	background-position: -180px center;
	}

	.heropanel.darkheropanel,
	.heropanel {
	position: absolute;
	width: 100%;
	padding: 200px 20px 40px 20px;
	bottom: 0;
	left: 0;
	top: initial;
	right: initial;
	border-radius: 0;
	background: rgb(2,0,36);
	background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.75) 55%, rgba(0,0,0,.98) 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), color-stop(55%, rgba(0,0,0,0.75)), to(rgba(0,0,0,.98)));
	background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.75) 55%, rgba(0,0,0,.98) 100%);
	opacity: 1;
	-webkit-transform: translateY(0px);
	    -ms-transform: translateY(0px);
	        transform: translateY(0px);
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
	-webkit-backdrop-filter: blur(0px);
	        backdrop-filter: blur(0px);
	}

	.heropanelheading {
	font-size: 18px;
	margin-bottom: 0;
	font-weight: 700;
	}

	.heropaneltext{
	font-size: 12px;
	}

	.heropaneltext2{
	font-size: 15px;
	}

	.socialicons{
	color: white;
	text-align: right;
	margin-top: 50px;
	margin-bottom: -95px;	
	padding-right: 0;
	width: calc(100% - 30px);
	}

}

@media (max-width: 767px) {

	.heroimage{
	background-position: -250px center;
	}

}

/*home panel*/

.homepanel{
padding: 30px 50px;
}

.homepanelheading.sitestats{
margin-top: 70px;
}

.homepanelheading{
font-size: 40px;
position: relative;
}

.homepanelheading::after {
content: "";
position: absolute;
bottom: -5px;
left: 3px; 
width: 80px;
height: 3px;
background-color: #b32727; /* The color of the underline */
}


/*footer*/

.sitefooter{
width: 100%;
background-color: black;
padding: 70px 30px;
text-align: center;
color: white;
background-repeat: no-repeat;
background-position: calc( 50% - 430px) -115px;
background-size: 1200px 1200px;
opacity: 1;
}

.sitefooter.galleryfooter{
opacity: 0;
}

.sitefooter .sitefooterpanel a.navlink,
.sitefooter a{
color: rgba(255,255,255,.8);
}

.sitefooter .sitefooterpanel a.navlink:hover,
.sitefooter a:hover{
color: rgba(255,255,255,1);	
}

.bottomfooter,
.sitefooterinner{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
max-width: 1000px;
text-align: center;
margin: 0 auto;
}

.sitefooter .socialicons a i,
.sitefooter .socialicons{
color: rgba(255,255,255,.8);
text-align: left;
}

.sitefooter .socialicons a:hover i{
color: rgba(255,255,255,1);	
}

.sitefooter .socialicons{
margin-top: 20px;
}

.sitefooterpanel{
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
text-align: left;
}

.sitefooterpanel:first-child{
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
text-align: left;
}

.sitefooterpanel:nth-child(2),
.sitefooterpanel:nth-child(3){
text-align: right;
width: 200px;
-webkit-box-flex: 0;
    -ms-flex: none;
        flex: none;
}

.sitefooterpanel .navlink{
display: block;
text-decoration: none;
color: white;
margin-bottom: 15px;
}

.sitefooterpanel .britexpanded{
margin-left: 0;
opacity: .85;
}

.bottomfooter{
padding-top: 50px;
text-align: right;
display: block;
margin-top: 30px;
border-top: 1px solid rgba(255,255,255,.4);
}

.bottomfooterpanel{
text-align: right;
display: inline-block;
margin-left: 30px;
}

.bottomfooter a{
text-decoration: none;
}

@media (max-width: 766px) {

	.sitefooterinner{
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	}

	.sitefooterpanel:first-child{
	width: 100%;
	}

	.sitefooter .socialicons{
	margin-bottom: 50px;		
	}

	.sitefooterpanel:nth-child(2), .sitefooterpanel:nth-child(3){
	text-align: left;
	}

	.bottomfooterpanel{
	margin-left: 0;
	}

	.sitefooter{
	background-position: 60px -110px;
	background-size: 1000px 1000px;
	}

}


/*spnsors*/

.sponsorlevel{
position: absolute;
bottom: 5px;
left: 5px;
font-size: 12px;
}

.title_of_listing{
font-size: 16px;
font-weight: 700;
margin-bottom: 5px;
}

.sponsortype{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
background-color: rgba(0,0,0,.015);
border-radius: 12px;
margin-bottom: 50px;
}

.sponsorlisting {
max-width: 1600px;
margin: 70px auto;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
-webkit-box-pack: center;
    -ms-flex-pack: center;
        justify-content: center;
}

.sponsors .sponsorlisting {
max-width: 1600px;
margin: 30px auto 70px auto;
text-align: left;
display: block;
}

.sponsorlisting a{
border: 2px solid rgba(0,0,0,0);
-webkit-transition: background .5s ease, -webkit-box-shadow .5s ease, -webkit-transform .5s ease;
transition: background .5s ease, -webkit-box-shadow .5s ease, -webkit-transform .5s ease;
-o-transition: box-shadow .5s ease, transform .5s ease, background .5s ease;
transition: box-shadow .5s ease, transform .5s ease, background .5s ease;
transition: box-shadow .5s ease, transform .5s ease, background .5s ease, -webkit-box-shadow .5s ease, -webkit-transform .5s ease;
border-radius: 12px;
height: 160px;
margin: 10px 10px;
padding: 20px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-shadow: 7px 7px 7px rgba(0,0,0,0);
        box-shadow: 7px 7px 7px rgba(0,0,0,0);
-webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
        transform: translate(0, 0);
background-size: 70%;
background-position: center center;
background-repeat: no-repeat;
width: 190px;
}

.sponsorlisting a:hover{
-webkit-box-shadow: -5px 5px 25px rgba(0,0,0,.12);
        box-shadow: -5px 5px 25px rgba(0,0,0,.12);
-webkit-transform: translate(-2px, -2px);
    -ms-transform: translate(-2px, -2px);
        transform: translate(-2px, -2px);
background-color: white;
}


/*comments*/

.brit_comments{
margin-top: 30px;
display: flex;
flex-wrap: wrap;
}

.britcommentssection.subhomepanelcontainer{
margin: 0 auto 50px auto;
}


.brit_comment{
flex: none;
width: calc(50% - 10px);
box-shadow: 7px 7px 7px rgba(0,0,0,0.07);
display: flex;
border-radius: 10px;
}

.brit_comment{
margin-right: 20px;
margin-bottom: 20px;
}

.darkmode .brit_comment{
background-color: rgba(0,0,0,.3);
}

.brit_comment:nth-child(2),
.brit_comment:nth-child(4){
margin-right: 0;
}

.users_comment{
padding: 30px;
}

.comment_image{
height: 200px;
width: 250px;
background-size: cover;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
flex: none;
background-size: cover;
background-position: center;
}

.brit_comment .name{
margin-top: 10px;
}

.brit_comment i{
margin: 0 4px 0 0;
}

.brit_comment i:nth-child(2){
margin-left: 10px;
}


/*event info*/

.socialicons.mobile{
display: none;
}

.eventline{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-bottom: 15px;
}

.eventline i{
-webkit-box-flex: 0;
    -ms-flex: none;
        flex: none;
width: 20px;
position: relative;
top: 2px;
margin-right: 10px;
}

.homepanelcontainer{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
max-width: 1600px;
margin: 40px auto 0 auto;
}

.subhomepanelcontainer{
max-width: 1600px;
margin: 0 auto 0 auto;	
}

.homepanelcontainer .homepanel:nth-child(1){
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
}


.homepanelcontainer .homepanel:nth-child(2){
-webkit-box-flex: 4;
    -ms-flex: 4;
        flex: 4;
}

@media (max-width: 1700px) {

	.brit_comments{
	flex-direction: column;
	}

	.brit_comment:nth-child(1){
	margin-right: 0;
	margin-bottom: 20px;
	}

	.brit_comment{
	width: 100%;
	}

}

@media (max-width: 1200px) {

	.homepanelcontainer{
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;	
	}

	.homepanelheading{
	font-size: 24px;
	}

	.homepanel{
	padding: 30px 20px;
	}


}

@media (max-width: 767px) {

	.sponsorlisting a{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 100%;
	}

	.socialicons.mobile{
	display: block;
	text-align: left;
	margin-top: 15px;
	margin-left: 30px;
	}

	.socialicons.desktop{
	display: none;
	}

	.brit_comment{
	flex-direction: column;
	box-shadow: none;	
	}

	.comment_image {
    border-radius: 10px;
	}

	.users_comment{
	padding: 20px 0 30px 0;
	}

	.darkmode .brit_comment{
	background:none;
	}

}


/*games container*/

.yearnavigation{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}

a.yearbutton{
border: 1px solid black;
padding: 7px 0px;
border-radius: 4px;
margin: 0 4px;
text-decoration: none;
width: 30px;
height: 32px;
display: inline-block;
text-align: center;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
font-size: 16px;
}

a.yearbutton:hover{
background-color: rgba(0,0,0,.07);
}

.home_gallery_container{
background-color: black;
}

.subhomepanelcontainer.gamescontainer{
background-color: black;
margin: 50px auto 0 auto;
width: 100%;
max-width: 100%;

}

.subhomepanelcontainer.gamescontainer .homepanel{
max-width: 1600px;
margin: 0 auto;
padding: 70px 0 70px 50px;
}

.gamescontainer .homepanelheading{
color: white;
}

.gamescontainer .sponsorlisting{
-webkit-box-pack: start;
    -ms-flex-pack: start;
        justify-content: flex-start;
text-align: left;
margin: 20px 0 70px 0;
max-width: 100%;
}

.gamescontainer .sponsorlisting a.home_sponsor_link{
background-color: white;
background-size: cover;
border: none;
padding: 0;
text-decoration: none;
margin: 10px 15px 5px 0;
overflow: hidden;
}

.gamescontainer .image_shade{
opacity: 0;
-webkit-transition: opacity .3s ease;
-o-transition: opacity .3s ease;
transition: opacity .3s ease;
color: white;
background-color: rgba(0,0,0,.65);
width: 200px;
height: 160px;
padding: 20px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
    -ms-flex-align: end;
        align-items: flex-end;
}

.gamescontainer .sponsorlisting a.home_sponsor_link:hover{
-webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
        transform: translate(0,0);
}

.gamescontainer .sponsorlisting a.home_sponsor_link:hover .image_shade{
opacity: 1;
}

.gamescontainer.subhomepanelcontainer {
position: relative;
overflow: hidden;
}

.gamescontainer.subhomepanelcontainer::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: inherit; /* Inherit the inline background image */
background-size: cover;
background-position: center 40%;
-webkit-filter: brightness(12%) grayscale(100%);
filter: brightness(18%) grayscale(100%);
z-index: 0;
}

.gamescontainer.subhomepanelcontainer .homepanel {
position: relative;
z-index: 1; /* Ensures content is above the background */
}


@media (max-width: 1200px) {
    
	.subhomepanelcontainer.gamescontainer .homepanel{
	padding: 70px 20px 30px 20px;
	}

}


@media (max-width: 767px) {

.gamescontainer .image_shade{
width: 100%;
padding: 0;
}

.gamescontainer .image_shade .gallery_name{
padding: 5px 15px;
background-color: rgba(0,0,0,.70);
width: 100%;
}

.gamescontainer .sponsorlisting a.home_sponsor_link .image_shade{
opacity: 1;
background: none;
}

.gamescontainer .sponsorlisting a.home_sponsor_link{
margin-right: 0;
}

}


/*Homepage text*/

.subhomepanelcontainer.hometext .homepanel{
	margin-top: 30px;

}

/*subpage*/




.subpagetitle{
position: absolute;
bottom: 50px;
right: 100px;
z-index: 2;
color: white;
font-weight: 700;
font-size: 30px;
margin-left: 40px;
}

.homepaneltext{
margin-top: 30px;
}

.heroimage.subpage {
height: 260px;
margin-bottom: 50px;
background-position: 30% 35%;
}

.heroimage.subpage .subpageshade {
content: '';
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background: rgb(0,0,0);
background: -o-linear-gradient(120deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,0.20) 30%, rgba(0,0,0,.10) 35%, rgba(0,0,0,0) 100%);
background: linear-gradient(330deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,0.20) 30%, rgba(0,0,0,.10) 35%, rgba(0,0,0,0) 100%);
z-index: 1;
pointer-events: none;
opacity: 0;
}




@media (max-width: 2000px) {

	.heroimage.subpage{
	background-size: 2000px;	
	}

}

@media (max-width: 1000px) {
	
	.subpagetitle{
	font-size: 22px;
	bottom: 30px;
	right: 30px;
	}

	.heroimage.subpage {
	height: 270px;
	}

}

@media (max-width: 600px) {

	.heroimage.subpage{
	height: 240px;
	background-position: 30% 10px;
	background-size: 112%;
	}


}

@media (max-width: 440px) {

	.heroimage.subpage{
	height: 200px;
	background-position: 30% 5%;
	background-size: 140%;
	}

	.subpagetitle{
	font-size: 18px;
	bottom: 20px;
	right: 30px;
	}

}

@media (max-width: 400px) {

	.heroimage.subpage{
	background-position: 30% -5%;
	}

}

@media (max-width: 400px) {

	.heroimage.subpage{
	background-position: 30% -7%;
	}

}

@media (max-width: 360px) {

	.heroimage.subpage{
	background-position: 30% -15%;
	}

}

/*login*/

.siteloginform .inputfield input {
width: 100%;
margin-bottom: 20px;
padding: 10px;
}

#loginbutton {
background-color: #b32727;
border: none;
padding: 10px 15px;
color: white;
border-radius: 5px;
}

.siteloginform .inputfield input {
margin-bottom: 0;
}


/*teams*/

.brit_teams{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}

.brit_teams .listing_of_games{
-webkit-box-flex: 0;
    -ms-flex: none;
        flex: none;
width: 270px;
margin-right: 30px;
}

.brit_teams .article-detail{
margin-top: 0;
padding-top: 0;
}

.team_block{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
}

.team_block .team_photo_block{
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
}

.team_block .team_photo_block img{
max-width: 800px;
width: 50vw;
border-radius: 20px;
}

.team_block .team_galleries{
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
display: inline-block;
text-align: left;
}

.team_block .team_galleries.team_photo_block{
text-align: left;
margin-right: 50px;
}

.team_block .team_galleries h1{
text-align: left;
margin-top: 0;
}

.team_block .team_galleries.alignleft{
text-align: left;	
}

.team_block .team_galleries.alignleft h1{
text-align: left;
}

@media (max-width: 1200px) {

	.brit_teams{
	display: block;
	}

	.brit_teams .article-detail{
	margin-top: 40px;
	padding-top: 40px;
	border-top: 1px solid lightgrey;
	}


}

@media (max-width: 1000px) {

	.team_block{
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	text-align: left;
	}

	.team_block .team_photo_block{
	margin-bottom: 30px;
	}

	.team_block .team_photo_block img{
	max-width: 100%;
	}

	.team_block .team_galleries{
	text-align: left;
	}

	.team_block .team_galleries h1{
	text-align: left;
	margin-top: 20px;
	}

	.team_block .team_galleries.team_photo_block{
	margin-right: 0;
	}

	.team_block .team_photo_block img{
	width: 100%;
	max-width: 100%
	}

}

/*team*/

.teampageheader{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-bottom: 30px;
}

.teampageheader .home_sponsor_link{
-webkit-transition: -webkit-box-shadow .5s ease, -webkit-transform .5s ease;
transition: -webkit-box-shadow .5s ease, -webkit-transform .5s ease;
-o-transition: box-shadow .5s ease, transform .5s ease;
transition: box-shadow .5s ease, transform .5s ease;
transition: box-shadow .5s ease, transform .5s ease, -webkit-box-shadow .5s ease, -webkit-transform .5s ease;
border-radius: 20px;
height: 140px;
width: 200px;
margin: 10px 30px 10px 0px;
padding: 20px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
-webkit-box-shadow: -5px 5px 25px rgba(0,0,0,.12);
        box-shadow: -5px 5px 25px rgba(0,0,0,.12);
-webkit-transform: translate(-2px, -2px);
    -ms-transform: translate(-2px, -2px);
        transform: translate(-2px, -2px);
background-color: white;
}



.profiledetail6 .teamnameblock h1{
margin-top: 20px;
}

@media (max-width: 767px) {

	.teampageheader{
	-webkit-box-orient: vertical;
	-webkit-box-direction: reverse;
	    -ms-flex-direction: column-reverse;
	        flex-direction: column-reverse;	
	}

}

/*homepage blog posts*/

.profiledetail6{
min-height: 500px;
}

.blogthumbnails{
margin-top: 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
width: 100%;
}

.blogthumbnails .herobutton{
margin-top: 0;
}

.allblogarticles{
width: 100%;
text-align: left;
}


.blogpost{
width: 45%;
margin: 0 2.5% 50px 0;
}

.thumbnailimagecontainer{
height: 300px;
border-radius: 12px;
margin-bottom: 15px;
background-size: cover;
background-position: center center;
-webkit-transition: opacity .3s ease;
-o-transition: opacity .3s ease;
transition: opacity .3s ease;
}

.thumbnailimagecontainer:hover{
opacity: .8;
}

.blogtitle a {
text-decoration: none;  /* Removes the underline */
color: inherit;         /* Inherits the color from the parent element */
font-size: 22px;

}

.articledate{
margin-top: 10px;	
font-size: 13px;
}

.articledate i{
margin-right: 3px;
}

.articledate i.fa-calendar{
margin-left: 10px;
}

.articlelist .articledate i.fa-calendar{
margin-left: 0;
}

.articlelist .articledate i.fa-user{
margin-left: 0;
margin-top: 7px;
}

@media (max-width: 767px) {

	.blogpost{
	width: 100%;
	margin: 0 0% 50px 0;
	}

}

/*blog post*/

.articledate,
.posttitle{
text-align: left;
}

a.back_blog_posts {
text-decoration: none;
}

.posttitle{
margin-bottom: 2px;
}

.summernote img{
opacity: 1;
max-width: 100%
}

.article-detail{
margin-top: 0px;
width: 100%;
border: none;
}

.servicebodycontainer .serviceboximage{ 
height: 350px;
width: 100%;
left: -0px;
top: -5px;
border-top-right-radius: 9px;
border-top-left-radius: 9px;
position: relative;
-webkit-box-flex: 0;
    -ms-flex: none;
        flex: none;
background-position: center calc(50% + 40px);
margin: 30px auto 0px auto;
}

.bg-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
opacity: 1 !important;
z-index: -1;
border-radius: 6px;
}

.servicebody_body{
text-align: left;
}

.blogbody{
padding: 0;
}

.level6 {
width: 90%;
}

.profiledetail6.actualblogpost{
max-width: 780px;
padding: 0;
min-height: 500px;
}

.profiledetail6.actualblogpost p{
line-height: 26px;
margin-top: 16px;
margin-bottom: 10px;
letter-spacing: normal;
margin-left: 0;
margin-right: 0;
overflow-wrap: break-word;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
padding-top: 0;
-webkit-text-size-adjust: 100%;
   -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
        text-size-adjust: 100%;
}

@media (max-width: 767px) {

	.profiledetail6{
	min-height: 200px;
	margin-bottom: 70px;
	}

}

/*contact form*/

.contactform{
max-width: 700px;
text-align: left;
}

.contactfield{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}

.requiredfield{
color: red;
display: inline-block;
width: 20px;
position: relative;
top: 7px;
margin-left: -20px;
}

.contactfield input{
display: inline-block;
}

.contactform button{
border: none;
margin-top: 0;
background-color: #b32727;
display: inline-block;
padding: 7px 15px;
border-radius: 4px;
text-decoration: none;
color: white;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
text-decoration: none;
color: white;
}

button{
background-color: white;
border: 1px solid black;
padding: 10px 20px;
border-radius: 4px;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
}

button:hover{
background-color: rgba(0,0,0,.08);
cursor: pointer;
}

.privacyagree{
text-align: left;
}


@media (max-width: 600px) {

	.requiredfield{
	color: red;
	display: inline-block;
	width: 10px;
	position: relative;
	top: 7px;
	margin-left: -10px;
	}

}

/*games*/

.tournamentstructure{
max-width: 100%;
height: auto;
}

/*schedule*/

.schedule_button {
margin-left: 10px;
}

a.gamelistingel,
.gamelistingel{
display: block;
margin-bottom: 10px;
}

.listing_of_games{
text-align: left;
}

.time_of_game{
font-weight: 700;
}

/*photos*/

.team_instance{
margin-top: 4px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}

.team_instance.winner{
margin-bottom: 15px;
}

a.photolink{
margin-bottom: 10px;
display: inline-block;
}

.game_container{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
    -ms-flex-direction: column;
        flex-direction: column;
}

.game_score,
.youtubevideobox{
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
}

.youtubevideobox iframe{
width: 498px;
height: 280px;
}

.youtubevideobox iframe{
border-radius: 10px;
overflow: hidden;
}

.youtubevideobox{
margin-top: 30px;
}

.game_time{
margin-bottom: 10px;
}

.hiddenform{
display: none;
}

.text-muted{
display: block;
margin-bottom: 5px;
display: block;
}

.upload_image_button{
border: 1px solid black;
padding: 5px 20px;
display: inline-block;
border-radius: 4px;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
width: 180px;
height: 32px;
display: block;
}

.upload_image_button:hover{
cursor: pointer;
background-color: rgba(0,0,0,.08);
}

.team_score{
padding: 0 5px;
border: 1px solid grey;
border-radius: 2px;
background-color: white;
width: 35px;
text-align: center;
margin-right: 4px;
min-width: 45px;
}

.leftalign input{
display: inline;
width: 30px !important;
}

.winner .team_score{
background-color: lightgreen;
border: 1px solid green;
}

.team_name,
.team_score{
display: inline-block;
}

.galleries.thumbnails {
margin-top: 50px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.no_photos{
margin: auto;
font-size: 30px;
color: grey;
}

.galleryimage{
position: relative;
}

.galleryimage img{
max-height: 200px;
width: auto;
border-radius: 10px;
margin: 0px 5px 10px 5px;
-webkit-transition: -webkit-filter .3s ease;
transition: -webkit-filter .3s ease;
-o-transition: filter .3s ease;
transition: filter .3s ease;
transition: filter .3s ease, -webkit-filter .3s ease;
}

.galleryimage img:hover{
-webkit-filter: contrast(1.3);
        filter: contrast(1.3); 
cursor: pointer;
}

.galleryimage img.lazy{
width: 10px;
height: 10px;
border: 10px solid red;
}

@media (max-width: 767px) {

	.galleries.thumbnails {
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	}

}


@media (max-width: 600px) {

	.youtubevideobox.dashlisting iframe{
	width: 100%;
	}

}

/* Admin Section */

.randomize_homepage_image{
position: relative;
}

.random_image_container{
width: 100%;
text-align: right;
}

.profiledetail6 form select,
.profiledetail6 form input{
width: 100%;
border-radius: 4px;
border: 1px solid lightgrey;
}

.profiledetail6 .smallform,
.profiledetail6 form.smallform {
max-width: 500px;
text-align: left;
}

.requiredformfield{
color: red;
margin-right: 5px;
position: relative;
top: 2px;
}

.deleteoptions{
display: none;
}

.profiledetail6 h1{
font-size: 22px;
text-align: left;
margin-top: 40px;
}

.admin_linkbar{
width: 100%;
text-align: left;
}

a.profilelink{
text-align: center;
display: inline-block;
width: 110px;
padding: 5px 10px;
text-decoration: none;
color: black;
border: 1px solid black;
border-radius: 4px;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
text-decoration: none;
}

.profilelink:hover{
cursor: pointer;
background-color: rgba(0,0,0,.1);
}

.profile_panels{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
    -ms-flex-direction: column;
        flex-direction: column;
}

.profile_panels .general_settings_container{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}

.profile_panels a {
padding: 10px 15px;
margin: 5px 10px;
border: 1px solid grey;
border-radius: 7px;
text-decoration: none;
color: black;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
-webkit-box-flex: 0;
    -ms-flex: none;
        flex: none;
width: 200px;
height: 42px;
}

.general_settings_explanation{
padding: 15px 15px;
text-align: left;
}

.profile_panels a:hover{
background-color: rgba(0,0,0,.1);
}

@media (max-width: 767px) {

	.profile_panels a{
	width: 95%;
	}

	.profile_panels .general_settings_container{
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	text-align: left;
	margin-bottom: 30px;
	}

}

/* styling for summernote boxes to ensure that floated images are 100% at lower resolutions */

@media (max-width: 767px) {
  
  .summernote img {
  width: 100% !important;
  float: none !important;
  padding: 10px 0 15px 0 !important;
  }

}



/* Blog Posts */

.captiontitle a{
text-decoration: none !important;
}

.deleteconfirmationbox a,
.deleteconfirmationbox .deloption {
color: black !important
}

.deloption.btn.btn-primary{
background-color: white;
border: 1px solid black;
}

.deleteconfirmme.deloption.btn.btn-primary{
background-color: red;
color: white !important;
border: none;
}

.submitbutton button{
background: white;
color: black;
font-weight: 500;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
}

.submitbutton button:hover{
background-color: rgba(0,0,0,.08);
}

.deleteconfirmme.deloption.btn.btn-primary:hover{
background-color: darkred;
}

.imagedelete{
padding: 5px 10px;
background-color: rgba(0,0,0,.5);
display: inline-block;
border: none;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
}

.imagedelete:hover{
cursor: pointer;
background-color: rgba(0,0,0,.9);
}

.canceldelete{
margin-left: 30px;
}

.articlelist{
max-width: 900px;
}

.inactive_article,
.profiledetail6 .thumbnailimage a,
.profiledetail6 .thumbnailimage{
width: 150px;
height: 92px;	
}

.profiledetail6 .thumbnailimage{
margin-right: 20px;
}

.profiledetail6 .thumbnailimage a{
background-size: cover;
background-position: center center;
display: block;
border-radius: 4px;
opacity: 1;
-webkit-transition: opacity .3s ease;
-o-transition: opacity .3s ease;
transition: opacity .3s ease;
}

.profiledetail6 .thumbnailimage a:hover{
opacity: .8;
}

.articlelist .thumbnail{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-right: 20px;
}

.articlelist .thumbnail.disabled a,
.articlelist .thumbnail.disabled .timesince,
.articlelist .thumbnail.disabled{
background-color: grey;
color: white;
}

.inactive_article{
background-color: rgba(0,0,0,.6);
text-align: center;
padding-top: 35px;
font-weight: 700;
}

.articlelist .fa-solid.fa-eye,
.articlelist .fa-solid.fa-user{
margin-left: 10px;
}

@media (max-width: 480px) {

	.articlelist .thumbnail{
	display: block;
	}

	.inactive_article,
	.profiledetail6 .thumbnailimage,
	.profiledetail6 .thumbnailimage a{
	width: 100%;
	height: 150px;
	}

	.inactive_article{
	padding-top: 65px;
	}

}

/* Edit Home Images*/

.homeimageblock{
width: 300px;
height: 150px;
background-size: cover;
background-position: center center;
margin: 15px 20px 15px 0px;
position: relative;
border-radius: 10px;
border: 1px solid rgba(0,0,0,0.08);
padding: 5px 10px;
-webkit-box-shadow: 7px 7px 7px rgba(0,0,0,0.07);
        box-shadow: 7px 7px 7px rgba(0,0,0,0.07);
}

.instance_counter{
background-color: lightgreen;
padding: 3px 5px;
border-radius: 4px;
margin-top: 5px;
position: absolute;
bottom: 7px;
left: 0;
}

.thumbnail_priority{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
    -ms-flex-direction: column;
        flex-direction: column;
position: absolute;
bottom: 0;
right: left;
color: white;
z-index: 100;
margin: 0 0 2px -5px;
}

.thumbnail_priority .priority{
border: 2px solid white;
width: 30px;
height: 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-bottom: 3px;
border-radius: 5px;
background-color: rgba(0,0,0,.3);
-webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
        transform: translateX(0px);
-webkit-transition: background .3s ease, -webkit-transform .3s ease;
transition: background .3s ease, -webkit-transform .3s ease;
-o-transition: transform .3s ease, background .3s ease;
transition: transform .3s ease, background .3s ease;
transition: transform .3s ease, background .3s ease, -webkit-transform .3s ease;
}

.thumbnail_priority .priority:hover{
background-color: rgba(0,0,0,.9);
cursor: pointer;
-webkit-transform: translateX(2px);
    -ms-transform: translateX(2px);
        transform: translateX(2px);
}

.thumbnail_priority .priority.selected{
border: 2px solid green;
background-color: lightgreen;
color: black;
}

.thumbnail_priority .priority .priority_num{
margin: auto;
}

.actualdeletebutton,
.actualcancelbutton,
.thedeletebutton,
.deletebutton{
position: absolute;
bottom: 5px;
right: 5px;
color: white;
border: 2px solid white;
background-color: rgba(0,0,0,.5);
padding: 5px 10px;
border-radius: 4px;
text-decoration: none !important;
color: white !important;
}

.panel_color_selection{
background-color: rgba(0,0,0,.5);
position: absolute;
right: 5px;
top: 5px;
color: white;
border: 2px solid white;
padding: 5px 10px;
border-radius: 4px;
}

.actualcancelbutton{
width: 100px;
right: 5px;
}

.actualdeletebutton{
right: 110px;
background-color: red;
width: 100px;
}

.actualdeletebutton:hover,
.actualcancelbutton:hover,
.thedeletebutton:hover,
.deletebutton:hover{
cursor: pointer;
background-color: rgba(0,0,0,.6);
}

.actualdeletebutton:hover{
font-weight: 700;
background-color: red;
}

.homepageimages{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
-webkit-box-pack: start;
    -ms-flex-pack: start;
        justify-content: flex-start;
}

.brithomepageimage{
text-align: left;
}


/*Sponsors*/

.section_list_container,
.year_list_container{
display: inline-block;
}

.section_list_container select,
.year_list_container select{
padding: 0px 10px;
border: 1px solid black !important;
width: 130px;
height: 32px;
border-radius: 4px;
font-size: 14px;
}

a.link_to_sponsor{
position: absolute;
bottom: 42px;
right: 5px;
color: white;
border: 2px solid white;
background-color: rgba(0,0,0,.5);
padding: 5px 10px;
border-radius: 4px;
text-decoration: none;
}

.editsponsor.link_to_sponsor{
bottom: 80px;	
}

.link_to_sponsor:hover{
cursor: pointer;
background-color: rgba(0,0,0,.6);
}

.sponsors .homeimageblock{
background-size: contain;
background-repeat: no-repeat;
}

.sponsors .homeimageblock{
background-size: 30%;
}

@media (max-width: 767px) {

	.subhomepanelcontainer.sponsors .sponsorlisting{
	text-align: center;
	}

	.sponsortype{
	padding: 5px 0 5px 0;
	display: block;
	}

	.subhomepanelcontainer.sponsors .sponsorlisting a.home_sponsor_link{
	width: 200px;
	margin: 20px auto;	
	}

	.title_of_listing{
	margin-bottom: 15px;
	text-align: left;
	}

}

/*configure homepage images*/
.white_modal_switch {
text-align: left;
width: 30px;
}

.white_modal_switch input{
width: 20px;
height: 20PX;
}


/*Brit Website Sections*/

.section_list_container select{
width: 400px;
}


/*configure teams*/

.element_name{
font-weight: 700;
margin-top: 10px;
}


/*Create User*/

.usercreateform input[type="checkbox"] {
display: inline-block;
width: 20px;
position: relative;
top: 2px;

}


/*Tournament Grid*/

.tournament_grid{
max-width: 1400px;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
    -ms-flex-direction: row;
        flex-direction: row;
padding: 10px;
font-size: 11px;
}

@media (max-width: 1700px) {

	.tournament_grid{
	overflow-x: scroll;
	}

}

.column .gameleft.clickable,
.column .gameright.clickable{
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
background-color: rgba(238,238,238,1);
}

.gameright.clickable:hover,
.gameleft.clickable:hover{
background-color: grey;
cursor: pointer;
color: white;
}

.tournament_grid .column{
width: 145px;
-webkit-box-flex: 0;
    -ms-flex: none;
        flex: none;
}

.column a.teamlink{
width: 145px;
text-decoration: none;
display: block;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
color: red;
text-align: left;
padding: 0 2px;
}

.column a.teamlink .score{
display: inline-block;
background-color: #c21f1f;
border-radius: 3px;
padding: 2px 5px;
margin: 2px auto;
color: white;
}


.clickable{
color: red;
}

.column a.teamlink:hover{
background-color: grey;
color: white;
}

.column .teamnametop{
height: 40px;
border-bottom: 1px solid black;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
    -ms-flex-align: end;
        align-items: flex-end;  
-webkit-box-pack: center;  
    -ms-flex-pack: center;  
        justify-content: center;
}

.column .teamnamebottom{
height: 40px;
border-top: 1px solid black;
-webkit-box-align: start;
    -ms-flex-align: start;
        align-items: flex-start;  
-webkit-box-pack: center;  
    -ms-flex-pack: center;  
        justify-content: center;
}

.column .gameleft,
.column .gameright{
background-color: #fafafa;
padding: 5px;
}

.column .gameleft{
border-left: 1px solid black;
height: 40px;
}

.column .gameright{
border-right: 1px solid black;
height: 40px;
}

.column .bottomline{
border-bottom: 1px solid black;	
}

.column1 .block1{
height: 0px;
}

.column1 .block2{
height: 260px;
border-bottom: 1px solid black;
}

.column1 .block3{
height: 180px;
border-bottom: 1px solid black;
}

.column2 .block1{
height: 60px;
}

.column2 .block2{
height: 80px;
}

.column2 .block6 {
padding-top: 65px;
}

.column2 .block10{
border-right: 1px solid black;
}

.column2 .block6{
height: 160px;
}

.column3 .block1{
height: 40px;
}

.column3 .block1a{
border-right: 1px solid black;
}

.column3 .block5{
height: 40px;
}

.column4 .block1{
height: 140px;
}

.column4 .block3,
.column4 .block7{
border-right: 1px solid black;
}

.column4 .block5{
height: 0px;
}

.tournament_grid .column5.column{
width: 50px;
}

.column6 .block9{
height: 220px;
}

.column6 .block3,
.column6 .block7,
.column6 .block11,
.column6 .block14{
border-right: 1px solid black;
}

.column7 .block1{
height: 20px;
}

.column7 .block3{
height: 120px;
padding-top: 45px;
}

.column7 .block5{
height: 20px;
}

.column7 .block7,
.column7 .block19,
.column7 .block11,
.column7 .block9{
border-left: 1px solid black;		
}

.column7 .block9{
border-right: 1px solid black;	
}

.column7 .block15{
border-right: 1px solid black;
height: 120px;
padding-top: 40px;
}

.column7 .block17{
height: 100px;
}

.column8 .block1{
height: 80px;	
}

.column8 .block3{
height: 180px;
padding-top: 75px;
}

.column8 .block6{
height: 40px;
}

.column8 .block8{
height: 160px;
padding-top: 65px;
}

.column8 .block10{
height: 60px;
}

.column8 .block12{
border-left: 1px solid black;
}

.column8 .block13{
height: 40px;
}

.column9 .block1{
height: 170px;
}

.column9 .block3{
height: 290px;
padding-top: 125px;
}

.column9 .block5{
height: 160px;
}

.column10 .block1{
height: 350px;
}

a.winnerblock{
font-weight: 700;
padding: 3px 7px;
border-radius: 3px;
background-color: #c21f1f;
width: 135px;
margin-bottom: 4px;
text-decoration: none;
color: white;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
}

a.winnerblock:hover{
cursor: pointer;
background-color: #a10a0a;
}



/*results grid*/

.resultsbody{
max-width: 900px;
padding-left: 5px;
padding-right: 5px;
}

.gamecontainertitle{
font-size: 20px;
margin: 70px auto 20px auto;
}

.gamecontainertitle,
.gamecontainer{
max-width: 900px;
}

.gamecontainer{
margin: 5px auto;
position: relative;
overflow: hidden;
border-radius: 10px;
border: 1px solid rgba(0,0,0,.15);
padding: 5px;
font-size: 13px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
    -ms-flex-direction: row;
        flex-direction: row;
}

.gamenumbertag{
background-color: grey;
color: white;
padding: 7px 10px;
border-radius: 10px;
display: block;
-webkit-transition: background .3s ease;
-o-transition: background .3s ease;
transition: background .3s ease;
width: 160px;
-webkit-box-flex: 0;
    -ms-flex: none;
        flex: none;
}


.gamenumbertag.clickable{
background-color: #c21f1f;
}

.gameleft.gamenumbertag.clickable:hover{
background: #a10a0a;
}

.gametime{
margin-top: 3px;
font-size: 11px;
}

.gamenumber,
.teamsections .teamname{
font-weight: 700;
}

.teamsection1{
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
    -ms-flex-pack: center;
        justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
    -ms-flex-direction: column;
        flex-direction: column;
padding: 0 15px;
}

.teamscore{
margin-top: 10px;
color: white;
background-color: black;
padding: 3px 18px;
border-radius: 10px;
margin: 5px auto 0 auto;
font-weight: 700;
text-align: center;
}

.teamscore.noscore{
background: none;
}

.verses{
-webkit-box-flex: 0;
    -ms-flex: none;
        flex: none;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 35px;
height: 35px;
border-radius: 30px;
background-color: #f9f9f9;
margin: auto;
}

.vstag{
margin: auto;
text-align: center;
display: block;
}


@media (max-width: 767px) {

	.gamecontainer{
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	}

	.gamenumbertag {
	margin-bottom: 15px;
	width: 100%;
	}

	.verses{
	display: none;
	}

	.teamsection1{
	margin-bottom: 10px;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	    -ms-flex-direction: row-reverse;
	        flex-direction: row-reverse;
	}

	.teamsection1 .teamscore{
	-webkit-box-flex: 0;
	    -ms-flex: none;
	        flex: none;
	width: 50px;	
	height: 26px;	
	padding: 3px 0;
	margin-top: 1px;
	}

	.teamsection1 .teamname{
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
	text-align: left;
	padding: 5px 7px;
	}

}



/*gallery*/

.filename{
color: white;
font-size: 10px;
background-color: rgba(0,0,0,.7);
padding: 6px 10px 3px 10px;
width: calc( 100% + 20px );
position: relative;
left: -10px;
margin-top: -7px;
}

.site-form .homeimageblock{
overflow: hidden;
}

.gallery_container{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.gallery_container a.gallerythumbnail{
display: block;
margin: 0 20px 20px 0;
-webkit-box-shadow: 7px 7px 7px rgba(0,0,0,0);
        box-shadow: 7px 7px 7px rgba(0,0,0,0);
-webkit-transition: -webkit-box-shadow .6s ease;
transition: -webkit-box-shadow .5s ease;
-o-transition: box-shadow .6s ease;
-webkit-transition: -webkit-box-shadow .5s ease;
-o-transition: box-shadow .5s ease;
transition: box-shadow .5s ease;
transition: box-shadow .5s ease, -webkit-box-shadow .5s ease;
text-decoration: none;
color: black;
width: 350px;
background-color: #f5f5f5;
}

.gallery_container a.gallerythumbnail:hover{
-webkit-box-shadow: 3px 3px 9px rgba(0,0,0,0.15);
        box-shadow: 3px 3px 9px rgba(0,0,0,0.15);
}

.gallery_container .gallerythumbnailphotos{
height: 250px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
    -ms-flex-direction: row;
        flex-direction: row;
width: 100%;
}

.gallery_container .gallerythumb.gallerythumb1{
-webkit-box-flex: 2;
    -ms-flex: 2;
        flex: 2;
}

.gallery_container .gallery_name{
font-weight: 700;
margin-bottom: 5px;
}

.gallery_container .secondgallerycontainer{
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
    -ms-flex-direction: column;
        flex-direction: column;
}

.gallery_container .secondgallerycontainer div{
-webkit-box-flex: 1;
    -ms-flex: 1;
        flex: 1;
border-left: 2px solid white;
}

.gallery_container .gallerythumb{
background-size: cover;
background-position: center center;
}

.gallery_container .gallerythumb.gallerythumb3{
border-top: 2px solid white;
}

.gallery_container .gallerythumbdescription{
padding: 16px;
width: 100%;
border-top: 1px solid white;
}

.gallery_stats{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}

.gallery_stats div{
margin-right: 10px;
}

@media (max-width: 992px) {

	.gallery_container{
	-ms-flex-wrap: nowrap;
	    flex-wrap: nowrap;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	}	

	.gallery_container a.gallerythumbnail{
	margin: 15px auto;	
	}

}

@media (max-width: 440px) {

	.gallery_container a.gallerythumbnail{
	width: 100%;
	}

}


/*progress bar*/

.upload-panel {
position: fixed;
top: 0;
right: -320px; /* Initially hidden */
width: 300px;
height: 100%;
background-color: #f8f9fa;
border-left: 1px solid #dee2e6;
padding: 15px;
-webkit-box-shadow: -2px 0 5px rgba(0,0,0,0.1);
        box-shadow: -2px 0 5px rgba(0,0,0,0.1);
-webkit-transition: right 0.3s ease-in-out;
-o-transition: right 0.3s ease-in-out;
transition: right 0.3s ease-in-out;
z-index: 1050;
overflow-y: auto;
}
.upload-panel.open {
right: 0;
}
.upload-panel-header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
    -ms-flex-pack: justify;
        justify-content: space-between;
-webkit-box-align: center;
    -ms-flex-align: center;
        align-items: center;
margin-bottom: 15px;
}
.upload-panel-header h4 {
margin: 0;
}
.close-panel {
background: none;
border: none;
font-size: 2.5rem;
cursor: pointer;
}
.upload-item {
margin-bottom: 15px;
padding: 10px;
background-color: #fff;
border: 1px solid #ddd;
border-radius: 4px;
}
.file-info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
    -ms-flex-pack: justify;
        justify-content: space-between;
-webkit-box-align: center;
    -ms-flex-align: center;
        align-items: center;
}
.file-name {
max-width: 250px;
font-size: 12px;
word-break: break-all;
}

.progress-container {
width: 100%;
background-color: #e9ecef;
border-radius: .25rem;
margin-top: 5px;
}
#upload-panel .progress-bar {
width: 0%;
height: 10px;
background-color: #007bff;
border-radius: .25rem;
-webkit-transition: width 0.4s ease;
-o-transition: width 0.4s ease;
transition: width 0.4s ease;
}
.upload-status {
margin-top: 5px;
font-size: 0.9em;
}
.upload-status.success {
color: #28a745;
}
.upload-status.error {
color: #dc3545;
}
.error-details {
font-size: 0.8em;
color: #dc3545;
margin-top: 5px;
}

#upload-list{
height: calc(100% - 80px);
overflow-y: scroll;
}

.panel-controls button{
font-size: 20px;
color: black;
padding: 4px;
}

.panel-controls button.expand-panel{
position: relative;
right: 10px;
padding: 5px;
font-size: 20px;
}

.upload-panel {
-webkit-transition: width 0.3s ease;
-o-transition: width 0.3s ease;
transition: width 0.3s ease;
}
.upload-panel.minimized {
width: 30px; 
padding: 10px;
overflow: hidden;
}
.upload-panel.minimized .upload-panel-header h4,
.upload-panel.minimized #upload-list {
display: none;
}
.upload_image_button:disabled {
cursor: not-allowed;
opacity: 0.7;
}
.panel-controls {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.expand-panel, .minimize-panel {
background: none;
border: none;
font-size: 20px;
cursor: pointer;
line-height: 1;
padding: 0 5px;
color: #fff; /* Assuming a dark header */
}

@media (max-width: 1200px) {

	#upload-panel.upload-panel.open{
	height: 400px;
	width: 100%;
	bottom: 0px;
	top: initial;
	left: 0;
	}

	#upload-panel.upload-panel.minimized{
	height: 40px;
	width: 45px;
	left: initial;
	right: 0;
	padding-top: 7px;
	padding-left: 15px;
	}

}

.userslist .link_to_sponsor {
bottom: 7px;
} 

.galleryimage.lazy img.hiddenimage{
display: none;
}

.galleryimage .add_comment,
.galleryimage img.hiddenimage{
opacity: 0;
-webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
        transform: translateY(20px);
}

.showparent.galleryimage .add_comment,
.galleryimage img.hiddenimage.showhiddenimage{
display: block;
opacity: 1;
-webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
        transform: translateY(0px);
-webkit-transition: opacity .5s ease, -webkit-transform .7s ease, -webkit-filter .3s ease;
transition: opacity .5s ease, -webkit-transform .7s ease, -webkit-filter .3s ease;
-o-transition: opacity .5s ease, transform .7s ease, filter .3s ease;
transition: opacity .5s ease, transform .7s ease, filter .3s ease;
transition: opacity .5s ease, transform .7s ease, filter .3s ease, -webkit-transform .7s ease, -webkit-filter .3s ease;
}

.sitefooter.whitefooter{
background-color: white;
}


@media (max-width: 767px) {

	.galleryimage img.hiddenimage,
	.galleryimage img.hiddenimage.showhiddenimage{
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
	}

}


/*Dark mode*/

.darkmode select,
body.darkmode,
.darkmode .gallery_container a.gallerythumbnail,
.darkmode .article-detail{
background-color: #171717;
color: white;
}

.darkmode .gallery_container a.gallerythumbnail,
.darkmode .sponsortype{
background-color: rgba(255,255,255,.1);
}

.darkmode .teamscore.noscore,
.darkmode .column .gameleft, 
.darkmode .column .gameright{
background-color: #171717;
}

.darkmode .teamscore,
.darkmode .sponsorlisting a{
background-color: white;
}

.darkmode .teamscore{
color: black;
}

.darkmode .gallery_container .gallerythumbdescription,
.darkmode .gallery_container .secondgallerycontainer div,
.darkmode .gallery_container .gallerythumb.gallerythumb3{
border-color: #171717;
}

.darkmode .gamecontainer,
.darkmode select{
border: 1px solid white !important;
}

.darkmode a{
color: #388eeb;
}

.darkmode .articlelist .thumbnail .caption,
.darkmode .socialicons a i,
.darkmode .herobutton,
.darkmode .navigation a,
.darkmode a.winnerblock{
color: white;
}

.darkmode .team_score,
.darkmode .verses{
color: #171717;
}

.darkmode a.yearbutton,
.darkmode .column .teamnamebottom,
.darkmode .column .teamnametop,
.darkmode .column .gameleft,
.darkmode .column7 .block7, 
.darkmode .column7 .block19, 
.darkmode .column7 .block11, 
.darkmode .column7 .block9,
.darkmode .column .gameright{
border-color: white !important;
}

.darkmode .sponsortype{
background-color: rgba(0,0,0, 0.4);
}


.darkmode .articlelist .thumbnail,
.darkmode .column .gameright,
.darkmode .column .gameleft{
background-color: rgba(238,238,238,.1);
}

.darkmode .column .gameleft.clickable:hover, 
.darkmode .column .gameright.clickable:hover{
background-color: rgba(238,238,238,1);
color: black;
}

.darkmode input,
.darkmode textarea{
color: #171717;
}

.darkmode .sitefooter.whitefooter{
position: initial;
}

.darkmode .sitefooter.whitefooter .sitefooterpanel{
display: none;
}

.darkmode .sitefooter .sitefooterpanel{
display: block;
}

.darkmode .sitefooter{
position: relative;
}

.darkmode .blackbg{
height: 20000vh;
width: 100%;
position: fixed;
z-index: 0;
top: 600px;
left: 0;
background-color: #171717;
}

.darkmode .blackbg.withvideo{
top: 900px;
}

.darkmodeicon{
position: absolute;
bottom: 20px;
right: 102px;
font-size: 20px;
color: black;
}

.homedarkmodeicons .darkmodeicon,
.darkmode .darkmodeicon{
color: white;
}

.fa-sun.darkmodeicon{
right: 145px;
}

.darkmodeicon:hover{
cursor: pointer;
}

.darkmodeicons{
position: absolute;
bottom: -80px;
right: 0;
}

.mobilemenulinks .darkmodeicon{
color: white !important;
color: red;
bottom: initial;
display: block;
margin-top: 20px;
right: 43px;
}

.mobilemenulinks .fa-sun.darkmodeicon{
right: 90px;
}

.darkmode hr{
border-color: grey;
}

@media (max-width: 1100px) {

	.darkmodeicon{
	display: none;
	}

}

.showthebody.blogbody, 
.showthebody.homepagebody, 
.showthebody.bonusbody, 
.showthebody.bonussection, 
.showthebody.aboutusbody {
opacity: 1 !important;
}

/* 1. Force the Lightbox to stay fixed in the center of the screen */
#lightbox {
    position: fixed !important;   /* Locks it to the viewport, not the document */
    top: 50% !important;          /* Moves top edge to 50% down */
    left: 50% !important;         /* Moves left edge to 50% across */
    -webkit-transform: translate(-50%, -50%) !important;
        -ms-transform: translate(-50%, -50%) !important;
            transform: translate(-50%, -50%) !important; /* Centers it perfectly */
    margin-top: 0 !important;     /* Removes any JS-added margins */
}

/* 2. Constrain the image height and width */
.lb-image {
    max-height: 95vh !important;  /* Cap height at 85% of viewport */
    max-width: 95vw !important;   /* Prevent it from being too wide */
    height: auto !important;      /* Allow automatic resizing */
    width: auto !important;       /* Maintain aspect ratio */
    display: block !important;    /* Removes standard inline whitespace */
}

/* 3. Force the containers to "Shrink Wrap" the image 
   This is the specific fix for the lb-nav width */
.lb-outerContainer, 
.lb-container {
    width: -webkit-fit-content !important;
    width: -moz-fit-content !important;
    width: fit-content !important; /* Shrinks container to match image width */
    height: auto !important;       /* Ignores JS height calculation */
    background: none !important;   /* Your preference */
    margin: auto !important;       /* Centers the inner content */
}

.lb-outerContainer{
	    /* ADD THIS LINE to stop the jumping/sliding */
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important; 

}

/* 4. Ensure the nav matches the new "shrunk" container size */
.lb-nav {
    width: 100% !important; /* Now 100% means "100% of the image width" */
}

/* 5. Force the caption area to match the image width as well */
.lb-dataContainer {
    /*width: 100% !important; */
    min-width: 0 !important;
}

/* Optional: Ensure the background overlay covers everything */
.lb-overlay {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}





/*gallery comments*/
#comment_modal_overlay {
display: none;
position: fixed;
z-index: 100000; /* High z-index to sit above lightbox */
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0,0,0,0.6);
backdrop-filter: blur(2px);
}
/* Modal Content */
#comment_modal_content {
background-color: #fefefe;
margin: 10% auto;
padding: 25px;
border: 1px solid #888;
width: 90%;
max-width: 500px;
border-radius: 8px;
box-shadow: 0 5px 15px rgba(0,0,0,0.3);
font-family: inherit;
}
#comment_modal_content h3 { margin-top: 0; margin-bottom: 15px; color: #333; }

/* Message Box Styling */
#comm_message_box {
display: none;
padding: 12px;
margin-bottom: 15px;
border-radius: 4px;
font-size: 14px;
line-height: 1.4;
}
.comm-msg-error {
background-color: #ffebee;
color: #c62828;
border: 1px solid #ef9a9a;
}
.comm-msg-success {
background-color: #e8f5e9;
color: #2e7d32;
border: 1px solid #a5d6a7;
}

/* Form Elements */
.comm-label { display: block; margin-bottom: 5px; font-weight: bold; color: #555; }
.comm-input { 
width: 100%; 
margin-bottom: 15px; 
padding: 10px; 
border: 1px solid #ccc; 
border-radius: 4px; 
box-sizing: border-box; 
}
.comm-btn-group { text-align: right; margin-top: 10px; }
.comm-btn { 
padding: 10px 20px; 
cursor: pointer; 
border: none; 
border-radius: 4px; 
font-size: 14px;
}
#comm_cancel_btn { background-color: #e0e0e0; color: #333; margin-right: 10px; }
#comm_cancel_btn:hover { background-color: #d5d5d5; }
#comm_submit_btn { 
 }


.actualcancelbutton.approvebutton{
bottom: 50px;
}

.homepageimages.userscomments{
width: 100%;
display: flex;
}

.userscomments .comment{
display: flex;
flex-direction: row;
border-bottom: 1px solid lightgrey;
width: 100%;
}

.userscomments .comment .homeimageblock{
flex: none;
width: 300px;
}

.userscomments .comment .actual_comment{
margin: 15px 20px 15px 0px;
text-align: left;
}

.userscomments .comment .actual_comment{
flex: 1;
}

.approve_comments{
text-align: left;
}

.commentsbox{
position: relative;
}

.unapproved_comments_count{
display: inline-block;
background-color: red;
color: white;
padding: 2px 10px;
border-radius: 15px;
height: 22px;
position: relative;
font-size: 12px;
bottom: 1px;
left: 3px;
}

@media (max-width: 767px) {

	.userscomments .comment{
	flex-direction: column;
	border-bottom: 1px solid lightgrey;
	}

}


.galleryimage .add_comment{
opacity: 0;
}

.showparent.galleryimage .add_comment{
position: absolute;
bottom: 12px;
right: 10px;
color: white;
font-size: 20px;
opacity: .8;
z-index: 1000;
}

.showparent.galleryimage .add_comment:hover{
opacity: 1;	
}