/* ===============================
   Farbpalette
================================ */

:root{
    --primary: #2A7499;
    --secondary: #2A3E99;
    --accent: #3CBA9D;

    --background: #F7F9FC;
    --text: #1E293b;
    --white: #FFFFFF;
}

/* ===============================
   Allgemein
================================ */
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    
    font-family: "Segoe UI", Arial, sans-serif;
    background:var(--background);
    color:var(--text);
    
}

/* ===============================
    Gültig für alle Steuerelemente
*/

/*Text*/
.fullText {
    grid-column: 1 / -1;
    text-align: center;
    color:var(--secondary);
    background-color: var(--background);
    font-size:1.6rem;
}

.singleText {
    color:var(--secondary);
    justify-self: center;   
    background-color: var(--background);
    font-size:1.5rem;
}

.smallText {
    color:var(--text);
    justify-self: center; 
    text-align: center;  
    background-color: var(--background);
    font-size:1.1rem;
}


/*Buttons*/
button{

    color: var(--background);
    background-color: var(--primary);
    justify-self: center;
    border-radius: 25px;
    height: 60px;
    width: clamp(80px, 50vw, 350px);
    font-size: 1.3rem;
    cursor: pointer;
    transition:.25s;

}

button:hover{

    color: var(--text);
    background-color: var(--accent);
    
}

/*Listen / Aufzählungen*/
.list
{

    margin: 0 auto;             

    font-size: 26px;

}


/*allgemeine Hyperlinks*/
a {
    color: var(--accent);
}