.toursearch {
    width: 100%;
    padding: 70px 50px;
}
/*
.toursearch input,
.toursearch select {
    background-color: white;
    font-size: small;
    color: black;
    width: 15%;
    border: 1px solid black;
    outline: none;
    border-radius: 5px;
    padding: 10px 15px;
}

.toursearch #search {
    background-color: #00264b;
    font-size: small;
    color: white;
    width: 10%;
    border: 1px solid #00264b;
    outline: none;
    border-radius: 5px;
    padding: 10px 15px;
}

.toursearch input#search:hover,
.toursearch input#search:active {
    background-color: #ff0000;
}
*/
.tourhead {
    width: 100%;
    padding: 10px 100px;
}

.tourdis {
    width: 100%;
    padding: 200px 50px 200px 50px;
    display: flex;
    flex-direction: column;
    border-radius: 15px;
    justify-content: center;
    background: url('../IMG/pietro.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border: 2px solid #00264b;
    color: white;
    background-color: rgb(0, 0, 0, 0.6);
    background-blend-mode: overlay;
}

.tourdis h1 {
    font-size: 30px;
    margin-bottom: 20px;
}

.tourdis p {
    font-size: medium;
}

.cann {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    gap: 15px;
    margin-top: -150px;
}

.cans {
    width: 20%;
    display: flex;
    border: 2px solid #00264b;
    flex-direction: column;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    background-color: #00264b;
    border-radius: 10px;
}

.cans img {
    width: 100%;
    height: 150px;
    border-radius: 10px 10px 0 0;
}

.cans .can {
    width: 100%;
    height: 80px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.can h4 {
    color: white;
}

.can p {
    font-size: small;
    color: #ff0000;
}

.cans:hover .canp {
    color: #00264b;
}

.cans:hover {
    background-color: #ff0000;
    border-color: #ff0000;
}

.cans:hover .tourdis {
    border: 2px solid #ff0000;
}


@media (max-width:800px) {
    .toursearch {
        width: 100%;
        padding: 70px 20px;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
    /*
    .toursearch input,
    .toursearch select {
        background-color: white;
        font-size: small;
        color: black;
        width: 15%;
        border: 1px solid black;
        outline: none;
        border-radius: 5px;
        padding: 10px 15px;
    }
    
    .toursearch #search {
        background-color: #00264b;
        font-size: small;
        color: white;
        width: 10%;
        border: 1px solid #00264b;
        outline: none;
        border-radius: 5px;
        padding: 10px 15px;
    }
    
    .toursearch input#search:hover,
    .toursearch input#search:active {
        background-color: #ff0000;
    }
    */
    .tourhead {
        width: 100%;
        padding: 10px 0px;
    }
    
    .tourdis {
        width: 100%;
        padding: 100px 20px 100px 20px;
        display: flex;
        flex-direction: column;
        border-radius: 15px;
        justify-content: center;
        background: url('../IMG/pietro.jpg');
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 2px solid #00264b;
        color: white;
        background-color: rgb(0, 0, 0, 0.6);
        background-blend-mode: overlay;
    }
    
    .tourdis h1 {
        font-size: 30px;
        margin-bottom: 20px;
        text-align: center;
    }
    
    .tourdis p {
        font-size: medium;
        text-align: center;
    }
    
    .cann {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-evenly;
        align-items: center;
        gap: 15px;
        margin-top: -150px;
    }
    
    .cans {
        width: 20%;
        display: flex;
        border: 2px solid #00264b;
        flex-direction: column;
        cursor: pointer;
        align-items: center;
        justify-content: center;
        background-color: #00264b;
        border-radius: 10px;
    }
    
    .cans img {
        width: 100%;
        height: 100px;
        border-radius: 10px 10px 0 0;
    }
    
    .cans .can {
        width: 100%;
        height: 80px;
        padding: 10px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    
    .can h4 {
        color: white;
    }
    
    .can p {
        font-size: small;
        color: #ff0000;
    }
    
    .cans:hover .canp {
        color: #00264b;
    }
    
    .cans:hover {
        background-color: #ff0000;
        border-color: #ff0000;
    }
    
    .cans:hover .tourdis {
        border: 2px solid #ff0000;
    }
    
}