body {font-family: Arial, Helvetica, sans-serif;}
a:link {
	text-decoration: none;
	color: #660066;
}
a:visited{
	color:#350135; 
}
a:hover{
	text-decoration: underline;
	color: #99004d;
	text-shadow: 0.5px 0.5px 0.5px #99004d;
}
aside { color: #333233;
  margin-left: 20%;
  margin-right: 20%;
  
}
h1, h2, h3 {font-family: 'Marcellus', serif;}
h1, h2, h3, h4, h5, h6 {text-align: center;}
img {
  display: block;
  margin-left: auto;
  margin-right: auto;
    max-width: 100%;
    height: auto;


}
p {
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10%;
  margin-right: 10%;
}

/* Create 4 equal columns that float next to each other */
.column {
  float: left;
  width: 23%;
  margin-left: 1%;
  margin-right: 1%;
  margin-bottom: 1%;
}
h2 {color: #ffffff; background-color: #99004d;  background-image: radial-gradient( #99004d 5%, #660066 95%);  padding-top: 20px;
	padding-bottom: 20px; box-shadow: 5px 5px 5px lightgrey;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the 4 columns stack on top of each other instead of next to each other on smaller screens (600px wide or less) */
@media screen and (max-width: 600px) {
  .column {
    width: 100%;
  }
}
div #Joyful, #Sorrowful, #Luminous, #Glorious {box-shadow: 2px 2px 5px 2px lightgrey;}
/*div > #rosary, #divinemercy, #stmichaels, #lorica, #memorare */
ul .poetic 
{line-height: 180%;
}
sup { color:#a8a8a8
}
