70 lines
1.1 KiB
CSS
70 lines
1.1 KiB
CSS
|
#pinpad form {
|
||
|
|
width: 390px;
|
||
|
|
margin: 50px auto;
|
||
|
|
background: #fff;
|
||
|
|
padding: 35px 25px;
|
||
|
|
text-align: center;
|
||
|
|
box-shadow: 0px 5px 5px -0px rgba(0, 0, 0, 0.3);
|
||
|
|
border-radius: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#displayPass {
|
||
|
|
padding: 0 40px;
|
||
|
|
border-radius: 5px;
|
||
|
|
width: 350px;
|
||
|
|
margin: auto;
|
||
|
|
border: 1px solid rgb(228, 220, 220);
|
||
|
|
outline: none;
|
||
|
|
font-size: 60px;
|
||
|
|
color: transparent;
|
||
|
|
text-shadow: 0 0 0 rgb(71, 71, 71);
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
input:focus {
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pinButton {
|
||
|
|
border: none;
|
||
|
|
background: none;
|
||
|
|
font-size: 1.5em;
|
||
|
|
border-radius: 50%;
|
||
|
|
height: 60px;
|
||
|
|
font-weight: 550;
|
||
|
|
width: 60px;
|
||
|
|
color: transparent;
|
||
|
|
text-shadow: 0 0 0 rgb(102, 101, 101);
|
||
|
|
margin: 7px 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.clear,
|
||
|
|
.enter {
|
||
|
|
font-size: 1em !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pinButton:hover {
|
||
|
|
box-shadow: #506ce8 0 0 1px 1px;
|
||
|
|
}
|
||
|
|
.pinButton:active {
|
||
|
|
background: #506ce8;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.clear:hover {
|
||
|
|
box-shadow: #ff3c41 0 0 1px 1px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.clear:active {
|
||
|
|
background: #ff3c41;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.enter:hover {
|
||
|
|
box-shadow: #47cf73 0 0 1px 1px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.enter:active {
|
||
|
|
background: #47cf73;
|
||
|
|
color: #fff;
|
||
|
|
}
|