/* === MAIN === */
* {box-sizing: border-box;margin: 0;padding: 0;}
body {font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;line-height: 1.5;color: #222;background-color: #f5f7fa;min-height: 100vh;display: flex;flex-direction: column;}
a {color: inherit;text-decoration: none;}
.layout-980 {max-width: 980px;margin: 0 auto;}
.text-content {max-width: 700px;}

.icon_white {width: 28px;height: 28px;fill: #FFFFFF;}
.icon {width: 18px;height: 18px;fill: currentColor;}
.icon_s {width: 16px;height: 16px;fill: currentColor;padding:0;}

/* ===== HEADER ===== */
.site-header {position: sticky;top: 0;z-index: 1000;background: #002537;border-bottom: 1px solid #e5e5e5;}
.site-header-inner {display: flex;align-items: center;justify-content: space-between;padding: 0.75rem 0;}
.site-logo {font-size: 1.1rem;font-weight: 700;text-transform: uppercase;letter-spacing: 0.06em;}
.site-logo img {height: 36px;width: auto;display: block;}
.header-icons {display: flex;gap: 0.5rem;align-items: center; }
.icon-btn {border: none;background: none;padding: 0.3rem;cursor: pointer;font-size: 1.3rem;line-height: 1;color:#FFFFFF;}
.icon-btn:focus-visible {outline: 2px solid #007bff;outline-offset: 2px;}

/* ===== SEARCH ===== */
.search-bar {position: relative;overflow: hidden;max-height: 0;transition: max-height 0.25s ease;background: #f7f7f7;border-bottom: 1px solid #e5e5e5;}
.search-bar-inner {padding: 0.75rem 0 1rem;}
.search-form {display: flex;}
.search-input {flex: 1;padding: 0.5rem 0.75rem;border-radius: 999px;border: 1px solid #ccc;font-size: 0.95rem;}
.search-bar.is-open {max-height: 620px;}

/* =====MAIN CONTENT===== */
.page-content {padding: 1rem 0;min-height: 60vh;}
.page-content.is-hidden {display: none;}


.site-header-inner,
.search-bar-inner,
.page-content,
.footer-inner {padding-left: 15px;padding-right: 15px;}
.site-header-inner {padding-top: 0.75rem;padding-bottom: 0.75rem;}
.search-bar-inner {padding-top: 0.75rem;padding-bottom: 1rem;}
.page-content {padding-top: 1rem;padding-bottom: 1rem;}
.footer-inner {padding-top: 1.5rem;padding-bottom: 1.5rem;}

/* ===== FAVs ===== */
.fav-bar {position: relative;overflow: hidden;max-height: 0;transition: max-height 0.25s ease;background: #fff8d7;border-bottom: 1px solid #e5d8a8;}
.fav-bar-inner {padding-top: 0.75rem;padding-bottom: 1rem;padding-left: 15px;padding-right: 15px;}
.fav-bar.is-open {max-height: 100%;}
.favorites{display: grid;grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));gap: 10px;max-width: 980px;margin: 0 auto;padding: 8px 0 8px 0;}
.fav-card{display: flex;align-items: center;justify-content: space-between;gap: 10px;padding: 10px 12px;min-height: 54px;border: 1px solid #e9e9e9;border-radius: 12px;background: #fff;text-decoration: none;color: inherit;transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease;}
.fav-card:hover{background: #fafafa;box-shadow: 0 4px 14px rgba(0,0,0,0.06);transform: translateY(-1px);}
.fav-main{min-width: 0; }
.fav-title{font-size: 18px;font-weight: 600;color: #111;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.fav-sub{margin-top: 1px;font-size: 12px;color: #666;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.fav-temp{flex-shrink: 0;padding: 4px 8px;border-radius: 999px;font-size: 13px;font-weight: 700;color: #111;background: #f1f1f1;}
@media (max-width: 420px){
.favorites{grid-template-columns: 1fr;}}

/* line */
.unit-toggle-bar {background: #f5f5f5;border-bottom: 1px solid #e5e5e5;font-size: 0.9rem;}
.unit-toggle-inner {padding: 0.4rem 15px;display: flex;align-items: center;gap: 0.5rem;justify-content: flex-end;}
.unit-toggle-label {opacity: 0.7;}

/* C->F */
#unit_off {border: 1px solid #ccc;background: #fff;padding: 0.15rem 0.6rem;border-radius: 999px;cursor: pointer;font-size: 0.9rem;}
#unit_on {border: 1px solid #007bff;background: #007bff;padding: 0.15rem 0.6rem;border-radius: 999px;cursor: pointer;font-size: 0.9rem;color: #fff;}

/* === NAVs === */
.breadcrumbs {font-size: 0.99rem;margin-bottom: 0.75rem;color: #666;}
.breadcrumbs a {color: #666;text-decoration: none;}
.breadcrumbs-sep {margin: 0 0.25rem;}


/* === HERO === */
.location-hero {display: flex;flex-direction: column;gap: 1.2rem;margin-bottom: 1.5rem;}
.location-title {margin: 0 0 0.5rem;}
.location-title-main {display: block;font-size: 2.8rem;line-height: 1.2;font-weight: 700;margin-bottom: 0.15rem;}
.location-title-sub {display: block;font-size: 1.3rem;line-height: 1.4;font-weight: 300;color: #666;}
.location-intro {margin: 0;color: #444;font-size: 0.95rem;padding-top:10px;}
.location-intro2 {margin: 0;color: #444;font-size: 1.3rem;line-height: 1.4;font-weight: 300;color: #666;}
.location-intro3 {margin: 0;color: #444;font-size: 0.9rem;line-height: 1.4;font-weight: 300;color: #666;padding-top:10px;}
.location-hero-figure {margin: 0;font-size: 0.8rem;color: #666;}
.location-hero-figure img {display: block;width: 100%;height: auto;border-radius: 4px;}
.location-hero-figure figcaption {margin-top: 0.35rem;line-height: 1.3;}
@media screen and (max-width:490px){.location-hero-figure figcaption {padding-left:15px;}}
@media (min-width: 768px) {
.location-hero {flex-direction: row;align-items: flex-start;gap: 2rem;}
.location-hero-text {flex: 1 1 48%;}
.location-hero-figure {flex: 1 1 52%;}
}
@media (max-width: 767px) {
.location-hero-figure {margin-left: -15px;margin-right: -15px;}
.location-hero-figure img {border-radius: 0; }
}


/* === ARTICLE === */
.article-section {margin-left: 0;margin-right: 0;border: none;border-radius: 0;padding: 0;}
.article-inner {max-width: 767px;margin: 0 0 0 20px;padding: 1.25rem 15px;line-height: 1.65;color: #444;}
@media (max-width: 767px) {.article-inner {margin: 0 auto;}}
.article-title {font-size: 2.0rem;margin: 0 0 1rem;line-height: 1.3;font-weight:600;}
.article-inner h3 {margin-top: 1.7rem;margin-bottom: 0.7rem;font-size: 1.45rem;line-height: 1.35;color: #333;font-weight:400;}
.article-inner p {margin-top: 1.1rem;margin-bottom: 0.4rem;font-size: 1.05rem;line-height: 1.55;color: #333;font-weight:300;}
.article-figure {margin: 1.5rem 0;text-align: left;color: #666;font-size: 0.85rem;}
.article-figure img {width: 100%;height: auto;border-radius: 6px;display: block;}
.article-figure figcaption {margin-top: 0.4rem;}
.article-figure.wide img {border-radius: 8px;max-width: 100%;}
@media (min-width: 768px) {.article-section {border: 1px solid #006CD9;border-radius: 8px;background:#DFEFFF;}.article-inner {padding: 1.75rem 2rem;}}
@media (max-width: 767px) {
.article-section {margin-left: -15px;margin-right: -15px;border: none;border-radius: 0;background:#DFEFFF;}
.article-figure.wide {margin-left: -15px;margin-right: -15px;}
.article-figure {margin-left: -15px;margin-right: -15px;}
.article-figure.wide img {border-radius: 0;}
.article-figure img {border-radius: 0;}
.article-figure figcaption {padding-left:15px;}
}

/* === LIST === */
.seas-section {margin: 2rem 0 2.5rem;}
.seas-inner {background: #fff;border: 1px solid #dde2ea;border-radius: 8px;padding: 1.5rem 15px;}
@media (min-width: 768px) {.seas-inner {padding: 1.75rem 2rem;}}
@media (max-width: 767px) {.seas-inner {background: #f5f7fa;border: none;border-radius: 0;margin-left: -15px;margin-right: -15px;padding-left: 15px;padding-right: 15px;padding-top: 1.25rem;padding-bottom: 1.25rem;}}
.seas-title {font-size: 1.8rem;margin: 0 0 1rem;font-weight:600;}
.seas-grid {list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: repeat(1, minmax(0, 1fr));gap: 0.9rem 1rem;font-size: 0.95rem;}
.seas-item a {border: 1px solid #C5C5C5;display: flex;align-items: center;gap: 0.45rem;padding: 0.35rem 0.5rem;border-radius: 999px;text-decoration: none;color: #234;background:#E9E9E9;box-shadow: 0 0 0 1px rgba(0,0,0,0.02);
transition:background 0.15s ease,color 0.15s ease,box-shadow 0.15s ease,transform 0.1s ease;}
.seas-dot {width: 8px;height: 8px;border-radius: 50%;background: #2f80ed;flex-shrink: 0;}
.seas-name {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.seas-item a:hover {background: #e3ecf8;color: #000;box-shadow: 0 0 0 1px rgba(47,128,237,0.25);transform: translateY(-1px);}
.seas-empty {font-size: 0.95rem;color: #666;}
@media (min-width: 768px) {.seas-grid {grid-template-columns: repeat(3, minmax(0, 1fr));}}
@media (min-width: 1024px) {.seas-grid {grid-template-columns: repeat(3, minmax(0, 1fr));}}
.seas-badge {margin-left: auto;background: #e8eef8;color: #2f80ed;padding: 0.2rem 0.45rem;border-radius: 999px;font-size: 0.75rem;line-height: 1;font-weight: 600;flex-shrink: 0;}
.seas-badge.blue {background: #2f80ed;color: #fff;}
.seas-item a.top-sea {background: #e9f3ff;box-shadow: 0 0 0 1px #80BFFF;color: #1a3b6e;}
.seas-item a.top-sea .seas-dot {background: #2f80ed;}
.seas-item a.top-sea .seas-badge {background: #2f80ed;color: #fff;}

/* ===== FTR ===== */
.footer-projects {border-bottom:#DFDFDF 2px solid;padding:0 0 20px 0;margin-bottom:30px;}
.footer-outer {background:#181b20;color:#d5d8df;font-size:1.1rem;margin-top:0;}
.footer-inner {padding: 0.75rem 15px 1.5rem;}
@media (min-width: 768px) {.footer-inner {padding: 1.25rem 0 2rem;}}
.footer-projects-title {font-size: 1.1rem;text-transform: uppercase;letter-spacing: 0.08em;margin: 0 0 0.9rem;color: #f0f2f7;}
.footer-projects-grid {list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: repeat(1, minmax(0, 1fr));gap: 0.4rem 1.5rem;}
@media (min-width: 600px) {.footer-projects-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}}
@media (min-width: 992px) {.footer-projects-grid {grid-template-columns: repeat(3, minmax(0, 1fr));}}
.footer-project-item a {display: flex;align-items: center;gap: 0.45rem;text-decoration: none;color: #d5d8df;padding: 0.25rem 0;border-radius: 4px;transition: color 0.15s ease, background 0.15s ease;}
.footer-project-item a:hover {color: #ffffff;background: rgba(255,255,255,0.04);}
.footer-flag {width: 26px;height: 18px;border-radius: 9px;background:#6F6F6F;color:#FFFFFF;flex-shrink: 0;box-shadow: 0 0 0 1px rgba(0,0,0,0.4);text-align:center;font-size:11px;}
.footer-project-name {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size:15px;}
.footer-empty {margin: 0;color: #999;}
.footer-brand-row {gap: 0.9rem 1.5rem;margin-bottom: 1rem;clear:both;}
.footer-logo-img {height: 32px;width: auto;}
.footer-store-img {height: 34px;width: auto;}
.footer-slogan {margin: 0 0 1rem;max-width: 720px;line-height:1.5;color:#79D3FF;font-weight:700;font-size:1.10rem;}
.footer-bottom-row {gap: 0.4rem 1.5rem;font-size: 0.95rem;color: #9ea3af;}
.footer-copy {margin: 0;}
.footer-menu {margin-top:10px;display: flex;flex-wrap: wrap;gap: 0.35rem;}
.footer-menu a {color: #c6cad4;text-decoration: none;}
.footer-menu a:hover {text-decoration: underline;}
.footer-menu-sep {color: #555b66;}
@media (max-width: 480px) {.footer-bottom-row {flex-direction: column;align-items: flex-start;}}
/* ===== FTR ===== */

/* ===SECIONT+TABLE=== */
.temp-section {border: 1px solid #dde5f0;border-radius: 14px;background: #fff;padding: 18px 20px 16px;margin: 20px 0;}
.temp-title {font-size: 32px;line-height: 1.2;font-weight: 600;margin: 0 0 15px 0;padding-right:40px;}
.temp-wrapper {display: flex;justify-content: space-between;gap: 15px;margin-bottom: 12px;}
.temp-block {flex: 1;padding: 14px 16px 12px;border-radius: 10px;border: 1px solid #d4dbe7;text-align: center;background: #ffffff;box-sizing: border-box;}
.temp-value {font-size: 42px;font-weight: 700;margin-bottom: 6px;}
.temp-value span{font-size:28px;font-weight:400;}
.temp-label {font-size: 16px;opacity: 0.85;}
.temp-note {font-size: 16px;margin: 0;opacity: 0.9;}
.advapp {font-size: 18px;margin:10px 0 10px 0;opacity: 0.9;background:#C4E1FF;font-weight:600;padding:10px 10px 10px 10px;border-radius:9px;}
.advapp a {text-decoration:underline;}
.temp-block.cold {background: #e8f3ff;border-color: #a8c8ff;}
.temp-block.mild {background: #e9f7ef;border-color: #9cd3b0;}
.temp-block.warm {background: #fff1e6;border-color: #f3b48a;}
@media (max-width: 768px) {.temp-wrapper {flex-direction: column;}}
@media (max-width: 768px) {h2.temp-title {font-size: 24px;} h3.temp-title {font-size: 24px;}p.temp-note{font-size:14px;}}

.temp-content {display: flex;gap: 20px;align-items: flex-start;}
.temp-table-wrap {max-width: 440px;width: 100%;}
.temp-table {width: 100%;border-collapse: collapse;}
.temp-table th,
.temp-table td {padding: 10px 14px;border-bottom: 1px solid #d4dbe7;text-align: center;font-size: 15px;}

.temp-table th {font-weight: 600;background: #eef3fa;}
.temp-table tbody tr:nth-child(even) {background: #f2f5fa;}
.temp-table tbody tr:hover {background: #e6edf7;}
.temp-photo {flex: 1;max-width: 560px;}
.temp-photo img {width: 100%;height: auto;border-radius: 10px;display: block;}
.temp-photo-caption {font-size: 14px;margin-top: 12px;opacity: 0.8;}
@media (max-width: 768px) {
.temp-content {flex-direction: column;}
.temp-table-wrap {max-width: 100%;}
.temp-photo {max-width: 100%;margin-top: 10px;}
.temp-table th,
.temp-table td {padding: 8px 10px;font-size: 14px;}
.temp-title {font-size: 24px;margin-bottom: 12px;}
p.temp-photo-caption {font-size:16px;}
}


/* === LIST 2 === */
.newsea-section {margin: 1rem 0 1.5rem;}
.newsea-inner {border: 1px solid #dde5f0;border-radius: 14px;background: #fff;padding: 18px 20px 16px;margin: 20px 0;}
@media (min-width: 768px) {.newsea-inner {padding: 1.75rem 2rem;}}
@media (max-width: 767px) {.newsea-inner {}}
.newsea-title {font-size: 1.8rem;margin: 0 0 1rem;font-weight:600;}
.newsea-grid {list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: repeat(1, minmax(0, 1fr));gap: 1rem 1rem;font-size: 0.95rem;}
.newsea-item a {display: flex;align-items: center;gap: 0.45rem;padding: 0.35rem 0.5rem;border-radius: 999px;text-decoration: none;color: #234;background: #DFF4FF;box-shadow: 0 0 0 1px rgba(0,0,0,0.08);
transition:background 0.15s ease,color 0.15s ease,box-shadow 0.15s ease,transform 0.1s ease;}
.newsea-dot {width: 8px;height: 8px;border-radius: 50%;background: #2f80ed;flex-shrink: 0;}
.newsea-name {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.newsea-item a:hover {background: #6FCCFF;color: #000;box-shadow: 0 0 0 1px rgba(47,128,237,0.25);transform: translateY(-1px);}
.newsea-empty {font-size: 0.95rem;color: #666;}
@media (min-width: 768px) {.newsea-grid {grid-template-columns: repeat(3, minmax(0, 1fr));}}
@media (min-width: 1024px) {.newsea-grid {grid-template-columns: repeat(3, minmax(0, 1fr));}}
.newsea-badge {margin-left: auto;background: #88FFFF;color: #2f80ed;padding: 0.2rem 0.45rem;border-radius: 999px;font-size: 0.75rem;line-height: 1;font-weight: 600;flex-shrink: 0;}
.newsea-badge.blue {background: #2f80ed;color: #fff;}
.newsea-item a.top-sea {background: #e9f3ff;box-shadow: 0 0 0 1px #80BFFF;color: #1a3b6e;}
.newsea-item a.top-sea .newsea-dot {background: #2f80ed;}
.newsea-item a.top-sea .newsea-badge {background: #2f80ed;color: #fff;}
@media (max-width: 768px) {h2.newsea-title {font-size: 24px;} h3.newsea-title {font-size: 24px;}p.temp-note{font-size:14px;}}
.form-row2 {display:none;}

/* === cards === */
.temp-cards {display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));gap: 16px;}
.temp-card {position: relative;display: block;border-radius: 14px;overflow: hidden;text-decoration: none;color: #fff;background-size: cover;background-position: center;background-repeat: no-repeat;padding-top: 50%;}
.temp-card-inner {position: absolute;inset: 0;padding: 12px;
display: flex;flex-direction: column;justify-content: flex-end;align-items: center;text-align: center;
background: linear-gradient(to top,rgba(0, 40, 60, 0.85),rgba(0, 40, 60, 0.65),rgba(0, 40, 60, 0.55));}
.temp-card-temp {font-size: 38px;font-weight: 700;margin-bottom: 0;}
.temp-card-place {font-size: 22px;font-weight: 600;margin-bottom: 5px;}
.temp-card-country {font-size: 12px;padding: 3px 20px;border-radius: 999px;background: rgba(255, 255, 255, 0.88);color: #222;display: inline-block;margin-bottom: 2px;}
.temp-card:hover .temp-card-inner {transform: translateY(-2px);background: linear-gradient(to top,rgba(0, 60, 85, 0.85),rgba(0, 60, 85, 0.55),rgba(0, 60, 85, 0.24));transition: all 0.2s ease;}
@media (max-width: 768px) {.temp-cards {grid-template-columns: 1fr;}
.temp-card-temp {font-size: 42px;margin-bottom: 0;}
.temp-card-place {font-size: 26px;}}
.temp-card-temp,.temp-card-place {text-shadow:0 2px 4px rgba(0, 0, 0, 0.55),0 0 6px rgba(0, 0, 0, 0.35);}
.temp-card-temp span {font-size:36px;font-weigh:300;}

.temp-card-innerf {position: absolute;inset: 0;padding: 12px;
display: flex;flex-direction: column;justify-content: flex-end;align-items: center;text-align: center;
background: linear-gradient(to top,rgba(0, 40, 60, 0.55),rgba(0, 40, 60, 0.35),rgba(0, 40, 60, 0.25));}
.temp-card:hover .temp-card-innerf {transform: translateY(-2px);background: linear-gradient(to top,rgba(0, 60, 85, 0.85),rgba(0, 60, 85, 0.55),rgba(0, 60, 85, 0.24));transition: all 0.2s ease;}
@media (max-width: 768px) {.temp-cards {grid-template-columns: 1fr;}}


/* === faq === */
.faq-section {margin-top: 10px;}
.faq-list {margin-top: 10px;}
.faq-item {border-radius: 10px;border: 1px solid #d4dbe7;background: #ffffff;margin-bottom: 10px;padding: 0;overflow: hidden;}
.faq-item > summary {list-style: none;cursor: pointer;padding: 10px 14px;font-size: 18px;font-weight: 400;position: relative;outline: none;}
.faq-item > summary::-webkit-details-marker {display: none;}
.faq-item > summary::after {content: "+";position: absolute;right: 14px;top: 50%;transform: translateY(-50%);font-weight: 700;font-size: 16px;opacity: 0.7;}
.faq-item[open] > summary::after {content: "–";}
.faq-item > summary:hover {background: #f2f5fa;}
.faq-answer {padding: 6px 44px 12px 14px;font-size: 16px;line-height: 1.5;border-top: 1px solid #e2e6f0;font-weight:300;background: #ffffff;}
@media (max-width: 768px) {
.faq-item > summary {padding: 10px 22px 10px 12px;font-size: 16px;}
.faq-answer {padding: 10px 12px 10px 12px;font-size: 16px;}
.temp-title {font-size: 24px;}
}

/* ===2 photos=== */
.photo-grid {display: grid;grid-template-columns: repeat(2, 1fr);gap: 16px;margin-top: 10px;padding-bottom:25px;}
.photo-item {display: flex;flex-direction: column;}
.photo-item img {width: 100%;height: 230px;object-fit: cover;border-radius: 12px;display: block;}
.photo-caption {margin-top: 1px;font-size: 11px;opacity: 0.85;text-align: left;}
@media (max-width: 768px) {.photo-grid {grid-template-columns: 1fr;}}


/* ===FAVORITES=== */
.follow-btn{background: transparent;color: #0072A8;border: 1px solid #0072A8;padding:4px 8px 4px 8px;border-radius:10px;}
.follow-btn:hover{background: #0072A8;color: #fff;}
.follow-btn2{background: #CEEFFF;color: #004262;border: 1px solid #0072A8;padding:4px 8px 4px 8px;border-radius:10px;}
.follow-btn2:hover{background: #005177;color: #fff;}

/* ===CHART SECTION=== */
.chart-section {border: 1px solid #dde5f0;border-radius: 14px;background: #fff;padding: 18px 0 16px 0;margin: 0;}
.chart-title3 {font-size: 28px;line-height: 1.2;font-weight: 600;margin: 0 0 15px 0;padding:10px 40px 0 20px;}
.chart-title {font-size: 32px;line-height: 1.2;font-weight: 600;margin: 0 0 15px 0;padding:10px 40px 0 20px;}
.chart-note {font-size: 16px;margin: 0;opacity: 0.9;padding:0px 35px 10px 20px;}
.chart-note2 {font-size: 15px;margin: 0;opacity: 0.9;padding:5px 55px 10px 20px;}
.chart-note-for {font-size: 16px;margin: 0;opacity: 0.9;padding:5px 35px 10px 20px;font-weight:600;}
@media (max-width: 768px) {
.chart-title {font-size: 24px;margin-bottom: 12px;}
.chart-title3 {font-size: 22px;margin-bottom: 12px;}
.chart-note {font-size: 14px;}
.chart-note2 {font-size: 13px;padding:5px 15px 10px 15px;}
}

.chart-wrap{max-width: 980px;margin: 0 auto;padding: 12px;}
   svg{width: 100%;height: auto;display: block;background: var(--bg);border-radius: 12px;}
  .grid line{stroke: rgba(0,0,0,0.18);stroke-width: 1;stroke-dasharray: 6 6;}
  .ylabels text{fill: rgba(0,0,0,0.45);font-size: 14px;}
  .line{fill: none;stroke: #0A6C8E;stroke-width: 4.5;stroke-linecap: round;stroke-linejoin: round;}
  .dot{fill: #0A6C8E;}
  .chart-wrap .title {font-weight:600;padding:0 0 10px 25px;font-size:18px;}
  @media (max-width: 480px){
.chart-wrap{ padding: 10px; }
.chart-wrap .title {padding:0 0 10px 10px;font-size:16px;}
.ylabels text{ font-size: 12px; }
   }




/* ===temp-table=== */
.temp-table4-wrap {width: 100%;}
.temp-table4 {width: 100%;border-collapse: collapse;padding: 0 0 10px 30px;margin-bottom:10px;}
.temp-table4 th,
.temp-table4 td {padding: 7px 14px;border-bottom: 1px solid #d4dbe7;font-size: 16px;text-align:center;}

.temp-table4 th {font-weight: 600;background: #eef3fa;}
.temp-table4 tbody tr:nth-child(even) {background: #f2f5fa;}
.temp-table4 tbody tr:hover {background: #e6edf7;}
.snoska {font-size:14px;font-weight:300;padding:0 0 0 15px;}
.otv {border-bottom: 1px solid #dde5f0;margin-top:15px;}

@media (max-width: 768px) {
.temp-table4-wrap {max-width: 100%;margin:0;}
.temp-table4 th,
.temp-table4 td {padding: 8px 10px;font-size: 14px;}
.temp-title4 {font-size: 24px;margin-bottom: 12px;}
.snoska {font-size:12px;padding:0 15px 0 15px;}
}

/* ===month tables=== */
.histo {width:100%;background:#E6F7FF;margin:10px 0 10px 0;padding:15px 20px 15px 20px;}
#setkahist {width:390px;height:310px;position:relative;float:left;}
#anuallist {width:420px;height:310px;margin-left:40px;float:left;}
#setkahist h4 {font-weight:600;padding-left:10px;}
#anuallist h4 {font-weight:600;padding-left:20px;}
#anuallist img {max-width: 100%;height:290px;display: block;}
.bartoline {font-size:12px;font-weight:300;color:#858585;padding-left:10px;width:100%;border-bottom: 1px solid #C0C0C0;margin-top:15px;height:20px;}
.monthbar {position:absolute;width:22px;background:#006393;float:left;border-radius:7px;}
#table_month {margin:10px 0 0 0;padding:15px 0 0 0;}
#table_month h4 {font-weight:600;padding:0 10px 15px 15px;font-size:20px;}
.snoska2 {font-size:14px;font-weight:300;padding:5px 0 10px 15px;}
@media (max-width: 599px) {
#setkahist {width:100%;padding:0;margin:0;}
#setkahist h4 {padding-left:0;}
.bartoline {width:100%;padding:0;}
#anuallist {width:105%;height:auto;margin: 0 -10px 0 -10px;padding:0;}
#anuallist h4 {padding-left:10px;}
#anuallist img {width: 100%;height:220px;display: block;}
.snoska2 {font-size:12px;}
}
#m1 {left:60px;}
#m2 {left:85px;}
#m3 {left:110px;}
#m4 {left:135px;}
#m5 {left:160px;}
#m6 {left:185px;}
#m7 {left:210px;}
#m8 {left:235px;}
#m9 {left:260px;}
#m10 {left:285px;}
#m11 {left:310px;}
#m12 {left:335px;}

@media (max-width: 599px) {
.monthbar {width:16px;}
#m1 {left:40px;}
#m2 {left:59px;}
#m3 {left:78px;}
#m4 {left:97px;}
#m5 {left:116px;}
#m6 {left:135px;}
#m7 {left:154px;}
#m8 {left:173px;}
#m9 {left:192px;}
#m10 {left:211px;}
#m11 {left:230px;}
#m12 {left:249px;}
 }

/* ===beaches=== */
.beaches-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 16px;max-width: 980px;margin: 0 auto;margin-top:15px;}
.beach-card {border: 1px solid #5BCAFF;border-radius: 10px;padding: 14px;background: #fff;}
.beach-card h4 {margin: 0 0 8px;font-size: 1.1rem;font-weight:600;line-height: 1.3;}
.rating {font-size: 0.9rem;color: #f5a623;margin-left: 6px;white-space: nowrap;}
.betita {background:#D7F2FF;padding:2px 10px 2px 10px;border-radius:10px;}
.beach-meta {display: flex;justify-content: space-between;font-size: 0.85rem;color: #555;margin-bottom: 8px;}
.beach-icons {display: flex;flex-wrap: wrap;gap: 6px;font-size: 1.1rem;}
@media (max-width: 768px) {.beaches-grid {grid-template-columns: 1fr;}}

/* ===weather=== */
.meteo-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 16px;max-width: 980px;margin: 0 auto;margin-top:15px;}
.meteo-card {border: 1px solid #959595;border-radius: 10px;padding: 8px 14px 8px 14px;background:#F2F2F2;}
.meteo-card h4 {margin:0;font-size: 0.98rem;font-weight:600;line-height: 1.1;text-align:center;padding:0 0 0 0;}
.meteo-temp {font-size:2.0rem;font-weight:700;text-align:center;}
.besmall {font-size:1.4rem;font-weight:400;}
.besmall2 {font-size:1.4rem;font-weight:400;}
.meteo-txt {font-size:1.0rem;font-weight:600;text-align:center;line-height: 1.1;text-decoration: underline;}
.meteo-ads {font-size:0.9rem;font-weight:400;text-align:center;padding-top:6px;}
@media (max-width: 768px) {.meteo-grid {grid-template-columns: 1fr;}}

/* ===neighb=== */
.about-title {font-size:1.3rem;font-weight:400;}
.icon-color {width: 24px;height: 24px;vertical-align: middle;display:inline-block;}
.block-info {margin:15px 0 10px 0;max-width:840px;}
.about-title2 {padding:15px 0 6px 0;font-size:1.3rem;font-weight:600;}
.sosedi-inner {background: #fff;padding: 1.5rem 15px;max-width:840px;}

/* ===time== */
.block-time {padding:0;margin:0 20px 0 0;}
.about-title3 {padding:5px 0 16px 0;font-size:1.3rem;font-weight:600;}
.time-set {display: flex;justify-content: space-between;text-align:left;padding: 6px 0;font-size: 14px;border-bottom: 1px solid #dde2ea;margin-right:20px;width:100%;}
@media (min-width: 768px) {
.time-set {width: 33.333%;float: left;padding-right: 16px;box-sizing: border-box;max-width:260px;}}
@media (min-width: 768px) {.time-set:nth-child(3n+1) {clear: left;}}
.time-right {font-weight: 600;white-space: nowrap;background:#B0FFD8;border-radius:4px;padding:3px 10px 3px 10px;}

/* ===month== */
.nophoto-hero {width:980px;padding: 18px 0 0 0;margin: 0 0 0 0;}
h1.location-title2 {font-size:42px;padding:0 250px 0 0;line-height: 1.2;}
#climate-summary {font-size:17px;font-weight:600;padding:15px 230px 10px 5px;}
@media (max-width: 420px){
.nophoto-hero {width:100%;padding: 0 0 0 0;}
h1.location-title2 {font-size:28px;padding:0 0 0 0;}
#climate-summary {padding:15px 0 10px 0;font-size:15px;}
}
.month-list{list-style: none;margin: 20px 0 10px 0;padding: 0;display: flex;flex-wrap: wrap; gap: 10px; }
.month-list > li {border: 1px solid #ccc;padding: 6px 8px;border-radius: 6px;display: inline-flex;align-items: center;white-space: nowrap; }
.month-list > li > a {display: block; text-decoration: none;color: #333;white-space: nowrap;}
.month-list > li:hover {background-color: #f0f6ff;border-color: #4a7cff;}
.month-list > li:hover > a {color: #1f4fd8;}

h4.loca-country {font-weight:600;font-size:20px;padding:20px 0 10px 0;}
.loca-oblast {font-weight:400;}


#livesearch {clear:both;width:90%;max-width:520px;margin:0 0 0 14px;}

#livesearch p {font-size:16px;line-height:24px;font-weight:400;border-bottom:#CDCDCD 1px solid;border-left:#0080C0 8px solid;padding:5px 0 5px 7px;margin:0;background:#E1F5FF;}
#livesearch a:link {TEXT-DECORATION: none;color:#006595;}
#livesearch a:visited {TEXT-DECORATION: none;color:#006595;}
#livesearch a:hover {TEXT-DECORATION: none;color:#FF0000;}
#livesearch span {font-size:13px;background:#1CB5FF;padding:2px 4px 2px 4px;border-radius:7px;color:#fff;}

h1{ hyphens:auto; overflow-wrap:normal; }
@media (max-width: 480px){
  h1{ overflow-wrap:anywhere; word-break:break-word; }
}