@charset "utf-8";
 
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap'); 

/* DNN LIGHTBOX DEFUALT CSS start here */
.ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.dnnFormPopup.ui-draggable.ui-resizable {
    position: fixed !important;
    top: 50px !important;
}
/* DNN LIGHTBOX DEFUALT CSS end here */
 
/*============= Reset Code ===========*/
html                            { height:100%; }
body                            { font-family: "Open Sans", sans-serif; font-size:14px; line-height:24px; color:#000;}  


/*-------------------------------------*/
/* ANCHOR STYLES */
/*-------------------------------------*/
a, a:visited {
    color:#ba2031; /*red*/
    text-decoration: underline;
    outline: 0;
}

    a:hover, a:focus, a:active {
        color: #000;
        outline: 0;
    }


p                               { font-family: "Open Sans", sans-serif; font-size:14px; line-height:24px; color:#000; text-decoration: none; text-transform: none; margin: 0 0 10px 0; padding: 0;}

h1                              { font-family: "Open Sans", sans-serif; font-size:26px;}
h2                              { font-family: "Open Sans", sans-serif; font-size:22px;}
h3                              { font-family: "Open Sans", sans-serif; font-size:18px;}

.Normal                         { font-family: "Open Sans", sans-serif; font-size:14px; line-height:24px;}



#top-header      { background-color: #fff; height: auto; width: auto;}
#mid-header      { height: auto; width: 1200px; margin:0 auto;}
#logo-wrapper    { float: left; height: auto; width: auto; margin-top: 12px; margin-bottom: 12px;} 
/*#logo-wrapper img{ width:100%; height:auto;}*/



#tab             { background-color: #ba2031; height:55px; width: 100%;}
#tab-mid         { height: auto; width: 1200px; margin:0 auto;}
.click_img       { margin-top: -1px;}

#mid-white       { background-position: center -470px; background-image: url(images/light-bg.png); width:100%; margin:0 auto; padding:10px 0;}
#mid-white-mid   { width:1200px; margin:0 auto;}
.image-full      { margin: 0 0 15px 0; }

.register-btn         { display: inline-block; background-color: #ba2031; color: white; text-decoration: none; border: none; padding: 10px 15px; font-size: 16px; font-weight: bold; text-transform: uppercase;  border-radius: 50px; cursor: pointer; transition: all 0.3s cubic-bezier(0.2, 0, 0.2, 1); text-align: center;}
.register-btn:hover   { background-color: #000000; transform: translateY(-1px); letter-spacing: 1px; color: white; text-decoration: none;}
.register-btn:active  { transform: translateY(-1px); }
.register-btn:visited { color: #fff;}
.register-btn::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent); transition: left 0.3s;}
.register-btn:hover::before { left: 100%;} 
 
.camp-details              { font-family: "Open Sans", sans-serif; font-size:14px; list-style: none; margin: 0; padding: 0; line-height: 1.5;}
.camp-details li           { position: relative; padding-left: 15px;   /* space for arrow */ margin-bottom: 0.4rem;}
/* custom arrow bullet */
.camp-details li::before   { content: "▸"; position: absolute; left: 0; top: 0.1rem; color: #c00000; font-size: 0.9rem;}
  
#btm-grey      { background-color: #e6e6e6; padding: 60px 0px 40px 0px; clip-path: polygon(0 40px, 100% 8px, 100% 100%, 0 100%);}
#btm-grey-mid  { width:1200px; margin:0 auto;}


#fotter          { background-color:#ba2031; width:100%; margin:0 auto; padding:10px 0;}
#fotter-mid      { width:1200px; margin:0 auto;} 
#fotter-copyright{ width:51%; float:left; margin:0; text-align:left;}
#footer-logo     { width:30%; float:right; margin:0; text-align:right;}
.copyright              { font-size:13px; font-weight:normal; color:#ffffff;}    
a.footer-link:link      { font-size:13px;color:#fff;text-decoration:none;}
a.footer-link:hover     { font-size:13px;color:#fff;text-decoration: underline;}
a.footer-link:active    { font-size:13px;color:#fff;text-decoration:none;}
a.footer-link:visited   { font-size:13px;color:#fff;text-decoration:none;}
a.footer-link:focus     { font-size:13px;color:#fff;text-decoration:none;}
.divi                   { font-size:13px;color:#fff;}
 


/* History page css */
/* Wrapper */
.champions-wrapper        { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: 1100px; margin: auto; font-family: "Open Sans", sans-serif;}
/* Box */
.champions-box             { border-radius: 14px; overflow: hidden; background: #ffffff; box-shadow: 0 6px 18px rgba(0,0,0,0.1); transition: transform 0.35s ease, box-shadow 0.35s ease; display: flex; flex-direction: column;}

/* Hover */
.champions-box:hover       { transform: translateY(-8px); box-shadow: 0 18px 40px rgba(0,0,0,0.18);}
/* Title */
.champions-box h3          { margin: 0; padding: 5px; font-size: 16px; text-align: center; color: #fff; background: #2d2d2d;}
/* Content */
.years                     { background: #f1f5f9; padding: 15px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; justify-items: center; align-content: start; flex-grow: 1;}

/* Year Pills */
.years span                { background: #ffffff; width: 65px; height: 30px; border-radius: 20px; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; color: #ba2031; box-shadow: 0 4px 10px rgba(0,0,0,0.08); transition: all 0.3s ease; }
/* Hover */
.years span:hover          { background: #ba2031; color: #ffffff; transform: scale(1.1);}

/* Tablet */
@media (max-width: 1024px) {
  .champions-wrapper { grid-template-columns: repeat(2, 1fr); }
}
/* Mobile */
@media (max-width: 600px) {
  .champions-wrapper { grid-template-columns: 1fr; }
}
/* History page css */




/* Coaches page css */
.staff-section {
  max-width: 1200px;
  margin: auto;
  padding: 20px 10px 20px 20px;
}

/* ====== HEADER ====== */
.staff-header {
  text-align: center;
  margin-bottom: 50px;
}

.staff-header h2 {
  font-size: 30px;
  margin-bottom: 10px;
  color: #0D0D0D;
}

.staff-header p {
  max-width: 750px;
  margin: auto;
  font-size: 16px;
  color: #555;
  line-height: 1.6;
}

/* ====== GRID ====== */
.staff-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 30px;
}

/* ====== CARD ====== */
.staff-card {
  background: #ffffff;
  border-radius: 12px;
  padding: 28px 24px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.staff-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 35px rgba(0,0,0,0.12);
}

.staff-name {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 6px;
  color: #000;
}

.staff-role {
    font-size: 13px;
    font-weight: 600;
    color: #b71c1c;
    background: rgba(183, 28, 28, 0.08);
    display: inline-block;
    padding: 2px 10px;
    border-radius: 20px;
    margin-bottom: 14px;
}

.staff-meta {
  font-size: 14px;
  line-height: 1.7;
  color: #444;
}

.staff-meta span {
  font-weight: 600;
  color: #222;
}



/* ====== RESPONSIVE ====== */
@media (max-width: 600px) {
  .staff-header h2 {
    font-size: 28px;
  }
}
/* Coaches page css */






/* iphone Landscape  [HORIZONTAL] CSS Start here */
@media only screen and (max-width :1199px)   
{
#mid-header             { height: auto; width: auto; margin: 0 auto; padding: 10px 20px;}
#logo-wrapper           { margin-top: 0; margin-bottom: 0;}
#tab-mid                { width: auto;}
#mid-white-mid          { width: auto; padding: 0 20px;}
#btm-grey               { padding: 60px 20px 40px 20px;}
#btm-grey-mid           { width: auto; margin: 0 auto;}
#fotter-mid             { width: auto; padding: 0 20px;}
}
@media only screen and (max-width :768px)   
{
#logo-wrapper           { text-align: center; width: 100%;}
#fotter-copyright       { width: auto; float: none; margin: 0; text-align: center;}
#footer-logo            { width: auto; float: none; margin: 10px 0 0 0; text-align: center; border-top: 1px solid #ff7e7e; padding: 10px 0 0 0;}
}