Gestionnaire de fichiers - Editer - /home/dufoon/mtr/css/main.css
Arrière
/* Start NavBar */ .nav-bar { background: linear-gradient(to right, #FFCC00, #FFCC00, #FFEFB1); width: 100%; padding: 20px 30px; } @media (max-width:872px) { .nav-bar { padding: 20px 15px; } } .nav-bar .content-nav-bar { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%; position: relative; transition: 0.3s; } @media (max-width:872px) { .nav-bar .content-nav-bar { height: 25px; overflow: hidden; } .show-menu { height: 417px !important; } } .nav-bar .content-nav-bar .parent-image-and-links-nav-bar { display: flex; justify-content: space-between; align-items: center; width: 100%; } @media (max-width:872px) { .nav-bar .content-nav-bar .parent-image-and-links-nav-bar { flex-direction: column; justify-content: flex-start; align-items: flex-start; } } .nav-bar .content-nav-bar .parent-image-and-links-nav-bar img { width: 200px; cursor: pointer; } @media (max-width:872px) { .nav-bar .content-nav-bar .parent-image-and-links-nav-bar img { width: 150px; } } .nav-bar .content-nav-bar .parent-image-and-links-nav-bar .links-nav-bar { display: flex; justify-content: center; align-items: center; } @media (max-width:872px) { .nav-bar .content-nav-bar .parent-image-and-links-nav-bar .links-nav-bar { flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%; margin-top: 16px; } } .nav-bar .content-nav-bar .parent-image-and-links-nav-bar .links-nav-bar .link-nav-bar { font-size: 14px; margin-left: 30px; cursor: pointer; transition: 0.3s; font-weight: 400; color: #000; } @media (max-width:872px) { .nav-bar .content-nav-bar .parent-image-and-links-nav-bar .links-nav-bar .link-nav-bar { margin-left: 0px; padding: 10px; width: 100%; } } .nav-bar .content-nav-bar .parent-image-and-links-nav-bar .links-nav-bar .link-nav-bar:hover { color: red; } .nav-bar .content-nav-bar .parent-image-and-links-nav-bar .links-nav-bar .link-nav-bar i { margin-right: 8px; } .nav-bar .content-nav-bar .menu-bar-button { display: none; } @media (max-width:872px) { .nav-bar .content-nav-bar .menu-bar-button { display: block; font-size: 34px; color: #D40511; position: absolute; right: 0px; top: -11px; cursor: pointer; } } .nav-bar .content-nav-bar .links-nav-bar-other { margin-top: 40px; display: flex; justify-content: space-between; align-items: center; width: 100%; } .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-1 { display: flex; justify-content: center; align-items: center; } @media (max-width:872px) { .nav-bar .content-nav-bar .links-nav-bar-other { margin-top: 10px; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%; } .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-1 { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%; border-bottom: 2px solid #D40511; } } .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-1 .link-nav-bar-other { font-size: 13px; font-weight: 700; margin-right: 30px; cursor: pointer; transition: 0.3s; } @media (max-width:872px) { .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-1 .link-nav-bar-other { padding: 10px; margin-right: 0px; width: 100%; display: flex; justify-content: space-between; align-items: center; border-top: 2px solid #D40511; } } .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-1 .link-nav-bar-other:hover { color: red; } .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-1 .link-nav-bar-other i { margin-left: 8px; font-size: 16px; } .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-2 { display: flex; justify-content: center; align-items: center; } @media (max-width:872px) { .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-2 { width: 100%; margin-top: 10px; } } .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-2 .link-nav-bar-other-2 { font-size: 13px; font-weight: 700; cursor: pointer; transition: 0.3s; } @media (max-width:872px) { .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-2 .link-nav-bar-other-2 { margin-right: 0px; width: 100%; padding: 10px; border: 2px solid #D40511; display: flex; justify-content: center; align-items: center; } } .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-2 .link-nav-bar-other-2:hover { color: red; } .nav-bar .content-nav-bar .links-nav-bar-other .links-nav-bar-other-2 .link-nav-bar-other-2 i { margin-right: 8px; font-size: 16px; } /* Start Home */ .home { background: url(../img/background.png) no-repeat center center; width: 100%; height: 420px; position: relative; } .home .content-home { position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); } .home .content-home .title-home { width: 100%; color: #FFF; font-weight: 300; margin: 40px auto; font-size: 50px; text-align: center; } @media (max-width:500px) { .home .content-home .title-home { font-size: 35px; } } .home .content-home .steps-and-title { background: white; padding: 40px; box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); border-radius: 5px; display: flex; justify-content: center; align-items: center; flex-direction: column; } .home .content-home .steps-and-title .title-steps { display: flex; justify-content: center; align-items: center; } .home .content-home .steps-and-title .title-steps img { width: 70px; height: 70px; filter: invert(27%) sepia(0%) saturate(0%) hue-rotate(346deg) brightness(0%) contrast(0%); } .home .content-home .steps-and-title .title-steps h3 { font-size: 30px; color: #2FCC71; font-weight: 700; margin-left: 20px; } @media (max-width:500px) { .home .content-home .steps-and-title .title-steps img { width: 50px; height: 50px; } .home .content-home .steps-and-title .title-steps h3 { font-size: 20px; } } .home .content-home .steps-and-title .steps { width: 100%; display: flex; justify-content: space-between; align-items: center; margin-top: 8px; } .home .content-home .steps-and-title .steps .green-step { width: calc(100% / 3 - 10px); background-color: #2FCC71; height: 5px; } .home .content-home .steps-and-title .steps .red-step { width: calc(100% / 3 - 10px); background-color: #D40511; height: 5px; } .home .content-home .form-and-message { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; } @media (max-width:767px) { .home .content-home .form-and-message { flex-direction: column-reverse; justify-content: center; align-items: center; } } .step-end { background: #FFF; padding: 30px; margin-top: 20px; box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); border-radius: 5px; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; } .step-end form { display: flex; flex-direction: column; justify-content: center; align-items: center; } .step-end form h2 { color: #008000; margin-bottom: 20px; } .step-end form p { color: #212529; font-size: 16px; text-align: center; } .step-end form .button-send-data { background: #D40511; color: #FFF; padding: 6px 25px; font-weight: 600; transition: 0.3s; width: 100%; border: 1px solid #D40511; border-radius: 5px; cursor: pointer; height: 40px; display: flex; justify-content: center; align-items: center; margin-top: 20px; } .step-end form .button-send-data:hover { background-color: #FFF; color: #D40511; } .home .content-home .form-and-message form { background: #FFF; padding: 30px; margin-top: 20px; box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); border-radius: 5px; width: 60%; } @media (max-width:767px) { .home .content-home .form-and-message form { width: 100%; padding: 10px !important; } } .home .content-home .form-and-message form .title-form-1 { margin-bottom: 10px; font-size: 20px; color: #000000cc; } .message-mss { line-height: 1.5; font-size: 14px; margin-bottom: 10px; } .home .content-home .form-and-message form .container-inputs { display: flex; justify-content: space-between; align-items: center; width: 100%; } @media (max-width:767px) { .home .content-home .form-and-message form .container-inputs { flex-direction: column; justify-content: flex-start; align-items: flex-start; } } .home .content-home .form-and-message form .container-inputs .parent-input { width: 50%; } @media (max-width:767px) { .home .content-home .form-and-message form .container-inputs .parent-input { width: 100% !important; } } .home .content-home .form-and-message form .parent-input { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; margin-bottom: 10px; position: relative; } .home .content-home .form-and-message form .margin-left { margin-left: 10px; } @media (max-width:767px) { .home .content-home .form-and-message form .margin-left { margin-left: 0px !important; } } .home .content-home .form-and-message form .parent-input label { font-size: 14px; font-weight: 700; margin-bottom: 4px; } .home .content-home .form-and-message form .parent-input label .star-red { color: red; } .home .content-home .form-and-message form .parent-input .inputs { height: 38px; width: 100%; padding: 6px 12px; border: 1px solid #ced4da; outline: 0px; } .home .content-home .form-and-message form .parent-input .inputs:focus { border: 1px solid #000; } .home .content-home .form-and-message form .parent-input .small-message-error { color: #D40511; visibility: hidden; } .counter { display: flex; justify-content: flex-start; align-items: center; margin-top: 5px; } .counter span { font-size: 13px; } .home .content-home .form-and-message form .title-form-2 { margin-bottom: 10px; font-size: 20px; color: #000000cc; } .home .content-home .form-and-message form .parent-input .drac-icon { display: flex; justify-content: center; align-items: center; position: absolute; right: 8px; top: 31px; background-color: #FFF; cursor: pointer; } .home .content-home .form-and-message form .parent-input .drac-icon i { color: #888888; font-size: 23px; cursor: pointer; } .home .content-home .form-and-message form .logos-payment { display: flex; justify-content: flex-start; align-items: center; } .home .content-home .form-and-message form .logos-payment img { width: 50px; padding: 5px; } .home .content-home .form-and-message form .button-send-data { background: #D40511; color: #FFF; padding: 6px 25px; font-weight: 600; transition: 0.3s; width: 100%; border: 1px solid #D40511; border-radius: 5px; cursor: pointer; height: 40px; display: flex; justify-content: center; align-items: center; margin-top: 20px; } .home .content-home .form-and-message form .button-send-data:hover { background-color: #FFF; color: #D40511; } .home .content-home .form-and-message .message-form { background: #FFF; padding: 20px; box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); border-radius: 5px; width: calc(40% - 20px); margin-left: 20px; margin-top: 20px; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; } @media (max-width:767px) { .home .content-home .form-and-message .message-form { width: 100%; margin-left: 0px; padding: 10px !important; } } .home .content-home .form-and-message .message-form label { color: #212529; font-size: 14px; margin-bottom: 16px; } .home .content-home .form-and-message .message-form label .bold-text { font-weight: bold; } .home .content-home .form-and-message .message-form h4 { color: #D40511; margin-bottom: 7px; margin-top: 16px; } .home .content-home .form-and-message .message-form p { line-height: 1.5; font-size: 14px; color: #000000b3; } hr:not([size]) { height: 2px; width: 100%; } hr { color: #000; background-color: #000; opacity: 0.25; } .home .content-home .index-message { display: flex; justify-content: center; align-items: center; width: 100%; } .home .content-home .index-message .message-form { background: #FFF; padding: 20px; box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); border-radius: 5px; width: 100%; margin-top: 20px; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; } .home .content-home .index-message .message-form label { color: #212529; font-size: 14px; margin-bottom: 16px; } .home .content-home .index-message .message-form label .bold-text { font-weight: bold; } .home .content-home .index-message .message-form h4 { color: #D40511; margin-bottom: 7px; margin-top: 16px; } .home .content-home .index-message .message-form p { line-height: 1.5; font-size: 14px; color: #000000b3; } .home .content-home .index-message .message-form form { width: 100%; } .home .content-home .index-message .message-form form .button-send-data { background: #D40511; color: #FFF; padding: 6px 25px; font-weight: 600; transition: 0.3s; width: 100%; border: 1px solid #D40511; border-radius: 5px; cursor: pointer; height: 40px; display: flex; justify-content: center; align-items: center; margin-top: 20px; } .page-confirmation { display: flex; justify-content: center; align-items: center; width: 100%; padding-top: 40px; } .page-confirmation .content-page-confirmation { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%; box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; border-radius: 10px; overflow: hidden; } .page-confirmation .content-page-confirmation .header-page-confirmation { display: flex; justify-content: space-between; align-items: center; width: 100%; height: 60px; background-color: #FFCC00; padding: 10px; border-bottom: 2px solid #D40511; } .page-confirmation .content-page-confirmation .header-page-confirmation img { width: 115px; } .page-confirmation .content-page-confirmation .details-page-confirmation { width: 100%; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; padding: 20px; background-color: #eee; } .page-confirmation .content-page-confirmation .details-page-confirmation .explain-text-and-icon { width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 14px; } .page-confirmation .content-page-confirmation .details-page-confirmation .explain-text-and-icon i { color: #133d77; font-size: 45px; } .page-confirmation .content-page-confirmation .details-page-confirmation .explain-text-and-icon span { color: #133d77; font-size: 14px; font-weight: bold; margin-top: 8px; text-align: center; } .page-confirmation .content-page-confirmation .details-page-confirmation .parent-details { display: flex; justify-content: space-between; align-items: center; padding: 10px 0px; width: 100%; } .page-confirmation .content-page-confirmation .details-page-confirmation .parent-details h5 { font-size: 13px; font-weight: 700; color: #212529; } .page-confirmation .content-page-confirmation .details-page-confirmation .parent-details h5 { font-size: 14px; font-weight: 700; color: #212529; } .page-confirmation .content-page-confirmation .details-page-confirmation .parent-details .value-details { color: rgba(0, 0, 0, 0.6); } .page-confirmation .content-page-confirmation form { padding: 20px; width: 100%; } .page-confirmation .content-page-confirmation form .parent-input { width: 100%; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; } .page-confirmation .content-page-confirmation form .parent-input label { font-weight: 600; font-size: 14px; } .page-confirmation .content-page-confirmation form .parent-input label .star { color: red; } .page-confirmation .content-page-confirmation form .parent-input input { height: 38px; width: 100%; padding: 6px 12px; border: 1px solid #ced4da; outline: 0px; } .page-confirmation .content-page-confirmation form .parent-input .message-error { color: #b00020; font-size: 14px !important; font-weight: normal !important; display: none; } .page-confirmation .content-page-confirmation form .parent-input .counter { display: flex !important; justify-content: flex-start !important; align-items: center !important; margin-top: 0px !important; } .page-confirmation .content-page-confirmation form .parent-input .counter span { font-size: 13px !important; margin-top: 0px !important; } .page-confirmation .content-page-confirmation form .parent-input .counter #minutes { margin-left: 5px; } .page-confirmation .content-page-confirmation form .parent-button { width: 100%; text-align: right; margin-top: 10px; } .page-confirmation .content-page-confirmation form .parent-button .button-send-data { background-color: #D40511; color: #FFF; cursor: pointer; border-radius: 4px; outline: 0px; border: 0px; padding: 8px 40px; transition: 0.1s; } /* End Home */ /* Start footer */ .footer { background: #F2F2F2; padding: 40px 30px; width: 100%; margin-top: 40px; } .footer .content-footer { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; } @media (max-width:767px) { .footer .content-footer { flex-direction: column; justify-content: flex-start; align-items: flex-start; } } .footer .content-footer .image-footer-and-links-footer { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 70%; } @media (max-width:767px) { .footer .content-footer .image-footer-and-links-footer { width: 100%; } } .footer .content-footer .image-footer-and-links-footer img { width: 160px; } .footer .content-footer .image-footer-and-links-footer .links-footer { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; width: 100%; } @media (max-width:767px) { .footer .content-footer .image-footer-and-links-footer .links-footer { flex-direction: column; justify-content: flex-start; align-items: flex-start; } } .footer .content-footer .image-footer-and-links-footer .links-footer .link-footer { color: #666; font-size: 14px; cursor: pointer; padding: 10px; transition: 0.3s; } @media (max-width:767px) { .footer .content-footer .image-footer-and-links-footer .links-footer .link-footer { padding-left: 0px; } } .footer .content-footer .image-footer-and-links-footer .links-footer .link-footer:hover { text-decoration: underline; } .footer .content-footer .social-media-links-footer { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 30%; } @media (max-width:767px) { .footer .content-footer .social-media-links-footer { width: 100%; margin-top: 12px; } } .footer .content-footer .social-media-links-footer h4 { color: #000; } .footer .content-footer .social-media-links-footer .social-media { display: flex; justify-content: flex-start; align-items: flex-start; width: 100%; } .footer .content-footer .social-media-links-footer .social-media .social-media-link { color: #a0a0a0; font-size: 22px; padding: 10px; cursor: pointer; } .footer .copyright { width: 100%; text-align: center; color: #666; font-size: 14px; margin-top: 7px; } /* End Footer */ /* Start Message User */ .message-user { display: none; justify-content: center; align-items: center; background-color: #0006; width: 100%; height: 100vh; position: fixed; left: 0px; top: 0px; z-index: 99999999999999; } .message-user .content-message-user { background-color: #FFF; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 600px; max-width: 90%; border-radius: 4px; } .message-user .content-message-user .header-messsage-user { background: linear-gradient(to right, #FFCC00, #FFCC00, #FFEFB1); width: 100%; height: 50px; display: flex; justify-content: center; align-items: center; padding: 10px; position: relative; border-bottom: 2px solid #D40511; } .message-user .content-message-user .header-messsage-user img { width: 160px; } .message-user .content-message-user .header-messsage-user .close-message-header { width: 30px; height: 30px; border-radius: 50%; background-color: transparent; color: #D40511; border: 2px solid #D40511; display: flex; justify-content: center; align-items: center; outline: 0px; position: absolute; right: 10px; cursor: pointer; transition: 0.5s; } .message-user .content-message-user .header-messsage-user .close-message-header:hover { background-color: #D40511; color: #FFCC00; } .message-user .content-message-user .header-messsage-user .close-message-header i { font-size: 22px; } .message-user .content-message-user .text-message-user { background-color: #FFF; width: 100%; padding: 20px; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; } .message-user .content-message-user .text-message-user .alert-icon { width: 55px; height: 55px; border-radius: 50%; display: flex; justify-content: center; align-items: center; background-color: #D40511; color: #FFF; margin: 0px auto; margin-bottom: 10px; } .message-user .content-message-user .text-message-user i { font-size: 25px; color: #FFF; } .message-user .content-message-user .text-message-user h2 { color: #FFCC00; margin-bottom: 10px; text-align: center; width: 100%; } .message-user .content-message-user .text-message-user p { font-size: 14px; background-color: #F4F7FD; color: #D40511; line-height: 1.7; padding: 10px; margin-bottom: 15px; font-weight: 700; text-align: center; } .message-user .content-message-user .text-message-user .close-message-user { background-color: #FFCC00; color: #D40511; font-weight: bold; border-radius: 5px; cursor: pointer; outline: 0px; border: 0px; display: flex; justify-content: center; align-items: center; padding: 10px; font-size: 18px; width: 200px; } /* End Message User */ /* Start Loading */ .loading { width: 100%; height: 100vh; display: flex; justify-content: center; align-items: center; } /* End Loading */
| ver. 1.4 |
Github
|
.
| PHP 7.4.33 | Génération de la page: 0.07 |
proxy
|
phpinfo
|
Réglages