*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;

}
body{

    display:flex;
    flex-direction:column;
    min-height:100vh;
    background-color: rgb(16, 29, 50);

}




.search-menu {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 20px;
    margin: 10px;
}
.search-input {
    border: 2px solid rgb(56, 70, 90);
    border-radius: 5px;
    padding: 10px;
    margin: 5px;
    background-color: rgb(25, 39, 60);
    width: 30%;
    color: white;
    box-shadow:0 5px 15px rgba(0,0,0,.2);
    padding: 10px;
}

.search-btn {
    background-color: rgb(21, 148, 231);
    color: white;
    border: 2px solid rgb(21, 148, 231) ;
    border-radius: 5px;
    padding: 10px;
    transition: 0.3s ease;

}

.search-btn:hover {
    cursor: pointer;
    transform:translateY(-2px);
    background:#2d4d77;
    border: 2px solid #2d4d77;
}

.block {
    color: white;
    padding: 10px;
    margin: 5px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.container {
    max-width: 550px;
    margin: 30px auto;
    padding: 25px;
    border-radius: 16px;
    background: rgb(18,34,62);
    border: 1px solid rgb(36,52,76);
    color: rgb(193, 210, 225);;
    transition:.3s;
}

.container:hover{
    transform:translateY(-3px);
}
.temp {
    font-size: 64px;
    font-weight: bold;
}
.data-menu {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 10px;
    margin-top: 30px;
    
}



.icon-block {
    color: rgb(193, 210, 225);
    padding: 20px;
    margin: 10px;
    border: 2px solid rgb(31, 45, 66);
    border-radius: 10px;
    background-color: rgb(25, 40, 60);
    width: 20%;

}

.history-container{

    display:flex;
    flex-wrap:wrap;
    gap:12px;
    justify-content: center;
    border: 2px solid rgb(31, 45, 66);
    border-radius: 10px;

    padding:20px;
    margin-top: 100px;
    color: rgb(193, 210, 225);
    text-align: center;

}
.history-block {
    border:  2px solid rgb(26, 43, 63);
    border-radius: 10px;
    padding:12px 18px;
    height:auto;
    min-width:100px;
    display:flex;
    justify-content:center;
    align-items:center;
    color: white;
    background-color: rgb(27, 42, 63);
    color: rgb(193, 210, 225);
    transition: 0.3s ease;
}
.history-block:hover{

    transform:translateY(-2px);
    background:#2d4d77;

}

.footer-menu {

    border-top: 2px solid rgb(56, 70, 90);
    color: white;
    width: 100%;
    text-align: center;
    padding: 20px;
    margin: 5px;
    margin-top:auto;
}