body {
    margin: 0px;
    background-color: $COLOR_FULL_BACKGROUND$;
}

.bold {
    font-weight: bold;
}#top {
    margin: 0px;
    padding: 0px;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-evenly;
}

.headerTitle {
    width: 25%;
    min-width: 300px;
}

.headerTitle p {    
    font-family: 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 36px;
    font-weight: bold;

    color: $COLOR_TEXT$;
    text-shadow: $COLOR_TEXT$ 0 0 4px;
    text-align: center;

    margin: 10px;
    margin-top: 5px;
}

.headerNavigation {
    width: 75%;
    min-width: 500px;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.headerNavigationElement {
    font-family: 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 24px;
    font-weight: bold;
    
    text-align: center;
}

.headerNavigationElement a {
    color: $COLOR_TEXT$;
    text-decoration: none;
}

.headerNavigationElement a:hover {
    color: $COLOR_TEXT$;
    text-shadow: $COLOR_TEXT$ 0 0 15px;
    text-decoration: underline;
}h1 {
    font-family: 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 36px;
    font-weight: bold;
    
    text-align: center;
}

#mainDiv {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

fieldset {
    width: 400px;
    
    background-color: rgb(160, 160, 160);
    border : 3px solid black;
}

legend {
    background-color: rgb(160, 160, 160);
    border: 3px solid black;
    
    font-family: 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 20px;
    font-weight: bold;
}

label, #labelCouleurs {
    font-family: 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
}

input {
    background-color: white;
    font-family: 'Segoe UI', Roboto, Arial, sans-serif;
    font-weight: bold;
}

#labelCouleurs { margin-top: 10px; margin-bottom: 3px; }

button {
    width: 100px;
    height: 35px;
    
    font-family: 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
    
    border: 2px solid black;
    background-color: rgb(192, 192, 192);
}

#boutonGeneration {
    margin-left: 66px;
}

#boutonReset {
    margin-left: 66px;
}

button:hover {
    border: 2px solid rgb(192, 192, 192);
    background-color: rgb(128, 128, 128);
}

button:active {
    border: 2px solid rgb(210, 210, 210);
    background-color: rgb(140, 140, 140);
}

#precisionsVariables {
    font-family: 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
}

#positionXY {
    font-family: 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
    text-align: right;
    margin-bottom: 3px;
}