.call{
    position: relative;
    margin: 0 0 1rem 0;
}
.post-summary.panel {
    background: #fff;
    border-style: solid;
    margin-bottom: 1.25rem;
    border-width: 1px;
    border-color: #d8d8d8;
    padding: 1.25rem;
    color: #333;    
}
.post-image {
    background-color: #cdcdcd;
    margin-bottom: 16px;
    aspect-ratio: 6 / 4;
    overflow: hidden;       /* hides image overflow */
}
.post-image img {
    width: 100%;            /* fill width */
    height: 100%;           /* fill height */
    object-fit: cover;      /* keep aspect ratio, crop if needed */
    display: block;         /* remove inline gaps */
}
.post-summary h2 {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: .625rem;
}
.post-summary h2 a {
    color: #181717;
    transition: 0.4s all;
}
a.read-more {
    color: #f8132f;
    display: block;
}
a.read-more:hover {
    color: #494848;
    text-decoration: underline;
}
.blog-post-meta{
    font-weight: 500;
    font-size: .9rem;
    padding:20px 0 !important;

}
.menu.vertical li {
    margin-bottom: 10px;
}
.menu.vertical li a {
    padding: 4px;
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    color: #181717;
    transition: 0.4s all;
    font-size:15px;
    line-height: 1.6;
}
.menu.vertical li a:hover {
    text-decoration: underline;
}
.secondary h3{
    font-size: 22px;
}
.tagger a.tagged {
    padding: 6px 8px;
    border:solid 1px #92b9fa;
    display: inline-block;
    color: #1c6aeb;
    transition: 0.4s all;
    font-size:15px;
    border-radius: 3px;
}
.tagger a.tagged:hover {
    text-decoration: underline;
}
.no - sidebar.content - container.size3of4 {
    width: 75 %
}
.archive-title{
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
}
.blog - entry.post - image img {
    width: 98.75 %
}
.featured-image img{
    object-fit: cover;
    width: 100%;
    aspect-ratio:1/ 1;
}

.featured-image.wide img{
    aspect-ratio:20 / 8;
}


.blog-post-meta a{
    font-weight: 600;
    text-decoration: underline;
}

ul.blogTagCloud {
    list - style - type: none;
    clear: both
}

ul.blogTagCloud li {
    float: left;
    display: inline;
    padding - right: 8 px
}

ul.blogTagCloud li a span {
    float: left;
    line - height: 30 px;
    text - align: center;
    padding: 0
}

ul.blogTagCloud.blog - sidebar.WidgetHolder ul {
    margin - left: 0
}

ul.blogTagCloud.blog - sidebar.WidgetHolder ul li {
    list - style - type: none
}

ul.blogTagCloud.tagCount10 {
    font - size: 26 pt
}

ul.blogTagCloud.tagCount9 {
    font - size: 24 pt
}

ul.blogTagCloud.tagCount8 {
    font - size: 22 pt
}

ul.blogTagCloud.tagCount7 {
    font - size: 20 pt
}

ul.blogTagCloud.tagCount6 {
    font - size: 18 pt
}

ul.blogTagCloud.tagCount5 {
    font - size: 16 pt
}

ul.blogTagCloud.tagCount4 {
    font - size: 14 pt
}

ul.blogTagCloud.tagCount3 {
    font - size: 12 pt
}

ul.blogTagCloud.tagCount2 {
    font - size: 10 pt
}

ul.blogTagCloud.tagCount1 {
    font - size: 8 pt
}

.cms table.ss - gridfield - table tr td.MergeAction a {
    display: block;
    height: 100 %;
    width: 100 %
}

.has - panel.cms - content - tools.blog - admin - sidebar {
    width: 280 px;
    border - right: 0;
    border - left: 1 px solid# c0c0c2;
    position: absolute !important;
    right: 0;
    top: 0;
    height: 100 %
}

.has - panel.cms - content - tools.blog - admin - sidebar.cms - panel - toggle a {
    text - align: left;
    margin: 0
}

.has - panel.cms - content - tools.blog - admin - sidebar.cms - panel - toggle.south {
    border - top: 1 px solid# aaa
}

.has - panel.cms - content - tools.blog - admin - sidebar~.blog - admin - outer {
    width: 100 %;
    padding - right: 280 px;
    position: absolute;
    height: 100 %;
    overflow: hidden hidden;
    box - sizing: border - box
}

.has - panel.cms - content - tools.blog - admin - sidebar~.blog - admin - outer>.ss - tabset {
    position: relative;
    overflow: auto;
    height: 100 %;
    width: 100 %
}

.has - panel.cms - content - tools.blog - admin - sidebar~.blog - admin - outer>.ss - tabset# Title label {
    float: none
}

.has - panel.cms - content - tools.blog - admin - sidebar~.blog - admin - outer>.ss - tabset# Title.middleColumn,
.has - panel.cms - content - tools.blog - admin - sidebar~.blog - admin - outer>.ss - tabset# Title input {
    width: 100 %;
    max - width: 100 %;
    margin - left: 0
}

.has - panel.cms - content - tools.blog - admin - sidebar.cms - content - view>.field+.field {
    margin - top: 10 px
}

.has - panel.cms - content - tools.blog - admin - sidebar.cms - content - view>.field.urlsegment.preview {
    padding - top: 0;
    line - height: 25 px
}

.has - panel.cms - content - tools.blog - admin - sidebar.cms - content - view>.field.urlsegment.edit {
    float: right
}

.has - panel.cms - content - tools.blog - admin - sidebar.cms - content - view>.field.datetime>.middleColumn>.date {
    width: 60 %
}

.has - panel.cms - content - tools.blog - admin - sidebar.cms - content - view>.field.datetime>.middleColumn>.time {
    width: 36 %;
    float: right
}

.has - panel.cms - content - tools.blog - admin - sidebar.cms - content - view>.field.datetime>.middleColumn.middleColumn,
.has - panel.cms - content - tools.blog - admin - sidebar.cms - content - view>.field.datetime>.middleColumn input {
    width: 100 %
}

.has - panel.cms - content - tools.blog - admin - sidebar.collapsed~.blog - admin - outer {
    padding - right: 41 px
}

.has - panel.cms - content - tools.blog - admin - sidebar.collapsed~.blog - admin - outer# Root_Main {
    margin - right: 15 px
}

.has - panel.cms - content - tools.blog - admin - sidebar.cms - content - tools.cms - panel - content {
    width: auto
}

# FeaturedImage.middleColumn {
    clear: none;
    float: left
}

.toggle - description {
    display: inline - block;
    font - size: 1.2 rem;
    width: 20 px;
    height: 20 px;
    margin - top: 1 px;
    cursor: pointer
}

.middleColumn.toggle - description - correct - middle {
    margin - left: 0;
    float: left;
    width: 416 px
}

.tab - content.field p.toggle - description - correct - right {
    display: inline - block;
    margin - left: 0;
    padding - left: 0;
    clear: none;
    float: left
}

.description.toggle - description - correct - description {
    width: 416 px;
    padding: 12 px 0
}

.custom - summary.ui - accordion - content,
.custom - summary.ui - accordion - content.field {
    padding: 0
}

.cms table.ss - gridfield - table tr td.MergeAction {
    width: 225 px
}

.cms table.ss - gridfield - table tr td.MergeAction select {
    width: 150 px
}

.blog - cms - categorisation.toolbar--content {
    margin - top: 0
}

.blog - cms - categorisation.MergeActionReveal: after {
    content: "@";
    font - family: "silverstripe";
    display: inline - block;
    position: relative;
    margin - left: 10 px;
    top: 3 px
}

.blog - cms - categorisation.blog - merge - action {
    margin - top: 5 px
}