/*Css for Elder_Porter*/

body {
background-color: #aa0064;
background-image: linear-gradient(to right, rgb(206,10,255), rgb(88,76,255), rgb(240,71,235), rgb(112,255,102));
}

img {
width: 400px;
height: auto;
}

div {
width: 500px;
float: left;
}

#porter {
margin: 40px; 
box-shadow: 18px 18px 9px 10px;
border-style: dashed groove;
padding: 10px;
border-color: #51d569 #1f97df;
border-width: 12px 7px 12px 7px;
border-radius: 15px 50px;
text-align: center;
color: #a126c6;
font-family: 'Borel', cursive;
Regular 800 at 58px;
font-size: 45px;
}

#porter1 {
margin: 40px; 
box-shadow: 18px 18px 9px 10px;
border-style:dashed groove;
padding: 10px;
border-color: #51d569 #1f97df;
border-width: 12px 7px 12px 7px;
border-radius: 15px 50px;
}

#elder { 
margin: 40px; 
box-shadow: 13px 13px 7px 21px;
border-width: 12px 7px;
border-style: dotted ridge;
padding: 15px;
border-color:#48c03c;
border-radius: 15px 20px;
text-align: center;
color: #a126c6;
font-family: 'Borel', cursive;
Regular 800 at 58px;
font-size: 45px;
}

#elder1 {
margin: 40px; 
box-shadow: 13px 13px 7px 21px;
border-width: 12px 7px;
border-style: dotted ridge;
padding: 15px;
border-color:#48c03c;
border-radius: 15px 20px;
}

#pipes {
margin: 40px;
padding: 12px;
box-shadow: 15px 15px 10px;
border-style:dashed dotted double;
border-width: 15px 10px;
border-color: #c50037;
border-radius: 16px 30px;
text-align: center;
font-family: 'Princess Sofia', cursive;
Regular 400 at 48px;
font-size: 45px;
color: #0e1392
}

#pipes1 {
margin: 40px;
padding: 12px;
box-shadow: 15px 15px 10px;
border-style:dashed dotted double;
border-width: 15px 10px;
border-color: #c50037;
border-radius: 16px 30px;
}

#back {	
width: 100%;
height: 45px;
}

.button {
display: inline;
border-radius: 40%;
background-color: orange;
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
width: 50%;
font-size: 50px;
margin-left: 250px;
}