/* Cascading Style Sheet for site TinaRealtyAZ - 20 Jul 2012 */
/* ******************  default body  *************** */

/* Color refs:
  white   = white (prv background)
  #fff8d0 = lt. yellow  (extern hover)  #edf5ff = v. lt. blue    #6fa7a6 = med. teal #8d112d dk. red
  #fe8    = med. yellow (onscr)         #f5f9ff = v.v. lt. blue  #006360 = dark teal #fefee2 v.lt.yellow
  #ffd800 = dark yellow (offscr,bg)     #e3efff = l. blue        #b9d3d4 = lt. teal  #fff white
 */


body {
   background-color: white;
 /*  background-image: url(/Images/bg.jpg); */
   background-image: none;
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
   /* Georgia, Times New Roman, Times, Serif */
   /* Verdana, Arial, Helvetica, Sans */
}

/* Links */
a:link, a:visited, a:active
 { text-decoration: underline; background-color: transparent; }
a:link { color: blue; }
a:visited { color: #309; }
a:active { color: #f00; }

/* No default border on "regular" images, so make one that will have a border: */
a.photo:link IMG, .imgnotfollow { border: 2px solid blue; }
a.photo:visited IMG, .imgfollow { border: 2px solid #309; }
a.photo:active IMG { border: 2px solid red; }

/* Off-site links */
a.extern:link { background-color: transparent; color: #037; }
a.extern:visited { background-color: transparent; color: #525; }
a.extern[href]:hover { background-color: #edf5ff; color: black }
/* The MSIE kludges: ones without 'href' hoses standards-compliant agents, grr */
a.extern:href:hover, a.extern:hover
 { background-color: #edf5ff; color: black; }

/* Provide for special handling of "off-screen" nav links: */
td a.offscr { display: block; height: auto; width: 100%; } /* to highlight behind all of the "button" cell */
a.offscr:link {
 /* background:url(/Images/menubghover-rgold-4b.png) repeat-x; */
 background:url(/Images/menubghover-wgold-4b.png) repeat-x;
 background-color: #fc3; color: blue; /* shown before link is followed */
}
a.offscr:visited {
 /*   background-color: #fc3; */
   color: #309; /* shown after link is visited */
}

/* Define the hover color we use so we can show it if needed: */
.notfollow { text-decoration: underline; background-color: transparent; color: blue; }
.hover { text-decoration: underline; background-color: #b8d; color: white; }
.follow { text-decoration: underline; background-color: transparent; color: #309; }
.extnotfollow { text-decoration: underline; background-color: transparent; color: #037; }
.exthover { text-decoration: underline; background-color: #edf5ff; color: black }
.extfollow { text-decoration: underline; background-color: transparent; color: #525; }

@media screen { /* hide from IE3 */
a[href]:hover { background-color: #b8d; color: white; } /* Default hover is like "onscr" colors */
/* Do the next line to avoid having the MSIE kludge below do something "funny" */
/* (But now if an anchor and a link are on the same line, the background won't change then! Grr) */
a[id]:hover, a[name]:hover
 { background-color: transparent; }
/* Other link definitions: */
a.nonrect[href]:hover
 { background-color: transparent; border: none; } /* hover here would look wierd */
/* Kludge to make MSIE work since it doesn't support attribute selectors,
   so it doesn't recognise the standard "a[href]:hover" construct, sigh! */
/* MSIE Strict needs no "href", but this messes up non-MSIE, so see above */
a:href:hover, a:hover
 { background-color: #b8d; color: white; }
a.nonrect:href:hover
 { background-color: transparent; border: none; } /* MSIE kludge, hover here would look wierd */
}

/* Setting so there is no hover display for image links
   (otherwise it looks funny on non-rectangular images) */
@media screen { /* hide from IE3 */
a[href]:hover IMG {
   background-color: #b8d; /* dwe transparent; */
   border: 0; /* For default, don't have a border, so none to hover either */
 }
a.nonrect[href]:hover IMG {
   background-color: transparent; /* hover background here would look wierd */
   border: 1px solid #b8d;
 }
a.photo[href]:hover IMG, .imghover {
   background-color: #b8d; /* dwe transparent; */
   border: 2px solid #b8d; /* dwe #f5f9ff; */
 }
/* Kludge to make MSIE work since it doesn't support attribute selectors,
   so it doesn't recognise the standard "a[href]:hover" construct, sigh! */
a:href:hover IMG {
   background-color: lime; /* dwe transparent; */ /* hover background here would look wierd */
   border: 0; /* For default, don't have a border, so none to hover either */
 }
a:hover IMG {
   background-color: teal; /* dwe transparent; */ /* hover background here would look wierd */
   border: 0; /* For default, don't have a border, so none to hover either */
 }
a.nonrect:href:hover IMG {
   background-color: transparent; /* hover here would look wierd */
   border: 1px solid #362;
/*   color; none;
   border: none; */
 }
a.photo:href:hover IMG {
   background-color: olive; /* dwe transparent; */
   border: 2px solid #b8d;
 }
a.photo:hover IMG {
   background-color: green; /* dwe transparent; */
   border: 2px solid #b8d;
 }
}

/* Other elements */

img {
   vertical-align: middle;
   border: 0; /* For default, don't have a border */
}
img.photo {
   vertical-align: middle;
   border: 2px solid black;
}
img.nonrect {
   vertical-align: middle;
   border-width: 1px;
   border-style: dotted;
   border-color: transparent; /* white; since "transparent" does not work on MSIE! :-( */
}
p.nonrect {
   margin-left: auto; /* These 2 center the table, but not on MSIE, see .msiekludge <grr> */
   margin-right: auto;
}

/* MSIE is broken and does not honor standard ways of centering a table
   So to do so, fool it by putting a table into a "<div>" of the following class: */
.msiekludge {
   text-align: center;
}

table {
   table-layout: auto;
   margin-left: auto; /* These 2 center the table, but not on MSIE, see .msiekludge <grr> */
   margin-right: auto;
   border-style: none; /* Drop the box around a standard table */
}

/* Then, some notes say that in the _real_ table def, set the text-align back to
   "left" or defaulted cells will be centered, not left aligned,
   but this does not seem to work, so just make certain that all cells set
   their own text-align as is desired ... sheesh, what a mess! */
td {
   text-align: left;
}

/* Special cells for more compressed display: */
.tightcell {
   margin-top: 1px; /* Compress these lines a bit */
   margin-bottom: 2px;
}

/* Items in Specials list: */
.specialitem {
   text-align: left;
   line-height: 1.1;
   border-top: dashed 1px #004aba;
   border-left: dashed 1px #004aba;
   border-bottom: dashed 1px #004aba;
}
.specialcost {
   font-weight: bold;
   text-align: right;
   line-height: 1.1;
   border-top: dashed 1px #004aba;
   border-right: dashed 1px #004aba;
   border-bottom: dashed 1px #004aba;
}
.specialnote {
   text-align: left;
   font-size: 70%;
}

/* Used on certain script error pages: */
body.errorpg {
   background-color: #ffccff; /* Light magenta */
   background-image: none;
   color: #5e1b0f;            /* Dark Red */
   font-family: sans-serif;
}

/* Body styles used with ARDEpet application: */
body.master, body.mirror {
   background-color: white;   /* white */
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
body.testsrvr {
   background-color: #ff0;    /* yellow */
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
body.othersrvr {
   background-color: red;     /* red */
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}

/* **********  "Private" page definitions  ********* */
/* Also used for private metrics pages */
/* MSIE does not seem to honor the following the same way Firefox does. */
/* On MSIE "transparent" causes the folowing to display "a:visited", etc. not the background: */
a.prvnorect:link IMG, a.metrnorect:link IMG,
a.prvnorect:visited IMG, a.metrnorect:visited IMG {
   border-width: 1px;
   border-style: dotted;
   border-color: transparent; /* white; since "transparent" does not work on MSIE! :-( */
}
a.prvnorect:active IMG, a.metrnorect:active IMG
 { border: 1px dotted red; }

body.private, body.metrics {
   background-color: white;
/*   background-image: url(/Images/bg.jpg); */
   background-image: none;
   text-align: left;
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
img.prvnorect, img.metrnorect {
   vertical-align: middle;
   border-width: 1px;
   border-style: dotted;
   border-color: transparent; /* white; since "transparent" does not work on MSIE! :-( */
}
/* Define the private link colors we use so we can show them if needed: */
.prvlink, .metrlink { background-color: #eee; color: #444; }
.prvvisited, .metrvisited { background-color: transparent; color: #444; }

/* Special treatments for private links: */
a.private:link, a.metrics:link
 { background-color: #eee; color: #444; }
a.private:visited, a.metrics:visited
 { background-color: transparent; color: #444; }
a.prvextern:link, a.metrextern:link
 { background-color: #afc1db; color: #002454; }
a.prvextern:visited, a.metrextern:visited
 { background-color: transparent; color: #037; }

/* Define the private hover color we use so we can show it if needed: */
.prvhover, .metrhover { background-color: #444; color: white; }
/* Define private hovers, keeping MSIE kludges separate or standard styles don't work */
a.private[href]:hover, a.prvextern[href]:hover, a.metrics[href]:hover, a.metrextern[href]:hover
  { background-color: #444; color: white }
/* The MSIE kludges: ones without 'href' hose standards-compliant agents, grr */
a.private:href:hover, a.prvextern:href:hover, a.metrics:href:hover, a.metrextern:href:hover,
a.private:hover, a.prvextern:hover, a.metrics:hover, a.metrextern:hover
  { background-color: #444; color: white }
/* hover bg on non-rectangular images would look wierd */
a.prvnorect[href]:hover, a.metrnorect[href]:hover
  { background-color: transparent; border: none; }
/* The MSIE kludges: ones without 'href' hose standards-compliant agents, grr */
a.prvnorect:href:hover, a.metrnorect:href:hover,
a.prvnorect:hover, a.metrnorect:hover
  { background-color: transparent; border: none; }
a.prvnorect[href]:hover IMG, a.metrnorect[href]:hover IMG
  { background-color: transparent; border: 1px solid #eee; }
/* The MSIE kludges: ones without 'href' hose standards-compliant agents, grr */
a.prvnorect:href:hover IMG, a.metrnorect:href:hover IMG,
a.prvnorect:hover IMG, a.metrnorect:hover IMG
  { background-color: transparent; border: 1px solid #eee; }

/* Used on contract and other official pages: */
body.contract {
   background-color: white;
   background-image: none;
   text-align: left;
   color: black;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
/* For small things (like expiration messages) in the contract: */
.contractexp {
   text-align: center;
   color: black;
   font-size: 70%;
   line-height: 1.1;
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}
/* Use sparingly! Confuses users due to links. */
.underline {
   text-decoration: underline;
}

/* These are classes which may be applied to multiple tags: */

.brdr {
   border-style: solid; /* Add the box around the table or block */
   border-width: 1px;
   border-color: #b10;
}
.maincols {
 /*  background-color: #fff; */ /* Allow background url to take over */
   vertical-align: top;
}
.pgbrdr {
   border-style: solid; /* Add the box around the table or block */
   border-width: 10px;
   border-color: #407; /* rich-dark purple */
   border-bottom: none;
}
.ctrcol {
   text-align: center;
   vertical-align: top;
   background-color: #fff;
   border-style: solid; /* Add the box around the table or block */
   border-width: 10px;
   border-color: #fff;
   border-top: none;
   border-bottom: none;
}
.horizsep {
   width: 100%;
   height: 10px;
   background-color: #fff;
}
.botmbar {
   border-style: solid; /* Add the box around the table or block */
   border-width: 10px;
   border-color: #407;
   border-top: none;
   border-bottom: none;
}
.lowbarwords {
   background-color: #362;
   background:url(/Images/menubghover-prpl-3b.png) repeat-x;
   color: #fff;
   vertical-align: middle;
}

.inbrdr {
   border-style: inset; /* Add the inset box around the table or block */
   border-width: 2px;
   border-color: #004aba;
}

/* border to be used around each real page content: */
.tblbrdr {
   width: 99%;
   padding: 5px;
   border-style: inset; /* Add the box around the table or block */
   border-width: 1px;
   border-color: #8ab9ff;
/*   border-color: #630; */
}

.center {
   text-align: center;
}

.left {
   text-align: left;
}

.right {
   text-align: right;
}

.justify {
   text-align: justify;
}

.middle {
   vertical-align: middle;
   text-align: center;
/*   border: 3px solid black; */
}

.margin {
   margin-left: 5%;
}

.indent {
   text-indent: 2em;
}

.undent {
   margin-left: 2em;
   text-indent: -2em;
}

.clearall {
   clear: both;
}

.pagebrk {
   page-break-before: always; /* Force a page break when this is printed */
}

/* More Specials: */

/* Page title (Hx, etc.) formats: */
.pgttl {
   text-align: center;
   margin-top: 0; /* This is to keep FireFox from pushing Strict page content down the screen */
}
/* General description: */
.gendesc {
   text-align: left;
   font-size: 80%;
   margin-top: 0;
}

/* Title on an error page */
.errttl {
   text-align: center;
   background-color: #ff0000;
}

/* Page "Updated" info line: */
.updated {
   text-align: center;
   font-size: 70%;
}

/* Explanitory info: */
.explain {
   font-size: 80%;
}
.explaintiny {
   font-size: 60%;
}

/* Critical info: */
.critical {
   font-weight: bold;
   font-size: 90%;
}

/* Highlighted info: */
.highlight {
   color: red;
}

/* Required info: */
.required {
   font-weight: bold;
   font-size: 70%;
   color: red;
}

.reqinput {
   background-color: #b8d; /* light purple */

}

/* Form action elements: */
.formele {
   text-align: center;
   vertical-align: middle;
   padding: 9px; /* if this is too small, MSIE chops the top of the fake button, grr */
   margin: 1px;
}

/* Form action button: */
input {
   font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
}

/* Real and fake form action button: */
.inputbtn, .fakebtn {
   line-height: 1.2;
   padding: 3px;
}

/* Top navigation block: */
.navblock
{
   background-color: #cce0ff; /* Light blue */
   color: white;
   text-align: center;
}

/* Navigation buttons */
.headrow {
 /*  background-image: url(/Images/bg-checkered-gold.jpg); */
 /*  background:url(/Images/menubghover-gold-4b.png) repeat-x; */
   background-color: #fc3;
/*   background:url(/Images/headbghover-gold-1b-l.png) repeat-x; */
   background:url(/Images/headbghover-silver2-2b-l.png) repeat-x;
}
.navrow {
   background-color: #999;
 /*  background:url(/Images/headbghover-silver2-2b-l.png) repeat-x; */
}
.mainrow {
   background-color: #fc3;
/*   background:url(/Images/headbghover-silver4-2b-l.png) repeat-x; */
   background:url(/Images/headbghover-silver-2b-tile3.png);
}
.privtemp { /* For things that are private and need removal by release to public */
   background-image: url(/Images/bg-checkered-gold.jpg);
   background-color: #fc3;
}

.headphone {
   font-size: 80%;
   color: #b10;
   text-align: center;
   font-weight: bolder;
}
.telnmber {
   color: #407; /* purple */ /* #362; green */
   font-size: 130%;
   font-weight: bolder;
}
.location {
   color: #407; /* purple */ /* #362; green */
   font-size: 85%;
}
.headblurb {
   font-size: 90%;
   color: #362; /* was: #b10; */
   text-align: center;
   font-weight: bolder;
}

td.onscr, button.offscr, input.offscr, td.offscr
{
   padding: 1px;
   font-size: 80%;
}
td.onscr, button.offscr, input.offscr, td.offscr, .inputbtn, .fakebtn
{
   text-align: center;
   vertical-align: middle;
   font-weight: bolder;

   margin: 3px 3px 3px 3px;
}
/* For pages offscreen now and for "real" buttons: */
.inputbtn, .fakebtn, button.offscr, input.offscr, td.offscr
{
   background-color: #fc3; /* was: #fc3; #bdf; */  /* over-drawn if url below */
  /* background:url(/Images/menubghover-gold-4b.png) repeat-x; */
   background:url(/Images/menubghover-rgold-4b.png) repeat-x;
   color: black;
}

button.offscr, input.offscr, td.offscr, .inputbtn, .fakebtn
{
/* Add the box around the table or block, use darker color */
   border-top: 3px outset #fc3;
   border-right: 3px outset #fc3;
   border-bottom: 3px outset #fc3;
   border-left: 3px outset #fc3;
}
/* For the page onscreen now: */
td.onscr
{
   background-color: #b10; /* was: #b10; #f5f9ff; #edf5ff; */ /* #fe8; */
  /* background:url(/Images/menubghover-rgold-1b.png) repeat-x; */
   background:url(/Images/menubghover-prplc-1b.png) repeat-x;
   color: white;

/* Add the box around the table or block, use darker color */
   border-top: 3px outset #407;
   border-right: 3px outset #407;
   border-bottom: 3px outset #407;
   border-left: 3px outset #407;
}

/* Menu classes */
.menucat {
   margin-top: 2px; /* compress it */
   margin-bottom: 1px;
   border-style: solid; /* Add the box around the table or block */
   border-width: 0px;
   border-top: none;
   border-bottom: none;
   border-color: #362;
   background-color: #362;
   background:url(/Images/menubghover-prpl-3b.png) repeat-x;
   color: #fff;
   font-size: 140%;
   font-weight: bolder;
   text-align: center;
}
.menuitm {
   color: #362;
   font-size: 100%;
}
.menuitm, .menusubitm, .menusizitm {
   font-weight: bolder;
   text-align: left;
   width: 75%;
}
.menusubitm {
   padding-left: 30px;
   color: #b10;
   font-size:95%;
}
.menusizitm {
   padding-left: 30px;
   color: #362;
   font-size:95%;
}
.menuprc {
   color: #000;
   font-size: 95%;
   font-weight: bolder;
   text-align: right;
   width: 25%;
}
.menudsc {
   color: black; /* was red: #b10; */
   font-size: 80%;
   text-align: left;
}
.menuhilt {
   color: #b10;
   font-size: 80%;
   font-weight: bolder;
}
.caterhilt {
   color: #362;
   font-weight: bolder;
}
.splhilite {
   font-weight: bolder;
}

/* Add special navigation hover styles; be sure background is appropriate */
@media screen { /* hide from IE3 */
button.offscr:hover, input.offscr:hover, a.offscr[href]:hover {
 background-color: #407;
 background:url(/Images/menubghover-prpl-3b.png) repeat-x;
 color: white;
}
/* Kludge to make MSIE work since it doesn't support attribute selectors,
   so it doesn't recognise the standard "a[href]:hover" construct, sigh! */
/* in 4.01 transitional, use this: button.offscr:hover, input.offscr:hover, a.offscr:href:hover */
button.offscr:hover, input.offscr:hover, a.offscr:href:hover, a.offscr:hover {
 background-color: #407;
 background:url(/Images/menubghover-prpl-3b.png) repeat-x;
 color: white; }
}