/*   
Author: themasterlab.com
Date: May 15, 2012
File Info: Cappel Canine - White, Teal, Blue
Color Scheme:
  #EEEEEE - off white - body bg, container bg, header bg
  #23B5C2 - teal - text, top and bottom bar, links, image borders
  #2D3448 - blue (dark) - top and bottom bar, links, image borders
  #1B1B1B - black (matte) - headings, side menu titles, paragraph text
*/

body {
	margin: 0;
	padding: 0;
	background-color: #333333;
	background-image: url(../images/cc_bg_1x1_2024.jpg);
	background-repeat: repeat;
}
#container {
	width: 90%;
	text-align: left;
	margin: 0 auto;
	color: #2D3448;
	background-color: #EEEEEE;
	border: 4px solid #23B5C2;
	font-family: Tahoma, Helvetica, Verdana, sans-serif;
}
#main-content {
	padding: 0 50px;
}
#main-content p {
	padding: 10px;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: lighter;
}
#main-content ul {
	font-family: Helvetica, Arial, sans-serif;
	font-weight: lighter;
}
#video {
	margin-top: 20px;
	border: 5px solid #2D3448;
}

/* header */

#header {
	margin-top: 5px;
	margin-left: 20px;
	height: 205px;
}
#header h1 {
	font-style: italic;
	font-size: 390%;
	padding-left: 230px;
	margin-top: -160px;
}
#header h2 {
	color: #23B5C2;
	font-style: italic;
	font-size: 100%;
	margin-left: 380px;
	margin-top: -35px;

}
#header h3 {
	font-style: italic;
	font-size: 95%;
	margin-left: 450px;
	margin-top: 10px;
}

/* content headings */
#content h1, h2, h3, h4 {
	color: #2D3448;
	font-weight: bold;
}
#content h1 {
	font-size: 120%;
}
#content h2 {
	font-size: 110%;
}
#content h3 { /* IE needs this separate */
	font-size: 95%;
}
/* navigation */

a:link, a:visited {
	color: #2D3448;
}
a:hover {
	color: #23B5C2;
}
#top-nav {
	font-size: 120%;
	text-align: center;
	height: 30px;
	padding: 5px 0;
	clear: both;
	background-color: #2D3448;
}
#top-nav ul {
	list-style: none;
	margin: 0;
	padding-top: 3px;
}
#top-nav li {
	display: inline;
}
#top-nav li a {
	padding: 0 15px;
}
#top-nav a:link, #top-nav a:visited, #top-nav a:active {
	color: #EEEEEE;
	text-decoration: none;
}
#top-nav a:hover {
	color: #23B5C2;
	text-decoration: none;
}
#bottom-nav {
	font-size: 90%;
	margin-top: 10px;
	text-align: center;
	clear: both;
}
#bottom-nav ul {
	list-style: none;
	margin: 0;
	padding: .5em 0 .5em 0;
}
#bottom-nav li {
	display: inline;
}
#bottom-nav li a {
	padding-right: 3px;
	padding-left: 3px;
}
#bottom-nav a:link, #bottom-nav a:visited, #top-nav a:active {
	color: #23B5C2;
	font-weight: bold;
	text-decoration: none;
}
#bottom-nav a:hover, #bottom-nav a:focus {
	color: #333333;
	font-weight: bold;
	text-decoration: none;
}

/* top and bottom bar */

#top-bar {
	background-image: url(../images/bar_blue_white_teal_25px.png);
	background-color: #23B5C2;
	height: 25px;
}
#bottom-bar {
	background-image: url(../images/bar_blue_white_teal_25px.png);
	background-color: #23B5C2;
	height: 25px;
}
/* footer */
#footer {
	text-align: center;
	margin-top: 20px;
}
#copyright {
	margin-top: 10px;
	text-align: center;
	font-size: 85%;
}
/* social media in the footer */
#social_media {
	margin-top: -15px;
	list-style: none;
}
#social_media ul {
	list-style: none;
	text-align: center;
}
#social_media li {
	display: inline;
}
#main-content blockquote p .first_word {
	font-size: 24px;
}
#services_home {
	font-size: 15px;
	text-align: center;
	background-color: #23B5C2;
	padding: 10px 2px;
	border-radius: 25px;
}
#services_home a:link, #services_home a:visited, #services_home a:active {
	color: #EEEEEE;
	font-weight: bold;
	text-decoration: none;
}
#services_home a:hover, #services_home a:focus {
	color: #2D3448;
	font-weight: bold;
	text-decoration: none;
}
#contact_pg {
	font-size: 16px;
	margin-bottom: 50px;
}
#contact_pg h1 img {
	float: right;
	border: 10px solid #333;
}

                          /* tags */



                          /* classes */
.img_border {
	border: 10px solid #2D3448;
}
.justify {
	text-align: justify;
}
.signature {
	font-size: 16px;
	font-weight: lighter;
	float: right;
}
.highlighted {
	color: #EEEEEE;
	background-color: #2D3448;
}
.reviews {
	color: #2D3448;
	background-color: #FFFFFF;
	border: 5px solid #23B5C2;
	border-radius: 15px 50px;
	line-height: 2em;
	padding: 5px 15px;
	margin: 30px auto;
	width: 50%;
}
                         /* Silent Whistle */
#silent_whistle_page img {
	margin-right: 10px;
	
}
#silent_whistle_page p {
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 17px;
	margin: 10px;
}
                         /* Book */
.butch_from_book_cover {
	padding: 5px;
	border: 10px solid #333;
}
#butch_from_book_cover img {
	float: left;
	border: 10px solid #333;
}
#by_butch {
	color: #EEEEEE;
	background-color: #292929;
	padding: 5px;
}
#3_minutes {
	color: #23B5C4;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	word-spacing: -2px;
	font-size: 55px;
}
#ldt_image {
	float: left;
	margin-right: 20px;
	border: 5px solid #333;
}
#purchase_book {
	font-weight: bold;
	font-size: 22px;
	text-align: center;
}
#howdy {
	color: #2D3448;
	background-color: #FFFFFF;
	border: 5px solid #23B5C2;
	border-radius: 15px 50px;
	line-height: 2em;
	padding: 5px 15px;
}
#howdy h1 {
	color: #2D3448;
	font-size: 24px;
}
#howdy p {
	margin-top: -10px;
}
#home {
	box-shadow: 2px 1px 5px #333333;
	border: 3px solid #23B5C2;
	border-radius: 30px;
	margin: 5px;
}
                            /* contact page */
#map {
	border: 10px solid #333333;
	height: 400px;
}
#contact_info {
	font-size: 18px;
}
/* Responsive layout - when the screen is less than 800px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
#container {
	width: 100%;
	text-align: left;
	margin: 0 auto;
	border: 4px solid #23B5C2;
}
#main-content, .reviews {
	width: 90%;
	padding: 0;
}
}

/* Responsive layout - when the screen is less than 400px wide, make the navigation links stack on top of each other instead of next to each other */
@media screen and (max-width: 400px) {
#container {
	width: 100%;
	text-align: left;
	margin: 0 auto;
	border: 4px solid #23B5C2;
}
#main-content {
	width: 100%;
}
.reviews {
	 width: 90%;
}
}