/* --------------------------------------------------------------------
    Copyright (c) Demosphere International Inc.
    No permission is granted for any purpose without prior
    written consent from Demosphere International Inc.
-----------------------------------------------------------------------*/

/* Background Color */
body { background: url('../images/bg.jpg') #292729; }

/* Header BG Pattern */
#dii-navbar-load .ui-widget-header,
#design-header { background-image: url('../images/header-bg-1.png'); }

/* Header BG & Text Color */
#dii-navbar-load .ui-widget-header,
#design-header { background-color: transparent; }
#dii-navbar-load .ui-widget-header,
#design-header-title { color: #fff; }

#design-header-title .text::before { content: 'KC PRIME'; line-height: 75px; font-size: 75px; }
#design-header-title .subtext::before { content: 'SOCCER CLUB'; line-height: 35px; font-size: 35px; color: #b0b0b0; }

@media only screen and (max-width: 900px) {
  #design-header-title .text::before { font-size: 35px; }
  #design-header-title .subtext::before { font-size: 18px; }
}
@media only screen and (max-width: 650px) {
  #design-header-title .text::before { line-height: 35px; font-size: 25px; }
  #design-header-title .subtext::before { line-height: 14px; font-size: 14px; }
}
@media only screen and (max-width: 450px) {
  #design-header-title .text::before { line-height: 25px; font-size: 18px; }
  #design-header-title .subtext::before { line-height: 12px; font-size: 12px; }
}
@media only screen and (max-width: 350px) {
  #design-header-title .text::before { line-height: 20px; }
}

/* Top Nav BG, Text & Highlight Colors */
#design-header nav,
#design-header #ww-btn-main-nav { background-color: rgba(0,121,224,.75); }
#design-header nav.design-nav-fixed,
#design-header nav.design-nav-fixed #ww-btn-main-nav { background-color: #0a65b2; }
#design-container-main-nav .dii-content-nav-menu > ul > li > a,
#design-header #ww-btn-main-nav { color: #fff; }
#design-container-main-nav .dii-content-nav-menu > ul > li:before { background-color: #0e3556; }
#design-container-main-nav .dii-content-nav-menu > ul > li:hover > a { color: #fff; }

/* Top Nav Submenu BG, Text & Highlight Colors */
#design-container-main-nav ul ul { background-color: #0e3556; }
#design-container-main-nav ul ul a { color: #fff; }
#design-container-main-nav .dii-content-nav-menu ul ul > li:before { background-color: #155082; }
#design-container-main-nav ul ul li:hover > a { color: #fff; }

/* Main Content Side BG Color */
#design-content { background-color: transparent; }

/* Main Content Accent Text & Highlight Colors */
#design-content-wrapper .dii-content-title a:hover,
#design-content-wrapper .dii-content-linkview:hover > a,
#design-content-wrapper .dii-calendar-upcoming-events h3 a,
#design-content-wrapper .dii-content-nav-menu.theme-none li:hover > a,
#design-content-wrapper .dii-content-rotator .dii-rotator-nav i:hover:not(.fa-circle) { color: #bb1616; }

#design-content-wrapper .dii-content-nav-menu ul li .dii-sub-menu-link::before,
#design-content-wrapper .dii-content-calendar .dii-content-title:after,
#design-content-wrapper .dii-content-header:after,
#design-content-wrapper .dii-content-rotator .group-nav:hover,
#design-content-wrapper .dii-content-rotator article h2 a:hover,
#design-content-wrapper .dii-content-rotator article div a:hover { background-color: #bb1616; }

/* Header Item BG & Text Color */
#design-content-wrapper .dii-content-header h2::before { background-color: #0079e0; }
#design-content-wrapper .dii-content-header h2,
#design-content-wrapper .dii-content-header h2::after { background-color: #292729; }
#design-content-wrapper .dii-content-header h2 { color: #dcdcdc; }

/* Footer BG & Text Color */
#design-footer { background-color: rgba(0,0,0,.35); }
#design-footer,
#design-footer a { color: #fff; }

#design-footer-client::before { content: 'KC Prime Soccer Club'; }