#simulateur
{
    background-color: #f3f7fe;
    text-align: center;
    border-radius: 20px 20px 20px 20px;
}

#top-simu-header
{
    background-color: #1c60cb;
    color: #ffffff;
    border-radius: 10px 10px 0px 0px;
}


.visibility-hidden
{
    visibility: hidden;
}

.masquer
{
    display: none;
}

.simu-btn-custom
{
    color: #071b6a;
    width: 150px;
    transition: transform .2s;
}

.simu-btn-custom:hover
{
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 15px rgb(95 95 95 / 80%);
    transform: scale(1.05);
}

.simu-label-question
{
    color: #1c60cb;
    font-weight: bold;
    font-size: 26px!important;
    margin-bottom: 1.5rem;
}

@media (max-width: 768px) {
    .simu-label-question
    {
        color: #1c60cb;
        font-weight: bold;
        font-size: 16px!important;
        margin-bottom: 1.5rem;
    }
}



.progress {
    border-radius: 0px 0px 0px 0px!important;
}

.bloctel
{
    font-size: 9px;
    text-align: justify;
    display: block;
    min-height: 1.5rem;
}

.rgpd
{
    font-size: 12px;
    text-align: center;
}
.text-simu-wantcall
{
    font-size: 12px;
    text-align: justify;
}

.simu-label-infos
{
    font-size: 15px;
    color: #000000;
}

#simulateur .form-control
{
    border: 1px solid #ff9900!important;
}

.customPlacementIcon
{
    position: absolute;
    right: 10px;
}

.valideColorIcon
{
    color: #53e6b3;
}

.invalideColorIcon {
    color: #f47768;
}

.erreurChamp
{
    border: 1px solid red;
    color: red;
    font-size: 13px;
    padding: 3px;
    display: block;
    margin-top: 5px;
}

#simulateur .btn-primary:hover
{
    color: white!important;
}

#simulateur .btn-validation
{
    background-color: #FF9900!important;
    border-color: #be975c!important;
}

#simulateur .btn-validation:hover
{
    border-color: #be975c!important;
    background-color: #e28700 !important;

}


#simulateur .form-floating>label
{
    color: #b9b9b9!important;
}

#simulateur .form-control {

    font-weight: bold!important;
}

.popover-header {
    background-color: #ff9900;
    color: white;
}

.resultat-simulation
{
    width: 100px;
}

a:link.customLinkRGPD,a:visited.customLinkRGPD,a:visited.customLinkRGPD {
    color: #616161!important;
    font-weight: bold;
    text-decoration: none;
}

a:hover.customLinkRGPD {
    color: black!important;
    font-weight: bold!important;
}

.animationCta {


    -webkit-animation-name: customAnimationSimu; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 3s; /* Chrome, Safari, Opera */
    animation-name: customAnimationSimu;
    animation-duration: 3s;
}



.smallAlertMsg {
    text-align: center;
    margin-top: 5px;
    margin-bottom: 5px;
    font-size: 17px;
    color: #ffffff;
    font-weight: bold;
    background-color: #f47768;
}


/* Chrome, Safari, Opera */
@-webkit-keyframes customAnimationSimu {
    0%   {outline:2px solid #1c60cb;}
    10%  {outline:2px solid #ff4e4a;}
    20%   {outline:2px solid #1c60cb;}
    30%  {outline:2px solid #ff4e4a;}
    40%   {outline:2px solid #1c60cb;}
    50%  {outline:2px solid #ff4e4a;}
    60%   {outline:2px solid #1c60cb;}
    70%  {outline:2px solid #ff4e4a;}
    80%   {outline:2px solid #1c60cb;}
    90%  {outline:2px solid #ff4e4a;}
    100%   {outline:2px solid #1c60cb;}
}

/* Standard syntax */
@keyframes customAnimationSimu {
    0%   {outline:2px solid #1c60cb;}
    10%  {outline:2px solid #ff4e4a;}
    20%   {outline:2px solid #1c60cb;}
    30%  {outline:2px solid #ff4e4a;}
    40%   {outline:2px solid #1c60cb;}
    50%  {outline:2px solid #ff4e4a;}
    60%   {outline:2px solid #1c60cb;}
    70%  {outline:2px solid #ff4e4a;}
    80%   {outline:2px solid #1c60cb;}
    90%  {outline:2px solid #ff4e4a;}
    100%   {outline:2px solid #1c60cb;}
}