@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,300;0,400;0,900;1,200&display=swap');

@font-face {
    font-family: "Kibanka";
    src:
        url("fonts/Kibanka-Regular.woff") format("woff"),
        url("fonts/Kibanka-Regular.otf") format("opentype"),
        url("fonts/Kibanka-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

body {
    background-color: rgb(0, 42, 54);
    color: white;
    font-family: 'Inter Tight', sans-serif;
    margin: 0;
    padding: 5em 1em;
    overflow-x: hidden;
}
input, select {
    font-family: 'Inter Tight', sans-serif;
}
#persondiv {
    text-align: center;
    font-weight: 900;
    letter-spacing: .2em;
}
#logo {
    display: block;
    width: 10em;
    margin: 0 auto;
}
h1, h3 {
    color: rgb(244, 168, 18);
    font-family: 'Kibanka', sans-serif;
}
h2 {
    text-align: center;
}
h2 {
    font-weight: 300;
}
h3 {
    font-weight: 120;
}
.award {
    padding: 1em 3em;
    margin: 9em auto;
    position: relative;
    max-width: 800px;
}
.awrect-topleft, .awrect-botright {
    fill: rgba(244, 168, 18, 1);
}
.awrect-topleft {
    position: absolute;
    top: 0;
    left: 0;
}
.awrect-botright {
    position: absolute;
    bottom: 0;
    right: 0;
}
.award h3 {
    text-align: center;
}
.award label {
    display: block;
    margin: 2.4em auto 1em auto;
    max-width: 340px;
}
.select2-container {
    display: block !important;
    width: 100% !important;
    max-width: 340px !important;
    background-color: transparent !important;
    border: none !important;
    border-bottom: .21em solid rgb(255, 255, 255) !important;
    margin: 0 auto 0 auto !important;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: rgba(244, 168, 18, 1) !important;
    color: rgb(0, 42, 54) !important;
}
.award input:active, .award input:focus {
    outline: none;
    border-bottom: .21em solid rgba(244, 168, 18, 1);
}
.select2-container {
    color: rgb(0, 42, 54);
}




.check-vote-parent {
    display: flex;
    margin-top: 1em;
    height: 1.2em;
    width: 100%;
    align-items: center;
    justify-content: center;
}
.check-vote {
    display: none;
    height: 1.2em;
    width: 1.2em;
    background-size: contain;
}
.check-vote.vote-en-cours {
    display: block;
    animation: rotationInfinie 3.12s linear infinite;
    background: url("vote_en_cours.svg") no-repeat;
}
.check-vote.a-vote {
    display: block;
    animation: none;
    background: url("a_vote.svg") no-repeat;
}
.check-vote-parent p {
    color: transparent;
    display: block;
    margin-left: 1.2em;
}
.check-vote-parent p.a-vote {
    color: rgb(246, 163, 10);
}

@keyframes apparition {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes rotationInfinie {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}


#socialbar {
    display: flex;
    justify-content: center;
    margin-top: 3em;
}
#insta-button #insta-form {
    fill: rgba(246, 163, 10, 1);
}
#insta-button #insta-bkg {
    fill: rgba(246, 163, 10, 0);
}
#insta-button:hover #insta-form {
    fill: rgba(37, 37, 37, 1);
}
#insta-button:hover #insta-bkg {
    fill: rgba(246, 163, 10, 1);
}

.buttonbutton {
    display: block;
    max-width: 28em;
    text-decoration: none;
    margin: 0 auto;
    padding: 1.3em 2.2em;
    background-color: rgba(244, 168, 18, 1);
    color: rgb(0, 42, 54);
    border: none;
    border-radius: .1em;
    font-size: .8em;
    font-weight: 900;
    letter-spacing: .2em;
    cursor: pointer;
    transition: .3s;
}