/* George Willcox */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans|Noto+Serif');
/* @import url('https://fonts.googleapis.com/css?family=Raleway|Playfair+Display+SC'); */
@import url('https://fonts.googleapis.com/css?family=Roboto');

@font-face {
  font-family: "freight-big-pro-lt";
  font-style: normal;
  font-weight: 300;
  src: url(/fonts/FreightBigPro/FreightBigProLight-Regular.ttf) format('truetype');
}

@font-face {
font-family: "Caslon 540 LT Std";
font-style: normal;
font-weight: 200;
src:    url(/fonts/Caslon/Caslon540LTStd-Roman.otf) format('opentype');
}


/*
Colour codes:
Dark Blue: rgb(22,43,72);
Sand: rgb(191,185,167);
GP Grey: rgb(74,74,74);
Slate Grey: rgb(35,31,32);
Accent Grey: rgb(103,102,108);
Pale Grey: rgb(35,31,32);
Mid Grey: rgb(151,150,154);
Lime: rgb(190, 214, 0);
Pale Lime: rgb(240,246,199);

Purple: rgb(56,35,89); or indigo;
Teal: teal;
Beige: rgb(241,234,226); or bisque/cornsilk;
Grey: rgb(35,31,32);

*/
body, input, td, div, a, textarea, p {
font-family:Roboto, arial, helvetica, sans-serif;
font-size:1em;
line-height:1.5em;
}

/* Print Rules */
.yp {
visibility:hidden;
display:none;
}

.xp {
visibility:visible;
display:block;
}
/* End of Print rules */

a {
color: teal;
text-decoration:none;
font-variant: small-caps;
}

a:hover {
color: indigo;
cursor: pointer;
}

p {
margin-bottom:1.2em;
}

.bgGrn {
background-color: rgb(170,255,85);
}

.bgCrm {
/*background-color: rgb(248,252,106);*/
background-color: rgb(225,255,132);
}

.bgWht {
background-color: white;
}

.bgRed {
background-color: crimson;
color:white;
}

.ajaxLoadingIndicator {
font-size: 1.2rem;
background:indigo url(../../img/build/alert-overlay.png) repeat-x;
display: inline-block;
padding: 5px 30px;
color: snow;
border:2px solid gold;
border-radius: 5px;
box-shadow: 0px 1px 3px 3px rgba(0, 0, 0, 0.5);
z-index: 800;
position: fixed;
top: 4vw;
line-height: 1.2rem;
font-weight: 300;
text-shadow: 0 -1px 1px rgba(0,0,0,0.75);
font-family: Oswald, Roboto, calibri, optima;
height: auto;
max-height: 1.8rem;
text-align: center;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
max-width: fit-content;
min-height: fit-content;
}

.ajaxLoadingIndicator:hover {
background-color: purple;
}

div#geopage {
position:absolute;
top:300px;
margin:0 10%;
}

/* Tags */

body {
background-color: rgb(255,255,255);
width:100%;
min-width:1024px;
}

input[type='password']:focus {
color:indigo;
border:2px solid indigo;
background-color:cornsilk;
font-size:20px;
border-radius:0;
}

/*button {
font-size:16px;
background-color:rgb(190, 214, 0);
color:rgb(161,0,0);
text-shadow: -1px 1px 2px rgb(201,201,201);
padding:2px 4px;
border:2px solid silver;
cursor:pointer;
margin-top:10px;
border-radius:8px;
}

button:hover {
color:black;
text-shadow: 1px -1px 1px rgb(101,101,101);
border:2px solid rgb(161,0,0);
}*/

.geo {
font-family: georgia, "palatino linotype", "baskerville old style", serif;
}

/* Granite Tablet Styles */

div.granitetablet strong {
font-weight: 600;
}
div.granitetablet em {
font-style: italic;
}
div.granitetablet ul, div.granitetablet ol {
margin-left: 5vw;
margin-bottom:2vw;
}
div.granitetablet ul li {
list-style: outside square;
line-height:1.8em;
}
div.granitetablet ol li {
list-style: outside lower-roman;
line-height:1.8em;
}

div#navbar {
margin:0;
left:160px;
top:80px;
position:absolute;
width:800px;
}

ul#topnav {
display:inline;
float:left;
}

ul#topnav li.topnav {
list-style-position:inside;
list-style-type:none;
border:1px solid rgb(152,151,156);
background-color:rgb(145,135,111);
width:125px;
padding:4px 0;
height:20px;
text-align:center;
cursor:pointer;
float:left;
margin-right:2px;
}

ul#topnav li.topnav:hover {
background-color:rgb(189,180,140);
}

ul#topnav li.topnav a {
font-size:10px;
color:rgb(168,209,0);
text-transform:uppercase;
}

ul#topnav li.topnav a:hover {
color:rgb(255,255,255);
text-decoration:none;
}

/* Start of Maxi e-catalogue */

/* ul#ecoll li {
float:left;
text-align:center;
margin-left:10px;
height:180px;
list-style-type:none;
margin-bottom:5px;
cursor:pointer;
}

ul#ecoll li div.eImg {
border:1px solid rgb(181,181,181);
padding:2px;
margin-bottom:2px;
z-index:400;
}

ul#ecoll li div.eImg:hover {
border:1px solid rgb(202,228,0);
}

ul#ecoll li div.eTxt {
position:relative;
font-size:11px;
font-family:georgia;
font-variant: small-caps;
border:1px solid rgb(181,181,181);
background-color:silver;
height:36px;
width:120px;
padding:4px 0;
z-index:400;
color:rgb(74,74,74);
}

ul#ecoll li div.eTxt:hover, ul#ecoll li div.ecTxt:hover {
border:1px solid rgb(190, 214, 0);
background-color:rgb(235,243,175);
color:rgb(0,0,0);
}

ul#ecoll li div.ecTxt {
position:relative;
font-size:12px;
font-family:arial;
font-variant: small-caps;
border:1px solid rgb(181,181,181);
background-color:silver;
min-height:18px;
width:120px;
padding:2px;
z-index:400;
color:rgb(80,81,85);
} */

/* End of Maxi e-catalogue
***************************
Start of Mini e-catalogue */

/* ul.ecollm li { */
/* float:left; */
/* text-align:center; */
/* margin-left:0; */
/* height:240px; */
/* list-style-type:none; */
/* margin-bottom:5px; */
/* cursor:pointer; */
/* padding:10px; */
/* } */

/* ul.ecollm li div.eImg { */
/* border:1px solid rgb(56,35,89); */
/* padding:2px; */
/* margin-bottom:2px; */
/* z-index:400; */
/* width:140px; */
/* height:165px; */
/* overflow:hidden; */
/* position:relative; */
/* } */

/* ul.ecollm li div.eImg img.minimg { */
/* max-width:80%; */
/* max-height:95%; */
/* position:absolute; */
/* bottom:10px; */
/* left:12px; */
/* width:7.8vw; */
/* height:7.8vw; */
/* object-fit:contain; */
/* object-position:50% 60%; */
/* } */

/* ul.ecollm li div.eImg:hover { */
/* border:1px solid teal; */
/* } */

/* ul.ecollm li div.eTxt { */
/* position:relative; */
/* font-size:14px; */
/* line-height:16px; */
/* font-family:Roboto, georgia; */
/* font-variant: titling-caps; */
/* border:1px solid purple; */
/* background-color:rgb(56,35,89); */
/* height:40px; */
/* width:140px; */
/* padding:6px 2px 0; */
/* z-index:400; */
/* color:cornsilk; */
/* overflow:hidden; */
/* } */

/* ul.ecollm li div.eTxt:hover, ul.ecollm li div.ecTxt:hover { */
/* border:1px solid purple; */
/* background-color:cornsilk; */
/* color:rgb(56,35,89); */
/* } */

/* ul.ecollm li div.ecTxt { */
/* position:relative; */
/* font-size:14px; */
/* font-family:Roboto, Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; */
/* font-variant: titling-caps; */
/* border:1px solid purple; */
/* background-color:rgb(56,35,89); */
/* height:40px; */
/* width:140px; */
/* padding:6px 2px 0; */
/* z-index:400; */
/* color:cornsilk; */
/* } */

ul.ecollm li {
float:left;
text-align:center;
margin-left:0;
height:10vw;
list-style-type:none;
margin-bottom:0.5vw;
cursor:pointer;
padding:1vw;
}

ul.ecollm li div.eImg {
border:0.1vw solid rgb(56,35,89);
padding:0.2vw;
margin-bottom:0.2vw;
z-index:400;
width:8vw;
height:8vw;
overflow:hidden;
position:relative;
}

ul.ecollm li div.eImg img.minimg {
width:7.8vw;
height:7.8vw;
object-fit:contain;
object-position:50% 50%;
}

ul.ecollm li div.eImg:hover{
border:0.1vw solid gold;
}

ul.ecollm li div.eTxt {
position:relative;
font-size:0.8vw;
font-family:Roboto;
font-variant: titling-caps;
border:0.1vw solid rgb(56,35,89);
background-color:rgb(56,35,89);
height:2.2vw;
width:8vw;
padding:0.2vw;
z-index:400;
color:cornsilk;
overflow:hidden;
line-height:1.1vw;
}

ul.ecollm li div.eTxt:hover, ul.ecollm li div.ecTxt:hover {
border:1px solid purple;
background-color:cornsilk;
color:rgb(56,35,89);
}

ul.ecollm li div.ecTxt {
position:relative;
font-size:0.8vw;
font-family:Roboto;
font-variant: titling-caps;
border:0.1vw solid silver;
background-color:rgb(56,35,89);
height:2.2vw;
width:8vw;
padding:0.2vw;
z-index:400;
color:cornsilk;
overflow:hidden;
line-height:1.1vw;
/* white-space:nowrap; */
}

.white-popup {
font-family: roboto, arial, helvetica;
position: relative;
top:0;
left:0;
background: white;
padding: 2em;
width: auto;
max-width:80%;
margin: 2em auto;
border:3px solid black;
border-radius:1em;
}

/* End of Mini e-catalogue */

header {
/* background-image:url(../../img/build/WillcoxGranite.png);
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 2.5% 0;
height:184px; */
background-color:rgb(56,35,89);
width:100%;
height:92px;
position:fixed;
top:0;
bottom:160px;
z-index:50;
border-bottom: 5px double white;
min-width:1200px;
}

div#logo {
position:absolute;
/*left:100px;*/
left:0;
top:0;
width:284px;
z-index:600;
}

img#topimg {
position:relative;
z-index:1;
background-color:rgb();
}

div#dtd {
float:right;
position:relative;
font-size:24px;
text-transform:uppercase;
line-height:30px;
font-family: "freight-big-pro-lt", "Caslon 540 LT Std", georgia, serif;
color:snow;
top:10px;
right:20px;
/* text-shadow:1px 1px 5px rgb(255,255,255); */
}

div#tel {
float:right;
position:relative;
font-size:24px;
text-transform:uppercase;
line-height:30px;
font-family: "freight-big-pro-lt", "Caslon 540 LT Std", georgia, serif;
/* font-weight: 300; */
font-style: normal;
color:snow;
top:24px;
right:20px;
/* text-shadow:1px 1px 2px white; */
}

div#banner {
width:auto;
margin:0 auto;
/*max-width:1600px;*/
}

div#nbuttons {
clear:right;
float:right;
margin-top:20px;
margin-right:5%;
}

div#copyright {
float:right;
font-size:0.9rem;
color:indigo;
text-shadow:1px 1px 2px lightgray;
}

div#sessioninfo {
position:relative;
font-size:24px;
float:right;
text-transform:uppercase;
white-space:nowrap;
font-family: georgia, "palationo linotype", serif;
color:rgb(35,31,32);
top:10px;
text-shadow:1px 1px 5px white;
margin-right:5%;
}

div#disp {
position:absolute;
top:0;
left:0;
z-index:20;
width:100%;
}

img.bdrImg {
border: 1px solid rgb(208, 208, 208);
}

img.imgOrder {
max-height:65px;
width:auto;
margin-bottom:0;
overflow:hidden;
}

div#container {
font-size: 1.2em;
line-height: 1.5em;
width:100%;
}

div#content {
text-align:justify;
vertical-align:top;
width:auto;
padding-left:40px;
padding-right:20px;
position:relative;
top:-80px;
}

div#contentA {
text-align:justify;
vertical-align:top;
width:500px;
padding-left:0px;
position:relative;
min-height:600px;
z-index:20;
/*
column-count: 3;
column-gap: 1em;*/
}

div#contentC {
text-align:justify;
vertical-align:top;
width:auto;
padding-left:0px;
position:relative;
min-height:300px;
z-index:30;
}

.titleA , h2.titleA {
font-family: "freight-big-pro-lt", "Caslon 540 LT Std", georgia, serif;
font-size:24px;
color:dimgray;
font-weight:normal;
margin-bottom:1em;
margin-top:1em;
text-shadow: 2px 2px 5px silver;
}

.titleB {
font-family: "freight-big-pro-lt", "Caslon 540 LT Std", georgia, serif;
font-size: 20px;
color: dimgray;
line-height: 21px;
text-shadow: 1px 1px 2px silver;
}


.titleC {
font-family: "freight-big-pro-lt", "Caslon 540 LT Std", georgia, serif;
font-size: 16px;
color: dimgray;
line-height: 20px;
text-shadow: 1px 1px 2px silver;
margin-bottom:0.5em;
margin-top:0.8em;
}


div#content2 {
position:absolute;
top:240px;
width:770px;
/*margin: 0 auto;
border:1px dotted red;*/
}

div#content3 {
position:absolute;
top:240px;
width:1000px;
/*margin: 0 auto;
border:1px dotted red;*/
}

select:focus, input[type=text]:focus, textarea:focus {
background-color:cornsilk;
border:1px solid rgb(35,31,32);
border-radius:0;
}

select.bdr, input.bdr, textarea.bdr {
border-radius:0;
}

/* *** Colours *** */

.ora {
color:rgb(251,72,0);
}

.red {
color:rgb(210,0,0);
}

.dkg {
color:rgb(35,31,32);
}

.blu {
color:rgb(72,161,251);
}
.bgBlu {
background-color:rgb(72,161,251);
}

.blu2 {
color:rgb(133,203,249);
}

.gry {
color:rgb(103,102,108);
}

.bk {
color:rgb(0,1,5);
}

.wh {
color:rgb(239,239,239);
}

.grn {
color:rgb(190, 214, 0);
}

.pnk {
color:rgb(251,183,156);
}

.turq {
color:rgb(148,250,200);
}

.pgrn {
color:rgb(161,251,72);
}

.pblu {
color:rgb(204,235,250);
}

.lme {
color:rgb(190, 214, 0);
}
.sand {
color:rgb(191,185,167);
}

.dkgrn {
color:rgb(0,85,0);
}

.dkblu {
color: rgb(14,14,99);
}

.qm {
cursor: url(../../img/build/QM.png), auto;
}

fieldset {
border:1px solid rgb(56,35,89);
padding:10px 10px 20px 10px;
border-radius:0;
position:relative;
}

legend {
font-family: "freight-big-pro-lt", "Caslon 540 LT Std", georgia, serif;
font-size: 24px;
color:gray;
padding:0 4px;
text-shadow: 1px 1px 2px silver;
}

div#neworder fieldset legend {
font-family: "freight-big-pro-lt", "Caslon 540 LT Std", georgia, serif;
font-size:1.2em;
color:gray;
}

.dot {
border-bottom:1px solid rgb(56,35,89);
width:100%;
}

.dottop {
border-top:1px solid rgb(56,35,89);
width:100%;
}

.dot75 {
border-bottom:1px solid rgb(56,35,89);
width:75%;
}

.dbl {
border-bottom:3px double rgb(56,35,89);
width:100%;
}

.sng {
border-bottom:1px solid rgb(56,35,89);
width:100%;
}

.sngT {
border-top:1px solid rgb(56,35,89);
width:100%;
}


input.address, select.address {
display:block;
margin-bottom:2px;
border:1px solid rgb(56,35,89);
font-size:12px;
}

div.orderform {
width:auto;
display:table;
}

div.orderform div {
min-height:40px;
font-size:10px;
padding:4px 12px 4px 4px;
}

div.orderform div.boxA {
border:1px solid indigo;
margin:2px 2px 2px 0;
white-space:nowrap;
font-size:12px;
min-height: 60px;
min-width: 60px;
border-radius:0;
}

div.orderform div.boxBCV {
border:1px solid indigo;
margin:2px 2px 2px 0;
white-space:nowrap;
font-size:12px;
min-height: 60px;
min-width: 60px;
border-radius:0;
background-color:bisque;
}

div.orderform div.boxB {
border-right:1px solid silver;
border-bottom:1px solid silver;
border-top:1px solid silver;
border-left:1px solid silver;
margin:2px 2px 2px 0;
white-space:nowrap;
min-height: 60px;
font-size:12px;
border-radius:0;
}

div.orderform div.boxC {
border-right:1px solid silver;
border-bottom:1px solid silver;
border-top:1px solid silver;
border-left:1px solid silver;
margin:2px 2px 2px 0;
white-space:nowrap;
min-height: 60px;
font-size:12px;
border-radius:0;
}

div.orderform span {
display:block;
font-size: 18px;
text-align:center;
}

div.orderform div.boxC span {
display:block;
font-size: 12px;
text-align:left;
white-space:pre-wrap;
}

div#neworder div.orderform div {
min-height:75px;
font-size:12px;
padding:8px;
}

div#neworder div.orderform div.boxA {
border:1px solid silver;
margin:2px 2px 2px 0;
white-space:nowrap;
font-size:12px;
min-height: 70px;
min-width: 80px;
border-radius:0;
}

div#neworder div.orderform div.boxB {
border-right:1px solid silver;
border-bottom:1px solid silver;
border-top:1px solid silver;
border-left:1px solid silver;
margin:2px 2px 2px 0;
white-space:nowrap;
min-height: 60px;
font-size:12px;
border-radius:0;
}

div#neworder div.orderform div.boxC {
border-right:1px solid silver;
border-bottom:1px solid silver;
border-top:1px solid silver;
border-left:1px solid silver;
margin:2px 2px 2px 0;
white-space:nowrap;
min-height: 60px;
font-size:12px;
border-radius:0;
}

div#neworder div.orderform span {
display:block;
font-size: 18px;
text-align:center;
}

div#neworder div.orderform div.boxC span {
display:block;
font-size: 12px;
text-align:left;
white-space:pre-wrap;
}

table#basket th {
font-size:12px;
}

table#basket td {
font-size:14px;
}

/* Order acknowledgment */
div#ack {
width:100%;
min-width:650px;
}
table.acknowledgment {
border:1px solid rgb(35,31,32);
color:white;
border-collapse:separate;
border-spacing:0;
}

table.acknowledgment th {
font-size:12px;
text-align:center;
border-bottom:1px solid rgb(35,31,32);
font-weight:normal;
padding:2px;
background-color:cornsilk;
color:black;
}

table.acknowledgment th.rb, table.acknowledgment td.rb {
border-right:1px solid rgb(35,31,32);
}

table.acknowledgment td {
font-size:12px;
text-align:center;
font-weight:normal;
padding:4px 2px;
background-color:white;
color:rgb(35,31,32);
border-bottom:1px solid rgb(35,31,32);
}

table.itemlist {
border-top:1px solid rgb(35,31,32);
border-right:0;
border-bottom:0;
border-left:0;
background-color:white;
color:rgb(35,31,32);
width:100%;
border-collapse:separate;
border-spacing:0;
}

table.itemlist th {
font-size:12px;
text-align:center;
border-bottom:1px solid rgb(35,31,32);
font-weight:normal;
padding:6px;
background-color:cornsilk;
color:black;
}

table.itemlist th.rb, table.itemlist td.rb {
border-right:1px solid rgb(35,31,32);
}

table.itemlist td.bb {
/*border-bottom:1px solid rgb(35,31,32);*/
border:0;
}


table.itemlist td {
font-size:14px;
font-weight:normal;
padding:6px;
color:rgb(35,31,32);
height:24px;
}

table.itemlist td.ttl {
font-size:15px;
font-weight:600;
padding:6px;
color:rgb(35,31,32);
height:24px;
}

table.itemlist th.b5, table.itemlist td.b1 {
border-top:0;
border-right:1px solid rgb(35,31,32);
border-bottom:1px solid rgb(35,31,32);
border-left:1px solid rgb(35,31,32);
padding: 0 6px;
}

table.itemlist td.b2 {
border-top:0;
border-right:1px solid rgb(35,31,32);
border-bottom:1px solid rgb(35,31,32);
border-left:0;
padding: 0 6px;
}

table.itemlist td.b3 {
border-top:1px solid rgb(35,31,32);
border-right:1px solid rgb(35,31,32);
border-bottom:1px solid rgb(35,31,32);
border-left:1px solid rgb(35,31,32);
}

table.itemlist td.b4 {
border-top:1px solid rgb(35,31,32);
border-right:1px solid rgb(35,31,32);
border-bottom:1px solid rgb(35,31,32);
border-left:0;
}

table.itemlist td.b5 {
border-top:0;
border-right:1px solid rgb(35,31,32);
border-bottom:0;
border-left:1px solid rgb(35,31,32);
}

table.itemlist td.b6 {
border-top:0;
border-right:0;
border-bottom:1px solid rgb(35,31,32);
border-left:1px solid rgb(35,31,32);
}

table.itemlist td.b7 {
border-top:0;
border-right:0;
border-bottom:1px solid rgb(35,31,32);
border-left:0;
}


div.hidden {
display:none;
visibility:hidden;
}

table#ordertable tr:hover {
background-color:silver;
}

table#ordertable tr td {
color:white;
}

table#ordertable tr td.hand:hover {
color:black;
}

th#itmno {
background-color:rgb(255,0,0);
color:white;
cursor:pointer;
}

th#itmno:hover {
background-color:rgb(0,0,0);
}


div.proper {
position:absolute;
top:-120px;
left:0px;
border:1px solid rgb(81,81,81);
background-color:rgb(197,229,2);
padding:5px;
font-size:12px;
z-index:500;
}

p#stocklevel {
text-shadow: -1px -1px 2px rgba(0,0,0,25);
font-size:24px;
font-family:georgia;
color:rgb(192,192,192);
text-align:right;
line-height:30px;
float:right;
margin-right:30px;
}

p#onorder {
text-shadow: -1px -1px 2px rgba(0,0,0,25);
font-size:24px;
font-family:georgia;
color:rgb(192,192,192);
text-align:right;
line-height:30px;
float:right;
margin-right:30px;
}

div#destination {
z-index:10;
position:relative;}


div.outercoat {
float:left;
font-size:12px;
margin-right:10px;
color:beige;
height:40px;
border:1px dotted lavender;
padding:2px;
margin-bottom:4px;
}

div.outercoatR {
float:left;
font-size:12px;
margin-right:10px;
color:rgb(220,185,215);
height:40px;
border:1px dotted lavender;
padding:2px;
margin-bottom:4px;
background-color:rgb(56,35,89);
}

.spacer {
clear:left;
border-bottom:1px solid white;
font-size:3px;
width:100%;
margin-bottom:10px;
}

table.cartline {
width:100%;
border-right:1px solid rgb(35,31,32);
margin-bottom:2px;
background-color:white;
border-collapse:separate;
border-spacing:0;
}

table.cartline th {
border-top:1px solid rgb(35,31,32);
border-left:1px solid rgb(35,31,32);
font-size:12px;
font-weight:normal;
text-align:left;
padding:0 2px;
background-color:cornsilk;
}

table.cartline th.red {
background-color:rgb(56,35,89);
color:white;
cursor:pointer;
}

table.cartline th.red:hover {
background-color:rgb(35,31,32);
}

table.cartline td {
border-top:1px solid rgb(35,31,32);
border-left:1px solid rgb(35,31,32);
border-bottom:1px solid rgb(35,31,32);
font-size:14px;
padding:0 2px;
}

table.cartline td.f13 {
font-size:14px;
font-weight:bold;
}

div.option {
float:left;
border:1px solid rgb(35,31,32);
margin-right:2px;
margin-bottom:1px;
background-color:white;
color:rgb(35,31,32);
}
div.option div.Otop {
background-color:teal;
border-bottom:1px solid rgb(35,31,32);
font-size:12px;
padding:0 2px;
color:white;
}

div.option div.OtopR {
background-color:rgb(56,35,89);
border-bottom:1px solid rgb(35,31,32);
font-size:12px;
padding:0 2px;
color:white;
cursor:pointer;
text-shadow:0 0 3px black;
}

div.option div.Obot {
padding:0 2px;
font-size:14px;
}

div.optionC {
float:right;
border:1px solid rgb(35,31,32);
margin-left:2px;
margin-bottom:1px;
}
div.optionC div.Otop {
background-color:teal;
border-bottom:1px solid rgb(35,31,32);
font-size:12px;
padding:0 2px;
color:white;
}

div.optionC div.Obot {
padding:0 2px;
font-size:16px;
text-align:right;
}

div.optionR {
float:right;
position:relative;
margin-top:-10px;
margin-right:2px;
padding:2px;
margin-bottom:4px;
/*height:24px;
font-size:14px;
border:1px dotted lavender;
background-color:red;
color:black;*/
}


/*div.optionR:hover {
background-color:black;
cursor:pointer;
color:white;
}*/

fieldset.goldbox {
padding:10px 10px;
border:1px solid #c9b162;
border-radius:0;
}

fieldset.goldbox legend {
font-size:14px;
font-family: optima, arial, helvetica neue, calibri, sans-serif;
color:rgb(201,177,98);
}

div.optionR {
float:right;
font-size:14px;
margin-right:2px;
height:24px;
border:1px dotted lavender;
padding:2px;
margin-bottom:4px;
background-color:red;
color:black
}


div.optionR:hover {
background-color:black;
cursor:pointer;
color:white;
}

div#fixtrade {
position:absolute;
top:140px;
width:90%;
margin:0 5%;
}

div#fixindex {
position:absolute;
top:60px;
width:90%;
margin:0 5%;
}

div#popup {
position:absolute;
left:25%;
/* top:30%;*/
margin:0 auto;
width:50%;
height:auto;
background-color:rgb(22,43,72);
border:2px solid rgb(129,26,28);
z-index:100;
cursor:move;
color:white;
}

p.adc {
float:left;
margin-right:10px;
color:black;
text-shadow:1px 1px 0 white;
border:1px solid black;
padding:1px 2px;
}

p.ads {
float:left;
margin-right:10px;
color:white;
text-shadow:1px 1px 0 black;
border:1px solid silver;
padding:1px 2px;
}

div#defmatnme {
float:left;
color:rgb(22,43,72);
font-size:30px;
margin-right:20px;
text-shadow: 0 0 0.2em rgb(34,65,109), 0 0 0.2em rgb(51,99,165), 0 0 0.2em rgb(70,135,226);
}

.whtlne {
border-top:1px solid white;
}

/* SundryDesign */
div#dSs {
position:relative;
left:0;top:-200px;
}
div.destinationS {
position:absolute;
width:auto;
height:auto;
background-color:rgb(93,179,95);
border:4px solid rgb(20,20,20);
box-shadow:3px 3px 3px gray;
z-index:100;
text-align:left;
padding: 10px 0 10px 10px;
border-radius:10px;
}

/* SBDesign */
div.dD {
position:relative;
left:0;top:200px;
}

div.destinationD {
position:absolute;
width:auto;
height:auto;
background-color:rgb(212,255,42);
border:4px solid rgb(20,20,20);
box-shadow:3px 3px 3px gray;
z-index:100;
text-align:left;
padding: 10px 0 10px 10px;
border-radius:10px;
}

/* Ornamentation */
div.dO {
position:relative;
left:0;top:200px;
}

div.destinationO {
position:absolute;
width:auto;
height:auto;
background-color:rgb(255,255,70);
border:4px solid rgb(20,20,20);
box-shadow:3px 3px 3px gray;
z-index:100;
text-align:left;
padding: 10px 0 10px 10px;
border-radius:10px;
}

div.deo {
float:left;
margin: 0 10px 10px 0;
box-shadow: 2px 2px 2px green;
height:180px;border:2px solid green;width:150px;overflow:hidden;padding:5px;border-radius:5px;
background-color:white;
}

div.orna {
float:left;
margin: 0 10px 10px 0;
box-shadow: 2px 2px 2px rgb(250,125,0);
height:180px;border:2px solid rgb(250,75,0);width:150px;overflow:hidden;padding:5px;border-radius:5px;
background-color:rgb(225,225,225);
}

div.supimg {
float:left;
margin: 0 10px 10px 0;
box-shadow: 2px 2px 5px rgb(179,116,139);
height:200px;border:2px solid rgb(179,93,125);width:auto;overflow:hidden;padding:5px;border-radius:5px;
background-color:rgb(225,225,225);
font-size:0.8em;
}

button.trash-it {
cursor:pointer;
width:80px;height:80px;background-color:black;border-radius:5px;border:2px solid blue;
}

span.hilite:hover {
color:rgb(201,0,0);
text-shadow: 1px 1px 2px rgba(0,0,0,25);
}

/*input.submit, input.butt, input[type=submit] {
text-transform:capitalize;
color:rgb(190, 214, 0);
border:1px solid rgb(190, 214, 0);
background-color:rgb(35,31,32);
padding:2px 4px;
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
}

input.buttOra {
color:black;
border:3px double rgb(210,1,1);
background-color: orange;
}

input.submit:hover, input[type=button]:hover, input.butt:hover, input[type=submit]:hover, input.buttOra:hover {
color:rgb(35,31,32);
border:1px solid rgb(35,31,32);
background-color:rgb(35,31,32);
cursor:pointer;
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
} */

div#hints {
visibility:hidden;
display:none;
/*margin:0 25px;*/
margin:20px 0 25px 0;
font-size:20px;
font-style:italic;
color: indigo;
font-family:georgia;
}

p#hinttxt {
font-size:14px;
border:3px double rgb(191,185,167);
width:auto;
padding:10px 20px;
color:rgb(21,21,21);
background-color:cornsilk;
margin-top:10px;
}

p#hinttxt em {
font-style:italic;
font-weight:600;
display:inline-block;
text-transform: capitalize;
}

p#hinttxt span {
color:crimson;
}

/*div#targets {
float:left;
margin-right:30px;
margin-top:10px;
width:725px;
height:500px;
padding:10px;
background-color:rgb(190, 214, 0);
border:5px double white;
}

div#targets fieldset {
border:3px solid rgb(191,185,167);
padding:10px;
}

div#targets fieldset legend {
font-size:16px;
color:rgb(22,43,72);
}*/

table#tardis {
width:auto;
border-collapse:separate;
border-spacing:4px 6px;
margin: 0 auto;
border:1px solid rgb(22,43,72);
}

table#tardis td {
font-size:0.8em;
background-color:white;
padding:4px 6px;
color:rgb(22,43,72);
border:1px solid rgb(22,43,72);
}

table#tardis td.colB {
text-align:right;
font-weight:bold;
white-space:nowrap;
}

table#tardis em {
font-style:italic;
}

div#instantreport, div#targets {
background-color:rgb(56,35,89);
padding:10px;
width:725px;
height:auto;
margin-top:10px;
margin-right:30px;
border:5px double white;
float:left;
}

fieldset#report, div#targets fieldset {
border:3px solid cornsilk;
padding:10px;
}

fieldset#report legend, div#targets fieldset legend  {
font-size:16px;
color:white;
}

fieldset#report fieldset {
width:220px;
border:1px solid cornsilk;padding:10px;
}

div#d5render {
background-color:rgb(56,35,89);
padding:10px;
width:1080px;
height:482px;
margin:10px 30px 10px 0;
border:5px double white;
float:left;
}

div#setDiscount {
clear:left;
width:600px;
height:250px;
background-color:rgb(56,35,89);
padding:10px;
margin:10px 30px 10px 0;
border:5px double white;
float:left;
}

table.moneymatters {
border:1px solid white;
background-color:black;
border-collapse:separate;
border-spacing: 2px 4px;
width:400px;
}

table.moneymatters caption {
font-size:16px;
color: white;
text-shadow: 1px 1px 2px rgba(0,0,0,50);
padding: 10px 0 2px;
}
table.moneymatters tr.gry {
background-color:rgb(81,81,81);
}

table.moneymatters th {
color:white;
font-size:14px;
}

table.moneymatters td {
color:red;
font-size:14px;
text-align:right;
padding:0 5px;
}

table.moneymatters tr.gry td {
color:white;
}

table#webpurchases {
width:auto;
border-collapse:separate;
border-spacing:4px;
float:right;
margin-bottom:18px;
}

table#webpurchases td {
border:1px solid rgb(120,120,120);
text-align:right;
color:white;
font-size:12px;
padding:2px;
min-width:80px;
}

/*
div#targets {
float:left;
margin-right:30px;
margin-top:10px;
width:500px;
height:360px;
padding:10px;
background-color:rgb(190, 214, 0);
border:5px double white;
font-size:12px;
}

div#targets fieldset {
border:3px solid rgb(191,185,167);
padding:10px;
}

div#targets fieldset legend {
font-size:16px;
color:rgb(22,43,72);
}

table#tardis {
width:auto;
border-collapse:separate;
border-spacing:4px 6px;
margin: 0 auto;
border:1px solid rgb(22,43,72);
}

table#tardis td {
font-size:1em;
background-color:white;
padding:4px 6px;
color:rgb(22,43,72);
border:1px solid rgb(22,43,72);
}

table#tardis td.colB {
text-align:right;
font-weight:bold;
white-space:nowrap;
}

div#instantreport {
background-color:rgb(22,43,72);
padding:10px;
width:620px;
height:360px;
margin-top:10px;
margin-right:30px;
border:5px double white;
float:left;
}

fieldset#report {
border:3px solid rgb(212,206,184);
padding:10px;
}

fieldset#report legend {
font-size:16px;
color:white;
}

table.moneymatters {
border:1px solid white;
background-color:black;
border-collapse:separate;
border-spacing: 2px 4px;
width:300px;
}

table.moneymatters caption {
font-size:12px;
color: white;
text-shadow: 1px 1px 2px rgba(0,0,0,50);
padding: 10px 0 2px;
}
table.moneymatters tr.gry {
background-color:rgb(81,81,81);
}

table.moneymatters th {
color:white;
font-size:11px;
}

table.moneymatters td {
color:red;
font-size:13px;
text-align:right;
padding:0 5px;
}

table.moneymatters tr.gry td {
color:white;
}

table#webpurchases {
width:auto;
border-collapse:separate;
border-spacing:4px;
float:right;
margin-bottom:18px;
}

table#webpurchases td {

border:1px solid rgb(120,120,120);
text-align:right;
color:white;
font-size:12px;
padding:2px;
min-width:80px;
}
*/
fieldset.grouped {
float:left;
margin-right:10px;
padding:2px;
background:rgb(245,50,0) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAJUlEQVQImWOoCC7+f2f7dThmuLP9+n9kQQYYAybIgKy8Irj4PwCZvjHhfXaufgAAAABJRU5ErkJggg==) repeat;
border:1px dotted black;
}
div#stockedit {
background-color:rgb(225,225,225);
padding-left:40px;
}

div#stockedit div, div#stockedit p {
margin-bottom:20px;
margin-right:20px;
}

.boxbdr {
min-width:400px;
max-width:800px;
border:3px double grey;
padding:20px;
-webkit-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 6px 6px 5px 2px rgba(0, 0, 0, 0.25);
box-shadow: 6px 6px 5px 2px rgba(0, 0, 0, 0.25);
}

table#prixfix {
width:auto;
border-spacing:10px 4px;
border-collapse:separate;
}

table#prixfix th {
font-size:0.8em;
text-align:right;
width:100px;
}

table#prixfix td {
font-size:11px;
text-align:right;
}

table.pricelist {
width: 280px;
border-collapse:separate;
border-spacing:2px 2px;
border:2px solid black;
margin-bottom:20px;
}

table.pricelist thead {
background-color:indigo;
color:snow;
font-family:roboto;
}

table.pricelist thead th {
font-size:1em;
text-align:center;
padding:4px 6px;
border:1px solid black;
}

table.pricelist tbody {
background-color:white;
}

table.pricelist tbody td {
border:1px solid black;
font-size:0.8em;
font-family: arial;
color:black;
padding:2px 4px;
text-align:right;
white-space:nowrap;
}

table.pricelist tbody td.firstcell {
text-align:left;
}

table.pricelist tbody td.lastcell {
background-color:rgb(221,221,221);
}

table.pricelist tbody td div {
color:black;
font-size:1em;
font-family: arial;
}

.bg241 {
background-color:rgb(241,241,241);
}

div.autocomplete {
position:absolute;
width:250px;
background-color:white;
margin:0;
padding:0;
z-index:600;
border:1px dotted rgb(22,43,72);
}

div.autocomplete ul {
list-style-type: none;
margin: 0;
padding: 0;
}

div.autocomplete ul li.selected {
background-color: rgb(240,246,199);
}

div.autocomplete ul li {
list-style-type:none;
display:block;
margin:0;
padding:2px;
height:auto;
cursor:pointer;
font-size:16px;

}

div#indicator {
top:-40px;right:60px;z-index:0;width:40px;height:40px;
margin-bottom:-40px;
}

div#vindicator {
top:-40px;right:60px;z-index:0;width:40px;height:40px;
margin-bottom:-40px;
}

span.searchbeans {
float:left;
margin-right:10px;
font-size:12px;
cursor:pointer;
border-radius:5px;
padding:6px 10px;
text-shadow:1px 1px 1px gray;
margin-top:10px;
color:black;
border:2px solid black;
}

span.searchbeans:hover {
padding:6px 10px;
text-shadow:2px 2px 2px black;
box-shadow:1px 1px 2px white;
background-color:black;
color:white;
border:2px solid gray;
}

div.lineman {
float:left;
font-size:12px;
font-style:italic;
padding:6px;
background-color:black;
color:white;
outline:2px solid silver;
outline-offset:2px;
margin-right:10px;
margin-top:10px;
width:120px;
text-align:center;
}

div.lineman:hover {
cursor:pointer;
color:black;
background-color:white;
}

table.axd_dt th {
font-size:12px;
text-align:left;
}

table.axd_dt td {
font-size:12px;
}

div.stockfound {
float:left;
margin: 10px 10px 10px 0;
border:2px solid rgb(81,81,81);
border-radius: 5px;
width:360px;
padding:4px 10px;
min-height:80px;
cursor:pointer;
position:relative;
text-transform:capitalize;
font-variant:small-caps;
overflow:hidden;
}

div.stockfound:hover {
background-color: rgb(225,255,132);
color:rgb(0,85,0);
}

div.avast {
position:absolute;
bottom:2px;
font-size:12px;
}

div#changeEC {
float:right;
background-color:rgb(190, 214, 0);
right:0;
top:10px;
padding:20px;
border:2px solid rgb(35,31,32);
border-radius:5px;
}

table#multiusers {
width: 80%;
border-collapse: separate;
border-spacing: 4px;
}

table#multiusers th {
text-align:left;
font-size: 1em;
border-bottom:1px dotted black;
}

table#multiusers td {
font-size:1.2em;
}

table#searchandfound {
border:1px solid black;
min-width:600px;
width:100%;
border-collapse:collapse;
font-size:1em;
}

table#searchandfound tr.odd {
background-color:rgb(221,221,221);
}

table#searchandfound th {
font-size:0.7em;
text-align:left;
border:1px solid black;
padding:1px 5px 1px 2px;
}

table#searchandfound td {
font-size:0.8em;
padding:1px 5px 1px 2px;
border-right:1px solid grey;
cursor:pointer;
}

/*  Pop-out  cartline table for orders */
div.showorder {
top:36px;
left:40px;
min-width:500px;
min-height:50px;
border:1px solid black;
background-color:rgb(221,221,221);
z-index:60;
padding:5px 10px;
border-radius:5px;
box-shadow:0 0 1px 3px white;
cursor:auto;
width:auto;
}

table#searchandfound table.clorder {
border: 1px solid gray;
width:100%;
margin-bottom:5px;
background-color:white;
border-collapse:collapse;
font-size:11px;
}

table#searchandfound table.clorder tr {
border-bottom: 1px solid gray;
}

table#searchandfound table.clorder th {
cursor:auto;
border-bottom:none;
padding:0 5px;
color:black;
font-size:0.8em;
font-variant:small-caps;
background-color:rgb(255,221,221);
text-align:left;
}

table#searchandfound table.clorder td {
padding:2px 5px;
cursor:auto;
border-bottom:none;
white-space:nowrap;
color:black;
font-size:1em;
}

table#searchandfound td.relacolm {
position:relative;
}


div.stockresult {
margin: 10px 10px 10px 0;
border: 2px solid purple;
float:left;
width:360px;
padding:8px;
background-color:rgb(56,35,89);
border-radius:0;
height:80px;
position:relative;
cursor:pointer;
box-shadow: 2px 2px 4px rgba(0,1,5,0.7);
color:whitesmoke;
overflow:hidden;
}

div.stockresult:hover {
background-color:cornsilk;
color:indigo;
}

div.stockresult a {
font-size:16px;
color:white;
text-decoration:none;
}

div.stockresult:hover a, div.stockresult a:hover {
color:teal;
text-shadow:1px 1px 1px rgba(0,1,5,0.7);
}

div.stockresult img {
width:auto;
height:80px;
box-sizing:border-box;
}

div.calvari {
float:left;
margin-right:10px;
font-size:1.2em;
color: rgb(0,1,5);
width:150px;
}

div.boxred {
border:2px solid red;
border-radius:10px;
width:40px;
height:40px;
padding:5px 10px 10px 5px;
background-color:red;
box-shadow:2px 2px 2px rgb(0,1,5);
}

div.boxgreen {
border:2px solid green;
border-radius:10px;
width:40px;
height:40px;
padding:5px 10px 10px 5px;
background-color:green;
box-shadow:2px 2px 2px rgb(0,1,5);
}

div.boxyellow {
border:2px solid rgb(244,205,60);
border-radius:10px;
width:60px;
height:60px;
padding:5px 10px 10px 5px;
background-color:rgb(244,205,60);
box-shadow:2px 2px 2px rgb(0,1,5);
}

tr.hover {
background-color: rgb(220,220,220);
}

p.adc {
float:left;
margin-right:5px;
margin-left:5px;
color:black;
font-size:14px;
/*text-shadow:1px 1px 1px rgb(66,66,66);*/
border:2px solid black;
border-radius:5px;
padding:1px 2px;
width:190px;
background-color:rgb(201,201,201);
}

table#refdata {
min-width:250px;border:2px solid indigo;border-collapse:separate;border-spacing:5px;padding:20px;min-height:185px;
}

button.list-group-item {width:200px;text-align:left;}


/* Account Summary */

table#creditlimit {
width:100%;
}

table#creditlimit td, table#creditlimit td span, table#creditlimit td div {
font-size:0.9em;
}

table#accinv thead {
background-color: rgb(190,214,0);
}

table#accinv th {
background-color: rgb(190,214,0);
font-size:1.2em;
border-top:1px solid rgb(0,1,5);
}

table#accinv td {
text-align:center;
font-size:1.2em;
}
div#accinv_paginate, div#accinv_info, div#accinv_wrapper {
background-color:rgb(190,214,0);
padding:0.2em;
}

div#accinv_wrapper {
border:1px solid black;
}

div#accinv_filter, div#accinv_length {
padding:1em 0;
}

div#accinv_filter input {
color: gray;
}

table#ageddebt {
width:50vw;
border:0.1vw solid rgb(0,1,5);
}

table#ageddebt th {
text-align:center;
font-size:0.9vw;
font-weight:700;
}
table#ageddebt td {
text-align:center;
padding:0.7vw;
font-size:1vw;
}


/* table#livestock thead { */
/* background-color: indigo; */
/* position:sticky; */
/* top:93px; */
/* z-index:20; */
/* } */

/* table#livestock th { */
/* font-size:1.0vw; */
/* border-top:1px solid snow; */
/* border-bottom:1px solid snow; */
/* color: snow; */
/* } */

/* table#livestock td { */
/* text-align:center; */
/* font-size:1.0vw; */
/* color: rgb(0,1,5); */
/* } */

/* table#livestock td.l { */
/* text-align:left; */
/* } */

/* table#livestock td.r { */
/* text-align:right; */
/* } */
/* table#livestock td.plum { */
/* background-color:plum; */
/* color:indigo; */
/* } */
/* table#livestock td.indigo { */
/* background-color:indigo; */
/* color:snow; */
/* } */
/* table#livestock td.cornsilk { */
/* background-color:cornsilk; */
/* color:black; */
/* } */
/* table#livestock td.teal { */
/* background-color:teal; */
/* color:snow; */
/* } */

/* div#livestock_paginate, */
/* div#livestock_info, */
/* div#livestock_wrapper { */
/* background-color: rgb(56,35,89); */
/* color:snow !important; */
/* padding:0.2em; */
/* } */

/* div#livestock_filter, */
/* div#livestock_length { */
/* padding:1em 0; */
/* font-size:0.9vw; */
/* } */

/* div#livestock_filter input { */
/* color: black; */
/* font-size:1vw; */
/* } */

/* div#livestock_length select { */
/* color: black; */
/* font-size:1vw; */
/* } */

/* div#livestock_filter label { */
/* color: snow; */
/* font-size:0.9vw; */
/* } */

/* div#livestock_length label { */
/* color: snow; */
/* font-size:0.9vw; */
/* } */

/* div#livestock_info { */
/* color: snow !important; */
/* font-size:0.9vw; */
/* } */
/* div#livestock_paginate span a.paginate_button { */
/* color: snow !important; */
/* font-size:0.9vw; */
/* } */
/* a#livestock_previous.paginate_button, a#livestock_next.paginate_button { */
/* color: snow !important; */
/* font-size:0.9vw; */
/* } */

/* div#livestock_paginate span a.paginate_button.current { */
/* color: dimgray !important; */
/* font-size:0.9vw; */
/* } */

/* table#livestock td.relacolm { */
/* position:relative; */
/* } */



table#arsmemoria thead {
background-color: indigo;
}

table#arsmemoria th {
background-color: indigo;
font-size:1.0vw;
border-top:1px solid cornsilk;
color: snow;
}

table#arsmemoria td {
text-align:center;
font-size:1.0vw;
color: rgb(0,1,5);
}
table#arsmemoria td.l {
text-align:left;
}
table#arsmemoria td.r {
text-align:right;
}
div#arsmemoria_paginate, div#arsmemoria_info, div#arsmemoria_wrapper {
background-color:rgb(56,35,89);
padding:0.2em;
color:snow !important;
}
div#arsmemoria_filter, div#arsmemoria_length {
padding:1em 0;
font-size:0.9vw;
}
div#arsmemoria_filter input {
color: rgb(35,31,32);
font-size:1vw;
}
div#arsmemoria_length select {
color: rgb(35,31,32);
font-size:1vw;
}
div#arsmemoria_filter label {
color: snow;
font-size:0.9vw;
}
div#arsmemoria_length label {
color: snow;
font-size:0.9vw;
}
a#arsmemoria_previous,
a#arsmemoria_next {
color: snow !important;
font-size:0.9vw;
}
a#arsmemoria_previous:hover,
a#arsmemoria_next:hover {
color: cornsilk !important;
font-size:0.9vw;
}
#arsmemoria_info.dataTables_info,
#arsmemoria_paginate.dataTables_paginate {
color: snow !important;
font-size:0.9vw;
}

div#arsmemoria_paginate a.paginate_button {
background-color:indigo;
font-size:0.9vw;
color:snow !important;
}
div#arsmemoria_paginate a.current {
font-size:0.9vw;
color:#333 !important;
}
table#arsmemoria tbody tr {
    background-color: cornsilk;
}
table#arsmemoria tr:nth-of-type(even) {
    background-color: white;
}

p.elmedit {
border:1px solid lightgray;
padding:2px;
min-width:160px;
font-size:14px;
float:left;
margin-right:10px;
}

table#livestock2 td.relacolm {
    position:relative;
}

table#livestock2 thead {
    position:sticky;
    top:145px;
    z-index:20;
}

table#livestock2 th {
    background-color: rgb(190,214,0);
    font-size:0.8vw;
    border-right:1px solid rgb(0,1,5);
    border-bottom:1px solid rgb(0,1,5);
    border-left:1px solid rgb(0,1,5);
    color: rgb(0,1,5);
    text-align:left;
}

table#livestock2 td {
    text-align:center;
    font-size:0.85vw;
    color: rgb(0,1,5);
}

table#livestock2 td.l {
    text-align: left;
}

table#livestock2 td.r {
    text-align: right;
}

table#livestock2 td.c {
    text-align: center;
}

table#livestock2 td.stocktype a {
    font-size:0.85vw;
    text-decoration:none;
    color:black;
}

table#livestock2 td.stocktype a:hover {
    color:crimson;
}

div#livestock2_paginate,
div#livestock2_info,
div#livestock2_wrapper {
    background-color:#3c285b;
    padding:0.2em;
    color:snow;
}

table#livestock2 tbody tr {
    background-color: cornsilk;
}
table#livestock2 tr:nth-of-type(even) {
    background-color: blanchedalmond;
}

.dt-length label, .dt-search label {
    color:snow;
    font-size: 0.9vw;
}

.dt-length select {
    font-size: 0.8vw;
    background-color:snow !important;
    color: black !important;
}

.dt-search {
    /* margin-right:10px; */
}

.dt-search input {
    font-size: 0.8vw;
    color: black !important;
    background-color: snow !important;

}
.dt-info {
    color:snow;
    font-size: 0.8vw;
}



/* SVG Control */

div#svgMgr {
width:48vw;
min-height:48vw;
background-color:white;
border:1px solid gainsboro;
background-image:url(../images/grid.svg);
}
div#svgMgrSm {
width:8vw;
height:8vw;
background-color:white;
}

div.svgBox {
position:relative;
top:-50px;
left:-20px;
}

div.svgLg {
width:36vw;
height:auto;
background-color:white;
border:2px solid rgb(0,1,5);
padding: 10px;
cursor:not-allowed;
color:red;
}

div#svgoption {
min-width:10em;
}

div.svgSm {
position:relative;
max-width:7.5em;
max-height:7.5em;
background-color:white;
cursor:pointer;
margin:0 auto;
}

span.svgvSm {
position:relative;
max-width:5em;
max-height:5em;
background-color:white;
cursor:pointer;
}

div.svgLgHover {
min-width:250px;
border:3px solid gray;
font-family:roboto;
font-weight:300;
border-radius:5px;
background-color:rgb(255,255,255);
}

/* End SVG Control */

/* Img Control */

div.imgBox {
position:relative;
top:-50px;
left:-20px;
}

div.imgLg {
width:36vw;
height:auto;
min-height:280px !important;
background-color:white;
border:1px solid grey;
padding: 10px;
cursor:not-allowed;
}

p.imgTxt {
color:black;
font-size:2em !important;
}

div.imgSm {
position:relative;
max-width:7.5em;
max-height:7.5em;
background-color:white;
cursor:pointer;
margin:0 auto;
}

/* End Img Control */

div#elmex {
margin:0 0 0 50%;
position:fixed;
background-color:rgb(255,255,255);
max-width:600px;
padding:10px;
}

div#elmex5 {
position:fixed;
bottom:10%;
margin:0 10% 0 40%;
max-width:50%;
min-width:40%;
z-index:500;
background-color:white;
}

div#elmexKS {
right:10%;
top: 30%;
bottom: 30%;
position:fixed;
background-color:rgb(255,255,255);
max-width:300px;
padding:0;
z-index:1000;
}

ul#elmul { color:rgb(0,1,5); }

ul#elmul li:hover{ background-color:rgb(0,1,5); color:white; }
/*************************/


div#passwordupgrade input {
width:15.5em;
padding:0.3em;
box-shadow:2px 2px 2px 2px lightgray;
font-size:20px;
border:1px solid black;
border-radius:5px;
}

ul#multiuser {
margin-top:2em;
margin-bottom:3em;
}

ul#multiuser li {
list-style-type:square;
list-style-position: inside;
font-size:0.9em;
margin-left:3em;
}

div.covid {
float:left;
margin:0 15px;
width:200px;
border:2px solid rebeccapurple;
padding:5px;
border-radius:5px;
}

table#othermaterials {
border: 1px solid yellowgreen;
border-radius: 0.2em;
margin: 0.5em;
font-size: 0.8em;
border-collapse: separate;
border-spacing: 0.3em 0.5em;
min-width: 12em;
}

button.awesome, div.awesome {
border-radius: 0;
}

input[type=checkbox] {
transform: scale(1.8,1.8);
margin: 0.5em;
accent-color:rebeccapurple;
}

input[type=radio] {
transform:scale(1.5,1.5);
margin-top:0.5rem;
accent-color: rebeccapurple;
}

div.swal-text {
text-align: center;
}


/* Isotope */

.grid-item {
    width: 150px;
    height:150px;
    border:2px solid rgb(0,1,5);
    border-radius: 5px;
    margin:2px;
    padding:5px;
    text-shadow: 1px 1px 2px rgb(0,1,5);
    }

.grid-item:hover {
    border: 2px solid white;
    background-color: indigo;
}

.route-1 {
    background-color: dodgerblue;
        color: rgb(0,1,5);
}
.route-2 {
    background-color: forestgreen;
        color: rgb(0,1,5);
}
.route-3 {
    background-color: darkorange;
    color: rgb(0,1,5);
}
.route-4 {
    background-color: gold;
    color: rgb(0,1,5);
}
.route-5 {
    background-color: hotpink;
    color: rgb(0,1,5);
}

.route-9 {
    background-color: black;
    color:white;
}

.grid-item  div.red {
    color: rgb(255,0,0);
}
.loadday {display:none;}

div#create div.grid-item {
    width: 200px;
    height:200px;
    border:2px solid rgb(0,1,5);
    border-radius: 0;
    margin:1em;
    padding:5px;
    text-shadow: 1px 1px 2px rgb(0,1,5);
    background-size:cover;
    background-repeat:none;
    background-position:-35px 0;
    }

div#create div.grid-item:hover {
    border: 2px solid purple;
    background-color: cornsilk;
    z-index:20;
    cursor: grab;
}

div#create div.grid-item:active {
    border: 2px solid yellow;
    background-color: gold;
    cursor: grab;
}


/* Masonry */

.grid-itm {
    float:left;
    width: 180px;
    margin-right:10px;
    height: 240px;
    border:1px solid grey;
    margin-bottom:10px;
}
.grid-sizer {width:180px;}

/* ---- button class ---- */

.button {
  display: inline-block;
  padding: 5px 15px;
  margin-bottom: 10px;
  background: #EEE;
  border: none;
  border-radius: 7px;
  background-image: linear-gradient( to bottom, hsla(0, 0%, 0%, 0), hsla(0, 0%, 0%, 0.2) );
  color: #222;
  font-weight: 500;
  text-shadow: 0 1px white;
  cursor: pointer;
}


.button:hover {
  background-color: teal;
  text-shadow: 0 1px hsla(0, 0%, 100%, 0.5);
  color: ghostwhite;
}

.button:active,
.button.is-checked,
.button.is-selected {
  background-color: indigo;
}

.button.is-checked,
.button.is-selected {
  color: white;
  text-shadow: 0 -1px hsla(0, 0%, 0%, 0.8);
}

.button:active {
  box-shadow: inset 0 1px 10px hsla(0, 0%, 0%, 0.8);
}

/* ---- button-group ---- */

.button-group:after {
  content: '';
  display: block;
  clear: both;
}

.button-group .button {
  float: left;
  border-radius: 0;
  margin-right: 1px;
}

.button-group .button:first-child { border-radius: 0.5em 0 0 0.5em; }
.button-group .button:last-child { border-radius: 0 0.5em 0.5em 0; }
/***/



/* TIPSY - jQuery plugin */

.tipsy { padding: 5px; font-size: 12px; position: absolute; z-index: 100000; line-height:16px;}
.tipsy-inner { padding: 5px 8px 4px 8px; background-color: black; color: white; max-width: 200px; text-align: center; }
.tipsy-inner { border-radius: 3px; -webkit-border-radius:3px; }
.tipsy-arrow { position: absolute; background: url(../../img/build/tipsy.gif) no-repeat top left; width: 9px; height: 5px; }
.tipsy-n .tipsy-arrow { top: 0; left: 50%; margin-left: -4px; }
.tipsy-nw .tipsy-arrow { top: 0; left: 10px; }
.tipsy-ne .tipsy-arrow { top: 0; right: 10px; }
.tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -4px; background-position: bottom left; }
.tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; background-position: bottom left; }
.tipsy-se .tipsy-arrow { bottom: 0; right: 10px; background-position: bottom left; }
.tipsy-e .tipsy-arrow { top: 50%; margin-top: -4px; right: 0; width: 5px; height: 9px; background-position: top right; }
.tipsy-w .tipsy-arrow { top: 50%; margin-top: -4px; left: 0; width: 5px; height: 9px; }

#gravity { width: 100%; margin: 5px 0; border-spacing: 5px; }
#gravity td { text-align: center; vertical-align: middle; padding: 5px 0; background-color: #d0d0d0; width: 33%; }
#gravity a:hover { color: #505050; background: none; }