﻿body {
    padding: 0;
}

#languageSelected:focus, #languageSelected:active {
    outline: none !important;
    box-shadow: none;
}

body, .form-control, input {
    font-size: 0.9rem !important;
}

.container {
    display: flex;
    flex-direction: column;
}

.container_content {
    overflow-y: auto;
    height: calc(100vh - 160px);
}

#logomax {
    content: var(--logomax);
    width: 360px;
}

#logo3 {
    content: var(--logo3);
    width: 80px;
}

/* Lien */
a {
    color: #CCC !important;
}

a.dropdown-item {
    color: black !important;
}

a:hover {
    text-decoration: none !important;
}

/* Couleur autour de l'input quand il est séléctionné */
.form-control:focus {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 0.2rem var(--primary-color) !important;
}

.sendButton {
    background-color: var(--primary-color);
    color: var(--white-color) !important;
    width: fit-content
}

.sendButton:not([disabled]):hover {
    background-color: var(--secondary-color) !important;
}

.choixRole:hover {
    cursor: pointer;
}

/* Image de fond */
.backgroundImage {
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-image: var(--bg-fixe-account-url);
    display: var(--bg-fixe-account-display);
}

/* https://wweb.dev/resources/animated-css-background-generator/ */
/*************************************/
/*            Fond animé               */
/*************************************/
@keyframes animate {
    0% {
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        /*        border-radius: 0;*/
    }

    100% {
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        /*        border-radius: 50%;*/
    }
}

/*loader css*/
.loader-ajax {
    display: none;
}

.background {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    background: var(--background);
    overflow: hidden;
    display: var(--bg-dynamic-account-display);
}

.background li {
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background: var(--elementRGBA);
    animation: animate 15s linear infinite;
}

.background li:nth-child(0) {
    left: 33%;
    width: 117px;
    height: 117px;
    bottom: -117px;
    animation-delay: 1s;
}

.background li:nth-child(1) {
    left: 44%;
    width: 111px;
    height: 111px;
    bottom: -111px;
    animation-delay: 3s;
}

.background li:nth-child(2) {
    left: 52%;
    width: 127px;
    height: 127px;
    bottom: -127px;
    animation-delay: 8s;
}

.background li:nth-child(3) {
    left: 40%;
    width: 188px;
    height: 188px;
    bottom: -188px;
    animation-delay: 10s;
}

.background li:nth-child(4) {
    left: 7%;
    width: 186px;
    height: 186px;
    bottom: -186px;
    animation-delay: 20s;
}

.background li:nth-child(5) {
    left: 54%;
    width: 141px;
    height: 141px;
    bottom: -141px;
    animation-delay: 18s;
}

.background li:nth-child(6) {
    left: 73%;
    width: 157px;
    height: 157px;
    bottom: -157px;
    animation-delay: 24s;
}

.background li:nth-child(7) {
    left: 60%;
    width: 103px;
    height: 103px;
    bottom: -103px;
    animation-delay: 20s;
}

.background li:nth-child(8) {
    left: 26%;
    width: 135px;
    height: 135px;
    bottom: -135px;
    animation-delay: 17s;
}

.background li:nth-child(9) {
    left: 54%;
    width: 199px;
    height: 199px;
    bottom: -199px;
    animation-delay: 28s;
}
