.signup_transition{
    position: relative;
    width: 100%;
    height: 60px; 
    background: linear-gradient( #070C13 , #0c2e79  );
 
}

#data_view_signup{
    position: relative;
    background: linear-gradient(to bottom, #0c2e79 30%, #0f3c9e 80%);
    width: 100%;
    height: 500px;
}

#data_view_signup .radial_gradient1{
    position: absolute;
    width:400px;
    height:400px;
    top:5px;
    right:25px;
    border: 0px;
    border-radius: 50%; 
    background: radial-gradient(closest-side, #2668f8 ,#0c2e79);
    box-shadow: 0px 0px 40px 40px #0c2e79;
}

#data_view_signup .radial_gradient2{
    position: absolute;
    width:150px;
    height: 150px;
    top:300px;
    left:45%;
    border: 0px;
    border-radius: 50%; 
    background: radial-gradient(closest-side, #2668f8 ,#0c2e79);
    box-shadow: 0px 0px 40px 40px #0c2e79;
}

#data_view_signup .radial_gradient3{
    position: absolute;
    width:310px;
    height: 310px;
    top:80px;
    left:25px;
    border: 0px;
    border-radius: 50%; 
    background: radial-gradient(closest-side, #2668f8 ,#0c2e79);
    box-shadow: 0px 0px 30px 30px #0c2e79;
}

#tp_formulaire_signeup {
    position: relative;
    max-width: 450px;
    height: 400px;
    /*background-image: url("../images/galerie/accueil/opacity_50.png");*/
    /* background-color:rgb(235, 235, 235); */
    background-position:center ;
    background-size: 100%;
    margin: 0px auto 10px auto;
    padding: 20px 25px 0px 25px;
    border-radius: 6px;

}

#tp_formulaire_signeup h2{
    text-align: center;
    padding-bottom:10px;
}

#tp_formulaire_signeup h2,
#tp_formulaire_signeup label,
#tp_formulaire_signeup h3,
#tp_formulaire_signeup h4,
#tp_formulaire_signeup h5 {   
    color:#6a66ff;
}

#tp_formulaire_signeup .form-group {
    position: relative;
    text-align: left;
    margin:20px 0px 20px 0px;
    max-width: 420px;
}

#tp_formulaire_signeup .form-control {
    padding: 3px 8px!important;
    height: 30px;
    border-radius: 25px;
}


#tp_formulaire_signeup span{
    color: #ff0000;
}

#tp_formulaire_signeup textarea{
    width:95%;
    min-height:150px;
    resize:both
}

#tp_formulaire_signeup h3,
#tp_formulaire_signeup h4,
#tp_formulaire_signeup h5{
    text-align: left;
}

#tp_formulaire_signeup h4{
text-align: center;
font-size: 23px;
font-weight: 500;
margin-top: 10px;
margin-bottom: 10px;
text-align: center;
text-decoration: none;
font-family: "https://fonts.google.com/specimen/Montserrat";
color: #fbfbfb;
}

#formulaire_signeup_msg{
    color:#fbfbfb;
    text-align:left;
    width:100%;
    min-height:40px; 
    padding-top:3px;
    padding-left:15px;
    border-radius:6px;  
    margin-bottom: 8px;
}

#formulaire_signeup_msg h4{
    text-align: left;
}

#formulaire_signeup_confirm_msg h4{
    display: block;
    margin-top: 5px!important;

}

#tp_formulaire_signeup > input{
    display: block;
    border:none;
    font-size: 15px;
    transition: 0.4s ease-out;
}

#tp_formulaire_signeup .form-group > label{
    position: absolute;
    top:-10px;
    left: left;
    transform:translateY(-50%);
    color:#ffffff;
    font-size: 15px;
    transition:0.4s ease-out;
    font-family: "https://fonts.google.com/specimen/Montserrat";

}

#tp_formulaire_signeup .form-group
{
    margin:30px 0px 0px 0px;
}

#tp_formulaire_signeup .form-group p{
    color: #fbfbfb;
    font-family: "https://fonts.google.com/specimen/Montserrat";
    font-size: 16px;
    line-height: 1.42857143;
    margin: 0px 0px;
    text-align: right;
}

#tp_formulaire_signeup .form-group:focus-within > label,
#tp_formulaire_signeup .form-group.animationJs > label {
    /*transform:translateY(-100%);*/
    color:#2d95f7;
}

#tp_formulaire_signeup .form-group:focus-within > input,
#tp_formulaire_signeup .form-group.animationJs > input,
#tp_formulaire_signeup .form-group:focus-within > textarea,
#tp_formulaire_signeup .form-group.animationJs > textarea,
#tp_formulaire_signeup .form-group:focus-within > select,
#tp_formulaire_signeup .form-group.animationJs > select
{
    border-bottom: 2px solid #2d95f7;
}

#tp_formulaire_signeup .form-group.animationJs > label
{
    color:#0062a1;
}
.btn_validation{
    width: 120px;
    height: 30px;
    border-radius: 25px 25px 25px 25px;
    background-color: #2d95f7!important;
    margin-top: 20px;
    
}

.btn-primary:hover{
    background-color: #00aeff;
}

#loading_signup {
    position: absolute;
    display: none;
    z-index: 1;
    text-align: center;
    background-color: #1f1f1f;
    opacity: 0.7;
    width: 100%;
    height: 100%;
}

#loading_signup img{
margin:160px auto 0px auto;
color: #ffffff;
}

 #loading_signup p{
    color: #ffffff;
    }

@media(max-width: 767px){

}