input { display: none; }
p { margin: 0; }
h2 { margin: 0; color:#D8A31D;}
h3 { margin: 0; color:white;}
/* Napit 1.tekstin vari 2.tausta*/
.button { color: white; font-weight: bold; font-size: 20px; background-color: #D8A31D; display: block; padding: 10px 16px; border-radius: 15px; cursor: pointer; animation: fadein .5s; animation: pulse 1.5s infinite;}
/* Content=avautuva tausta*/
.content { background:#443E3B; text-align: center; display: none; margin: 10%; border-radius: 15px; max-width: 400px; }
.cross { font-weight: bold; background: black; color:  #D8A31D; padding: 10px;}
#b1 { position: absolute; left: 5%; top: 5%; }
#b2 { position: absolute; left: 5%; top: 15%; }
#b3 { position: absolute; left: 5%; top: 25%; }
#input1:checked ~ #content1,
#input2:checked ~ #content2,
#input3:checked ~ #content3 { display: block !important; animation: fadein .5s; }
input:checked ~ label .button { display: none !important; animation: fadeout .5s; }
.button:hover { color: #d32f2f; background: white; }

.bodyCopy { color: black; background: white; }
.bodyCopy:hover { color: #d32f2f; background: white; }

.cta { display: inline-block; background: #D8A31D; Color: white; padding: 12px 24px; margin: 12px; border-radius: 12px; text-decoration: none; transition: all .3s ease; }
.cta:hover { text-decoration: underline !important; box-shadow: 0 0 0 6px rgba(211, 46, 46, 0.4); }
@keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes fadeout {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes pulse {
  from { box-shadow: 0 0 0 0px rgba(211, 47, 47); }
  to { box-shadow: 0 0 0 15px rgba(0, 0, 0, 0); }
}

/* Piharati 2023 */