body{

  display: flex;
  
  justify-content: center;
  background: url(4.jpg) no-repeat;
  background-size: cover;
  


}

.heder{
  background-color: transparent;  
  border-radius: 25px;
  padding: 15px 15px;
  border: 1px solid ;
  box-shadow:1px 5px 9px rgba(0,0,0,0.5);
  
    

}

.div-button{

}

.ekhtelaf-input,.darsad-input,.total-input,.azad-input{
  display: block;
  margin: 3px 3px;
  border-radius: 19px;
  border-color: rgb(0, 0, 0);
  border-width: 3px;
  border-style: solid;
  width: 280px;
  height: 40px;
  padding: 2px 10px;
  font-size: 20px;
  background-color: transparent;

}

input::placeholder{
  font-weight: 540;
  color:rgb(12, 157, 12);
}

.checkbox-input{
  display: inline-block;
  transform: scale(2);
  margin: 1px;
  margin-left: 10px;
  margin-right: 30px;
  cursor: pointer;
}

.fany-text{
  display: inline-block;
  font-size: 20px;
  font-weight: bold;
}

.button-total{
border-radius: 20px;
border-style: none;
width: 120px;
height: 50px;
background-color: aqua;
font-size: 19px;
font-weight: 600;
cursor: pointer;
margin-left:70px ;

}
.button-total:hover{
  background-color: rgb(33, 215, 215);
}

.output-moshtary,.output-site,.All{
display: block;
margin: 12px 5px ;
font-size: 22px;
font-weight: 600;
}

.output-site{
  display: inline-block;
}

.hide{
  display: none;
}
.copy-button{
  border:none;
  padding: 2px 18px;
  border-radius: 25px;
  margin-top: 2px;
  background-color: rgb(201, 248, 201);
  cursor: pointer;
  font-size: 15px;
}
.site-copy{
  display: flex;
  justify-content: space-between;
}