html {
    background: #fff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /* font-size: 10px; */
    /* height: 100%; */
}
header {
    position: fixed;
    /* top: 0; */
    width: 100%; 
    z-index: 20;
        /* Заголовок остается сверху */

}

header::after {
    content: "";
    position: absolute;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    width: 75%;
    height: 10%;
    z-index: -1;
    box-shadow: 0px 7px 9px rgba(0, 0, 0, 0.4);

}
header>.wrapper {
    border: none;
    background-color: #3E775A;
    height: 60px;
}
body {
    font-family: 'Roboto', Arial,  sans-serif;
    /* background-color: #595454; */
    background-color: #AAE0A8;
   /*  background-image: url('../images/background_1.jpg'); */
    background-repeat: repeat;
    background-size: 100%;
    color: #595454;
    margin: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
p {
    margin: 10px;
}
.wrap {
    height: 100%;
}
.wrapper {
    margin: 0px auto 0px;
    width: 75%;
    background-color: #edeef0;
    flex-grow: 1;
}
.container {
    padding: 10px 15px 10px;
    margin-top: 13px;
}
.info {
    width: 100%;
    height: 400px;
    background-color: #3498DB;
}
.player__img {
    width: 275px;
    height: 275px;
}
.player__span {
    display: block;
    margin-left: 30px;
}
.player__img>img {
    width: 100%;
    object-fit: cover;
    border-radius: 50%;
}
.span_club {
    margin-left: 10px;
}
nav {
    display: block;
    margin: auto 0;
}
.nav {
    display: flex;
    justify-content: space-around;
    list-style-type: none;
    padding-left: 0;
    margin: 0;
    font-size: 22px;
    background-color: #3E775A;
}
.nav li>img {
    max-width: 55px;
}
.nav_header {
    display: flex;
    justify-content: space-between;
    list-style-type: none;
    padding-left: 0;
    margin: 0;
    font-size: 30px;
    background-color: #c9c8c8;
    background-color: #3A9E6A;
}
.nav_header div {
    display: block;
    margin: auto 60px;
    margin-right: 115px;
}
.nav>li {
    margin-left: 15px;
    margin-right: 15px;
}
.nav>li>a {
    text-decoration: none;
    color: #333333;
    padding-left: 10px;
}
.header {
    background-color: #fff;
    padding-top: 12px;
}
.header-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
}
.pleyer {
    display: flex;
    margin: 130px 0px 0px;
}
.player__info {
    margin-left: 10em;
}
.filter {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin-top: 15px;
}
h4 {
    text-align: center;
    margin: 0px;
    font-size: 24px;
}
.block__a {
    display: flex;
    justify-content: space-evenly;
   /*  width: 80%; */
    height: 80px;
    margin: 7px auto 7px;
}
.block__seas {
    display: flex;
    flex-wrap: wrap;
    margin: 7px auto;
}
.filter__name {
    text-align: center;
    font-family: Tahoma, sans-serif;
    padding: 5px;
    margin: auto;
}
.seasons_div {
    width: 40%;
    margin: 12px auto 0px;
    display: flex;
    justify-content: space-between;
    margin: auto;
}
.seasons_div a {
    padding: 5px 10px;
    text-decoration: none;
    font-size: 20px;
    color: rgb(64, 63, 63);
    margin: 0 auto;
}
.seasons_div a:hover {
    padding: 5px 10px;
    text-decoration: none;
    font-size: 20px;
    background-color: #28B56D;
    color: rgb(255, 255, 255);
    border-radius: 10px;
}
a.button {
    color: #fff;
    user-select: none;
    text-decoration: none;
    outline: none;
    background-color: #53DC96;
    padding: 1em 2em;
    border: 1px solid rgb(15, 213, 22);
    border-radius: 30px;
}
a.button:active {
    background-color: #3E775A;
}
a.button:hover {
    background-color: #28B56D;
}
.hr {
    height: 5px;
    width: 96%;
    background-color: #15e39b;
    border-radius: 19px;
    margin: 24px auto;
}
.seasons {
    padding: 6px;
}
.filtre__table {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    width: 100%;
}
.tables {
    margin: 10px;
}
.all__tables {
    display: flex;
    flex-wrap: wrap;
}
.table__name {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 700;
    font-size: 20px;
    margin: 7px auto;
    /* border-bottom: 1px solid #c4c2c2; */
    padding-bottom: 5px;
    width: fit-content;
}
.player__table-block {
    display: flex;
    justify-content: space-between;
}
.table__block {
    width: 100%;
    overflow-x: auto;
    margin: 20px auto 0px;
}
.table__visible {
    display: none;
}
.table {
    width: 100%;
}
.tab {
    font-size: 0;
    max-width: fit-content;
    margin: 0 auto;
}
.tablinks {
    border: 0;
    border-radius: 0;
    margin: 0;
    padding: 8px;
    font-size: 18px;
    background-color: #e9e9e9;
    background-color: #6DD29D;
    box-shadow: 0 2px 8px rgba(5, 31, 53, .2);
    cursor: pointer;
    text-decoration: none;
    color: #595454;
    border-radius: 10px;
    margin: 4px 6px;
}
.tablinks:hover {
    border-bottom: 3px solid rgb(22, 168, 61);
    border-right: 3px solid rgb(22, 168, 61);
    color: #ffffff;
    background-color: #15e39b;
    transform: scale(1.2);
    transition: transform .5s;
}
a.text:active,
a.text:hover,
a.text {
    text-decoration: none;
    color: #333333;
}
.player__table {
    width: 100%;
    display: block;
    border: 1px solid #c4c2c2;
    border-radius: 15px;
    margin: 4px 2px;
    box-shadow: 0 2px 8px rgba(5, 31, 53, .2);
    padding-bottom: 10px;
    padding-left: 10px;
    background-color: #fff;
}
.tr {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #c4c2c2;
    margin: 0px 8px;
    background-color: #d0d3d5;
    padding: 6px;
}
.tr:nth-child(even) {
    background-color: #e8e8e8;
}
.th {
    font-size: 16px;
    font-weight: 500;
}
i {
    font-size: 1.0rem;
    font-weight: 300;
}
.dropbtn {
    background-color: #3498DB;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
    min-width: 100px;
}
.dropbtn:hover,
.dropbtn:focus {
    background-color: #2980B9;
}
.dropdown {
    position: relative;
    display: inline-block;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 100px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}
.dropdown-content a {
    color: black;
    padding: 8px 11px;
    text-decoration: none;
    display: block;
}
.dropdown a:hover {
    background-color: #ddd;
}
.show {
    display: block;
}
.block {
    width: 25%;
}
.data {
    padding: 3px 4px;
    display: flex;
    justify-content: space-between;
}
.active1 {
    background-color: #D0D3D5;
}
table {
    max-width: 100%;
    border: 1px solid #747678;
    margin: 0 auto;
    box-shadow: 0px 5px 3px 0px rgba(0, 0, 0, 0.5);
}
tr {
    border: 1px solid #747678;
}
th {
    content: "▼▲";
    background-color: #cecece;
    padding: 10px 10px;
    background-color: #dddada;
}
td {
    text-align: left;
    /* padding: 6px 10px; */
    font-size: 15px;
    background-color: #f5f5f5;
    white-space: nowrap;
    ;
}
.title {
    width: 100px;
    position: fixed;
    padding: 10px 20px;
    border: 1px solid #b3c9ce;
    border-radius: 4px;
    text-align: center;
    font: italic 14px/1.3 sans-serif;
    color: #333;
    background: #fff;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, .3);
    width: 200px;
    left: 0;
    top: 0;
    background: #15e39b;
    color: #fff;
}
.table_sort th {
    /*  color: #ffebcd;
    background: #008b8b; */
    cursor: pointer;
}

/* Закрепляем только левый столбец */
th:first-child,
td:first-child{
    position: sticky;
    left: 0;
    /* Чтобы текст не перекрывался при прокрутке */
    z-index: 10;
    /* Поднимаем над остальными элементами */
}
/* .table_sort { 
    overflow-x: auto;
    display: block;
    white-space: nowrap; 
} */
/* Закрепляем только левый столбец */
th.sorted[data-order="1"],
th.sorted[data-order="-1"] {
    position: relative;
}
th.sorted[data-order="1"]::after,
th.sorted[data-order="-1"]::after {
    right: 8px;
    /*  position: absolute; */
}
th.sorted[data-order="-1"]::after {
    content: "▼";
    padding-left: 10px;
}
th.sorted[data-order="1"]::after {
    content: "▲";
    padding-left: 10px;
}
.top {
    margin-left: 30px;
    font: bold italic 110% serif
}
.top::after {
    content: "\2191";
    padding-left: 10px;
}
.match_content {
    padding-top: 120px;
}

.m_data_wk {
    display: block;
    width: 30%;
    margin: 0 auto;
    text-align: center;
    margin-top: 14px;
}
.m_data{
font-size: 22px;
}

.m_wk{
    font-size: 26px;
    color: #9a9090;
    padding: 5px 0;
}
.calendar {
    width: 80%;
    display: flex;
    justify-content: center;
    margin: 16px auto 10px;
}
.tabl_cal {
    border: 0;
    border-collapse: inherit;
}
.text_left {
    text-align: left;
    padding-left: 20px;
}
.mantch_info {
    flex-direction: column;
    padding-right: 0;
    text-align: center;
    width: 200px;
    margin-top: 21px;
}
.club_img {
    width: 180px;
    height: 180px;
}
.club_img a>img {
    max-width: inherit;
    max-height: inherit;
}
.all_score {
    width: 20%;
    margin-top: 21px;
}
.score {
    height: 84%;
    display: table;
    margin: 0 auto;
}
.span_score {
    font: 700 85px Roboto Condensed, Arial Narrow, sans-serif;
    display: table-cell;
    vertical-align: middle;
}
.club_name {
    font: 600 23px Roboto Condensed, Arial Narrow, sans-serif;
    text-align: center;
    padding: 10px 5px 2px;
}
.xg {
    color: #515356;
    font: 20px Roboto Condensed, Arial Narrow, sans-serif;
    text-align: center;
    padding: 4px 5px 2px;
}
.match_summary_1 {
    width: 60%;
    margin: 0 auto;
}
.stadium {
    margin: 0 auto;
    width: 80%;
    padding: 12px 10px;
    font-size: 20px;
    font-weight: 500;
}
.team_sum {
    margin: 10px auto;
}
.match_summary {
    display: flex;
    width: 100%;
    margin: auto;
    font-size: 20px;
    color: #5c5c5c;
    border-bottom: #fbfffe 2px solid;
}
.club_img a,
td a,
.match_summary a {
    text-decoration: none;
    color: inherit;
}
.club_img a:hover,
td a:hover,
.match_summary a:hover {
    color: #ac5555;
    cursor: pointer;
    text-decoration: underline;
}
.left-match_summary {
    display: flex;
    width: 50%;
}
.right-match_summary {
    display: flex;
    width: 50%;
}
.evt_name {
    display: flex;
    flex-direction: column;
    width: 40%;
}
.evt_1,
.evt_5 {
    width: 40%;
}
.evt_1>.sp_nm_1 {
    display: flex;
    justify-content: right;
    align-items: center;
    padding: 0px 6px;
}
.evt_1>.sp_nm_2 {
    display: flex;
    justify-content: right;
    align-items: center;
    padding-right: 20px;
}
.evt_5>.sp_nm_1 {
    display: flex;
    justify-content: left;
    align-items: center;
    padding: 0px 6px;
}
.evt_5>.sp_nm_2 {
    display: flex;
    justify-content: left;
    align-items: center;
    padding-left: 20px;
}
.evt_5 {
    justify-content: left;
}
.evt_2,
.evt_4 {
    width: 30px;
    padding: 6px 6px;
}
.evt_3 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    padding: 0px 6px;
    color: #040303;
}
.evt_3_m {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    padding: 0px 6px;
    color: #040303;
    color: #736565;
    /* font-size: 18px; */
    height: 30px;
}

img {
    height: inherit;
    width: inherit;
    display: table-cell;
    vertical-align: middle;
}
.img_logo {
    background-size: cover;
    width: 40px;
}
.img_liga {
    padding: 5px;
}
.team_clubs {
    padding-right: 20px;
    padding-left: 15px;
}
.line_up {
    display: flex;
    justify-content: space-between;
    width: 50%;
    margin: 0 auto;
}
.line {
    display: flex;
    /* height: 54px; */
    font-size: 20px;
    background-color: #d5d8db;
    margin-bottom: 2px;
    padding: 4px 6px;
   
    /* box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.3),
        inset 5px 5px 5px 0px rgba(0, 0, 0, 0.3);
    filter: drop-shadow(3px 3px 7px rgba(0, 0, 0, 0.3)) */
}
.line:hover {
    transform: scale(1.3);
    position: relative;
    z-index: 4;
    transition: transform .5s;
}
.pl_match__img {
    width: 50px;
    margin: auto;
}
.pl_match__img>img {
    object-fit: cover;
    border-radius: 50%;
}
.line_row_1,
.line_row_2,
.line_row_3 {
    margin: 0px 8px;
    padding: 6px;
}
.line_row_1 {
    display: table-cell;
    text-align: right;
    width: 20px;
    margin: auto;
    color: rgb(115, 115, 115);
    font-size: 18px;
}
.line_row_2 {
    width: 80%;
    margin: auto;
    padding-left: 10px;
}
.line_row_2 a {
    color: #333333;
    cursor: pointer;
    text-decoration: none;
}
.line_row_2 a:hover {
    color: #ac5555;
    cursor: pointer;
    text-decoration: underline;
}
.line_row_3 {
    width: 40px;
    margin: auto;
}
.line_up_home {
    flex: 0 0 calc(50% - 10px);
}
.line_up_away {
    flex: 0 0 calc(50% - 10px);
}
h2,
h4 {
    text-align: center;
    margin: 0 auto;
}
.club_name {
    display: flex;
    justify-content: space-around;
    width: 98%;
    margin: 0 auto;
}
.stats {
    display: flex;
    flex-direction: column;
    width: 98%;
    margin: 0 auto;
}
.value {
    display: flex;
    justify-content: space-around;
}

.value_left>img,
.value_right>img {
    max-width: 27px;
    max-height: 27px;
}
.value_left>img:nth-child(1) {
    float: right;
    margin-right: 20px;
}
.value_right>img:nth-child(1) {
    margin-left: 20px;
}
.match_team_stats_all {
    display: flex;
    width: 100%;
}
.match_team_stats_home {
    width: 50%;
    background-color: #2980B9;
    height: 200px;
}
.match_team_stats_away {
    width: 50%;
    background-color: #ac5555;
    height: 200px;
}
.see_all {
    margin: 5px auto;
}
.all_stats {
    width: 100%;
    display: flex;
    display: none;
}
.all_stats_left {
    width: 50%;
}
.all_stats_right {
    width: 50%;
}
.bord {
    color: #5c5c5c;
    border-bottom: #fbfffe 2px solid;
    padding: 8px 0;
}
button {
    text-decoration: none;
    outline: none;
    border: 0;
    background: 0;
    padding: 0;
    font-size: 24px;
}
.btn {
    display: flex;
    width: 130px;
    margin: 0 auto;
    cursor: pointer;
}
.btn>img {
    width: 32px;
}
.taiangle_up {
    width: 14px;
    height: 14px;
    background: url('../images/events/black_triangle_up.png') no-repeat center;
    background-size: cover;
    margin: auto auto;
}
.chage_trainle {
    transform: rotate(180deg)
}
.all_teams {
    width: 100%;
}
.all_seasons {
    display: flex;
    margin-left: 50px;
    margin-top: 14px;
    margin: 0 auto;
    width: fit-content;
}
 
.sel_seasons {
    font-size: 24px;
    padding: 1px 9px;
    border: 1px solid #bcb4b4;
    border-radius: 8px;
    height: 40px;
    /* margin: auto 0; */
    margin-right: 10px;
}
.teams {
    display: grid;
    /* grid-template-rows: 1fr 1fr 1fr 1fr; */
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-gap: 2vw;
    padding: 20px;
}
.teams_h2 {
    margin: auto;
}
.team {
    border: #747678 1px solid;
    border-radius: 10px;
    padding: 18px 0px;
    background-color: white;
}
.team img {
    display: block;
    margin: auto;
}
.team a {
    text-decoration: none;
    color: #645d5d !important;
}
.team_text {
    text-align: center;
    padding-top: 20px;
    font-size: 18px;
}
.form-select {
    font-size: 24px;
    padding: 7px 25px;
    border: 1px solid #bcb4b4;
    border-radius: 8px;
    margin-top: 24%;
}
.ac-dropdown {
    position: absolute;
    font-size: 16px;
    background-color: #fff;
    z-index: 100;
    cursor: default;
    overflow-x: hidden;
    overflow-y: scroll;
    width: calc(100% - 2px);
    border: #aaa 1px solid;
    border-top-color: rgb(170, 170, 170);
    border-top-style: solid;
    border-top-width: 1px;
    border-top: 0;
    width: 200px;
    max-height: 380px;
    margin: 0;
    text-align: center;
}
.ac-dropdown li {
    list-style-type: none;
    padding: 4px 0;
}
.inp {
    width: 100%;
    padding: 0;
    font-size: 24px;
}
.ac ul {
    width: inherit;
    padding-left: 0;
}
form,
.ac {
    position: relative;
    width: 400px;
    margin: 0 auto;
}
input {
    width: 100%;
    height: 42px;
    padding-left: 10px;
    border: 2px solid #68B185;
    border-radius: 5px;
    outline: none;
    color: #9E9C9C;
}
.btn_sch {
    position: absolute;
    top: 0;
    left: 358px;
    width: 46px;
    height: 46px;
    border: none;
    background: #7BA7AB;
    background: rgb(84, 196, 138);
    ;
    ;
    border-radius: 0 5px 5px 0;
    cursor: pointer;
}
.btn_sch::before {
    content: "\f002";
    font-family: FontAwesome;
    font-size: 28px;
    color: #F9F0DA;
}
#search_inp {
    width: 90%;
    margin-left: 0;
}
.comp_nav {
    overflow: hidden;
    background-color: #6CCF9D;
}
.comp_nav a {
    float: left;
    color: #f2f2f2;
    text-align: center;
    padding: 7px 16px;
    text-decoration: none;
    font-size: 24px;
}
.comp_nav a:hover {
    background-color: #87CFAA;
    color: rgb(44, 41, 41);
}
.dv_right {
    border: 1px solid rgb(108, 105, 105);
    display: none;
    z-index: 99;
}
.visible {
    display: block;
}
.see_more:hover {
    display: block;
}
.carousel {
    width: 80%;
    height: 46px;
    padding: 10px 12px;
    border: 1px solid #CCC;
    border-radius: 15px;
    background-color: #fff;
    margin: 16px auto 16px;
    display: flex;
}
.carousel img {
    display: block;
}
.arrow {
    padding: 0;
    color: #444;
    display: block;
    margin: 0 8px;
    font-size: 40px;
    display: flex;
    align-items: center;
}
.arrow:focus {
    outline: none;
}
.arrow:hover {
    background: #ccc;
    cursor: pointer;
}
.prev {
    left: 7px;
}
.next {
    right: 7px;
}
.gallery {
    overflow: hidden;
}
.gallery ul {
    width: 9999px;
    margin: 0;
    padding: 0;
    list-style: none;
    transition: margin-left 250ms;
    font-size: 26px;
}
.gallery li {
    display: inline-block;
}
/* carousel */
.footer {
    background-color: #3E775A;
    width: 100%;
    height: 100px;
    color: #ffffff;
    text-align: center;
    font-size: 40px;
    margin: 0px auto 0px;
}
.tr_ic {
    display: flex;
    min-width: 180px;
}
.icon_f {
    width: 17px;
    margin-left: 4px;
    fill: rgb(138, 131, 131);
}
.section_bl {
    background-color: #fff;
    /* border-radius: 18px 18px 0 0; */
    padding: 5px;
    /* margin: 5px auto; */
	/* height: auto; */
}
.section_fl{
/* display: flex;
justify-content: space-between; */
display: grid; 
grid-template-columns: 2fr 4fr 4fr;
}

.l_block{
padding: 0 25px;
/* width: 20%; */
display: flex;
flex-direction: column;
justify-content: space-between;
}

 

 
.news {
    margin-top: 120px;
}
.img_news {
    width: 300px;
    margin: 0 auto;
    display: block;
}
.players_stats {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    padding-top: 3px;
}
.li_stats {
    display: grid;
    grid-template-columns: 1fr 1fr 7fr 1fr;
    padding: 7px 0px;
    font-size: 17px;
    border-top: 1px solid #dfdede;
    border-bottom: 1px solid #dfdede;
}
.img_player_stats {
    width: 30px;
}
.cat_stats {
    border: 1px solid #ae9d9d;
    border-radius: 10px;
    box-shadow: 0px 5px 3px 0px rgba(0, 0, 0, 0.5);
}
.ul_player_stats {
    padding: 0px 17px;
}
.all_stats_a {
    display: block;
    text-decoration: none;
    color: #131313;
    font-size: 17px;
    font-style: italic;
    font-weight: 600;
    padding-left: 20%;
    padding-bottom: 10px;
}
.li_stats_all {
    display: grid;
    grid-template-columns: 1fr 1fr 4fr 3fr 1fr;
    padding: 7px 0px;
    font-size: 20px;
    border-top: 1px solid #dfdede;
    border-bottom: 1px solid #dfdede;
}
.pl_stats_a {
    text-decoration: none;
    color: #595454;
}
.h_calendar {
    width: 30%;
    font-size: 16px;
    font-style: italic;
}
.games_clendar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border: 1px solid #f0ebeb;
    border-radius: 2px;
}
.game_today {
    display: grid;
    grid-template-columns: 1fr 3fr 2fr 3fr;
    /* display: flex; */
    padding-left: 10px;
    padding: 5px 10px 5px 10px;
    font-size: 16px;
    font-weight: 300;
    width: 45%;
    text-decoration: none;
    color: #5e5e5c;
}

/* Стили для первого span ( time) */
.game_today span:first-child {
    text-align: left;
    flex: 1;
}
/* Стили для второго span   */
.game_today span:nth-child(2) {
    text-align: right;
}

/* Стили для третьего span (: - :) */
.game_today span:nth-child(3) {
    text-align: center;
}

/* Стили для четвертог span(Интернационале)  */
.game_today span:last-child{
    text-align: left;
}
.game_score {
    margin: 0 20px;
    font-weight: 600;
}
.tab_date {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
	margin-top: 115px;
}
.tab_date button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 17px;
}
.tab_date button:hover {
    background-color: #ddd;
}
.tab_date button.active {
    background-color: #ccc;
}
.tabcontent_date {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
}
.seas_fl {
    display: flex;
}
.all_seasons {
    display: flex;
}
.all_seasons_h3 {
    padding: 0 20px;
}
.all_seasons_dv {
    margin: auto 0px;
}
.all_seasons_sl {
    margin: 0;
}
.data_time {
    color: #94999f;
}
.data_time {
    width: 20%;
    display: flex;
}
.news_div {
    display: flex;
    /* padding: 5px; */
    font-size: 18px;
    font: 15px/18px Roboto, Arial, sans-serif;
}
.news_div {
    font-size: 12px;
    display: grid;
    grid-template-columns: 1fr 8fr;
    column-gap: 10px;
}
/* .news_prev {
    margin-left: 5px;
} */
.news_prev a {
    text-decoration: none;
    color: #565050;
}
.datetime span {
    color: #94999f;
}
.sec_news {
    /* margin: 0; */
    width: auto;
    /* margin-left: auto; */
    margin: 0 auto;
}

.hidden {
    display: none;
}

.toggle-btn {
    margin: 10px;
    padding: 5px 10px;
    background-color: #FF7800;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.toggle-btn:hover {
    background-color: #0056b3;
}

caption>* {
    display: inline-block;
    vertical-align: middle;
}

/* Можно дополнительно задать отступы между элементами */
caption>*+* {
    margin-left: 10px;
    /* Отступ слева от второго элемента */
}

.d_bl {
    display: block;
}


.m_block {
    display: flex;
    flex-direction: column;
    gap: 10px;
    /* Расстояние между новостными блоками */
}

.m_news_div {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    /* Прижимаем datetime к верху, а news_prev к низу */
   /*  height: 100%; */
    /* Обеспечиваем заполнение высоты */
    /* border: 1px solid #ccc; */
    /* Для визуального понимания структуры */
    /* padding: 10px; */
    align-items: flex-start;
        /* Выравнивает содержимое по левому краю */
        
    height: 33%;
        /* Уже задано в inline-стилях, но лучше управлять в CSS */
    position: relative;
    width: 100%;
            /* Для стабильности */
}



.imp_img{
    display: flex;
}

.m_img_logo {
    flex-grow: 1;
     
}

.img_logo.img_news {
flex-grow: 0;
}

.m_news_prev {
    background: rgba(0, 0, 0, 0.6);
    /* Затемнение фона, если нужно */
    color: white;
    /* Белый цвет текста */
    padding: 10px 0px 10px 0px;
    width: 100%;
    /* Чтобы блок тянулся по ширине */
    margin-top: auto;
}
.m_news_prev  a {
    color: white;
    font-size: 20px;
    padding-left: 10px;
}

.m_news_prev span{
    padding: 10px;
}
/* .m_news_link {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
       
    text-decoration: none;
   
    color: inherit;
   
    height: 33%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    
} */

.m_news_link {
   /*  display: block; */
    display: flex;
    flex-direction: column;
    height: 33%;
    /* padding-top: 51.25%;*/
    /* Делаем ссылку блочным элементом */
    /* width: 100%;*/
    /* Занимает всю ширину контейнера */
    /* height: 0; */
    /* Задаём нулевую высоту */
    /* padding-top: 56.25%; */
    /* Соотношение сторон 16:9 (100 / 16 * 9) */
    background-image: url('/static/images/news/{{m.id}}.jpg');
    /* Фоновое изображение */
    background-size: cover;
    /* Масштабируем фон */
    background-position: center;
    /* Центрируем фон */
    background-repeat: no-repeat;
    /* Запрещаем повтор */
    text-decoration: none;
    /* Убираем подчеркивание */
    color: inherit;
    /* Наследуем цвет текста */
}



 .center-content {
     display: flex;
     align-items: center;
     /* Вертикальное выравнивание */
     gap: 10px;
     /* Отступ между элементами (по желанию) */
 }

 .img_liga {
     width: 50px;
     /* Пример ширины изображения (можно изменить) */
 }

.club_img a>img {
    display: inline;
}

.hidden-content {
    display: none;
}

.visible {
    display: flex;
    /* Для вялікіх экранаў */
}

.line_up_home div,
.line_up_away div {
    display: flex;
}
.news_title{
    font-size: 26px;
    text-align: center;
    margin: 0;
}
.news_text{
    padding: 30px 40px;
    font-size: 22px;
    line-height: 26px;
}

/* --- Стили для навигации по новостям (Вариант 2) --- */
.news-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 40px 0;
    padding: 20px 0;
    border-top: 2px solid #ddd;
    border-bottom: 2px solid #ddd;
    background-color: #f9f9f9;
    border-radius: 8px;
}


/* news-navigation.css */
/* Стили для элементов навигации */
.news-nav-item,
.news-nav-category {
    flex-basis: 33.33%;
    /* Каждый элемент занимает треть доступного пространства */
    text-align: center;
    /* Центрируем текст внутри */
    padding: 0 20px;
}

.news-nav-prev {
    text-align: left;
    /* Переопределяем для левого блока */
}

.news-nav-next {
    text-align: right;
    /* Переопределяем для правого блока */
}

.news-link {
    display: inline-flex;
    /* Используем flex для выравнивания текста и иконки */
    align-items: center;
    gap: 8px;
    /* Расстояние между текстом и иконкой */
    font-size: 17px;
    font-weight: 700;
    color: #333;
    /* Более темный цвет текста */
    text-decoration: none;
    transition: color 0.3s ease, transform 0.2s ease;
}

.news-link:hover {
    color: #53DC96;
    /* Цвет при наведении */
}

.news-nav-prev .news-link:hover {
    transform: translateX(-5px);
    /* Небольшое смещение влево */
}

.news-nav-next .news-link:hover {
    transform: translateX(5px);
    /* Небольшое смещение вправо */
}

/* Стиль для стрелок/иконок */
.news-link::before {
    /* Для предыдущей */
    content: '«';
    /* Или используйте иконку, например Font Awesome: \f104 */
    font-family: 'Arial', sans-serif;
    /* Или 'Font Awesome 5 Free' */
    font-weight: 900;
    /* Жирность для лучшей видимости символа */
    font-size: 20px;
    color: #3A9E6A;
    /* Цвет стрелки */
}

.news-nav-next .news-link::after {
    /* Для следующей */
    content: '»';
    /* Или используйте иконку, например Font Awesome: \f105 */
    font-family: 'Arial', sans-serif;
    /* Или 'Font Awesome 5 Free' */
    font-weight: 900;
    /* Жирность для лучшей видимости символа */
    font-size: 20px;
    color: #3A9E6A;
    /* Цвет стрелки */
}

/* Скрываем ненужные псевдоэлементы для корректного отображения */
.news-nav-next .news-link::before {
    content: none;
}

.news-nav-prev .news-link::after {
    content: none;
}

/* Скрываем элемент, если нет ссылки, чтобы избежать пустого блока */
/* !!! адапвиная часть */

/* Медиа-запросы для адаптивности */
@media (max-width: 1430px) {
    .wrapper {
        width: 95%;
    }
    header {
    position: absolute;
    }  
    .dropbtn {
            color: white;
            font-size: 20px;
        }
    .nav {
        /* flex-direction: column; */
       /*  align-items: center; */
       font-size: 20px;
    }

    .section_fl{
        display: grid;
        grid-template-columns:1fr 1fr
    }
    .l_block {
            width: 93%;
               display: flex;
                flex-direction: column;
                justify-content: space-between;
        }
    .m_news_link{
        height: 50%;
    }
    .players_stats {
        grid-template-columns: 1fr 1fr;
    }
   .match_summary, .line {
        font-size: 18px;
    }
        .match_summary_1,.line_up {
        width: 70%;
    }
	.span_score{
        font-size: 60px;
    }
    .seasons_div {
            background-color: inherit;
        }
   
}
@media (max-width: 1110px) {
    .img_liga {
            width: 40px;
        }
    .nav {
            /* flex-direction: column; */
            /*  align-items: center; */
            font-size: 16px;
        }
        .match_summary_1,.line_up {
            width: 76%;
        }
    .match_summary,
    .line {
             font-size: 16px;
         }
    .pleyer {
    	    display: block;
    	}
    .teams {
            grid-template-columns: 1fr 1fr 1fr 1fr ;
            padding: 20px;
        }
    .all_seasons {
            display: flex;
            margin-left: auto;
        }
    .seasons_div {
            width: 60%;
        }
    .news_div {
        /* font-size: 12px;
        display: grid;
        grid-template-columns: 2fr 8fr;  */
        grid-template-columns: 15fr 85fr;
    }    
    .visible {
        display: block;
        /* Для малых экранаў */
    }
    .all_stats_left,
    .all_stats_right{
        width: 100%;
        font-size: 16px;
    }
    h4{
        font-size: 20px;
    }
    .news_text {
        padding: 30px 40px;
        font-size: 20px;
        line-height: 26px;   
        }
}
@media (max-width: 950px) {
    
    .img_liga+span {
            display: none;
            /* Скрывает текст */
        }
        .match_summary_1,.line_up {
            width: 80%;
        }
        .stadium {
            font-size: 16px;
        }
        .teams {
            grid-template-columns: 1fr 1fr 1fr ;
            padding: 15px;
        }
    .cat_stats h4 {
        font-size: 22px;
    }
        .li_stats_all {
            font-size: 17px;
        }
}
@media(max-width:850px){
    .news_div {
            grid-template-columns: 20fr 80fr;
        }
}
@media (max-width: 820px) {
    /* .nav {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
        }
    
        .tab_date {
            margin-top: 150px;
        } */
     
    .h_calendar {
            width: 90%;
             
        }
    .game_today {
            width: 90%;
            padding-left: 10px;
            padding: 5px 10px 5px 10px;
            font-size: 16px;
            
        }
	.m_news_link {
        padding-top: 51.25%;
    }
    .match_summary_1,.line_up {
        width: 85%;
    }
    /* .news_div {
        font-size: 12px;
        display: grid;
        grid-template-columns: 2fr 8fr;
    } */
    .comp_nav a {
            width: 100%;
        }
    .news_div{
        grid-template-columns: 20fr 80fr;
    }    
}
@media (max-width: 800px) {
    a.button {
            padding: 8px 11px;   }
}
@media (max-width: 770px) {
    
    .nav {
       /*  display: block; */
        font-size: 17px;
        /* text-align: center; */
    }
    .img_liga {
            width: 40px;
            padding: 0px;
    }

    .nav li {
        /* display: block; */
        /* margin-bottom: 10px; */
        margin: 0;
    }
    .nav_header{
        display: flex;
    }
    .nav_header div{
        margin: 0;
        }
    .main-content {
        flex-direction: column;
        align-items: center;
    }

    .tab_date {
        margin-top: 120px;
        
    }
    .section_fl {
                    /* display: grid; */
        grid-template-columns: 1fr
    }
    .news_div{
        /* grid-template-columns: 1fr 8fr;  */
        grid-template-columns: 10fr 80fr;  
        column-gap: 0px;
    }
    .news_prev {
            /* margin-left: 15px; */
            width: 90%;
    }
        .match_summary_1,.line_up {
            width: 100%;
        }
    .bord{
        font-size: 20px;
    }    
    .stats h4 ,.club_name div{
        font-size: 20px;
    }
    .value div{
        font-size: 16px;
    }
    .calendar {
            width: 100%;
        }
        .m_wk,.club_name {
        font-size: 20px ;
    }
    .club_img {
            width: 145px;
            height: 145px;
        }
    .club_img a>img {
            width: 80px;
        }
    .span_score{
        font-size: 60px;
    }
    .teams {
            grid-template-columns: 1fr 1fr  ;
            padding: 15px;
        }
    .datetime span:nth-child(1),
    .datetime span:nth-child(2),
    .datetime span:nth-child(3) {
        display: none;
    }
    .seasons_div a {
        font-size: 18px;
    }
    .player__table-block {
        flex-direction: column;
    }
    .all_seasons {
            margin-left: 28px;
            margin-left: 5px;
            margin-top: 10px;  
    }
    .news_title {
        font-size: 24px;
    }
    .news_text {
        padding: 30px 40px;
        font-size: 18px;
        line-height: 26px;
    }
}


@media (max-width: 570px) {
    .pl_match__img img {
            display: none;
        }
    .pl_match__img {
            width: 0px;
        }
    .players_stats {
            grid-template-columns:  1fr;
        }
    .sel_seasons {
        font-size: 20px;
        height: 33px;;
    }
    a.button { 
        padding: 8px 11px;
    }
    .seasons_div {
            width: 60%;
        }
    .player__span:not(.pl_stats_a) {
            display: none;
        }
    .li_stats_all {
            display: grid;
            grid-template-columns: 1fr 1fr 4fr 1fr;
    }
    .table__name {
        font-size: 16px;
    }
    .form-select {
        font-size: 20px;
     }
    .comp_nav a {
            font-size: 20px;     
    }
}
@media (max-width: 520px){
    .block__a {
            display: grid;
            width: 100%;
            height: 90px;
            margin: 4px auto 4px;
            grid-template-columns: 1fr 1fr;   
        }
        .section_bl {
            background-color: #fff;
            padding: 5px;    
        }  
        .filter__name {
            border: 1px solid #53DC96;;
            width: 100%;
            padding: 0px;      
        } 
        a.button {
            display: inline-block;
            width: 100%;
            border-radius: 0px;
            padding: 14px 0px;       
        }  
        .evt_2,
        .evt_4 {
            width: 20px;
        }
        .team_clubs{
            display: none;
        }
        .line_up_home div,
        .line_up_away div {
            justify-content: center;
        }
        .news-navigation{
            display: block;
        }
        .news-nav-prev,
        .news-nav-next{
            text-align: center;
        }
}
@media (max-width: 480px) {
    body {
        font-size: 14px;
    }
    header{
        width: 100%;
    }
    .wrapper {
        width: 100%;
        padding: 5px;
    }
    .img_liga {
               width: 35px;
               padding: 2px;
           }
          
    .nav a {
        font-size: 14px;
        padding: 5px;
    }
    .ac{
        width: 98%;
    }
    .btn_sch{
        display: none;
    }
    
    .news_prev {
              width: 75%;
          }
   .game_today { 
       grid-template-columns: 1fr 2fr 2fr 2fr;
      
   }
   .stats h4,
   .club_name div {
       font-size: 20px;
   }

   .value div {
       font-size: 16px;
   }
.club_img {
    width: 135px;
    height: 135px;
}

.club_img a>img {
    width: 60px;
}

.span_score {
    font-size: 40px;
}
.club_name {
    font-size: 14px;
}
  .match_summary  {
      font-size: 14px;
  }
.stadium {
    font-size: 14px;
}
 .club_img a>img {
        display: inline;
    }
    .teams {
             grid-template-columns: 1fr ;
             padding: 10px;
         }
.game_teams a {
    display: block;
}

.separ {
    display: none;
}
  .li_stats_all {
      display: grid;
      grid-template-columns: 1fr  4fr 1fr;
  }
.li_stats_all .img_player_stats {
    display: none;
}
.seasons_div a {
    font-size: 15px;
}
.player__span { 
    margin-left: 0px;
}
.li_stats_all {
    font-size: 14px;
}
.cat_stats h4 {
    font-size: 18px;
}
.block__a { 
    height: 100px; 
}
.player__info {
    margin: 0 auto;
}
.news_div {
    grid-template-columns: 1fr 8fr;
    grid-template-columns: 15fr 80fr;
    column-gap: 0px;
}
}
@media (max-width: 360px) {
    .club_img {
            width: 130px;
            height: 130px;
        }
    
    .club_img a>img {
            width: 50px;
        }
    
        .span_score {
            font-size: 30px;
        }
    
    
        .match_summary {
            font-size: 14px;
        }
    
        .stadium {
            font-size: 14px;
        }
        .xg{
            font-size: 16px;
            width: 60px;
        }
    .club_img a>img {
        display: inline;
    }
    .block__a {
        display: grid; 
        width: 100%;
        height: 140px;
        margin: 4px auto 4px;
        grid-template-columns: 1fr 1fr;
    }
/* .all_seasons {
    margin-left: 28px;
    margin-left: 5px;
    margin-top: 10px;
} */
  .sel_seasons {
      font-size: 16px;
  }
.teams_h2 {
    font-size: 16px;
}
/* .game_teams a{
    display: block;
}
.separ{
    display: none;
} */
.bord td{
    font-size: 12px;
}
.sel_seasons {
    font-size: 20px;
    margin-left: auto;
}
/* button*/
.filter__name {
    width: 100%;
    padding: 0px;
}
a.button {
    display: inline-block;
    width: 100%;
    border-radius: 0px;
    padding: 20px 0px;
  }
/* .seasons_div {
    width: 60%;
} */
.seasons_div a{
    font-size: 10px;
    padding: 0px;
}
.tr_ic {
    
    min-width: 100px; 
}
/* .player__info {
    margin: 0 auto; 
} */
.line{
    height: 40px;
}
.line_row_1,
.line_row_2,
.line_row_3 {
   font-size: 12px;
 }
 .line_row_3 {
     width: 20px;
    }
.news_title {
     font-size: 20px;
    }
    
.news_text {
     padding: 12px 0px;
    font-size: 14px;
    line-height: 21px;
    }
}