body { background-color:#fafafa;}
.content {
  text-align: center;
  margin-top:150px;
}
.content h1 {
  font-family: 'Sansita', sans-serif;
  letter-spacing: 1px;
  font-size: 50px;
  color: #282828;
  margin-bottom: 10px;
}
.content  i {
  color: #FFC107;
}
.content span {
  position: relative;
  display: inline-block;
}
.content  span:before, .content  span:after {
  position: absolute;
  content: "";
  background-color: #282828;
  width: 40px;
  height: 2px;
  top: 40%;
}
.content  span:before {
  left: -45px;
}
.content  span:after {
  right: -45px;
}
.content p {
  font-family: 'Open Sans', sans-serif;
  font-size: 18px;
  letter-spacing: 1px;
}
.wrapper {
  position: relative;
  display: inline-block;
  border: none;
  font-size: 14px;
  left: 22%;
  transform: translateX(-50%);
  margin-top: 3px;
}

.wrapper input {
  border: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
  position: absolute !important;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  opacity: 0;
}

.wrapper label {
  position: relative;
  float: right;
  color: #C8C8C8;
}

.wrapper label:before {
  margin: 2px;
  content: "\f005";
  font-family: FontAwesome;
  display: inline-block;
  font-size: 1.4em;
  color: #ccc;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  cursor: pointer;
}

.wrapper input:checked ~ label:before {
  color: #ff9900; 
}

.wrapper label:hover ~ label:before {
  color: #ff9900;
}

.wrapper label:hover:before {
  color: #ff9900;
}

.wrapper1 {
  position: relative;
  display: inline-block;
  border: none;
  font-size: 14px;
  left: 19%;
  transform: translateX(-50%);
}

.wrapper1 input {
  border: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
  position: absolute !important;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  opacity: 0;
}

.wrapper1 label {
  position: relative;
  float: right;
  color: #C8C8C8;
}

.wrapper1 label:before {
  margin: 2px;
  content: "\f005";
  font-family: FontAwesome;
  display: inline-block;
  font-size: 1.4em;
  color: #ccc;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  cursor: pointer;
}

.wrapper1 input:checked ~ label:before {
  color: #ff9900; 
}

.wrapper1 label:hover ~ label:before {
  color: #ff9900;
}

.wrapper1 label:hover:before {
  color: #ff9900;
}