@charset "UTF-8";


     body {
        margin: 0;
        padding: 0;
        background-color: #fdf6e3;
        color: #2b2b2b;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 16px;
        line-height: 1.5;
    }
    .header {
        background-color: #2a6f97;
        color: #ffffff;
        padding: 20px 15px;
        text-align: center;
    }
    .header h1 {
        margin: 0;
        font-size: 28px;
    }
    .nav {
        background-color: #61a0af;
        padding: 10px;
        text-align: center;
    }
    .nav a {
        display: inline-block;
        margin: 5px 8px;
        padding: 10px 16px;
        background-color: #ffffff;
        color: #2a6f97;
        text-decoration: none;
        font-weight: bold;
        border: 2px solid #2a6f97;
        border-radius: 6px;
    }
    .nav a:hover,
    .nav a:active {
        background-color: #ffb703;
        border-color: #ffb703;
        color: #ffffff;
    }
    .content {
        max-width: 700px;
        margin: 0 auto;
        padding: 25px 20px;
        background-color: #ffffff;
    }
    .content h2 {
        color: #2a6f97;
    }
    .viesti-ok {
        background-color: #d4edda;
        border: 2px solid #28a745;
        color: #155724;
        padding: 12px;
        border-radius: 6px;
        margin-bottom: 20px;
    }
    .viesti-virhe {
        background-color: #f8d7da;
        border: 2px solid #dc3545;
        color: #721c24;
        padding: 12px;
        border-radius: 6px;
        margin-bottom: 20px;
    }
    .lomake p {
        margin: 14px 0;
    }
    .lomake label {
        display: block;
        font-weight: bold;
        margin-bottom: 4px;
        color: #2a6f97;
    }
    .lomake input[type="text"],
    .lomake input[type="email"],
    .lomake textarea {
        width: 100%;
        max-width: 500px;
        padding: 8px;
        border: 2px solid #61a0af;
        border-radius: 4px;
        font-size: 16px;
        font-family: inherit;
        box-sizing: border-box;
    }
    .lomake textarea {
        height: 130px;
    }
    .captcha-box {
        background-color: #fff3cd;
        border: 2px solid #ffb703;
        border-radius: 6px;
        padding: 10px 14px;
        display: inline-block;
    }
    .lomake input[type="submit"] {
        background-color: #ffb703;
        color: #6b4c00;
        border: 2px solid #e08e00;
        padding: 10px 22px;
        font-size: 16px;
        font-weight: bold;
        border-radius: 6px;
        cursor: pointer;
    }
    .lomake input[type="submit"]:hover {
        background-color: #e08e00;
        color: #ffffff;
    }
    /* Hunajapurkkikenttä piilotetaan näkyvältä käyttäjältä, mutta se
       säilyy DOM:ssa, joten yksinkertaiset botit saattavat täyttää sen. */
    .piilo-kentta {
        position: absolute;
        left: -9999px;
        top: -9999px;
    }
    .footer {
        background-color: #2a6f97;
        color: #ffffff;
        text-align: center;
        padding: 15px;
        font-size: 13px;
    }

.tausta-sininen {
    background-color: #e0f2fe;
}


.tausta-vihr {
    background-color: #E4FEE0;
}


.varoitus {
    background-color: #FFFDA2;
       padding: 5px;
   border: 3px #ff0000 solid;
    
    animation: blink 1s;
    animation-iteration-count: 3;
      
      
}