    h1 {
        color: #3c3;
        text-align: center;
        font-family: trebuchet MS, sans-serif;
        font-size: 36px;
        text-shadow: 2px 2px green;
        margin-top: -5px;
        /*margin-bottom: -0px;*/
        /* font-weight: 100;*/
        font-style: italic;
        /*z-index: 5;*/
    }
    h2 {
        text-align: center;
        font-family: trebuchet MS, sans-serif;
        font-size: 20pt;
        color: green;
        /*text-shadow: 1px 1px #ff0;*/
        margin-top: -5px;
        /*margin-bottom: -0px;*/
    }
    h2.head2 {
        color: green;
        text-shadow: 1px 1px yellow;		
    }
    h3 {
        font-family: trebuchet MS, sans-serif;
        font-size: 1.25em;
        color: blue;
        margin-top: -5px;
        margin-bottom: 2px;
    }
    h4 {
        font-family: trebuchet MS, sans-serif;
        font-size: 1.5em;
        color: blue;
        text-shadow: 1px 1px grey;
        margin-top: -0px;
        margin-bottom: 15px;
    }
    h5 {
        font-family: trebuchet MS, sans-serif;
        font-size: 13pt;
        color: black;
        text-shadow: 1px 1px red;
        margin-top: 5px;
        margin-bottom: 5px;
    }
	h6 {
        text-align: center;
        font-family: trebuchet MS, sans-serif;
        font-size: 14pt;
        color: green;
        /*text-shadow: 2px 2px #ff0;*/
        margin-top: -5px;
        /*margin-bottom: -0px;*/
    }
	a[href^=tel]{ /* This block stops Apple Safari browser from changing the style of phone numbers */
		text-decoration: inherit;
		color: inherit;
	}
	.trump {
		padding: 15px;
		background: red;
        text-align: center;
        color: white;
        font-family: trebuchet MS, sans-serif;
        font-size: 20px;
	}
    .h3left {
        color: #F00;
        margin-left: 2.3em;
    }
	.white {
		background: white;
	}
	.trial {
		background: purple;
	}
    .center {
        text-align: center;
    }
    .adds {
        background: white;
        border-style: double;
        border: 2px white;
        /* border-radius: 5px; */
        margin-bottom: 0px;
        /* padding-bottom: 10px; */
        text-align: center;
        /* padding-bottom: 15px; */
    }
    .topmargin {
        padding-bottom: 5px;
        background: #3c3;
    }
	.container .jumbotron { 
		border: 1px solid black;
		border-radius: 0px;
	}
    .jumbotron {
		position: static;
        z-index: 1;
        background: url(/images/AngelicaRoscoe.JPG);
        /* margin-top: 0; */
        margin-bottom: 0;
        padding-bottom: 2px;
        padding-top: 2px;
    }
    .jumbotron h1 {
        color: yellow;
    }
    .head {
        color: yellow;
        text-shadow: 2px 2px green;
    }
	.navbartitle {
        font-family: trebuchet MS, sans-serif;
        font-size: 18px;
        color: black;
		text-shadow: 1px 1px yellow;
        margin-top: -1px;
        margin-bottom: 2px;
    }
    .attention {
        color: green;
        font-weight: bold;
    }
    .navbar { /*controlling navbar border and background*/
        border: 1px solid black;
        border-radius: 25px;
        background: lightgreen;
        margin-top: 0;
        margin-bottom: 0;
    }
    .navbar-header > a { /* This group controls the font of the navbar brand or in this case phone number */
        font-size: 13pt;
        color: red;
    }
    .navbar .navbar-nav { /*this and the next cause the navbar to center in the window as opposed to be positioned left*/
        display: inline-block;
        float: none;
        vertical-align: top;
    }
    .navbar .navbar-collapse { /*see above notation*/
        text-align: center;
    }
    .navbar-default .navbar-nav > li > a {/*this block controls the font in the navbar*/
        font-size: 14pt;
        color: #300; /*Change active text color here*/
        /*text-shadow: 2px 2px #ff0;*/
    }
    .navbar-default .navbar-nav > li > a:hover {/*this block controls the background color of a hovered link in the navbar*/
        background-color: #ADD8E6;
    }
    .dropdown-menu > li > a:hover { /* This block controls the color of the hovered link in the dropdown menus*/
		background-color: #ADD8E6;
    }
    .navbar-default a.navbar-brand {
        color: black;
    }
    .navbar-default .navbar-brand:hover {
        color: black;
    }
    body {
        background: #3c3;
    }
    .backimage { /* I was using this to attempt a background image with opacity, and nothing worked for obvious reasons */
        position: absolute;
        background: url(/images/RoscoeA1.JPG);
        z-index: 2;
        opacity: .2;
    }
    .pet {
        background: #e6e6ff; /*did not matter whether class vs id, or background vs background-image, or whether or not the .. was used before the /. However it did matter if the leading / was used, but more than anything else, the case of the jpg or JPG was the most significant factor in what did and what did not work.*/
        /*position: static;
        z-index: 1;*/
        margin-top: 0px;
        margin-left: -10px;
        padding: 5px;
        padding-top: 15px;
        border: 1px solid black;
        /* border-radius: 5px; */
    }
    .farm { /* I just never changed this name from when I was working on the veterinary site */
        background: #cff;
        /*position: static;
        z-index: 1;*/
        margin-top: 0px;
        margin-right: -10px; /* This rule (also used on .pet) reduces the space between colums on wide screen devices, but without @media rule below, disaligns colums on narrow views */
        padding: 5px;
        padding-top: 15px;
        border: 1px solid black;
        /* border-radius: 5px; */
        opacity: 1;
    }
    .farmi {
        position: relative;
        /*z-index: 1; /* z-index only applies to positioned elements set to one of these three: absolute, fixed or relative */
        /*opacity: 100;*/
        /*background: inherit;*/
        margin-top: 0px;
        margin-right: -10px; /* This rule (also used on .pet) reduces the space between colums on wide screen devices, but without @media rule below, disaligns colums on narrow views */
        padding: 5px;
        padding-top: 15px;
        border: 1px solid black;
        /* border-radius: 10px; */
    }
    .fullwidth {
        background: #cff;
        margin-top: 0px;
        margin-right: 0px;
        padding: 5px;
        padding-top: 15px;
        border: 1px solid black;
        /* border-radius: 10px; */
    }
    @media (max-width: 1000px) {
        /* This rule is applied to pages with two colums where the narrowing of the space between the colums caused the right borders to become disaligned on narrow media devices*/
        .farm {
            margin-right: 0px;
        }
        .pet {
            margin-left: 0px;
        }
    }
    .lwrap {/*These two items is what floats images to the left and right with text wrap*/
        float: left;
        margin-right: 5px;
    }
    .lwrapz {/*These two items is what floats images to the left and right with text wrap*/
        position: relative;
        z-index: -1;
        opacity: .2;
        /*float: left;
        margin-right: 5px;*/
    }
    .rwrap {
        float: right;
        margin-left: 5px;
    }
    #header {
        /*text-align: center;*/
        /*background-color: white;*/
        padding-bottom: 15px; /* This puts the white space below the text*/
        /*opacity: 0.5;*/
        /*border: none;*/
    }
    ul.standard { /* This was to override the bootstrap settings */
        font-family: trebuchet MS, sans-serif;
        font-size: 12pt;
		margin-right: 1em;
    }
	ul.modtab {
        font-family: trebuchet MS, sans-serif;
        font-size: 12pt;
		margin-right: 1em;
    }
    ul.modtab li {/* this class was created to allow a list indent that matched the "tab" class used on paragraphs. This puts a 5px space at the bottom of all list items*/
        margin-bottom: 1em;
		margin-left: 1em; /* I had to make this a negative to override the bootstrap indent mostly for phones where the gap on the left was to wide. I thought about using @media, but decided against it */
    }
    ol.standard {
        font-family: trebuchet MS, sans-serif;
        font-size: 12pt;
    }
    ol.standard li {/*This puts a 5px space at the bottom of all list items*/
        margin-bottom: 1em;
    }
    .normal {
        width: auto;
        border: 2px solid black;
        background-color: White;
        /* border-radius: 10px; */
        box-shadow: 6px 6px 6px #999;
        padding: 1em;
        padding-bottom: .1em;
        margin-bottom: .5em;
    }
    a {
        font-family: trebuchet MS, sans-serif;
        font-size: 12pt;
    }
    p {
        margin: 0em 1em 1em;
        font-family: trebuchet MS, sans-serif;
        font-size: 12pt;
    }
    .indent { /* This will add specified margin to the left and right */
		margin-left: 2em;
		margin-right: 2em;
    }
	.tab { /* I created this class to set special paragraph tabbing for better recognition */
		margin: 0em 1em 1em 2em; /*top, right, bottom, left - I reduced the left indent because on phones, the gap on the left was to wide */
	} 
    .red { /*used in emergencies*/
        margin-top: 5px;
        margin-bottom: 15px;
        font-family: trebuchet MS, sans-serif;
        font-size: 12pt;
        color: red;
    }
    #blue {
        color: blue;
    }
    #yellow {
        color: yellow;
    }
    table th { /*This was the only way I could get the text in the table heading to align to the center*/
        text-align: center;
    }
    .fine {
        font-family: trebuchet MS, sans-serif;
        font-size: 8pt;
    }
    .finesub {
        font-family: trebuchet MS, sans-serif;
        font-size: 9pt;
        margin-bottom: 6px;
    }
    .finemain {
        font-family: trebuchet MS, sans-serif;
        font-size: 6pt;
    }
    .fine-caption {
        font-family: trebuchet MS, sans-serif;
        font-size: 8pt;
        font-weight: bold;
        color: green;
    }
    .popover {
        border-radius: 6px;
    }
    .popover-title {
        font-size: 15px;
        font-weight: bold;
    }
    .popover-content {
        font-size: 12px;
    }
    .change {
        font-style: italic;
        color: #800000;
        text-shadow: .5px .5px #f00;
    }
    .footer {
        background-color: #48d1cc;
        border: 1px solid black;
        border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
        padding-top: 0.7em;
        padding-left: .7em;
        padding-right: .7em;
        /*padding-bottom: 1em;*/
        text-align: center;
        clear: both;
        font-size: 12px;
        font-style: oblique;
    }
