.form-border {
    border: 2px solid #dfefd3;
    padding: 20px;
    border-radius: 10px;
    background-color: #f9f9f9;
    /* Couleur de fond douce */
  }

  .titregrand {
    color: #4471c4 !important;
    font-size: 40px !important;
    font-weight: bold;
    text-align: center !important;
  }

  .rounded-imagepres {
    width: 200px; 
    height: 200px; 
    border-radius: 30%; 
    object-fit: cover; 
    margin: 10px 0; 
}

.suivant {
    background-color: #4471c4 !important;
    color: #fff !important;
    margin: 10px;
  }
  
  .verify {
    background-color: #4471c4 !important;
    color: #fff !important;
    margin: 10px;
  }
  
  .suivant:hover {
    background-color: #fff !important;
    border-color: #4471c4 !important;
    color: #4471c4 !important;
  }
  .precedant {
    background-color: #989494 !important;
    border-color: #fff !important;
    color: #fff !important;
    margin: 10px;
  }
  
  .precedant:hover {
    background-color: #fff !important;
    color: #989494 !important;
    border-color: #989494 !important;

  }


  #success_tic .page-body{
    max-width:300px;
    background-color:#FFFFFF;
    margin:10% auto;
  }
   #success_tic .page-body .head{
    text-align:center;
  }
  /* #success_tic .tic{
    font-size:186px;
  } */
  #success_tic .close{
        opacity: 1;
      position: absolute;
      right: 0px;
      font-size: 30px;
      padding: 3px 15px;
    margin-bottom: 10px;
  }
  #success_tic .checkmark-circle {
    width: 150px;
    height: 150px;
    position: relative;
    display: inline-block;
    vertical-align: top;
  }
  .checkmark-circle .background {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: #1ab394;
    position: absolute;
  }
  #success_tic .checkmark-circle .checkmark {
    border-radius: 5px;
  }
  #success_tic .checkmark-circle .checkmark.draw:after {
    -webkit-animation-delay: 300ms;
    -moz-animation-delay: 300ms;
    animation-delay: 300ms;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: ease;
    -moz-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-name: checkmark;
    -moz-animation-name: checkmark;
    animation-name: checkmark;
    -webkit-transform: scaleX(-1) rotate(135deg);
    -moz-transform: scaleX(-1) rotate(135deg);
    -ms-transform: scaleX(-1) rotate(135deg);
    -o-transform: scaleX(-1) rotate(135deg);
    transform: scaleX(-1) rotate(135deg);
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }
  #success_tic .checkmark-circle .checkmark:after {
    opacity: 1;
    height: 75px;
    width: 37.5px;
    -webkit-transform-origin: left top;
    -moz-transform-origin: left top;
    -ms-transform-origin: left top;
    -o-transform-origin: left top;
    transform-origin: left top;
    border-right: 15px solid #fff;
    border-top: 15px solid #fff;
    border-radius: 2.5px !important;
    content: '';
    left: 35px;
    top: 80px;
    position: absolute;
  }
  
  @-webkit-keyframes checkmark {
    0% {
      height: 0;
      width: 0;
      opacity: 1;
    }
    20% {
      height: 0;
      width: 37.5px;
      opacity: 1;
    }
    40% {
      height: 75px;
      width: 37.5px;
      opacity: 1;
    }
    100% {
      height: 75px;
      width: 37.5px;
      opacity: 1;
    }
  }
  @-moz-keyframes checkmark {
    0% {
      height: 0;
      width: 0;
      opacity: 1;
    }
    20% {
      height: 0;
      width: 37.5px;
      opacity: 1;
    }
    40% {
      height: 75px;
      width: 37.5px;
      opacity: 1;
    }
    100% {
      height: 75px;
      width: 37.5px;
      opacity: 1;
    }
  }
  @keyframes checkmark {
    0% {
      height: 0;
      width: 0;
      opacity: 1;
    }
    20% {
      height: 0;
      width: 37.5px;
      opacity: 1;
    }
    40% {
      height: 75px;
      width: 37.5px;
      opacity: 1;
    }
    100% {
      height: 75px;
      width: 37.5px;
      opacity: 1;
    }
  }

  .bounceBtn {
		animation: pulse 1s infinite;
	
		-moz-animation: bounce 2s infinite;
		-webkit-animation: bounce 2s infinite;
		animation: bounce 2s infinite;
	}

	@keyframes bounce {
		0%, 20%, 50%, 80%, 100% {
			-moz-transform: translateY(0);
			-ms-transform: translateY(0);
			-webkit-transform: translateY(0);
			transform: translateY(0);
		}
		40% {
			-moz-transform: translateY(-10px);
			-ms-transform: translateY(-10px);
			-webkit-transform: translateY(-10px);
			transform: translateY(-10px);
		}
		60% {
			-moz-transform: translateY(-5px);
			-ms-transform: translateY(-5px);
			-webkit-transform: translateY(-5px);
			transform: translateY(-5px);
		}
	}
  