body {
background-color: black;
color: #ffffff;
font-family: arial,times;

}
.usefulinfo {
position: absolute;
top:450px;
left: 10px;
color: white;
height: auto;
width: 160px;
font-size: 10pt;
}
.masthead {
height: 173px;
width: 100%;
background:black url(doglog.jpg);
background-repeat: no-repeat;
background-position: center center;
color: #FFFFFF;
padding: 0px;
}

.container {
position: relative;
font-family: arial, sans-serif, times;
font-size: .7em;
width: 80%;
height: auto;
margin-top: 5px;
margin-left: 0px;
}

.topnav {
font-family: sans-serif,arial, times;
font-size: 11pt;
text-align: center;
width: 100%;
line-height: 110%;



}
.topnav ul {
margin: 0;
padding: 0;
float: left;
width: 100%; /*width of menu*/
height: 30px;
background: black url(b1.jpg);
border-width: 1px 0;
overflow: hidden;
}


.topnav ul li{
display: inline;
}
.topnav ul li a{
float: left;
color: white; /*text color*/
padding: 5px 11px;
text-decoration: none;
border-left: 1px solid #564c66; /*dark purple divider between menu items*/
}

.topnav ul li a:visited{
color: white;
}
.vid {
float: right;
margin: 20px;}
.topnav ul li a:hover, .topnav ul li .current{
color: #ffcccc !important; /*text color of selected and active item*/
padding-top: 6px; /*shift text down 1px for selected and active item*/
padding-bottom: 4px; /*shift text down 1px for selected and active item*/
background: black url(b2.jpg);
height: 30px;
}


.intro img {
float: right;
margin: 2px;
}

.calendar {
position: absolute;
top: 5px;
left: 10px;
height: auto;
width: 160px;
margin-top: 20px;
margin-right: 5px;
padding: 5px;
font-size: 10pt;
}

.adopt h3 {
text-align: center;
background-color:#F0FFFF;
color: black;
font-size: 13pt;
text-decoration: underline;
}
.adopt {
position: absolute;
top: 250px;
left: 10px;
height: auto;
width: 150px;
font-family: arial, times;
background-color:#696969 ;
color: white;
padding: 5px;
font-size: 10pt;

}

.storieslinks {
position:absolute;
top: 440px;
left: 10px;
height: 250px;
width: 150px;
background-color: #696969;
color: black;
padding: 5px;
font-size: 9pt;
}
.fb {
margin-left: 10px;

}

/*************************footer element positioning****************************/
.footer {
position: relative;
bottom: 50px;
height: 70px;
width: 99%;
text-align: center;
}
/********************************************************************************/
.intro {
position: absolute;
top: 10px;
left: 200px;
height: auto;
width: 99%;
}
.intro img {
float: right;
margin-left: 5px;
}
.intro h1{
text-align: center;}
.intro p {
text-align: left;
letter-spacing: 1px;
line-height: 160%;
font-size: 9pt;
}
/****************************************individual dogs page elements************************/
.introk img {
float: right;
margin-left: 20px;
}
.introk h1{
text-align: center;}

.introk p {
text-align: left;
letter-spacing: 1px;
line-height: 160%;
font-size: 9pt;}

.introk {
position: absolute;
top: 10px;
left: 20px;
height: auto;
width: 110%;
margin-right: 2px;
}
/**************************************************************************************/
.introh {
position: absolute;
top: 10px;
left: 200px;
height: auto;
width: 95%;
background-color: #1F1F1F;
padding: 20px;
}
.introh img {
float: right;
margin-left: 5px;
}
.introh h1{
text-align: center;}
.introh p {
text-align: left;
letter-spacing: 1px;
line-height: 160%;
font-size: 9pt;
}

.intro2{
position: absolute;
top: 10px;
left: 20px;
height: auto;
width: 100%;
padding: 10px;
margin-right: 5px;
}
.intro2 img {
float: left;
margin: 15px;
}
.intro2 h1{
text-align: center;}
.intro2 p {
text-align: left;
letter-spacing: 1px;
line-height: 160%;
font-size: 9pt;
}
.intror{
position: absolute;
top: 15px;
right: -21%;
margin-left: 5px;
background-image:url(pawban.jpg);
background-repeat: repeat-y;
width: 155px;
height: 100%;
}
.rb {
background-image:url(rb.jpg);
height:30px;
width:100%;
color: black;
}
 h3{
background-color: black;
color: #ffffff;
}
.intro2 h2 {
text-align: right;}

.storieslinks ul
{
list-style-image: url('paw.jpg');
height: 2px;
width:2px;
font-size: .8em;
display: inline;
list-style-position:inside;

}
.storiesinks li{
padding-left: 5px;
margin: 2px;
}
/*************************foster and retirement page elements****************/
.introf {
position: absolute;
top: 10px;
left: 50px;
height: auto;
width: 100%;
}
.introf img {
float: right;
margin-left: 5px;
}
.introf h1{
text-align: center;}
.introf p {
text-align: left;
letter-spacing: 1px;
line-height: 160%;
font-size: 9pt;
}
/********************about page elements***********************/
.footera {
position: absolute;
top: 650px;
height: 70px;
width: 99%;
text-align: center;
}

.introha {
position: absolute;
top: 20px;
left: 200px;
height: auto;
width: 90%;
background-color: #1F1F1F;
padding: 20px;
font-size: 9pt;
letter-spacing: 1px;
}
.introha  img{
float: right;
padding: 10px;
}
.storieslinksa {
position:absolute;
top: 40px;
left: 10px;
height: 200px;
width: 150px;
background-color: #696969;
color: white;
padding: 5px;
}
.storieslinksa ul
{
list-style-image: url('paw.jpg');
height: 2px;
width:2px;
font-size: .8em;
display: inline;
list-style-position:inside;

}
.storiesinksa li{
padding-left: 5px;
margin: 2px;
}
.adopta h3 {
text-align: center;
background-color: #F0FFFF;
color: black;
font-size: 13pt;
text-decoration: underline;
}
.adopta {
position: absolute;
top: 290px;
left: 10px;
height: 150px;
width: 150px;
font-family: arial, times;
background-color: #696969;
color:white;
padding: 5px;

}
/****************************************************gallery*************************************/
.footerg {
position: absolute;
top: 700px;
left: 200px
height: 70px;
width: 99%;
text-align: center;
}
.gallery{
position: absolute;
top: 10px;
left: 200px;
width: 90%;
height: auto;
}
div.img
  {
  margin:4px;
  border:1px solid #8C8C8C;
  height:auto;
  width:auto;
  float:left;
  text-align:center;
  }
div.img img
  {
  display:inline;
  margin:3px;
  border:1px solid #ffffff;
  }
div.img a:hover img
  {
  border:1px solid #0000ff;
  }
div.desc
  {
  text-align:center;
  font-weight:normal;
  width:150px;
  margin:2px;
  }
  /**********************tumbnail image enlarger ********************************/
  /*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -100px;
left: 100px; /*position where enlarged image should offset horizontally */

}
/*******************foster dogs list styling**************************************/
.foster ul li{
display:inline;
}
.foster ul li a
{
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #036;
}

.foster ul li a:hover
{
color: #fff;
background-color: #369;
}
.foster ul{
margin: 0;
padding: 0;
list-style-type: none;
text-align: right;
}
/************************************************* link styling *********************************/

a:link {
text-decoration: none;
font-family: arial,sans-serif, times;
color:#20B2AA;}
a:visited {
text-decoration: none; 
font-family: arial,sans-serif, times; }
a:active {
text-decoration: none;
font-family: arial,sans-serif, times;
color:#48D1CC;
}

a:visited {
color: 	#FFEFD5;}