body{
background-color: #f4ecec;
font-family: Arial, Helvetica, sans-serif;
overflow: hidden;
}
h2{
font-size: 42px;
letter-spacing: 10px;
}
#basyazi{
font-size: 22px;
letter-spacing: 3px;
}
.sifrecikacakyer{
padding: 20px;
border-radius: 20px;
border: none;
width: 0px;
margin-top: 20px;
transition: 0.5s;
background:none
}
.sifrediv{
width: 650px;
}
.sifrediv:hover .sifrecikacakyer{
border: 1px solid #bbb;
width: 620px;
}
.sifrediv:hover #sifreiconu{
background-color: orange;
}
.range{
width: 250px;
font-size: 200px;
background-color: orange;
color: orange;
}
#olusturbuton{
width: 200px;
height: 50px;
border-radius: 20px;
border: 1px solid #bbb;
transition: 0.4s;
cursor: pointer;
margin-top: 30px;
color: black;
}
#olusturbuton:hover{
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
}
#olusturbuton2{
width: 200px;
height: 50px;
border-radius: 20px;
border: 1px solid #bbb;
transition: 0.4s;
cursor: pointer;
}
#olusturbuton2:hover{
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
background-color: #055bb6;
}
#olusturbuton3{
width: 200px;
height: 50px;
border-radius: 20px;
border: 1px solid #bbb;
transition: 0.4s;
cursor: pointer;
}
#olusturbuton3:hover{
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
background-color: #bb2b39;
}
#sifreiconu{
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #7b7676;
margin-left: -50px;
}