﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.trainedfamilypets.com/
   TEMPLATE NAME:  Trained Family Pets
   DATE:           Mar-3rd-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: url(/images/bg.jpg);
}
.link{cursor:pointer;text-decoration:underline}
.viewlink{position:absolute;bottom:0px;right:0px;}
.line { border: none; border-bottom: 1px solid #d9d8cc; height: 0px; margin: 0 auto }
.clear { clear: both; }

.floatright{float:right;}
.floatleft{float:left;}	

/* ----------Vodeos--------------------- */
.videogallery{width:100%;}
.videogallery .video{width:250px;}
.videogallery .description{width:250px;}
/* ----------CART--------------------- */
font, table, tr, td { border: none; background-color: transparent;}
table, td, tr { border: none; font: bold 12px Georgia, serif; color: #e1e1e1; }
td { line-height: 20px; }
table b { color: #e1e1e1; }
table a, tr a, td a, font a, .content table a {color: #e1e1e1; font: 9pt "Lucida Sans Unicode", Tahoma, Verdana, Arial, sans-serif; }
table a:hover, tr a:hover, td a:hover, font a:hover, .content table a:hover {color: #ee4591;}
table hr {border: none; border-bottom: 1px solid #e1e1e1; height: 0px;}
font img { border: 6px solid #e1e1e1; margin-right: 10px; } 

/* ----------Centered Container Or the Layout--------------------- */

#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 960px;
background: url(/images/tablebg.png) repeat-y;
} 

#holder {
width: 879px; 
margin: 0 auto;
min-height: 100%; 
height: auto !important; 
height: 100%; 
}

/* --------------LABELS BUTTONS & FORMS-----------*/
label { font: 12px Georgia, serif; color: #704418; text-transform: uppercase;}
 
.form, textarea {
width: 26em;
border: 1px solid #d3d3ca;
font: 12px Georgia, serif;
color: #704418;
padding: 12px;
margin-bottom: 20px;
background: #fff url('images/labelbg.gif') repeat-x;
}
 
.button {
border: none;
}

/* --------------HEADER------------- */
#header {
height: 124px;
padding-left: 24px;
background: #fff url(/images/headbg.gif) repeat-x bottom left;
}

#header .text {
width: 510px;
padding-top:40px;
float: right;
text-align: right;
padding-right: 22px;
}

/* --------------LOGO IN HEADER *always use this*------------- */
.logolink, #swap { width: 323px; height: 117px; float: left }
.logolink { background-image: url('/images/logo.gif'); background-repeat: no-repeat;}
.logolink a { float: left;  }
 
#swap { background-image: url(/images/logo.gif); }
 
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */



/* --------------TOPNAV------------- */
.images {
background: #42260a url(/images/navbg.gif) repeat-x;
border-bottom: 1px solid #8d7f48;
height: 52px;
}

.images a { float: left; margin: 14px 15px 0px 14px }

#swap01 {background-image: url(/images/nav_on_home.png);  width: 37px;  height: 26px; }
#swap02 {background-image: url(/images/nav_on_training.png);  width: 69px;  height: 26px; }
#swap03 {background-image: url(/images/nav_on_age.png);  width: 126px;  height: 26px; }
#swap04 {background-image: url(/images/nav_on_available.png);  width: 107px;  height: 26px; }
#swap05 {background-image: url(/images/nav_on_videos.png);  width: 72px;  height: 26px; }
#swap06 {background-image: url(/images/nav_on_delivery.png);  width: 122px;  height: 26px; }
#swap07 {background-image: url(/images/nav_on_articles.png);  width: 59px;  height: 26px; }
#swap08 {background-image: url(/images/nav_on_faq.png);  width: 52px;  height: 26px; }


.rollover { display: inline; } /* Allow setting widths and heights */
.rollover img { height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


/* --------------MISSION------------- */
#mission {
height: 266px;
border-top: 1px solid #43260a;
background: url(/images/mission.jpg) no-repeat;
}

#mission .text {
margin: 70px 0px 0px 50px;
width: 340px;
}

#mission .text .head {
width: 308px;
height: 37px;
background: url(/images/mission_header.gif) no-repeat;
margin-bottom: 8px
}

#mission .text p {
color: #6e92a9;
font: bold 12px Georgia, serif;
letter-spacing: normal;
line-height: 1.8em;
padding-bottom: 24px;
text-align: justify
}


/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/
#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
background: #FFF url(/images/mainbg.gif) repeat-x; /* Main DIV Background Img */
padding: 20px 30px 40px 20px
}

#main .content {
padding: 0px;
margin: 0px;
margin-left: 250px;
margin-right: 0px;
min-height: 170px; /* Height of Background Img */
height: auto;
}

#main h1 {
color: #835d37;
text-transform:uppercase;
font: 24px Georgia, serif;
letter-spacing: normal;
line-height: 1.2em;
margin-bottom: 20px
}

#main p {
color: #835d37;
font: 12px Georgia, serif;
letter-spacing: normal;
line-height: 1.8em;
padding-bottom: 24px;
text-align: justify
}

#main div {
color: #835d37;
font: 12px Georgia, serif;
letter-spacing: normal;
line-height: 1.8em;
text-align: justify
}

#main strong {
color: #835d37;
font: 12px Georgia, serif;
text-transform:uppercase;
}

#main a { color: #6e92a9;}
#main .img { float: right; margin: 20px 0px 30px 30px;}


#main .navleft {
float:left; 
width: 230px;
margin: 0px;
padding: 0px;
}


/* --------------LEFT BOXES------------- */
#leftbox { width: 220px; margin-bottom: 10px;}
#leftbox .top { height: 54px; background: url(/images/leftbox_top.png) no-repeat; }
#leftbox .container { background: url(/images/leftbox_bg.png) repeat-y;}
#leftbox img { padding: 20px 0px 0px 20px}
#leftbox .holder { min-height: 130px; background: url(/images/leftbox_holderbg.png) no-repeat; padding: 8px 18px 8px 20px}
#leftbox ul { margin: 0px; padding: 0px;}

#leftbox li {
display: block;
list-style-type: none;
color: #835d37;
font: 12px Georgia, serif;
letter-spacing: normal;
line-height: 2em;
background: url(/images/icon_check.gif) no-repeat left top;
padding-left: 24px;
}

#leftbox .bot { height: 13px; background: url(/images/leftbox_bot.png) no-repeat bottom left;}


/* --------------AVAILABLE------------- */
#available { padding: 0px; margin-top: 20px; font-family: Georgia, serif; height: 100%; height: auto; min-height: 100%; clear: right}
#available .icon, #available img { float: left; border: 6px solid #eaeae3}
#available .text { text-align: left; padding: 0px 0px 13px 20px; margin-left: 105px;  }
#available .button { float: right; border: none; margin-top: -30px}
#available .text h3 { color: #6e92a9; font: bold 18px Georgia, serif; padding-bottom: 4px;}
#available .text p { padding-bottom: 0px; clear:right}


/* --------------BREEDINGS------------- */
#breedings {background: none; clear:right; margin-top: 20px; margin-bottom: 20px;font-family: Georgia, serif; width: 550px;}
#breedings .icon { float: left; border: 6px solid #eaeae3}
#breedings .text { text-align: left; padding-left: 25px; vertical-align: top;}
#breedings .button { float: left; border: none; margin-top: 5px;}
#breedings h3 { color: #6e92a9; font: bold 18px Georgia, serif; padding-bottom: 4px;}
#breedings .text p { padding-bottom: 0px; }
#breedings .pics{ width: 112px; background: none; vertical-align:top }
#breedings img{margin: 0px 10px 10px 10px; border: 6px solid #eaeae3; }
#breedings .desc{float: left; width: 550px; }


#breedings .gallery{ float: left; width: 130px;margin: 10px 20px 10px 0px; height:180px; text-align: center;}
#breedings .gallery img{margin: 0px;}
#breedings .gallery p{float: left; text-align: center; padding-top: 5px;}


/* --------------DOG DETAILS------------- */
#details { padding: 0px; margin-top: 20px; height: 100%; height: auto; min-height: 100%; clear: right}
#details img { float: left; border: 6px solid #eaeae3; clear: right; margin-right: 7px; }

/* --------------TRAINING------------- */
ul#training  {margin-left: 30px; margin-top: 10px}
#training li { font: 12px Georgia, serif; color: #6e92a9; line-height: 22px; }

/* --------------ARTICLES------------- */
#articles { margin-bottom: 25px; padding: 0px;}
#articles li { list-style-type: none;}
#articles li a, #articlestext a { color: #6e92a9;  font: 11px Georgia, serif;}
#articlestext { margin: 10px 0px 10px 0px;}
#articlestext h1 { font: bold 12px Georgia, serif; padding: 0px; margin: 0px;}
#articlestext p { padding-bottom: 20px; margin: 0px;}

/* --------------FAQ------------- */
#faq ul { margin: 0px; padding: 0px;}
#faq li { font: bold 12px Georgia, serif; text-transform: uppercase; color: #6e92a9; list-style-type: none}
#faq li b { background: url(/images/icon_arrow.gif) no-repeat left top; padding-left: 10px}
#faq li p { text-transform: none;}


/* --------------FOOTER------------- */

#footer, .push { 
clear: both;
width: 960px;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background: url(/images/tablebg.png) repeat-y;
height: 100px;
height: auto;
margin: 0 auto
}

#footer .content { 
width: 879px; 
margin: 0 auto; 
position: relative; 
background-color: #dcdacf;
}


/* --------------FOOTER LINKS------------- */

#footer ul { padding: 10px 14px 10px 14px;}
#footer .links ul { margin: 0px; padding: 0px;}
#footer .links li { display: inline; list-style-type: none;}

#footer .links li a {
color: #553d23;
text-decoration: none;
border-right: 1px solid;
padding: 0px 10px 0px 10px;
font: bold 10px Georgia, serif;
}

#footer .links li.last a { border-right: 0px;}
#footer .links li a:hover { text-decoration: underline; }

/* --------ASC LINKS--------- */
#footer .asc ul { margin: 0px; padding: 0px;}
#footer .asc li { display: block; list-style-type: none; color: #553d23; text-decoration: none; padding: 0px 10px 0px 10px; font: 10px Georgia, serif;}
#footer .asc li a { color: #553d23; text-decoration: none; font: 10px Georgia, serif;}

/* --------W3 LINKS--------- */

#footer .w3 ul { margin: 0px; padding: 10px;}
#footer .w3 li { display: inline; list-style-type: none;}
#footer .w3 li a { color: #000; text-decoration: none; border-right: 1px solid; padding: 0px 10px 0px 10px; font: 10pt Arial, 'Trebuchet MS', Sans-Serif;}
#footer .w3 li a:hover { text-decoration: underline;}




/* ----- Customer Cart TABLES ---------- */
#awscustomertables table{margin: 1em; border-collapse: collapse;}
#awscustomertables td{ padding: .3em; border: 1px #F2F2F2 solid; }
#awscustomertables th{ padding: .3em; border: 1px #F2F2F2 solid; background: #F2F2F2; }
