#newest {border-bottom: 1px solid #ccc;}
#older article { display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between; align-items: center; align-content: space-between; padding: 20px;}

#older article:not(:first-of-type) {border-top: 1px solid #d3d3d3;}

h2 {font-size: 1.875em}
.col-1 {flex: 0 0 auto; padding: 0 10px; width: 35%;}
.col-2 { flex: 0 0 auto; padding: 0 10px; width: 60%;}
.col-1 img {display: block; margin: 0 auto;}
.col-2 h3, .col-2 p {text-align: left;}
@media only screen and (max-width: 480px) {
h2 {font-size: 1.625em;}
.col-2 h3, .col-2 p {text-align: center;}
}
@media only screen and (min-width: 481px) and (max-width: 680px) {h2 {font-size: 1.75em;}}

@media only screen and (min-width: 0px) and (max-width: 600px) {
.col-1, .col-2 {width: 100%;}
.col-1 img {margin-bottom: .2em;}
.col-2 {margin-top: .5em; margin-bottom:1.5em;}
}
@media only screen and (min-width: 0px) and (max-width: 480px) {.col-1 img.scalable {width: 150px;}}


/* BLOG DETAIL PG */
/*comment form*/
#comment-frm {margin-right: auto; margin-left: auto; width: 100%; margin-bottom: 25px;}
#comment-frm-fields {display: flex; flex-wrap: wrap; flex-direction: row; justify-content: start; align-items: auto; align-content: start; max-width:550px; margin: 0 auto;}
.fld1 {flex: 1 0 auto; width: 25%; margin: 14px; text-align: right;}
.fld2 {flex: 1 0 auto; width: 50%; margin: 10px; text-align: left;}
.fld2 input, .fld2 textarea {width: 100%; padding: 5px; border-radius: 6px; border-style: solid; border-width: 1px;}
.fld2 textarea {height: 200px;}
@media only screen and (min-width: 0px) and (max-width: 600px) {
.fld1, .fld2 {width: 100%; text-align: center;}
.fld1 {margin: 15px 0 3px;}
.fld2 {margin: 0 0 10px;}
}
.fld1 span {display: block; font-size: 90%; color:#949393;}
input#btn {font-size: 1.125em; display: inline-block; width: auto !important; padding: 5px 8px; margin-bottom: 10px; cursor: pointer;}
p.subhd {margin-top: 20px; font-size: 16px; border-top: 1px solid #000; border-right-style: none; border-bottom-style: none; border-left-style: none; padding-top: 10px; margin-bottom: 10px;}

/*comments*/
.commentbx {padding-bottom: 10px; margin: 1px auto 0px 0px; clear: both; width: 100%; padding-top: 5px;}
.commenthd {width: 25%; float: left; overflow: hidden; font-weight: normal; padding-top: 0px; text-align: right;}
.commentdte {margin-bottom: 6px; color: #949393; font-weight: normal; padding-top: 4px; font-size: .9em;}
.commenttxt {margin: 0px 0px 9px 20px; width: 70%; float: left; padding: 0px;}

@media only screen and (min-width: 0px) and (max-width: 600px) {
.commenthd {width: 100%; float: none; text-align: left; margin-bottom: 5px;}
.commenttxt {width: 100%; float: none; padding: 0px;}
}
.commenttxt-admin {background-color: #e9e9e9; margin: 0px 0px 0px 20px; width: 312px; float: left; padding: 5px;}
.commentdivide {width: 100%; height: 10px; margin-left: 0px; clear: both; margin-right: auto; border-top: 1px dotted #ccc;}
#err { margin: 10px auto; background: #ff6; padding: 15px; font-size: 1.1em; border-radius: 10px; max-width: 500px;}
#err p, #err a {color: #c00000;}