:root{--input-padding-x: 1.5rem;--input-padding-y: .75rem}select,textarea{-webkit-appearance:none;width:100%}input[type="file"]{display:none}input[type="file"]+label{border:1px solid #ced4da;height:50px;border-radius:2rem}body{background:#007bff;background:linear-gradient(to right, #0062E6, #33AEFF)}.card-signin{border:0;border-radius:1rem;box-shadow:0 0.5rem 1rem 0 rgba(0,0,0,0.1)}.card-signin .card-title{margin-bottom:2rem;font-weight:300;font-size:1.5rem}.card-signin .card-body{padding:2rem}.form-signin,.form-product{width:100%}.btn{font-size:80%;border-radius:5rem;letter-spacing:.1rem;font-weight:bold;padding:1rem;transition:all 0.2s}.form-label-group{position:relative;margin-bottom:1rem}.form-label-group input,.form-label-group select{height:50px;border-radius:2rem;color:#007bff}.form-label-group textarea{height:350px;border-radius:2rem;color:#007bff}.form-label-group>input,.form-label-group>select,.form-label-group>textarea,.form-label-group>label{padding:var(--input-padding-y) var(--input-padding-x)}.form-label-group>label{position:absolute;top:0;left:0;display:block;width:100%;margin-bottom:0;line-height:1.5;color:#495057;border:1px solid transparent;border-radius:.25rem;transition:all .1s ease-in-out}.form-label-group input::placeholder,.form-label-group textarea::placeholder{color:transparent}.form-label-group input:not(:placeholder-shown),.form-label-group textarea:not(:placeholder-shown){padding-top:calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));padding-bottom:calc(var(--input-padding-y) / 3)}.form-label-group select.selected{padding-top:calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));padding-bottom:calc(var(--input-padding-y) / 3)}.form-label-group input:not(:placeholder-shown) ~ label,.form-label-group input:hover ~ label,.form-label-group textarea:hover ~ label,.form-label-group textarea:not(:placeholder-shown) ~ label{padding-top:calc(var(--input-padding-y) / 3);padding-bottom:calc(var(--input-padding-y) / 3);font-size:12px;color:#777}.form-label-group select.selected ~ label,.form-label-group select:focus ~ label,.form-label-group select:hover ~ label{padding-top:calc(var(--input-padding-y) / 3);padding-bottom:calc(var(--input-padding-y) / 3);font-size:12px;color:#777}.form-label-group input[type="file"] ~ label{padding:var(--input-padding-y) var(--input-padding-x) !important;line-height:1.5;color:#495057;font-size:16px}.form-label-group input[type="file"]:hover ~ label{padding-top:calc(var(--input-padding-y) / 3);padding-bottom:calc(var(--input-padding-y) / 3);font-size:12px;color:#777;cursor:pointer}.btn-google{color:white;background-color:#ea4335}.btn-facebook{color:white;background-color:#3b5998}.form-label-group input[list]:hover::placeholder{color:#cccccc}
