@import url('./default.css');

body {
/*

*/
background-image: url("./bgs/misc102.jpg");
opacity: 1.0;

}

/* ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */

/*   == EDIT these in: artPage.css
 ===== */

/* ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; */
h1,h2, h3, h6 {
  color: black;
  background-color: linen;  
 /* darkolivegreen: rgb( 40, 100, 30) ; */
}

h4, h5 {color: linen;}

div.figure {
  float: right;  /* this should be working from .css but it's not */
  width: 40%;    /* change inline if needed */
  border: thin navy outset; /* groove; */   
}

.ribbonLong {
    font-size: 130%; 
    font-weight: bolder; 
    width: 75%; 
    background-color: darkolivegreen; 
    color: ivory;
}
.ribbonMed {
    font-size: 130%; 
    font-weight: bolder;
    width: 50%; 
    background-color: darkolivegreen; 
    color: ivory;

}
.ribbonShort {
    font-size: 130%; 
    font-weight: bolder;
    width: 25%; 
    background-color: darkolivegreen; 
    color: ivory;
}

.tableBlock {
   padding-left: ;
   padding-right: ;
   width: ;
   font-style: ;
}

hr.short  { color: olivedrab; }
hr.medium {  color: olivedrab;}
hr.long   {  color: olivedrab;}


a {font-weight: bold;}
a:link     {color: blue;}
a:visited  {color: maroon;}
a:hover    {color: darkgoldenrod;}
a:active   {color: blue;}


.inline-button {
	_width:11em;
	font: bold 65%/1 Verdana, sans-serif;
	margin: 0 0.2em; padding: 0.3em 0; _padding:0;

	border: 2px solid black;

	white-space: nowrap;
	text-decoration: none;
	vertical-align: middle;

	background:  #ccc; 
	color: black;

    font-weight: bolder; 
    font-size: 100%;
    border: 7px darkolivegreen ridge;
}

.inline-button em {
	_width:1em; _cursor:hand;
	font-style: normal;
	margin:0; padding: 0.3em 0.5em;

	background: white;
	color: black;

    font-weight: bolder; 
    font-size: 105%;
    border:  thick tab inset;
	}

.inline-button span {
	_width:1em; _cursor:hand;
	margin:0; padding: 0.1em 0.5em 0.1em 0.3em;
	}
<!--
.inline-button:hover {
	background: #666;
	color: ivory;
	}
-->
.inline-button:hover {
	background: darkolivegreen;
	color: snow;
	}

.inline-button:hover em {
	background: snow;
	color: navy;
	}

.gbutton      { font-size: 107%; background: linen; color: darkolivegreen; }
.gbutton em { background: darkolivegreen; color: linen; }

.ibutton       { border: 3px darkolivegreen outset; font-size: 80%;  background: snow; color: navy;  }
.ibutton em  { border: 3px darkolivegreen outset; font-size: 80%; background: navy; color: snow; }

.small       {  font-size: 80%; background: linen; color: darkolivegreen; }
.small em {  font-size: 70%; background: darkolivegreen; color: linen; }

.toTop { border: 4px darkolivegreen groove; font-size: 100%;  background: snow; color: navy; }
.toTop em { border: 4px darkolivegreen groove; font-size: 100%; background: navy; color: snow; }

.buy { border: 3px darkolivegreen outset; font-size: 90%;  background: snow; color: navy; }
.buy em { border: 3px darkolivegreen outset; font-size: 90%; background: navy; color: snow; }

.orange { background: orange; color: black }
.orange em { background: white; color: #c60 }

.blue { background: navy; color: white }
.blue em { background: white; color: #06c }

.green { background: darkolivegreen; color: white }
.green em { background: white; color: darkolivegreen }

.navy { font-size: 80%; background: navy; color: snow; }
.navy em { font-size: 100%; background: snow; color: navy; }

.brown { background: tan; color: black;}
.brown em { background: black; color: tan; }
/*
.brown em { background:#003; color:#ffc }
*/

