:root {
    --custom_col_1: #C71D18;
    --custom_col_2: #CF9B41;
    --custom_col_3: #F8F9FA;
}

html {
    scroll-behavior: smooth;
  }

#start {
    background-color: var(--custom_col_3);
}
nav .dropmenu {
    z-index: 1000;
}
.modular-text {
    padding-top: 5px;
    padding-bottom: 5px
}

.gold_text {
    color: var(--custom_col_2); 
}
.red_text {
    color: var(--custom_col_1);
}

.two_column_container {
    display: flex; /* Use flexbox for layout */
    flex-wrap: wrap; /* Allow content to wrap on smaller screens */
    justify-content: center;
}

.left_content_40 {
    width: 40%;
    padding: 10px;
    margin-left: auto;
    margin-right: auto;
}

.left_content_40 .btn {
    border-color: var(--custom_col_2);
    border-width: 2px;
    a {
        padding: 30px;
        font-size: 1em;
        font-weight: 600;
        color: var(--custom_col_2);
    }
}
.left_content_40 .btn:hover {
    background-color: var(--custom_col_3);
    border-color: var(--custom_col_1);
    a {
        color: var(--custom_col_1);
    }
}  



.right_content_60 {
    width: 60%;
    padding: 10px;
    text-align: left;
}

.left_content_50 {
    display: flex;
    justify-content: center;
    width: 50%;
    padding: 10px;
    text-align: left;
}  

.right_content_50 {
    display: flex;
    justify-content: center;
    width: 50%;
    padding: 10px;
    text-align: left;
}

.rcp {
    text-align: left;
    margin-top: -15px;
    margin-bottom: 5px;
}

.cards_centered {
    margin-left: auto;
    margin-right: auto;
    margin-top: 60px;
    max-width: 80%;
}

.cards {
    margin-left: auto;
    margin-right: auto;
}

.cards, h2 {
    text-align: center;
}

img.rounded {
    border-radius: 20px;
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
}

body {
    font-size: 1.2em;
    background-image: url(../images/global_images/logo_alpha.png);
    background-repeat: repeat;
}

#page-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    overflow: hidden;
}
#header {
    height: 115px;
    background: rgb(209,209,209);
    background: linear-gradient(38deg, rgba(209,209,209,1) 0%, rgba(101,101,101,1) 100%);
    /*background-color: #9B9B9B;*/
    /*background-image: url(../images/hc_ferlach_header\ _background.jpg);*/
    background-repeat: no-repeat;
}

.treemenu li a.active, .treemenu li a:focus, .treemenu li a:hover {
    text-decoration: none;
    color: var(--custom_col_2) !important;
    font-weight: 600;
  }

  .treemenu li a, .treemenu li a, .treemenu li a {
    text-decoration: none;
    color: var(--custom_col_2) !important;
    font-weight: 400;
  }

#header a {
    color: #000000;
    font-size: 1.5em;
    font-weight: 500;
  }

  #header a.active {
    font-weight: 800;
  }

nav, .navbar {
    align-items: center;
}

#header .navbar-section {
    height: 100%;
}

.hor_line_col_1 {
    background-color: var(--custom_col_1);
    display: block;
    min-height: 0.7vh;
}
.hor_line_col_2 {
    background-color: var(--custom_col_2);
    display: block;
    min-height: 0.7vh;
}

#header .logo img {
    height: 120px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.mobile-menu .button_container span {
    background: var(--custom_col_1);
}
.mobile-menu .button_container.active .bottom {
    background-color: var(--custom_col_2);
}
.mobile-menu .button_container.active .top {
    background-color: var(--custom_col_2);
}

.dropmenu ul li a.active, .dropmenu ul li a:focus, .dropmenu ul li a:hover {
    font-weight: 800;
  }

.hero .hero-text-background h1 {
        background-color: var(--custom_col_2);
        padding: 10px;
        border-radius: 6px;
}

/**On page menu stile**/
.on_page_menu {
    display: flex;
    justify-content: space-around;
    margin-top: 25px;
    a {
            border-color: var(--custom_col_2);
            border-width: 2px;
            border-style: solid;
            margin: 15px;
            padding: 10px;
            font-size: 1em;
            font-weight: 600;
            color: var(--custom_col_2);
          }
}
.on_page_menu a:hover {
    background-color: var(--custom_col_3);
    border-color: var(--custom_col_1);
    color: var(--custom_col_1);
}


/**Blog sidebar styles**/
.logo_container {
    display: block;
    margin: auto;

}

/**Sponsor block on team pages**/
.support_header_team {
    display: block;
    h3 {
        color: var(--custom_col_2);
        text-align: center;
    }
}

.support_container_team {
    max-width: 1200px;
    margin: auto;
    width: 100%;
}

.support_team {
display: flex;
justify-content: space-around;
    ul {
        list-style: none;
        margin: 0px;
    }
    p {
        font-size: 0.7em;
    }
}

.team_support_div{
    display: flex;
    justify-content: center;
    align-items: center;
}

/**footer styles**/

.footer_container {
    max-width: 1200px;
    margin: auto;
    width: 100%;
}

.footer {
background-color: #2b2b2b;
display: flex;
justify-content: space-around;
    ul {
        list-style: none;
        margin: 0px;
    }
    p {
        font-size: 0.7em;
    }
}
.footer_block_02 h2 {
    margin-top: 2px;
    color: var(--custom_col_2);
}
.footer_block_02 p {
    color: var(--custom_col_2);
    text-align: center;
}
.footer_block_03 h2 {
    margin-top: 2px;
    color: var(--custom_col_1);
}
.footer_block_03 li a {
    color: var(--custom_col_1);
    font-size: 0.7em;
}
.footer_block_03 li {
    margin: 0px;
    text-align: center;
}
.footer_block_01 {
    flex-grow: 1;
    min-width: 250px;
    margin: auto;
}

.footer_block_01 div{
    display: flex;
    justify-content: center;
    align-items: center;
}
.footer_block_02 {
    flex-grow: 1;
    min-width: 250px;
    text-decoration: none;
}
.footer_block_03 {
    flex-grow: 1;
    min-width: 250px;
    text-decoration: none;
}

.support_header {
    background-color: #2b2b2b;
    display: block;
    h3 {
        color: var(--custom_col_2);
        text-align: center;
        padding-bottom: 10px;
    }
}
.footer_support{
    flex-grow: 1;
    justify-content: center;
}
.footer_support_div{
    display: flex;
    justify-content: center;
    align-items: center;
}

.e-content p img {
    display: block;
    margin: 0 auto;
    max-width: 80%;
    padding: 15px; /* Combined top and bottom padding */
    border-radius: 40px;
}

.player-container {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    gap: 16px;
  }
  
  .player-card {
    width: 350px;
    /*border: 1px solid #ccc;*/
    border-radius: 8px;
    padding: 10px;
    text-align: center;
  }
  
  .player-image {
    max-width: 250px;
    height: auto;
    border-radius: 20px;
  }
  
  .player-info {
    margin-top: 0px;
    h3 {
        margin-top: 5px;
    }
  }
  .next-game-card {
    border: 3px solid #ffc107;
    padding: 10px;
    margin: 20px 0;
    border-radius: 20px;
    background-color: #fdffd5;
    text-align: center;
  }
  
  .next-game-card h3 {
    color: #d32f2f; 
    font-size: 1.5em;
    margin-bottom: 10px;
    margin-top: 20px;
  }

  .h1_like_h2 {
    font-size: 1.5em;
  }

  .h2_style {
    font-size: 1.4em;
    font-weight: 600;
    color: var(--custom_col_2);
  }
 .blog_h1 {
    font-size: 1.5em;
    a {
    color: var(--custom_col_1);
    }
 }
  .blog_p {
    a {
        color: var(--custom_col_1);
        font-weight: 600;
    }
  }
  .left_not_centered {
    text-align: left;
  }
  
  .view-report-button {
    border-color: var(--custom_col_2);
    border-width: 2px;
    border-style: solid;
    margin: 15px;
    padding: 10px;
    font-size: 1em;
    font-weight: 600;
    color: var(--custom_col_2);
  }
  
  .view-report-button:hover {
    background-color: var(--custom_col_3);
    border-color: var(--custom_col_1);
    color: var(--custom_col_1);
}
.view-report-button:visited {
    background-color: var(--custom_col_3);
    border-color: var(--custom_col_2);
    color: var(--custom_col_2);
}

  .game-card {
    background-color: #d4d4d4;
    padding-top: 10px;
    padding-bottom: 30px;
    margin-bottom: 10px;
    border-radius: 20px;
  }

  * hockeydata.los.Game.FullReport
  */
/* Base layout for the game report */
.-hd-los-game-full-report-game-info {
    display: flex;
}
.-hd-los-game-full-report-team-away {
    justify-content: left;
}



 
  

/* Media query for smaller screens */
@media (max-width: 768px) {
    .left_content_40,
    .right_content_60,
    .left_content_50,
    .right_content_50 {
        width: 100%;
        padding: 5px; 
    }

    .two_column_container {
        flex-direction: column; /* Stack the columns vertically */
    }

    p {
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .footer {
        flex-direction: column;
    }
    .footer_support_div {
        display: block;
        margin: auto;
    }
    .support_team {
        flex-direction: column;
    }
    .support_container_team {
        display: block;
        margin: auto;
    }
    .team_support_div {
        display: block;
        margin: auto;
    }
}