millironx/4h-record-books
1
0
Fork 0
mirror of https://github.com/MillironX/4h-record-books.git synced 2024-11-21 13:56:03 +00:00
Code Issues Releases Packages Activity

Changed formatting to be more readable

Browse source
This commit is contained in:
Thomas A. Christensen II 2018-01-06 12:03:02 -07:00
parent 1657fc0b85
commit 32af377650
16 changed files with 393 additions and 425 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
Index.html
View file

@ -50,7 +50,7 @@
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<!-- InstanceBeginEditable name="MainBody" -->
<img class="img-responsive img-thumbnail float-left center-cropped" src="img/woman-keeping-records.jpg" alt="Woman enjoying record keeping" />
<div class="center-cropped background-home"></div>
<h1>
4-H Record Book Portfolios
<br />

363
Section1.html
View file

@ -1,5 +1,6 @@
<!doctype html>
<html><!-- InstanceBegin template="/Templates/_template.dwt" codeOutsideHTMLIsLocked="false" -->
<html>
<!-- InstanceBegin template="/Templates/_template.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta charset="utf-8">
<!-- InstanceBeginEditable name="doctitle" -->
@ -15,21 +16,11 @@
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-main">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="Index.html">
<img src="img/4-H-Club-Emblem.svg" alt="Wyoming 4-H Logo" width="20px" height="20px" />
</a>
</div>
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-main"> <span class="sr-only">Toggle Navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
<a class="navbar-brand" href="Index.html"> <img src="img/4-H-Club-Emblem.svg" alt="Wyoming 4-H Logo" width="20px" height="20px" /> </a> </div>
<div class="collapse navbar-collapse" id="navbar-collapse-main">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Record Books <span class="caret"></span></a>
<li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Record Books <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="Cover.html">Cover Page</a></li>
<li><a href="Section1.html">Section 1</a></li>
@ -45,58 +36,20 @@
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<!-- InstanceBeginEditable name="MainBody" -->
<img class="img-responsive img-thumbnail float-left center-cropped" src="img/Close-upofaveryniceyoungawardwinnercow.jpg" alt="4-H Breeding Beef Project" />
<h1>
Section 1<br />
<small>Project Record</small>
</h1>
<div class="col-lg-8 col-lg-offset-2"> <!-- InstanceBeginEditable name="MainBody" -->
<div class="center-cropped background-sec-1"></div>
<h1> Section 1
&#9679; <small>Project Record</small> </h1>
<div class="row">
<div class="col-md-6 col-md-offset-3">
<div class="btn-group btn-group-justified">
<a href="book/Section1.docx" class="btn btn-primary">
<img src="img/Microsoft-Word-New.svg" alt="Microsoft Word Format"/>
&ensp;
Template
</a>
<a href="example/Section_1.pdf" class="btn btn-danger">
<img src="img/Adobe-Acrobat.svg" alt="Adobe Acrobat PDF Format"/>
&ensp;
Examples
</a>
<div class="btn-group btn-group-justified"> <a href="book/Section1.docx" class="btn btn-primary"> <img src="img/Microsoft-Word-New.svg" alt="Microsoft Word Format"/> &ensp;
Template </a> <a href="example/Section_1.pdf" class="btn btn-danger"> <img src="img/Adobe-Acrobat.svg" alt="Adobe Acrobat PDF Format"/> &ensp;
Examples </a> </div>
</div>
</div>
</div>
<img src="img/Record Book.svg" class="float-left img-responsive center-sm" alt="The components of a 4-H record book" />
<p>
Over half of your 4-H career is spent working on projects, and fittingly, over half of your record book is spent commemorating those projects.
Section 1 provides a framework for planning, completing, and analysing each of your 4-H projects.
How? Let's go through it step-by-step.
</p>
<div class="panel panel-warning float-right max-width-300 center-sm">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-edit"></span>
Note
</h3>
</div>
<div class="panel-body">
When completing a project record for a project carried over from another organization (i.e. a school art project or the Supreme Beef program), the documentation from that organization may fit the criteria for a 4-H project record, and many people choose to submit that documentation as their section 1.
This is acceptable, but the record book committee asks that you respect the judges' time by using the 4-H project record template, and not including extranneous information.
</div>
</div>
<div class="clearfix"></div>
<h2>
<a id="requirements"></a>
Requirements
</h2>
<h2> Requirements </h2>
<table class="table table-bordered table-responsive table-striped table-fixed-width font-mono">
<tr>
<th></th>
@ -129,171 +82,146 @@
<td colspan="3">Lists exhibitions and placings from entire year.</td>
</tr>
</table>
<h2>
<a id="overview"></a>
Overview
</h2>
<p>
Please just fill this box out.
<p> Over half of your 4-H career is spent working on projects, and fittingly, over half of your record book is spent commemorating those projects.
Section 1 provides a framework for planning, completing, and analysing each of your 4-H projects.
How? Let's go through it step-by-step. </p>
<img src="img/Record Book.svg" class="float-left img-responsive center-sm" alt="The components of a 4-H record book" />
<div class="panel panel-warning float-right max-width-300 center-sm">
<div class="panel-heading">
<h3 class="panel-title"> <span class="glyphicon glyphicon-edit"></span> Note </h3>
</div>
<div class="panel-body"> When completing a project record for a project carried over from another organization (i.e. a school art project or the Supreme Beef program), the documentation from that organization may fit the criteria for a 4-H project record, and many people choose to submit that documentation as their section 1.
This is acceptable, but the record book committee asks that you respect the judges' time by using the 4-H project record template, and not including extranneous information. </div>
</div>
<div class="clearfix"></div>
<h2> Overview </h2>
<p> Please just fill this box out.
It's really not that hard, and I'd rather not waste the space (or the bandwidth) to explain in detail.
If you really have questions, contact the Extension Office.
</p>
<h2>
<a id="goals"></a>
Goals
</h2>
<blockquote>
If you aim at nothing, you will hit it every time
<small>Zig Ziglar</small>
</blockquote>
If you really have questions, contact the Extension Office. </p>
<h2 onMouseOver="visibleLink('goals')" onMouseOut="invisibleLink('goals')"><a id="goals" style="display: none;"><span class="glyphicon glyphicon-link"></span></a> Goals</h2>
<blockquote> If you aim at nothing, you will hit it every time <small>Zig Ziglar</small> </blockquote>
<p>Goals provide direction for your 4-H project. If you've ever gone to any motivational leadership conference, you've heard about goals far more than you could ever care to, but the facts show the people with goals acomplish more. Great, you say, how do you make goals? I'm glad you asked.</p>
<p>A goal is an objective or thing desired to happen with SMARTY attributes:</p>
<table class="table table-responsive">
<table class="table-responsive">
<tr>
<th>
<a href="https://openclipart.org/detail/20596/arrow-in-the-gold"><img src="https://openclipart.org/download/20596/SnarkHunter-Arrow-in-the-gold.svg" class="max-width-100 max-height-100" /></a>
<th> <a href="https://openclipart.org/detail/20596/arrow-in-the-gold"><img src="https://openclipart.org/download/20596/SnarkHunter-Arrow-in-the-gold.svg" class="max-width-100 max-height-100" /></a> </th>
<th> <h3>S</h3>
</th>
<th>
<h3>S</h3>
</th>
<td>
<p>
<strong>Specific</strong><br/>
A goal should only cover one area
<td><h4>Specific</h4>
<p>A goal should only cover one area</p>
<dl class="dl-horizontal">
<dt>Bad Example</dt>
<dd>To walk my dog two miles every day this summer and teach her to fetch</dd>
<dt>Good Example</dt>
<dd>
To walk my dog two miles every day
<br />
To teach my dog how to fetch
</dd>
<dd> To walk my dog two miles every day <br />
To teach my dog how to fetch </dd>
</dl>
This goal needed to be split into two goals.
Having more goals is great: just make sure that each goal stands alone.
</p>
<p> This goal needed to be split into two goals.
Having more goals is great: just make sure that each goal stands alone. </p>
<hr />
</td>
</tr>
<tr>
<td>
<a href="https://openclipart.org/detail/13662/ruler"><img src="https://openclipart.org/download/13662/molumen-Ruler.svg" class="max-width-100 max-height-100" /></a>
</td>
<th>
<h3>M</h3>
<td><a href="https://openclipart.org/detail/13662/ruler"><img src="https://openclipart.org/download/13662/molumen-Ruler.svg" class="max-width-100 max-height-100" /></a></td>
<th> <h3>M</h3>
</th>
<td>
<p>
<strong>Measurable</strong><br/>
Someone else should be able to objectively tell if you've met the goal or not.
<td><h4>Measurable</h4>
<p>Someone else should be able to objectively tell if you've met the goal or not.</p>
<dl class="dl-horizontal">
<dt>Bad Example</dt>
<dd>To shoot really well this year in .22</dd>
<dt>Good Example</dt>
<dd>To shoot an average of over 250 points over all my .22 practice shoots this year</dd>
</dl>
Measurable usually involves numbers or binary (true/false) statements.
<p> Measurable usually involves numbers or binary (true/false) statements.
Notice how this example added a way of measuring (average) and a quantitative target (over 250 points).
That is characteristic of measureable goals.
</p>
<h5>What about <em>To do better than last year?</em></h5>
<p>
Invariably, record books are turned in each year with the goal "to do better than last year."
That is characteristic of measureable goals. </p>
<h5>What about <em style="font-style: normal;">To do better than last year</em>?</h5>
<p> Invariably, record books are turned in each year with the goal "to do better than last year."
Sometimes this is measurable, mostly it is not.
It would be far better to identify exactly what you want to improve and find a way to measure that.
If you do resort to this goal, you <b>MUST</b> keep your record book maticulously organised so that the judges can find how you did last year.
</p>
If you do resort to this goal, you <b>MUST</b> keep your record book maticulously organised so that the judges can find how you did last year. </p>
<hr />
</td>
</tr>
<tr>
<td>
<a href="https://openclipart.org/detail/242959/old-scroll"><img src="https://openclipart.org/download/242959/160303_scroll.svg" class="max-width-100 max-height-100" /></a>
</td>
<th>
<h3>A</h3>
<td><a href="https://openclipart.org/detail/242959/old-scroll"><img src="https://openclipart.org/download/242959/160303_scroll.svg" class="max-width-100 max-height-100" /></a></td>
<th> <h3>A</h3>
</th>
<td>
<p>
<strong>Achievable/Attainable</strong><br/>
<b>You</b> must be directly in charge of acomplishing the goal: it cannot depend partially on parents, animals, acts of nature, etc.
<td><h4>Achievable/Attainable</h4>
<p><b>You</b> must be directly in charge of acomplishing the goal: it cannot depend partially on parents, animals, acts of nature, etc.</p>
<dl class="dl-horizontal">
<dt>Bad Example</dt>
<dd>To finish my market hog at a weight between 245 and 280 lbs.</dd>
<dt>Good Example</dt>
<dd>To learn how protein percentage in feed affects rate of gain in hogs</dd>
</dl>
<p>
This does not mean that you cannot ask for help acomplishing your goals, but you do need to be in charge and take initiative for your goals.
No human being can directly control an animal's behavior or weight, another persons opinions, or the weather.
Make sure that your goals do not try to alter these things.
</p>
<hr />
</td>
</tr>
<tr>
<td>
<a href="https://openclipart.org/detail/18412/weightlifting"><img src="https://openclipart.org/download/18412/motudo-WeightLifting.svg" class="max-width-100 max-height-100" /></a>
</td>
<th>
<h3>R</h3>
<td><a href="https://openclipart.org/detail/18412/weightlifting"><img src="https://openclipart.org/download/18412/motudo-WeightLifting.svg" class="max-width-100 max-height-100" /></a></td>
<th> <h3>R</h3>
</th>
<td>
<strong>Realistic</strong><br/>
Your goals should be things you can actually acomplish with the resources (time, money) that you have.
<td><h4>Realistic</h4>
<p>
Your goals should be things you can actually acomplish with the resources (time, money) that you have.</p>
<dl class="dl-horizontal">
<dt>Bad Example</dt>
<dd>To make 20 saddles in the month of January<br/>To carve one drink coaster by fair</dd>
<dd>To make 20 saddles in the month of January<br/>
To carve one drink coaster by fair</dd>
<dt>Good Example</dt>
<dd>To complete two saddles by March of next year</dd>
</dl>
<p>
No 4-Her could have the money to buy materials for 20 saddles, or the time to make 20 saddles within one month: that is unrealistic.
Difficulty can also play a role here.
Making one coaster should not challenge anyone but a 1st-year leathercrafter, and would also be unrealistic.
Making one coaster should not challenge anyone but a 1st-year leathercrafter, and would also be unrealistic.</p>
<hr />
</td>
</tr>
<tr>
<td>
<a href="https://openclipart.org/detail/46075/stop-watch"><img src="https://openclipart.org/download/46075/stop-watch.svg" class="max-width-100 max-height-100"/></a>
</td>
<th>
<h3>T</h3>
<td><a href="https://openclipart.org/detail/46075/stop-watch"><img src="https://openclipart.org/download/46075/stop-watch.svg" class="max-width-100 max-height-100"/></a></td>
<th> <h3>T</h3>
</th>
<td>
<strong>Time-bound</strong><br/>
Set a deadline for your goals.
<td><h4>Time-bound</h4>
<p>
Set a deadline for your goals.</p>
<dl class="dl-horizontal">
<dt>Bad Example</dt>
<dd>To breed half of my rabbit hutch</dd>
<dt>Good Example</dt>
<dd>To have bred half of my rabbit hutch by December</dd>
</dl>
<p>
Because record books are due annually, the defacto time-limit for all record book goals is the record book due date;
so the time component isn't a deal-breaker.
It really shows initative and professionalism, though, if you set a deadline <em>before</em> record books are due.
It really shows initative and professionalism, though, if you set a deadline <em>before</em> record books are due.</p>
<hr />
</td>
</tr>
<tr>
<td>
<a href="https://openclipart.org/detail/271409/why-typography-black"><img src="https://openclipart.org/download/271409/WHY-Typography-Black.svg" class="max-width-100 max-height-100" /></a>
</td>
<th>
<h3>Y</h3>
<td><a href="https://openclipart.org/detail/271409/why-typography-black"><img src="https://openclipart.org/download/271409/WHY-Typography-Black.svg" class="max-width-100 max-height-100" /></a></td>
<th> <h3>Y</h3>
</th>
<td>
<strong>Why</strong><br/>
Every goal should have a bigger purpose or reason behind it.
<td><h4>Why</h4>
<p>Every goal should have a bigger purpose or reason behind it.</p>
<dl class="dl-horizontal">
<dt>Bad Example</dt>
<dd>To volunteer for three leadership positions in the community this year (because I need another Youth Leadership goal for my record book)</dd>
<dt>Good Example</dt>
<dd>To volunteer for three leadership positions in the community this year (because I need to improve my public speaking and organizational skills)</dd>
</dl>
</td>
<p>
You don't write the "why" in your record book, but if you have a good why, you will write better goals and be more motivated to acomplish those goals.
</p>
<hr /></td>
</tr>
</table>
<p>How do you write SMARTY goals? Here's a way I like to do it:</p>
@ -307,128 +235,67 @@
</ol>
<p>I've found that, by writing down the goals early along with the why behind them, I will be more likely to acomplish my goals.
Try it yourself, and I think you will, too.</p>
<h2>
<a id="projectdescription"></a>
Project Description
</h2>
<blockquote>
If you can't explain it to a six year old, you don't understand it yourself.
<small>Albert Einstein</small>
</blockquote>
<p>
Use the project description to explain what you did in the past year to someone who doesn't know anything about that subject.
<h2> Project Description </h2>
<blockquote> If you can't explain it to a six year old, you don't understand it yourself. <small>Albert Einstein</small> </blockquote>
<p> Use the project description to explain what you did in the past year to someone who doesn't know anything about that subject.
A good project description should read almost like a newspaper brief about your project.
Like a good reporter, include information on the
</p>
Like a good reporter, include information on the </p>
<ul>
<li>
<strong>Who</strong> (parents, siblings, project leaders)
</li>
<li>
<strong>What</strong> (leathercraft halter, market steer show, cooking recipe)
</li>
<li>
<strong>When</strong> (at fair, at the spring judging contest, at home all year)
</li>
<li>
and
</li>
<li>
<strong>Where</strong> (at Hansen arena, at home, at SAREC)
</li>
<li> <strong>Who</strong> (parents, siblings, project leaders) </li>
<li> <strong>What</strong> (leathercraft halter, market steer show, cooking recipe) </li>
<li> <strong>When</strong> (at fair, at the spring judging contest, at home all year) </li>
<li> and </li>
<li> <strong>Where</strong> (at Hansen arena, at home, at SAREC) </li>
</ul>
<p>
of your project.
</p>
<p> of your project. </p>
<div class="panel panel-warning">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-edit"></span>
Note
</h3>
<h3 class="panel-title"> <span class="glyphicon glyphicon-edit"></span> Note </h3>
</div>
<div class="panel-body">
For many years, the role of the project description was very ambiguous.
<div class="panel-body"> For many years, the role of the project description was very ambiguous.
As such, there are very few record books that followed these guidelines, and most of the examples do not.
Please use discernment when viewing the example project descriptions, and remember to use the reporter-like style when completing your record book.
Who knows, then your book might wind up in the next set of examples.
Who knows, then your book might wind up in the next set of examples. </div>
</div>
</div>
<h2>
<a id="sizeandscope"></a>
Size &amp; Scope
</h2>
<blockquote>
There's always a four-point-five percent margin of error, plus or minus.
<small>The Accountant in <em>The Accountant</em> (Short film)</small>
</blockquote>
<p>
The label &quot;Size &amp; Scope&quot; has caused confusion for several generations of 4-Hers.
Let's define these words to clear that up.
</p>
<h2> Size &amp; Scope </h2>
<blockquote> There's always a four-point-five percent margin of error, plus or minus. <small>The Accountant in <em>The Accountant</em> (Short film)</small> </blockquote>
<p> The label &quot;Size &amp; Scope&quot; has caused confusion for several generations of 4-Hers.
Let's define these words to clear that up. </p>
<dl class="dl-horizontal">
<dt>Size</dt>
<dd>is numbers, i.e. the number of hours spent, dollars invested, contest points earned, pounds of feed, etc.</dd>
<dt>Scope</dt>
<dd>indicates the varieties, different types, recipes, plants or animal breeds with which you worked.</dd>
</dl>
<p>
In short, Size &amp; Scope is a <abbr title="A detailed description including numbers of all substances used. Also the name of a class I'm glad I didn't have to take in college.">quantitative analysis</abbr> of everything you used to complete your project.
<p> In short, Size &amp; Scope is a <abbr title="A detailed description including numbers of all substances used. Also the name of a class I'm glad I didn't have to take in college.">quantitative analysis</abbr> of everything you used to complete your project.
Good Size &amp; Scope sections vary widely depending on the project, but all of them record the items (physical or intellectual) used in the project, and the time and money spent on the project.
Take a look at the examples for ideas to get you started.
</p>
Take a look at the examples for ideas to get you started. </p>
<div class="panel panel-success">
<div class="panel-heading">
<h3 class="panel-title">
<span class="glyphicon glyphicon-bullhorn"></span>
Tip
</h3>
<h3 class="panel-title"> <span class="glyphicon glyphicon-bullhorn"></span> Tip </h3>
</div>
<div class="panel-body">
<strong>Financial Information</strong> and <strong>Market Summary</strong> tables are provided under Size &amp; Scope.
<div class="panel-body"> <strong>Financial Information</strong> and <strong>Market Summary</strong> tables are provided under Size &amp; Scope.
They are not intended to serve as a full Size &amp; Scope, but they may be useful to augment your existing data.
Use them if you think they are appropriate to your project.
Use them if you think they are appropriate to your project. </div>
</div>
</div>
<h2>
<a id="knowledgeandskills"></a>
Knowledge &amp; Skills Acquired
</h2>
<blockquote>
Receive my instruction, and not silver; and knowledge rather than choice gold.
<small>Proverbs 8:10 KJV</small>
</blockquote>
<p>
Knowledge &amp; Skills Acquired serves two purposes.
<h2> Knowledge &amp; Skills Acquired </h2>
<blockquote> Receive my instruction, and not silver; and knowledge rather than choice gold. <small>Proverbs 8:10 KJV</small> </blockquote>
<p> Knowledge &amp; Skills Acquired serves two purposes.
First, it allows you to address whether or not you met your goals.
Second, it tells readers what you actually learned this year in your project.
</p>
<p>
To complete Knowledge &amp; Skills, create a heading for each <a href="#goals">goal</a> you wrote.
Second, it tells readers what you actually learned this year in your project. </p>
<p> To complete Knowledge &amp; Skills, create a heading for each <a href="#goals">goal</a> you wrote.
Write a paragraph (at least three sentences) explaining if you met the goal, how you met the goal (or why you did not meet the goal), and what you learned from the goal.
After each goal is addressed, include paragraphs explaining anything else you learned about your project area.
Remember that your readers might not know anything about your project area, so be sure to explain it in a way that a layperson can understand.
</p>
<h2>
<a id="summary"></a>
Exhibition Summary
</h2>
<!-- InstanceEndEditable -->
Remember that your readers might not know anything about your project area, so be sure to explain it in a way that a layperson can understand. </p>
<h2> Exhibition Summary </h2>
<!-- InstanceEndEditable --> </div>
</div>
</div>
</div>
<!--Bootstrap scripts-->
<script src="script/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="script/bootstrap.min.js" type="text/javascript"></script>
<script src="script/site.js" type="text/javascript"></script>
</body>
<!-- InstanceEnd --></html>
<!-- InstanceEnd -->
</html>

81
css/site.css
View file

@ -1,5 +1,9 @@
@charset "utf-8";
/* CSS Document */
body {
font-size: 14pt;
}
.background-grid {
background-repeat: no-repeat;
background-position: center;
@ -7,12 +11,22 @@
min-height: 150px;
}
.background-home {
background-image: url(../img/woman-keeping-records.jpg);
}
.background-eclipse {
background-image: url(../img/total-solar-eclipse-scottsbluff-ne.jpg);
}
.background-bull-calf {
background-image: url(../img/number-2-bull-calf.jpg);
}
.background-cover {
background-image: url(../img/Newnotebookandtexturewoodencoverwithpencil.jpg);
}
.background-sec-1 {
background-image: url(../img/Close-upofaveryniceyoungawardwinnercow.jpg);
background-image: url(../img/Close-up-of-a-very-nice-young-award-winner-cow.jpg);
}
.background-sec-2 {
@ -55,11 +69,13 @@
/*From https://stackoverflow.com/questions/11552380/how-to-automatically-crop-and-center-an-image*/
.center-cropped {
width: 100px;
height: 100px;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width: 100%;
height: 225px;
overflow: hidden;
display: block;
}
/* Set the image to fill its parent and make transparent */
@ -67,11 +83,11 @@
min-height: 100%;
min-width: 100%;
/* IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
/*-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";*/
/* IE 5-7 */
filter: alpha(opacity=0);
/*filter: alpha(opacity=0);*/
/* modern browsers */
opacity: 0;
/*opacity: 0;*/
}
/*From https://css-tricks.com/text-blocks-over-image/ */
@ -80,14 +96,14 @@
width: 100%; /* for IE 6 */
}
h4 {
h6 {
position: absolute;
top: 0;
left: 0;
width: 100%;
}
h4 span {
h6 span {
color: white;
/*font: bold 24px/45px Helvetica, Sans-Serif;*/
letter-spacing: -1px;
@ -101,10 +117,12 @@ h4 span.spacer {
.font-mono {
font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
overflow: hidden
}
.table-fixed-width {
table-layout: fixed;
font-size: smaller;
}
.max-width-300 {
@ -118,3 +136,50 @@ h4 span.spacer {
.max-height-100 {
max-height: 100px;
}
p {
font-size: 14pt;
}
h1 {
font-variant-caps: all-petite-caps;
}
h1 small {
font-variant-caps: normal;
}
h2 {
padding-top: 12pt;
font-variant-caps: all-petite-caps;
}
h3 {
font-weight: bolder;
}
h4 {
text-decoration: underline;
font-size: 13pt;
}
h5 {
font-style: italic;
font-size: larger;
text-decoration: underline;
}
blockquote {
background: linear-gradient(to right,lightgray,#F3F3F3);
border-left: 5px solid black ;
}
.underlined {
text-decoration: underline;
}
th, td {
vertical-align: top;
}

BIN
img/Background.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 386 KiB

BIN
img/Close-up-of-a-very-nice-young-award-winner-cow.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 416 KiB

BIN
img/Close-upofaveryniceyoungawardwinnercow.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 18 KiB

BIN
img/Man making speech.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 274 KiB

BIN
img/Old Fashion White Church with a Steeple.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 733 KiB

BIN
img/Old scroll paper on wooden background..jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 360 KiB

BIN
img/Pretty woman is a proffessional photographer with dslr camera.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 265 KiB

BIN
img/Team of volunteers picking up litter in park.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 361 KiB

BIN
img/number-2-bull-calf.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1 MiB

BIN
img/total-solar-eclipse-scottsbluff-ne.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 110 KiB

BIN
img/winner.jpg
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 386 KiB

10
script/site.js
View file

@ -11,3 +11,13 @@ $(function() {
.before("<span class='spacer'>")
.after("<span class='spacer'>");
});
function visibleLink(linkId) {
'use strict';
$('.'+linkId).css({'display': 'inline-block'});
}
function invisibleLink(linkId) {
'use strict';
$('.'+linkId).css({'display': 'none'});
}

26
untitled.html Normal file
View file

@ -0,0 +1,26 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<p>Ever since I got my goats I have tested annually for Caseous Lymphadenitis (CL) and Caprine Arthritic Encephalitis (CAE). I had been told it was a good idea and saw many herds stating that they were CL and CAE negative. I never asked why it was so important to test for these. Here is why you should.</p>
<h4>Caseous Lymphadenitis commonly called CL</h4>
<p>CL is an untreatable disease that affects the lymphatic system of goats and other mammals.&nbsp; CL is caused by the bacterium <em>Corynebacterium pseudotuberculosis,</em> it can show it&rsquo;s self in lumps around the lymph nodes, by the neck, jaw, shoulder, flank, udder, and along the back of the thigh. They can also have internal abscesses on their lungs and livers as well. The bacterium is spread by the puss that comes out of the abscess and also can be spread by the goats coughing and the mucus from them coughing. When the bacterium enters it goes through the goat&rsquo;s blood stream. The bacterium then works on destroying the lymph tissue. It can get into the lymph node and then fill it, not letting the lymph node or nodes work properly. The lymph system is very important to all bodies. The lymphatic system helps fight illnesses and bacteria. So CL compromises the system. When the immune system cannot work properly and therefore your goat can get even sicker an even die. &nbsp;CL can take 2 weeks to many months to be seen.</p>
<p>Even though CL is untreatable, there is a vaccine. However it is not approved for lactating goats.</p>
<p>Corynebacterium pseudotuberculosis can infect humans as well. It is only thought to infect humans if they get the pus in their mouth, however this is not known for certain. So, <u>always </u>be careful when dealing with goats that have Caseous Lymphadenitis or the possibility of having it.</p>
<p>Not all abscesses are CL. So do not worry too much if your goat gets a lump however treat it as soon as possible. If you think it might be CL you can take the goat to the vet and have the puss tested to check for CL. Remember the Lymph Node is usually were CL abides and is around the neck, jaw, shoulder, flank, thigh, and udder. Some abscesses such as those on the jaw can be caused by food stuck in their cheek. And other lumps can be caused by other infections or bugs bites or if they are in a pasture with branches they can get a lump from running into a tree to hard. And if your give an injection wrong that can leave a lump too. &nbsp;Whenever working with goats with abscesses it would be a good idea to wear gloves no matter what they have so you do not get sick too or pass on the infection to other animals you may have. </p>
<h4>Caprine Arthritic Encephalitis also called CAE or CAEV</h4>
<p>In 2007 up to 81% of Dairy goats had CAE.<span style="line-height: 200%; font-size: 8pt;">1</span> CAE is a disease that kills white blood cells in your goat, damaging and hurting their immune system. CAE shows itself by swelling around the knees, so knobby looking knees, and sometimes hardness in the udder. Some goats will not show any signs and still have CAE. On some goats if they do not have hair is missing on their knees it could mean they have CAE. Young goats who have CAE sometimes lean their head against a wall, because of inflammation of the brain stem and brain tissues. CAE is passed through colostrum, milk, and body fluids, (such as semen from bucks.)You can take the kids off their dams and pasteurize the dam&rsquo;s milk and then feed it to the kids and you can cut down on CAE spreading. A goat can get CAE and not show any signs for month and years, in fact many goats never show any signs through their whole life. Currently there is no known cure or vaccine. And it is not known to be communicable to humans.</p>
<p>Testing for CL and CAE is an important thing to do. Both are very painful for the animal and can cause production and longevity to go down not only for one goat but for your entire herd. Testing yearly would be a good idea if you take your goats to shows or you have a new goat in your herd or if the neighbor&rsquo;s goat came over for a visit. If your herd is a closed herd in would not hurt to have them tested every 5 years just to make sure all is well as goats can be asymptomatic.</p>
<p>The most common and reliable why to test for both CL and CAE is with blood testing. You can have your veterinarian draw the blood and send it to a lab for you. You can draw the blood yourself however people get a lot more false positives that way. You can sometimes get false negatives too so that is a reason why testing yearly is a good idea.&nbsp; You want NEGATIVES for both CL and CAE.</p>
<p>I now know why I test for CL and CAE and am glad even though I did not know what they were that I tested for them. I hope to share this with many people who are having problems with CL and CAE in their herds all around the world.</p>
<ol>
<li>
<p><a href="http://www.cfrsph.iastate.edu/factsheets/pdfs/caprine_arthritis_enclephalitis.pdf"><span style="color: #0000ff;">www.cfrsph.iastate.edu/factsheets/pdfs/caprine_arthritis_enclephalitis.pdf</span></a></p>
</li>
</ol>
</body>
</html>