Form by mi-series
#e8e8e8
1.container { 2 display: flex; 3 align-items: center; 4 justify-content: center; 5 flex-direction: column; 6 text-align: center; 7} 8 9.form_area { 10 display: flex; 11 justify-content: center; 12 align-items: center; 13 flex-direction: column; 14 background-color: #EDDCD9; 15 height: auto; 16 width: auto; 17 border: 2px solid #264143; 18 border-radius: 20px; 19 box-shadow: 3px 4px 0px 1px #E99F4C; 20} 21 22.title { 23 color: #264143; 24 font-weight: 900; 25 font-size: 1.5em; 26 margin-top: 20px; 27} 28 29.sub_title { 30 font-weight: 600; 31 margin: 5px 0; 32} 33 34.form_group { 35 display: flex; 36 flex-direction: column; 37 align-items: baseline; 38 margin: 10px; 39} 40 41.form_style { 42 outline: none; 43 border: 2px solid #264143; 44 box-shadow: 3px 4px 0px 1px #E99F4C; 45 width: 290px; 46 padding: 12px 10px; 47 border-radius: 4px; 48 font-size: 15px; 49} 50 51.form_style:focus, .btn:focus { 52 transform: translateY(4px); 53 box-shadow: 1px 2px 0px 0px #E99F4C; 54} 55 56.btn { 57 padding: 15px; 58 margin: 25px 0px; 59 width: 290px; 60 font-size: 15px; 61 background: #DE5499; 62 border-radius: 10px; 63 font-weight: 800; 64 box-shadow: 3px 3px 0px 0px #E99F4C; 65} 66 67.btn:hover { 68 opacity: .9; 69} 70 71.link { 72 font-weight: 800; 73 color: #264143; 74 padding: 5px; 75}
4.4K views
4.4K views
MIT License