@import url(https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap);:focus{outline:0}body,html{height:100%;width:100%}body{font-family:Poppins,sans-serif;margin:0;padding:0;background-color:#e5e7eb}#app{display:flex;flex-direction:column;min-height:100vh}.popup-message{font-weight:500;font-size:15px;color:#fff;padding:10px 20px;border-radius:7px;box-shadow:0 3px 8px -1px rgba(0,0,0,.3);position:fixed;top:-40px;right:15px;opacity:0;z-index:3;-webkit-animation-name:popup;animation-name:popup;-webkit-animation-duration:5s;animation-duration:5s}@-webkit-keyframes popup{0%{top:-40px}10%{opacity:.9;top:10px}20%{top:0}90%{opacity:.9;top:0}to{top:-40px}}@keyframes popup{0%{top:-40px}10%{opacity:.9;top:10px}20%{top:0}90%{opacity:.9;top:0}to{top:-40px}}header,header .btn,header .img{display:flex;flex-direction:row;align-items:center}header{background:linear-gradient(90deg,#dc2626,#8c5cf4);padding:15px 150px}header .img{margin-top:8px;flex:1;justify-content:flex-start}header .btn{flex:1;justify-content:flex-end}img{max-width:280px}.btn a{background-color:#2e2963;color:#fff;padding:10px 40px;font-size:17px;border-radius:5px;text-decoration:none;transition:.3s}.btn a:hover{background-color:#3b357e}main{padding:60px 150px 90px 150px}main h1{margin:0;font-size:50px;font-weight:700;color:#2e2963}.columns{display:flex;align-items:baseline;margin-top:30px}.columns .form{position:relative;margin-right:50px;flex:1}.loader{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;opacity:1}.loader div{opacity:0;display:inline-block;margin-right:10px;height:20px;width:20px;border-radius:50%}.loader .dot-1{-webkit-animation:grow 1.1s ease-in-out infinite;animation:grow 1.1s ease-in-out infinite;background:linear-gradient(90deg,#db2729,#b5408b)}.loader .dot-2{-webkit-animation:grow 1.1s ease-in-out .15555s infinite;animation:grow 1.1s ease-in-out .15555s infinite;background:linear-gradient(90deg,#b5408b,#9854d3)}.loader .dot-3{-webkit-animation:grow 1.1s ease-in-out .3s infinite;animation:grow 1.1s ease-in-out .3s infinite;background:linear-gradient(90deg,#9854d3,#8f5aeb)}@-webkit-keyframes grow{0%,to{opacity:1;transform:scale(0)}40%{transform:scale(1)}}@keyframes grow{0%,to{opacity:1;transform:scale(0)}40%{transform:scale(1)}}.time-left{position:absolute;text-align:center;font-size:22px;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;opacity:1}.form-overlay{position:absolute;border-radius:inherit;left:0;top:0;width:100%;height:100%;background-color:#000;opacity:.3;z-index:1}.form p{margin:0;margin-bottom:12px;line-height:1}.columns .infos{flex:0 30%}.infos p{margin:0;margin-top:10px;line-height:2}.partage{position:absolute;margin-top:40px;margin-left:-20px}.partage a{text-decoration:none;font-size:15px;color:#e5e7eb;border-radius:5px;padding:5px 10px 5px 35px;transition:.3s;background-repeat:no-repeat;background-position:left 10px center;background-size:20px}.twitter{margin-right:10px;background-color:#1d9bf0;background-image:url(../img/twitter-logo.1b41a5ae.png)}.facebook{background-color:#1877f2;background-image:url(../img/facebook-logo.ac20b3ab.png)}.twitter:hover{background-color:#0e87d8}.facebook:hover{background-color:#0d65d9}section{padding:20px;border-radius:6px;color:#fff;background:linear-gradient(90deg,#60a5fa,#3b82f6)}section h2{margin:0;margin-bottom:20px;font-size:25px;font-weight:600;line-height:1}input,textarea{font-family:Poppins,sans-serif;border-radius:6px;padding:3px 7px;font-size:15px;color:#2e2963;box-sizing:border-box;width:100%;transition:.15s}.commentaire{opacity:0;position:absolute;top:0;left:0;height:0;width:0;z-index:-1}input::-moz-placeholder,textarea::-moz-placeholder{color:#4f5153}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#4f5153}input::placeholder,textarea::placeholder{color:#4f5153}input:focus,textarea:focus{box-shadow:0 3px 8px -1px rgba(0,0,0,.2)}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin-bottom:15px;border:2px solid #fff;background-color:#fff}input[type=submit]{padding:7px;height:45px;font-size:17px;font-weight:600;border:none;margin-bottom:0;transition:.3s}input[type=submit]:hover{cursor:pointer;font-size:18px;background-color:#e5e7eb;box-shadow:0 3px 8px -1px rgba(0,0,0,.2)}input[type=submit]:active{font-size:16.5px;background-color:#d1d3d8;box-shadow:0 3px 8px -1px rgba(0,0,0,.4);transition:.2s}textarea{resize:none;height:130px;border:2px solid #dbe9fd;background-color:#dbe9fd;margin-bottom:5px}.border{border:2px solid #db3131}.progress-bar{background-color:#dbe9fd;border-radius:3px;height:15px;margin-bottom:40px}.progress-bar .value{min-width:0;max-width:100%;background:linear-gradient(90deg,#db2729,#8f5aeb);border-radius:3px;height:15px}.progress-bar .number{min-width:0;max-width:100%;display:flex;justify-content:center;font-weight:600;margin-top:3px}footer{font-family:Poppins,sans-serif;font-weight:300;font-size:14px;color:#fff;background:linear-gradient(90deg,#dc2626,#8c5cf4);padding:15px 150px;margin-top:auto}table{border-collapse:collapse}.left{text-align:center;opacity:.7}.left img{margin-top:10px}.middle{width:10%}.middle .line{margin:auto;height:50px;width:1px;background-color:#fff}.fade-enter-active,.fade-leave-active{transition:opacity .5s ease}.fade-enter-from,.fade-leave-to{opacity:0}@media screen and (max-width:1240px){main{padding:60px 150px 130px 150px}.columns{flex-direction:column;align-items:normal}.columns .form{margin-right:0;margin-bottom:40px}}@media screen and (max-width:930px){header,header .btn,header .img{flex-direction:column}header .btn,header .img{justify-content:center}header .btn{margin-top:10px}.btn a{padding:10px 20px;font-size:15px}h1{font-size:45px}main{padding:30px 50px 90px 50px}footer{padding:15px 50px}.middle{display:none}.left img{margin-top:15px}table td{text-align:center;width:100%;display:inline-block}}@media screen and (max-width:560px){main h1{font-size:42px}}@media screen and (max-width:480px){header .btn{width:150px}main{padding:30px 30px 75px 30px}main h1{font-size:30px}footer{padding:15px 30px}}@media screen and (max-width:480px){.popup-message{left:15px}}@media screen and (max-width:372px){main{padding:30px 30px 130px 30px}.infos{position:relative}.partage{text-align:center}.partage a{display:inline-block;margin-bottom:10px}.twitter{margin-right:0}}@media screen and (max-width:335px){header{padding:15px}header img{width:100%}footer{padding:15px}footer table{table-layout:fixed;width:100%}.left img{width:100%}}