body {
    font-size: 13px;
    font-family: Tahoma;
    width: 850px;
    margin: 0 auto;
    padding-bottom: 100px;
}
.clear {clear: both;}
.hidden {display: none !important;}
.hidden-desktop {display: none;}
.right {text-align: right;}
.center {text-align: center;}
.mobile-label {display: none;}
a {color: #0B7500;}
.position {
    background: #000;
    color: #fff;
    display: inline-block;
    padding: 3px 5px;
    margin: 2px 2px 0 0;
    border-radius: 4px;
    font-size: 12px;
}
.fake-content {display: none; font-size: 20px; text-align: center; padding: 20px 0;}

.topnav {
    position: relative;
    /*top: 0;*/
    background: #fff;
    z-index: 10;
}
.logo {
    display: block;
    float: left;
    color: #000;
    padding: 20px 10px 0 0;
}
.logo img {
    width: 110px;
    vertical-align: middle;
    border-radius: 100px;
}
.topnav .nav {
    float: left;
    margin-bottom: 2px;
}
.topnav a.icon {display: none;}
.topnav .langs {
    position: absolute;
    right: 0;
    top: 10px;
}
.telegram {color: #0d5aa7;}
.topnav .name {
    font-size: 18px;
    display: block;
    text-align: center;
    color: #fff;
    padding: 5px;
    background: #1c1c1c;
    border-radius: 5px;
    clear: both;
}
.menu {
    position: relative;
    display: block;
    list-style: none;
    padding: 5px 0;
}
.menu ul {
    padding:0;
    margin: 0;
}
.menu li {
    display: inline-block;
}
.menu a, .button {
    cursor: pointer;
    display: inline-block;
    padding: 5px 10px;
    border-radius: 4px;
    background: #3b4151;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    margin: 1px 0;
}
.menu a {
    font-size: 16px;
}
.menu a:hover, .button:hover {
    background: #0d5aa7;
}
/* первый уровень */
.menu > ul > li {
    position: relative;
}
/* второй уровень (выпадающий) */
.menu ul ul {
    display: none;
    position: absolute;
    left: 0;
    top: calc(100% - 4px);

    background: #3b4151;
    min-width: 180px;
    padding: 5px 0;
    border-radius: 4px;
    z-index: 1000;
}

/* элементы второго уровня */
.menu ul ul li {
    display: block;
}

/* ссылки второго уровня */
.menu ul ul a {
    display: block;
    padding: 6px 12px;
    font-size: 14px;
}

/* показать подменю при наведении */
.menu ul li:hover > ul {
    display: block;
}

/* hover для пунктов подменю */
.menu ul ul a:hover {
    background: #0d5aa7;
}

.link-button {
    cursor: pointer;
    display: inline-block;
    padding: 2px 0px;
    margin: 0px 5px;
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 1px dashed #0B7500;
}
h1 {
    font-size: 18px;
}

.yad {
    margin: 0 auto;
    width: 728px;
    position: relative;
}
.yad .banner {
    /*position: absolute;*/
    /*top:0;*/
    /*left:0;*/
}
.donate a{
    height: 90px;
    line-height: 90px;
    background-image: linear-gradient(45deg, #737373 25%, #8f8f8f 25%, #8f8f8f 50%, #737373 50%, #737373 75%, #8f8f8f 75%, #8f8f8f 100%);
    background-size: 56.57px 56.57px;
    color: #fff;
    font-weight: bold;
    font-size: 24px;
    text-align: center;
    display: block;
    text-decoration: none;
    border-radius: 5px;
}
.content {
    clear: left;
}
.stat {
    width: 100%;
}
.stat td {
    padding: 2px 5px;
    border-bottom: 1px dashed #aaa;
}
.stat .header td {
    font-weight: bold
}
.stat td input {
    width: calc(100% - 24px);
}
.stat td.location {max-width: 200px;}
.stat td label input {width: auto;}
.stat td input[type=submit] {
    width: auto;
}
.stat td input.position-input {width: 70px;}
.fish-type label {vertical-align: middle;}
.fish-type label input {width: auto;}
.fish-type label img {width: 10px;}
.info i.t{
    padding: 10px;
    display: block;
    background: #e0ebff;
}
.info {
    position: relative;
}
.info .share {
    position: absolute;
    right: 12px;
    top:8px;
    text-decoration: none;
}
.info .share {
    font-size: 14px;
}
.stat .hours input {width: 30px;}
.stat .bait-icon img {
    width: 28px;
    float: left
}
.params-toggle-block {
    text-align: right;
    padding-bottom: 10px;
    margin-top: -40px;
    float: right;
    position: relative;
}
.params-block {
    display: none;
    padding-bottom: 20px;
}
.tooltip-data {
    text-align: left;
    background: rgba(0, 0, 0, 0.9);
    border-radius: 8px;
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);
    color: #FFF;
    margin-top: 20px;
    opacity: 0;
    padding: 7px;
    position: absolute;
    visibility: hidden;
    font-family: Tahoma;
    z-index: 100;
    font-size: 14px;
}
.tooltip-data a {color :#fff; text-decoration: none;}
.tooltip:hover .tooltip-data{
    opacity: 1;
    visibility: visible;
}
.locations .item {
    float: left;
    background-size: 415px  !important;
    width: 415px;
    height: 200px;
    margin: 5px;
    text-align: center;
    position: relative;
}
.locations .title {
    font-size: 20px;
    color: #fff;
    background-color:rgba(0, 0, 0, 0.5);
    padding: 5px 10px;
}
.locations .buttons {
    margin-top: 50px;
    font-size: 18px;
}
.locations .props {
    position: absolute;;
    bottom: 0;
    background-color:rgba(0, 0, 0, 0.5);
    font-size: 14px;
    color: #fff;
    padding: 5px 0px;
    width: 100%;
}
.locations a {
    color: #fff;
}
.filters td {
    vertical-align: top;
}
.filters td.fish input {
    margin-bottom: 3px;
}
.fish-icon {
    position: relative;
}
.sticker {
    position: absolute;
    left: 0;
    top: 0;
}
.sticker img {
    width: 12px;
}
.filter-link {
    text-decoration: none;
    border-bottom: 1px dashed;
}
.change-object {
    float: right;
}
.date-period {
    text-align: center;
    padding-top: 50px;
    color: #888888;
}
.tops-show-block {
    text-align: right;
}
.tops-hide-block {
    float: right;
}
.top-block {
    padding: 5px;
    margin: 10px 0 20px;
}

.tabs {
    display: block;
    list-style: none;
    padding: 5px 0;
    padding:0;
    margin: 0 10px;
}
.tabs li {
    display: inline-block;
}
.tabs a {
    cursor: pointer;
    display: inline-block;
    padding: 5px 10px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    background: #3b4151;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    margin: 1px 0;
}
.tabs a {
    font-size: 16px;
}
.tabs a.active {
    background: #fcfee2 !important;
    color: #000;
    cursor: default;
}
.tabs a:hover {
    background: #0d5aa7;
}
.tab-data {
    background: #fcfee2;
    border-radius: 5px;
    padding: 5px;
}
.small-info {
    color: gray;
    font-size: 10px;
    text-align: center;
    padding: 5px 0;
}
.minimalWeight {width: 100px !important;}
.clip {
    display: block;
    position: relative;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    line-height: 20px;
    border-radius: 50%;
    text-align: center;
    font-size: 10px;
    color: white;
    box-shadow:
            0 0 0 3px #f0f0f0, /* Белая внешняя обводка */
            0 4px 6px rgba(0, 0, 0, 0.3);        /* Внутренняя тень */
    background-color:  #333333;
}


/***/

.banner-container {
    overflow: hidden;
    margin: 10px 0;
    display: flex;
    gap: 15px;
    flex-wrap: wrap; /* Чтобы на мобильных баннеры переносились */
}

.make-posts {
    width: 415px;
    height: 50px;
    border-radius: 8px;
    position: relative;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    /* Серый градиент для нейтрального вида */
    background: linear-gradient(135deg, #4a4a4a 0%, #2b2b2b 100%);
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    border: 1px solid #555;
}

.make-posts a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding-left: 65px;
    color: #e0e0e0 !important;
    text-decoration: none !important;
    font-family: "Segoe UI", Tahoma, sans-serif;
    font-weight: 600;
    font-size: 16px;
    z-index: 2;
}

/* Общая настройка для иконок */
.make-posts::before {
    content: "";
    position: absolute;
    left: 18px;
    width: 32px;
    height: 32px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: brightness(0) invert(1); /* Делает иконки белыми */
    opacity: 0.8;
}

/* Иконка VK (исправленный SVG) */
.make-posts.vk::before {
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.162 18.994c-6.098 0-9.57-4.172-9.714-11.107h3.047c.1 5.102 2.345 7.262 4.126 7.711V7.887H13.5v4.406c1.087-.117 2.887-2.117 3.272-4.406h2.894a8.1 8.1 0 01-3 5.484c.9 1.053 2.5 3.1 3.4 5.623h-3.136c-.71-2.226-2.49-3.934-3.568-3.934-.108 0-.216.015-.3.045v3.889h-.002z"/></svg>');
}

/* Иконка Discord */
.make-posts.discord::before {
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 11.721 11.721 0 0 0-.617-1.25.077.077 0 0 0-.079-.037 19.736 19.736 0 0 0-4.885 1.515.069.069 0 0 0-.032.027C.533 9.048-.32 13.58.099 18.057a.082.082 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.078.078 0 0 0 .084-.028 14.027 14.027 0 0 0 1.226-1.994.076.076 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128c.125-.094.252-.192.37-.29a.074.074 0 0 1 .077-.01c3.927 1.793 8.18 1.793 12.061 0a.074.074 0 0 1 .077.01c.118.098.245.196.37.29a.077.077 0 0 1-.006.127 12.988 12.988 0 0 1-1.873.893.076.076 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.956-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.956 2.419-2.157 2.419zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.955-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.946 2.419-2.157 2.419z"/></svg>');
}

/* Эффект наведения */
.make-posts:hover {
    filter: brightness(1.2);
    transform: translateY(-1px);
    border-color: #777;
}

/***/

@media (max-width: 480px) {
    .hidden-desktop {
        display: block;
    }
    .hidden-mobile {
        display: none !important;
    }
    .clip {
        display: inline-block;
        margin-left: -5px ;
    }

    .topnav .menu {
        display: none;
    }
    .mobile-clear {
        clear: both;
    }
    .mobile-block {
        display: block;
    }
    body {
        width: auto;
        padding: 0 5px;
        margin: 0;
        font-size: 16px;
    }
    .logo {padding: 0 10px 0 0;}
    .logo img {
        width: 60px;
    }
    .tooltip-data {
        left: 0;
    }
    .yad {
        width: 100%;
        position: absolute;
        left: 0;
        top: 70px;
    }
    .topnav .langs {
        top: 45px;
    }
    .topnav {
        position: sticky;
        top: 0;
        height: 160px;
        padding-top: 5px;
    }
    .topnav .name {
        text-align: left;
        background: #fff;
        color: #000;
        font-size: 14px;
        display: block;
        padding-top: 10px;
        padding-right: 45px;
        clear: none;
    }
    .topnav .menu {
        width: 100%;
        overflow: hidden;
        position: absolute;
        left: 0;
        top: 70px;
        z-index: 100;
        background: #fff;
    }
    .menu h1 {
        padding-left: 0;
    }
    .topnav a.icon {
        background: black;
        display: block;
        position: absolute;
        right: 5px;
        top: 10px;
        padding: 7px 10px;
        border-radius: 7px;
        color: #fff;
    }
    .menu li a {
        color: white;
        padding: 14px 16px;
        text-decoration: none;
        font-size: 17px;
        display: block;
        float: none;
        background-color: #333;
        border-radius: 0;
    }
    .menu li a:hover {
        background-color: #ddd;
        color: black;
    }
    .menu li {
        display: block;
    }
    /* подменю — показываем всегда */
    .menu ul ul {
        display: block !important;
        position: static;
        background: #2f3442;
        padding: 0;
    }

    /* пункты подменю */
    .menu ul ul li a {
        padding: 10px 16px;
        font-size: 15px;
        background: #2f3442;
        border-left: 3px solid #0d5aa7;
    }

    .menu ul ul li a:hover {
        background: #444b5e;
        color: #fff;
    }

    /* отключаем hover-логику полностью */
    .menu li:hover > ul {
        display: block;
    }

    /* убираем "мостик" — он нужен только на desktop */
    .menu ul ul::before {
        display: none;
    }



    small .button {
        padding: 5px;
    }
    .mobile-label {
        display: inline-block;
        color: #555555;
        font-size: 12px;
        width: 120px;
    }
    .list-position .mobile-label {
        width: auto;
    }
    .mobile-location {
        font-weight: bold;
    }
    .stat td {
        display: block;
        float: left;
        border : none;
        font-size: 14px;
    }
    .stat tr {
        display: block;
        clear: both;
        position: relative;
    }
    .stat .header {
        display: none
    }
    .stat .info {
        width: calc(100% - 10px);
    }
    .data tr {
        border-bottom: 2px solid #1e5eb6;
    }
    .data .time div {
        display: inline;
    }
    .data .list-gamer {
        position: absolute;
        right: 0;
        top: 70px;
        font-size: 14px;
    }
    .data .fish-icon img{
        width: 32px;
    }
    .data .fish-icon .sticker img {
        width: 8px;
    }
    .filters .fish, .filters .location, .filters .bait, .filters .gamer {
        width: 45%;
    }
    .locations .item {
        background-size: 100%  !important;
        width: 100%;
        height: 150px;
        margin: 5px 0 0;
    }
    .locations .buttons {
        margin-top: 20px;
    }
    .orders {
        float: none !important;
        background: #000;
        color: #fff;
    }
    .orders a {
        color: #fff;
    }
}
