Sermon Page HTML code edit

I have some knowledge of HTML, yet perhaps not enough to resolve the width issue I believe my site is receiving from my editing of the Sermon Browsers’ sermon page HTML code.

Below is my editing of the default code. All I have done so far is eliminate the code I do not wish to present through the use of comments, however every time a user visits our site (please refresh if you do not encounter problem) the width of the plugin cuts off the primary left content sidebar and clips off the entire footer.

I am able to reset the code to default and receive no errors. I have switched themes before and I have come to the conclusion that the source of the issue must relate to the HTML editing concerning the width of the plugin.

Any guidance on either the sermon page HTML code of this plugin, or the related CSS code, or even guidance on editing the back end .php file would be helpful.

Here is the edited HTML code from the sermon page template

<div class="sermon-browser-results"> </div>
	<h2>[sermon_title] <span class="scripture">([passages_loop][passage][/passages_loop])</span> [editlink]</h2>
	[preacher_image]<span class="preacher">[preacher_link], [date]</span><br />
	This sermon is part of [series_link] series, preached during [service_link]<br />
	<div class="sermon-description">[sermon_description]</div>
        <!--
	<p class="sermon-tags">Tags: [tags]</p>
        -->
	[files_loop]
		<br />[file_with_download]<br />
	[/files_loop]
	[embed_loop]
		<br />[embed]<br />
	[/embed_loop]
	<!--
	<br />[preacher_description]<br />
	-->
	<!--
	<table class="nearby-sermons">
		<tr>
			<th class="earlier">Earlier:</th>
			<th>Same day:</th>
			<th class="later">Later:</th>
		</tr>
		<tr>
			<td class="earlier">[prev_sermon]</td>
			<td>[sameday_sermon]</td>
			<td class="later">[next_sermon]</td>
		</tr>
	</table>
	-->
	[kjvtext]
	<!--
   	[creditlink]
	-->
</div>

Here is the CSS code. Please note this code is the default CSS code. I have previously edited all fields related to width and width px in a prior attempt to find a solution. I have had no success and since reverted to the default code as seen below.

.sermon-browser h2 {
	clear: both;
}

div.sermon-browser table, div.sermon-browser td {
	border-top: none;
	border-bottom: none;
	border-left: none;
	border-right: none;
}

div.sermon-browser tr td {
	padding: 4px 0;
}

div.sermon-browser table.podcast table {
	margin: 0 1em;
}

div.sermon-browser td.sermon-title, div.sermon-browser td.sermon-passage {
	font-family: "Helvetica Neue",Arial,Helvetica,"Nimbus Sans L",sans-serif;
}

div.sermon-browser table.sermons {
	width: 100%;
	clear:both;
}

div.sermon-browser table.sermons td.sermon-title {
	font-weight:bold;
	font-size: 140%;
	padding-top: 2em;
}

div.sermon-browser table.sermons td.sermon-passage {
	font-weight:bold;
	font-size: 110%;
}

div.sermon-browser table.sermons td.preacher {
	border-bottom: 1px solid #444444;
	padding-bottom: 1em;
}

div.sermon-browser table.sermons td.files img {
	border: none;
	margin-right: 24px;
}

table.sermonbrowser td.fieldname {
	font-weight:bold;
	padding-right: 10px;
	vertical-align:bottom;
}

table.sermonbrowser td.field input, table.sermonbrowser td.field select{
	width: 170px;
}

table.sermonbrowser td.field  #date, table.sermonbrowser td.field #enddate {
	width: 150px;
}

table.sermonbrowser td {
	white-space: nowrap;
	padding-top: 5px;
	padding-bottom: 5px;
}

table.sermonbrowser td.rightcolumn {
	padding-left: 10px;
}

div.sermon-browser div.floatright {
	float: right
}

div.sermon-browser div.floatleft {
	float: left
}

img.sermon-icon , img.site-icon {
	border: none;
}

table.podcast {
	margin: 0 0 1em 0;
}

.podcastall {
	float:left;
	background: #fff0c8 url(wp-content/plugins/sermon-browser/sb-includes/icons/podcast_background.png) repeat-x;
	padding: 0.5em;
	font-size: 1em;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
}

.podcastcustom {
	float:right;
	background: #fce4ff url(wp-content/plugins/sermon-browser/sb-includes/icons/podcast_custom_background.png) repeat-x;
	padding: 0.5em;
	font-size: 1em;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
}

td.podcast-icon {
	padding-right:1em;
}

div.filtered, div.mainfilter {
	text-align: left;
}

div.filter {
	margin-bottom: 1em;
}

.filter-heading {
	font-weight: bold;
}

div.sermon-browser-results span.preacher {
	font-size: 120%;
}

div.sermon-browser-results span.scripture {
	font-size: 80%;
}

div.sermon-browser-results img.preacher {
	float:right;
	margin-left: 1em;
}

div.sermon-browser-results div.preacher-description {
	margin-top: 0.5em;
}

div.sermon-browser-results div.preacher-description span.about {
	font-weight: bold;
	font-size: 120%;
}

span.chapter-num {
	font-weight: bold;
	font-size: 150%;
}

span.verse-num {
	vertical-align:super;
	line-height: 1em;
	font-size: 65%;
}

div.esv span.small-caps {
	font-variant: small-caps;
}

div.net p.poetry {
	font-style: italic;
	margin: 0
}

div.sermon-browser #poweredbysermonbrowser {
	text-align:center;
}
div.sermon-browser-results #poweredbysermonbrowser {
	text-align:right;
}

table.nearby-sermons {
	width: 100%;
	clear:both;
}

table.nearby-sermons td, table.nearby-sermons th {
	text-align: center;
}

table.nearby-sermons .earlier {
	padding-right: 1em;
	text-align: left;
}

table.nearby-sermons .later {
	padding-left: 1em;
	text-align:right;
}

table.nearby-sermons td {
	width: 33%;
	vertical-align: top;
}

ul.sermon-widget {
	list-style-type:none;
	margin:0;
	padding: 0;
}

ul.sermon-widget li {
	list-style-type:none;
	margin:0;
	padding: 0.25em 0;
}

ul.sermon-widget li span.sermon-title {
	font-weight:bold;
}

p.audioplayer_container {
	display:inline !important;
}

div.sb_edit_link {
	display:inline;
}
h2 div.sb_edit_link {
	font-size: 80%;
}

.sb-clear {
	clear:both;
}

https://ww.wp.xz.cn/plugins/sermon-browser/