/* CMCC Web V2 Global Styles */
:root {
--cmrc-green: #90c838;
--cmrc-dark: #2b2b2b;
--cmrc-darker: #0a1628;
--cmrc-text-light: #e0e0e0;
--cmrc-text-white: #ffffff;
--cmrc-font-main: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
/* AGGRESSIVE CMS RESET */
.cmrc-v2,
.cmrc-v2 h1,
.cmrc-v2 h2,
.cmrc-v2 h3,
.cmrc-v2 p,
.cmrc-v2 span,
.cmrc-v2 a,
.cmrc-v2 div,
.cmrc-v2 strong {
font-family: var(--cmrc-font-main) !important;
}
.cmrc-v2 {
color: var(--cmrc-text-light) !important;
background-color: var(--cmrc-dark) !important;
box-sizing: border-box !important;
}
.cmrc-v2 *,
.cmrc-v2 *::before,
.cmrc-v2 *::after {
box-sizing: inherit;
}
/*
* HERO COMPONENT
* Uses negative margins to break out of CMS content constraints
*/
.cmrc-v2-hero {
position: relative;
width: 100vw;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
overflow: hidden;
background-color: var(--cmrc-darker) !important;
padding: 45px 20px 60px;
margin-top: -20px;
}
.cmrc-v2-hero-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
background-size: cover;
background-position: center 40%;
background-repeat: no-repeat;
transform: scale(1.08);
/* Hide baked-in borders */
}
.cmrc-v2-hero-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
background: linear-gradient(180deg, rgba(10, 22, 40, 0.20) 0%, rgba(10, 22, 40, 0.35) 60%, rgba(10, 22, 40, 0.55) 100%);
}
.cmrc-v2-hero-content {
position: relative;
z-index: 2;
display: flex;
flex-direction: column;
align-items: center;
}
.cmrc-v2-hero-logo {
width: 440px;
height: auto;
max-width: 70%;
filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.7)) brightness(1.3);
margin: 40px 0 70px;
}
/* BUTTONS */
.cmrc-v2 .cmrc-v2-btn {
display: inline-block;
padding: 16px 44px;
font-size: 18px !important;
font-weight: 700 !important;
letter-spacing: 1.5px !important;
text-transform: uppercase !important;
text-decoration: none !important;
color: #ffffff !important;
background-color: #90c838 !important;
border: 2px solid var(--cmrc-green) !important;
border-radius: 4px;
cursor: pointer;
transition: all 0.3s ease;
}
.cmrc-v2 .cmrc-v2-btn:hover {
background-color: transparent !important;
color: var(--cmrc-green) !important;
text-decoration: none !important;
}
/* SECTION CONTAINERS */
.cmrc-v2-section {
padding: 40px 20px;
max-width: 1200px;
margin: 0 auto;
}
.cmrc-v2-section-title {
font-size: 26px !important;
font-weight: 700 !important;
color: var(--cmrc-text-white) !important;
margin-top: 0 !important;
margin-bottom: 18px !important;
letter-spacing: 0.5px !important;
}
.cmrc-v2-text {
font-size: 18px !important;
line-height: 1.6 !important;
margin-top: 0 !important;
margin-bottom: 20px !important;
color: var(--cmrc-text-light) !important;
}
.cmrc-v2-text strong {
color: var(--cmrc-text-white) !important;
}
/* QUICK LINKS GRID */
.cmrc-v2-quick-links {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
margin-top: 20px;
margin-bottom: 30px;
position: relative;
z-index: 10;
}
.cmrc-v2 .cmrc-v2-quick-link-item {
background: #3a3a3a !important;
border-radius: 8px;
padding: 20px;
text-align: center;
text-decoration: none !important;
color: var(--cmrc-text-white) !important;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
transition: transform 0.2s, box-shadow 0.2s;
display: flex;
flex-direction: column;
align-items: center;
border-top: 4px solid var(--cmrc-green) !important;
aspect-ratio: 4 / 3;
justify-content: center;
font-size: 22px !important;
font-weight: 700 !important;
gap: 15px;
}
.cmrc-v2 .cmrc-v2-quick-link-item span {
color: var(--cmrc-text-white) !important;
}
.cmrc-v2 .cmrc-v2-quick-link-item:hover {
transform: translateY(-5px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
color: var(--cmrc-green) !important;
text-decoration: none !important;
}
.cmrc-v2 .cmrc-v2-quick-link-item:hover span {
color: var(--cmrc-green) !important;
}
.cmrc-v2-quick-link-icon {
margin-bottom: 12px;
}
/* FEATURED NEWS CARDS */
.cmrc-v2-cards-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 20px;
}
.cmrc-v2 .cmrc-v2-card {
background-color: #333333 !important;
border-radius: 6px;
overflow: hidden;
text-decoration: none !important;
color: var(--cmrc-text-light) !important;
transition: transform 0.2s;
display: flex;
flex-direction: column;
}
.cmrc-v2 .cmrc-v2-card:hover {
transform: translateY(-3px);
text-decoration: none !important;
}
.cmrc-v2-card-img {
width: 100%;
height: 180px;
object-fit: cover;
}
.cmrc-v2-card-content {
padding: 15px;
flex-grow: 1;
}
.cmrc-v2-card-title {
color: var(--cmrc-green) !important;
font-size: 18px !important;
font-weight: 700 !important;
margin: 0 0 10px 0 !important;
line-height: 1.4 !important;
}
.cmrc-v2-card-desc {
color: var(--cmrc-text-light) !important;
font-size: 15px !important;
line-height: 1.5 !important;
margin: 0 !important;
}
/* SPONSOR CAROUSEL */
.cmrc-v2-sponsor-grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
align-items: center;
}
.cmrc-v2-sponsor-img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
opacity: 0.8;
transition: opacity 0.2s, transform 0.2s;
}
.cmrc-v2-sponsor-img:hover {
opacity: 1;
transform: scale(1.05);
}
/* HYPERLINKS */
.cmrc-v2 a {
color: var(--cmrc-green) !important;
text-decoration: none !important;
font-weight: 700 !important;
}
.cmrc-v2 a:hover {
text-decoration: underline !important;
}
.cmrc-v2-sponsor-box {
background-color: #ffffff !important;
border-radius: 8px;
padding: 15px;
width: 200px;
height: 140px;
display: flex;
justify-content: center;
align-items: center;
filter: grayscale(100%);
opacity: 0.6;
transition: all 0.4s ease;
text-decoration: none !important;
box-sizing: border-box;
}
.cmrc-v2-sponsor-box:hover {
filter: grayscale(0%);
opacity: 1;
transform: translateY(-5px);
}
/* SPONSORSHIP PAGE SPECIFIC */
.cmrc-v2-tier-title {
color: var(--cmrc-green) !important;
font-size: 24px !important;
font-weight: 700 !important;
margin: 40px 0 20px 0 !important;
text-transform: uppercase;
letter-spacing: 1px;
border-bottom: 1px solid #444;
padding-bottom: 8px;
text-align: center !important;
}
.cmrc-v2-table {
width: 100%;
border-collapse: separate;
border-spacing: 0;
border-radius: 8px;
overflow: hidden;
margin: 30px 0;
}
.cmrc-v2-table thead tr {
background-color: #c3c5be !important;
color: #000000 !important;
}
.cmrc-v2-table th {
padding: 15px !important;
text-align: left !important;
font-weight: 700 !important;
font-size: 18px !important;
}
.cmrc-v2-table td {
padding: 20px !important;
vertical-align: top !important;
line-height: 1.5 !important;
}
.cmrc-v2-table ul {
margin: 0 !important;
padding-left: 20px !important;
}
.cmrc-v2-table li {
margin-bottom: 10px !important;
}
.cmrc-v2-table strong {
color: #000000 !important;
}
/* MOBILE OPTIMIZATIONS */
@media (max-width: 768px) {
.cmrc-v2-hero {
padding: 30px 15px 40px;
}
.cmrc-v2-hero-logo {
width: 320px;
margin: 20px 0 40px;
}
.cmrc-v2 .cmrc-v2-btn {
padding: 12px 30px;
font-size: 16px !important;
}
.cmrc-v2-section {
padding: 30px 15px;
}
}
@media (max-width: 480px) {
.cmrc-v2 .cmrc-v2-quick-link-item {
aspect-ratio: auto;
min-height: 120px;
padding: 20px;
}
.cmrc-v2-section-title {
font-size: 22px !important;
}
.cmrc-v2-text {
font-size: 16px !important;
}
}
/* SYSTEM PAGE OVERRIDES (For Newsletter Signup, etc.) */
/* Ensure the body and main containers respect the dark theme */
body, #ctl00_MainBody {
background-color: var(--cmrc-dark) !important;
color: var(--cmrc-text-light) !important;
}
/* Fix titles on system pages and force a hero-style banner */
.PageTitle, h2.PageTitle, #TitlePanel h1 {
position: relative !important;
width: 100vw !important;
left: 50% !important;
right: 50% !important;
margin-left: -50vw !important;
margin-right: -50vw !important;
margin-top: -20px !important; /* Align with top of content area */
margin-bottom: 40px !important;
padding: 80px 20px !important;
background-color: var(--cmrc-darker) !important;
background-image: url('http://d2jqoimos5um40.cloudfront.net/site_2049/37856b.jpg') !important;
background-size: cover !important;
background-position: center 40% !important;
background-attachment: fixed; /* Parallax effect */
color: var(--cmrc-text-white) !important;
font-weight: 700 !important;
font-size: 32px !important;
text-align: center !important;
text-transform: uppercase;
letter-spacing: 2px;
display: flex !important;
align-items: center !important;
justify-content: center !important;
overflow: hidden;
z-index: 1;
}
/* Add the dark overlay to the forced banner */
.PageTitle::before, #TitlePanel h1::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(180deg, rgba(10, 22, 40, 0.4) 0%, rgba(10, 22, 40, 0.7) 100%);
z-index: -1;
}
/* Ensure the text stays readable and centered */
.PageTitle, #TitlePanel h1 {
text-shadow: 0 2px 10px rgba(0,0,0,0.8);
}
/* Style the informational message boxes */
.InformationMessage, #PageTitleTextDiv.alert-primary {
background-color: var(--cmrc-darker) !important;
color: var(--cmrc-text-white) !important;
border: 1px solid #444 !important;
border-left: 4px solid var(--cmrc-green) !important;
padding: 20px !important;
border-radius: 4px !important;
margin-bottom: 30px !important;
font-size: 16px !important;
}
/* Fix form labels and instructions */
.Label, .FormLabel, .InstructionMessage, label {
color: var(--cmrc-text-light) !important;
font-size: 16px !important;
}
.InstructionMessage {
display: block;
margin-top: 5px;
margin-bottom: 15px;
opacity: 0.9;
}
/* Style input fields for better visibility */
input[type="text"], input[type="email"], input[type="tel"], textarea {
background-color: #3a3a3a !important;
border: 1px solid #555 !important;
color: #ffffff !important;
padding: 10px !important;
border-radius: 4px !important;
margin-bottom: 10px !important;
}
input[type="text"]:focus {
border-color: var(--cmrc-green) !important;
outline: none;
}
/* Style the system submit buttons to match V2 theme */
input[type="submit"], #ctl00_ContentPlaceHolder1_NewsletterSignUpControl_submitButton {
display: inline-block !important;
padding: 12px 35px !important;
font-size: 16px !important;
font-weight: 700 !important;
letter-spacing: 1px !important;
text-transform: uppercase !important;
text-decoration: none !important;
color: #ffffff !important;
background-color: var(--cmrc-green) !important;
border: 2px solid var(--cmrc-green) !important;
border-radius: 4px !important;
cursor: pointer !important;
transition: all 0.3s ease !important;
height: auto !important;
line-height: normal !important;
}
input[type="submit"]:hover {
background-color: transparent !important;
color: var(--cmrc-green) !important;
}
/* Fix the white footer/bottom container in system forms */
.NewsletterSignUp .rbConfig,
#ctl00_ContentPlaceHolder1_NewsletterSignUpControl_NewsletterSignUpPanel .rbConfig {
background-color: var(--cmrc-darker) !important;
border-top: 1px solid #444 !important;
padding: 20px !important;
margin-top: 20px !important;
border-radius: 0 0 8px 8px !important;
color: var(--cmrc-text-light) !important; /* Fixes "Required Fields" text color */
}
/* Ensure any spans or labels inside that box are also light-colored */
.NewsletterSignUp .rbConfig span,
.NewsletterSignUp .rbConfig b {
color: var(--cmrc-text-light) !important;
}
/*
* TEAMSIDELINE DEFAULT COMPONENT HIDING
* Aggressively hides unwanted default components and containers to clean up V2 theme
*/
/* Hide default News and Sponsors Sections (Containers) */
#ctl00_ContentPlaceHolder1_HomeControlControl_ctl06,
#ctl00_ContentPlaceHolder1_HomeControlControl_ctl07,
div[id*="HomeControlControl_ctl06"],
div[id*="HomeControlControl_ctl07"] {
display: none !important;
height: 0 !important;
visibility: hidden !important;
margin: 0 !important;
padding: 0 !important;
}
/* Hide default Header utilities (Sign In/Cart Panels and Links) */
#ctl04_UserSignInHyperLink,
#ctl04_CartHyperLink2,
#ctl04_UserSignInPanel,
#ctl04_CartPanel {
display: none !important;
}
/* Hide default Footer widgets, Social Media, and "Powered By" branding */
#ctl00_divFooterLinks,
#ctl00_divSocialMedia,
#ctl00_divFooterSocial,
#ctl00_divPoweredBy {
display: none !important;
}
/* Hide default Legal and Admin links in the footer area */
#TermsOfServiceHyperLink,
#RefundPolicyHyperLink,
#PrivacyPolicyHyperLink,
#AdminSignInHyperLink {
display: none !important;
}