
body {
    font: 16px Arial, Helvetica, sans-serif;
    background-color: lightsteelblue;
}

.page-container {
    background: azure;
    margin-left: 300px;
    margin-right: 300px;
    flex-direction: row;
    padding: 20px;
    width: auto;
}

.daily {
    margin-top: 20px;
}

.current-container {
    text-align: center;
}

#city, .current-temp {
    font-size: 36px;
}

.current-feels, .daily-container {
    margin: 20px;
    font-weight: bold;
    text-align: center;
    color: midnightblue;
}

/*.union {
    display: flex;
}*/
table {
    border-spacing: 10px;
    min-width: 400px;
}
#dt, th {
    color: mediumslateblue;
}

td {
    padding: 5px;
}

/*-------поиск---------------------------
.search_c {
    float:right;
}
.search_c input {
    vertical-align:middle;
}
.search_field {
    font:11px Verdana,Arial,Helvetica,sans-serif;
    color:#4684a8; text-shadow: 1px 1px 1px #fff;
    height:16px;
    margin:0;
    padding:4px;
    background:#eff3f7;
    border: 1px solid #84ABC2;
    border-right: none;
}
.search_field:focus {
    background:#fff;
}
.search_button {
    font:11px Verdana,Arial,Helvetica,sans-serif;
    color:#4684a8; text-shadow: 1px 1px 1px #fff;
    height:26px;
    margin:0;
    padding:0 7px;
    background:#AFD5EB;
    border:1px solid #84ABC2;
}
.search_button:hover {
    background:#88b9d6;
}*/

/*-----------всплывающая подсказка-----------------
/*[data-tooltip] {
    position: relative; /* Относительное позиционирование */
/*}
[data-tooltip]::after {
    content: attr(data-tooltip); /* Выводим текст
    position: absolute; /* Абсолютное позиционирование
    width: 300px; /* Ширина подсказки
    left: 0; top: 0; /* Положение подсказки
    background: #3989c9; /* Синий цвет фона
    color: #fff; /* Цвет текста
    padding: 0.5em; /* Поля вокруг текста
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); /* Параметры тени
    pointer-events: none; /* Подсказка
    opacity: 0; /* Подсказка невидима
    transition: 1s; /* Время появления подсказки */
/*}
[data-tooltip]:hover::after {
    opacity: 1; /* Показываем подсказку */
.daily-container {

}
.temp-table th{
    text-align: left;
}
/*.temp-table {
    width: 70%;
}*/
.daily-values tr {
    text-align: left;
}

hr{
    border: 2px solid mediumslateblue;
}

