posts page formatting

For some reason, the Post page formatting is all stuffed up.
This is all the CSS modification I have made to date

This is all the CSS changes I have made to the site to date

h2.site-description{
font-weight:bolder;
font-size:15px;
padding-top:5px;
letter-spacing:1.5px;
padding-left:5px;
}
.site-title {
font-weight:600;

letter-spacing:1.5px;
}
#agama_slider .slide-content a.button{
text-shadow: 2px 2px #000;
font-weight: bolder;
font-size:22px;
box-shadow:2px 2px #000;
}
#agama_slider .slide-content a:hover.button{
text-shadow:none;
}
#agama_slider .slide-content .slide-content-cell {
text-shadow: 2px 2px #000;
display: table-cell;
vertical-align:top;
padding-top:20px;}
body .gform_wrapper form ul{
display:block;
}
body .gform_wrapper form li{
list-style:none;

max-width:500px;
}
body .gform_wrapper form li .field{
padding-right:200px;
}
#mega-menu-wrap-primary ul{
border-top:2px;
border-color:rgb(36, 63, 91);
border-width:1px;
}
#agama_widget_about-3 {
background-color:rgba(232, 238, 247, 0.41);
}
#masthead.header_v2 hgroup {
padding: 24px 0;
max-width:770px;
margin:auto ;
font-weight: bolder;
background-image: url(https://www.gilmourwebdesigns.com.au/wp-content/uploads/2019/12/gwd-logo4r.png);
background-repeat: no-repeat;
background-position:90%;
}
#masthead.header_v2 hgroup a{
text-shadow: 2px 1px grey;
}
@media only screen and (max-width: 990px) {
#masthead.header_v2 hgroup{
background-image:none;
}
}
#masthead.site-title a {
text-shadow: 2px 2px lightgray;
}
.widget-area .widget{
background-image: linear-gradient(#E8EEF7, #c7d7ed);
padding-left:15px;
box-shadow: 2px 2px 1px grey;
}
.widget-area .widget li{
font-size: 16px;
font-weight:bold;
}

.widget-area .widget h3{
font-size: 18px;
color:#277FB8;
font-weight:bold;
text-shadow: .5px 1px grey;
margin:5px auto 5px 50px;
}

.section-blog{
width:80%;
margin: 0px auto;
color:#fff;
position:relative;

}

body:not(.single-post) .article-wrapper{
width:150px;
}

The page I need help with: [log in to see the link]