ol {
max-width:100%;
margin-top:3em;
margin-left:1em;
}
li{line-height: 1.7}     

.flex_box {
padding:  10px;  
display: flex; 
flex-direction:row;
justify-content:flex-end;
flex-wrap: wrap;
width:100%;
height:auto;
}

.flex_item {
padding: 10px;
margin:  10px auto; 
border-radius: 10px 10px 0 0 / 10px 10px 0 0;
-webkit-border-radius: 10px 10px 0 0 / 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0 / 10px 10px 0 0; 
border:1px #e0e0e0 solid;
width: 45%;
align-self: stretch;
}
.flex_box .flex_item {
padding: 10px;
margin:  10px auto; 
border-radius: 10px 10px 0 0 / 10px 10px 0 0;
-webkit-border-radius: 10px 10px 0 0 / 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0 / 10px 10px 0 0; 
border:1px #e0e0e0 solid;
width: 25%;
align-self: stretch;
}
.flex_box .flex_item:nth-child( 3n ) { margin-right: 0; }

.flex_item:hover {
opacity: 0.5;
}
.flex_item img {max-width: 100%;height:auto}
section h4 {margin-top:1.2em}

.sub {
vertical-align: sub;
font-size: 60%;
text-align: right;
}
hr {
margin-top:2em;
border-top: 1px dotted #ccc;
}
@media screen and (max-width:768px) {

.sub {
vertical-align: sub;
font-size: 75%;
text-align:left;
} 
}