.h1_transparent2{ color: transparent; font-size: small; } @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400&display=swap"); body { background-color: #faffff; font-family: Arial; text-align: center; } * { padding: 0; border: none; outline: none; } body { background: #504e4e; color: #18dcff; } h2 { margin-top: 35px; text-align: center; } .form-content { display: grid; grid-template-rows: repeat(4, 1fr) 105px; } input, textarea { background: none; font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: 1.1rem; border-bottom: 1px solid #cec950; color: #18dcff; } input::placeholder, textarea::placeholder { color: #bebcbc; } input, .email-content, textarea { width: 90%; margin: 0 auto; } input { padding: 24px 0 12px; } .email-content { position: relative; } .email-content input { width: 100%; } #not-mail { display: none; position: absolute; top: 4px; color: #ff4d4d; right: 0; transform-origin: 50% 50%; } @keyframes dongle { 0% { transform: translate(0px, 0px); } 10% { transform: translate(-10px, 0px); } 20% { transform: translate(10px, 0px); } 30% { transform: translate(-10px, 0px); } 40% { transform: translate(10px, 0px); } 50% { transform: translate(-10px, 0px); } 60% { transform: translate(10px, 0px); } 70% { transform: translate(-10px, 0px); } 80% { transform: translate(10px, 0px); } 90% { transform: translate(-10px, 0px); } 100% { transform: translate(0px, 0px); } } textarea { resize: none; padding: 24px 0; } .button { font-size: 1.3rem; margin-top: 15px; color: #cec950; border: none; cursor: pointer; transition: 0.2s; width: 100%; } .button:hover { letter-spacing: 2px; } .error::placeholder { color: #ff4d4d; } .form-message { margin-top: 10px; padding: 12px; opacity: 0; transition: 0.2s ease; color: black; border-radius: 4px; box-shadow: 0 0 2px rgba(51, 51, 51, 0.3); } .nb_page { text-align: -webkit-right; } .user_list { /*display: flex; */ flex-irectdion: row-reverse; flex-wrap: wrap; } .ul { list-style-type: none; } .li { list-style-type: none; } .div1 { display: inline-block; vertical-align: top; width: 20%; margin-right: 0.5%; max-height: 400px; overflow-y: scroll; } .div2 { display: inline-block; border-left: 1px solid green; vertical-align: top; width: 70%; border-left-width: thick; max-height: 400px; overflow-y: scroll; } .div3 { display: inline-block; vertical-align: top; width: 9%; } .navigation { margin: 26px 0; } .navigation a { margin: 10px; padding: 10px; position: relative; } .navigation .nav-active::after { content: ""; width: 100px; height: 5px; background-color: aqua; position: absolute; bottom: 1px; left: 50px; transform: translateX(-50%); } .footer { margin-top: 1rem; padding: 1rem; background-color: black; position: fixed; bottom: 0; left: 0; width: 100%; } .searchbar .col-md-8 { width: 100%; margin: 10px; } .searchbar .card card-sm { border: none; } .searchbar .card-body row no-gutters align-items-center { border: none; margin: 0 auto; width: 90%; height: 80px; alignItems: "center"; justifyContent: "center"; background-color: #ccc; border-radius: 3px; } .searchbar .form-control form-control-lg form-control-borderless { font-size: 30px; padding-top: 10px; padding-bottom: 10px; } .searchbar .form-control-borderless { border: none; } .searchbar .form-control-borderless:hover, .searchbar .form-control-borderless:active, .searchbar .form-control-borderless:focus { border: none; outline: none; box-shadow: none; } .header .App-logo { height: 15vmin; pointer-events: none; } .header .App-header { background-color: #E2F0D9; min-height: 20vh; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: calc(10px + 2vmin); color: white; } .loginicon .ch_login_img { position: absolute; left: 87%; top: 1%; } .loginicon .class_ch { justify-content: right; float: right; } .formation { height: 80px; position: relative; margin: 1px; box-shadow: 0 0 2px rgba(51, 51, 51, 0.25); transition: 0.3s; overflow: hidden; border-radius: 4px; text-align: -webkit-left; } .formation:hover { transform: scale(1.25); z-index: 2; } .formation img { object-fit: cover; height: 100px; width: 160px; } .formation .data-container { position: absolute; top: 0; opacity: 0; width: 100%; height: 100%; transition: 0.2s; } .formation .data-container:hover { opacity: 1; } .formation .data-container:hover ul { transform: scaleY(1); } .formation .data-container ul { color: #f7f7f7; padding-top: 5px; display: grid; height: 100%; width: 100%; text-align: center; transition: 0.3s; transform: scaleY(0.3); z-index: 20; list-style-type: none; text-align: -webkit-right; } .formation .data-container ul:after { content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: 0.02s; } .formation .data-container ul:hover::after { background: rgba(0, 0, 0, 0.65); } .formation .data-container li { font-size: 0.8rem; z-index: 30; list-style-type: none; } .formation .data-container li:nth-child(1) { font-weight: bold; color: #FAFFFF; } /*# sourceMappingURL=index.css.map */