div.reg { font-family:"Times New Roman"; width:100%; }
div.narrow { font-family:"Times New Roman"; width:500px; }
div.border { border-style:solid; font-family:"Times New Roman";margin-top:0px }
div.medwide { font-family:"Times New Roman"; width:1200px; height: 2000px; margin: 300px auto;}
div.wide { font-family:"Times New Roman"; width:1600px; }
div.func { font-family:"Times New Roman";  width:800px; color:darkgreen}
div.table { font-family:"Times New Roman"; font-size:12px; width:500px; color:darkgreen}
div.main { font-family:"Times New Roman"; float:left; text-align:justify; width=800px; }
div.mainwider { font-family:"Times New Roman"; float:left; text-align:justify; width=1000px; }
div.mainnarrower { font-family:"Times New Roman"; float:left; text-align:justify; width=600px; }
div.center { font-family:"Times New Roman"; margin:auto; display:table; font-size:18px}
div.center16 { font-family:"Times New Roman"; margin:auto; display:table; font-size:16px}
div.wideborder { border-style:solid; font-family:"Times New Roman"; width:600px }
div.thebibliography { border-style:solid; font-family:"Times New Roman"; width:1200px }

p.right { position:fixed; top:30px; right:5px; }
p.left { position:fixed; top:30px; left:5px; }
p.left20 { font-size:20px; }
p.left16 { font-size:16px; padding: 2px}
.font16 { font-size:16px; }
.font14 { font-size:14px; }
p.center { margin-left:auto; margin-right:auto; text-align:justified; width:100%; font-family:"Times New Roman"; font-size:16px; }
p.center20 { margin-left:auto; margin-right:auto; text-align:justified; width:100%; font-family:"Times New Roman"; font-size:20px; padding:0px; margin:2px; }
p.center24 { margin-left:auto; margin-right:auto; text-align:justified; width:100%; font-family:"Times New Roman"; font-size:24px; vertical-align:text-top; }
p.list { margin-left:auto; margin-right:auto; margin-top:0; margin-bottom:0; text-align:justified; width:100%; font-family:"Times New Roman"; font-size:20px; }
p.centernarrow { margin-left:auto; margin-right:auto; text-align: justified; width: 50%; font-family:"Times New Roman"; font-size:16px; }
p.centerlarge { margin-left:auto; margin-right:auto; text-align:justified; width:98%; font-family:"Times New Roman"; font-size:20px; }
p.bibitem { margin-left:auto; margin-right:auto; text-align:justified; width:98%; font-family:"Times New Roman"; font-size:20px; }

p.verylarge { margin-left:auto; margin-right:auto; text-align:center; width:100%; font-family:"Times New Roman"; font-size:32px; }

.fleft { float:left; width:800px; border:1px solid #0000ff; padding:5px; margin:2px  }
.fleftwide { float:left; width:1000px; padding:15px; margin:2px  }
.fleftnarrow { float:left; width:350px; padding:5px; }
.fleftmenu { float:left; position:fixed; width:175px; padding:5px; }
.frightborder { float:right; width:700px; border:1px solid #0000ff; padding:5px; top:15px }
.fright { float:right; width:700px; padding:5px; margin:10px }
.frightwide { float:right; width:950px; padding:15px;  }
.frightnarrow { float:right; width:350px; padding:15px; }
.fright250narrow { float:right; width:250px; padding:0px 0px 0px 15px; margin-top:-30px   }

## These have big impact. Screwed up Rgis page, so I had to remove locally. Need to test further before reinstating. 
## Note that they are not now (8 Nov 2017) uploaded to richardcondit.org.
# *{margin:0; padding:0;} 
# body { background-color:gray; text-align:left}
html { width:100vw; height:100vh; margin:0; }
body.gray { width:100vw; height:100vh; background-color:lightgray; margin:0;}

body { background-color:#d0e4fe; text-align:left; width:100vw; height:100vh; margin:0;}
body.darkgreen { background-color:#088A08; text-align:left}
#map-canvas { height: 100% }

h1 { color:blue; text-align:center; }
h1.black { color:black; text-align:left; }
h2.blue { color:blue; text-align:center; padding:50px 0px 0px 5px; font-size:21px}
h2.black { color:black; text-align:left; margin:1px; }
h3 { color:blue; text-align:left; padding:50px 0px 0px 5px;}
h3.black { color:black; text-align:left; font-size:20px}
h3.big { color:blue; text-align:left; font-size:22px; margin-top:0; padding-top:1em}
h3.center { color:black; text-align:center; font-size:20px}

li { font-family:"Times New Roman"; font-size:16px;  }
li.func { font-family:"Times New Roman"; font-size:16px; color:darkgreen}
li.tight { font-family:"Times New Roman"; font-size:20px; margin-top:0; margin-bottom:-1em; }
li.large { font-family:"Times New Roman"; font-size:20px; }
li.medium { font-family:"Times New Roman"; font-size:18px; }
p.norm { font-family:"Times New Roman"; text-align:justify; font-size:20px; padding:20px 0px 0px 5px;}

img.right { float:right; margin:0px; padding: 5px;}
img.left { float:left; margin:0px; padding: 5px;}

.thumbnail { float:left; height:182px; margin:5px; border:1px solid #0000ff; }
.text_line { clear:both; margin-bottom:2px; }

a.spaced { padding: 5px 10px 20px 0px; } 

ul.leftmenu {float:left;list-style-type:none;margin:0;padding:20;overflow:hidden;background-color:#d0e4fe;width=100px; border:1px solid #0000ff; }
ul.leftlinks {float:left; position:fixed; list-style-type:none; margin:5; padding:10; overflow:hidden; background-color:#d0e4fe; width=75px; border:1px solid #0000ff; }
ul.box {position:fixed; margin:15; padding:15; overflow:hidden; background-color:lightgray; width=75px; border:1px solid #0000ff; }
ul.nomark { list-style-type: none; margin:0; padding:0; }
li.nomark { list-style-type: none; margin:0; padding:0; }
ul.tight { list-style-type:none; margin-top:0; margin-bottom:0; }
a.leftmenu {display:block; color:blue; font-size:16px;  }
a.center { margin:auto; text-align:center; color:blue; font-size:16px;  }

#maincontent { float:right; width:800px; margin: 0px auto; font-family:"Times New Roman"; font-size:16px; background-color:lightgray;}
#leftsidebar { float:left; width:200px; margin: 0px auto; font-family:"Times New Roman"; font-size:16px; background-color:#E6E6E6; }
#fullwrapper { width:1010px; margin:0 auto; background-color:lightgray; }
#tablewrapper { width:1400px; margin:0 auto; background-color:lightgray; }

/* These are moved to table.css. Many html scripts will now fail if relying on these until I insert table.css
td { font-family:"Times New Roman"; font-size:16px; align:right}
table.largefont td {font-size: 20px;}
table.normal td {font-size: 16px; padding: 1px 4px 1px 4px;}
table.normal th {font-size: 16px; padding: 1px 4px 1px 4px;}
*/

#table{ color:#003300; font-family:"Times New Roman"; font-size:14px; empty-cells: show;  }

a.anchor{display: block; position: relative; top: -210px; visibility: hidden;}

             
.sidebarPush { position:fixed; top:206px; font-family:"Times New Roman"; font-size:2vh; width:12%; height: 100%; padding: 1px 1px 1px 1px; 
               display:block; background-color: #gray;  margin: 10px 0px 0px 2px; }

.sidebar { font-family:"Times New Roman"; font-size:2vh; position: fixed; width: 12%; padding: 1px 1px 1px 1px; background-color: #gray; 
           top: 206px; margin: 10px 0px 0px 2px; z-index:1}
    
#sidebar20 { font-family:"Times New Roman"; font-size:16px; position: fixed; width: 20%; padding: 10px 15px 0px 5px; background-color: #d0e4fe; 
    top: 210px; left: 0px; margin: 0px 0px 0px 0px; }

.sidebarHigh { font-family:"Times New Roman"; font-size:16px; position: fixed; width: 18%; padding: 10px 15px 0px 5px; background-color: #gray;
    top: 25px; left: 0px; margin: 0px 0px 0px 0px}

#sidebarHighGray { font-family:"Times New Roman"; font-size:16px; position: fixed; width: 15%; padding: 10px 15px 0px 5px; background-color: lightgray; 
    top: 25px; left: 0px; margin: 0px 0px 0px 0px; }


#contentGray { font-family:"Times New Roman"; position:absolute; top: 206px; font-size:16px; width: 100%; height: 100%; padding: 1px 1px 1px 1px; 
            background-color: lightgray; margin: 10px 1px 1px 1px; }
#contentGrayAll {font-family:"Times New Roman";position:absolute;top:0px;font-size:16px;width:100%;height:100%;padding:0px;background-color:lightgray;margin:0px;}
#contentPush { font-family:"Times New Roman"; position:absolute; top: 206px; font-size:16px; width: 85%; height: 100%; right:0; padding: 1px 1px 1px 1px; 
              background-color: lightgray; margin: 10px 10px 1px 1px; }
#contentTop { font-family:"Times New Roman"; position:absolute; top: 10px; font-size:16px; width: 95%; height: 100%; right:0; padding: 1px 1px 1px 1px; 
              background-color: lightgray; margin: 10px 10px 1px 1px; }
#contentFull { font-family:"Times New Roman"; position:absolute; top: 5px; font-size:16px; width: 80%; height: 100%; right:0; padding: 1px 1px 1px 1px; 
              background-color: lightgray; margin: 10px 10px 1px 1px; }
.Rcode { border-style: solid; background-color: white; font-size: 2vh; }

/* These match up with headernormal. Allowing ht 120px */
#contentnormal { font-family:"Times New Roman"; font-size:16px; position: absolute; width: 85%; padding: 10px 25px 0px 10px; top: 120px; right: 0;  
                 background-color: d0e4fe; margin: 0px 0px 0px 00px; }
#sidebarnormal { font-family:"Times New Roman"; font-size:16px; position: fixed; width: 15%; min-width: 170px; padding: 10px 15px 0px 5px; top: 120px; left: 0px; 
                 background-color: #d0e4fe; margin: 0px 20px 0px 0px; }

#content { font-family:"Times New Roman"; font-size:16px; position: absolute; top: 210px; right: 0; width: 85%; padding: 20px 25px 0px 10px; 
            background-color: d0e4fe; margin: 0px 0px 0px 00px; z-index:5; }


#content80 { font-family:"Times New Roman"; font-size:16px; position: absolute; top: 210px; right: 0; width: 80%; padding: 20px 25px 0px 10px; 
             background-color: d0e4fe; margin: 0px 0px 0px 00px; z-index:5; }

#content80high { font-family:"Times New Roman"; font-size:16px; position: absolute; top: 100px; right: 0; width: 80%; padding: 20px 25px 0px 10px; 
                 background-color: d0e4fe; margin: 0px 0px 0px 00px; z-index:5; }

#content70 { font-family:"Times New Roman"; font-size:16px; position: absolute; top: 20px; left: 10; width: 70%; padding: 20px 25px 0px 10px; 
            background-color: d0e4fe; margin: 0px 0px 0px 00px; z-index:5; }

#contentHigh { font-family:"Times New Roman"; font-size:16px; position: absolute; top: 25px; right: 0; width: 85%; padding: 20px 25px 0px 10px; 
            background-color: d0e4fe; margin: 0px 0px 0px 00px; z-index:5; }

#container { width:100%; height: 100%; padding-top:210px; }
#containerfull { width:100%; height: 100%; padding: 10px 10px 5px 25px; }
#containerall { width:100%; height: 100%; padding: 0px; }

#footer { clear: both; width: 100%; height: 150px; background: #3b5998; }

img.rotate90 {
    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    transform: rotate(90deg);
    /* Moving origin this way accomplished rotation while lifting picture up, so base line remain unchanged */
    transform-origin: 45% 63%; 
}

img.rotate180 {
    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
    transform: rotate(180deg);
}

img.rotate270 {
    -ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
    transform: rotate(-90deg);
    -webkit-transform-origin: 43% 32%;
    transform-origin: 43% 32%;
}

img {
    -ms-transform: none; /* IE 9 */
    -webkit-transform: none; /* Chrome, Safari, Opera */
    transform: none;
}

section { padding-top:40px; margin-top:-100px; }

.rowtight{ margin-top:0px !important; }



.column 
 {
  float:left;
  padding:15px;
 }
 
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

.form-group {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   width: 1300px;
   flex-wrap: wrap;

 }
 
.form-group .input-control {
   flex: 1 1 auto; 
   display: block;
   margin-right: 8px;
   padding: 4px;
   margin-top: 0px;
   margin-bottom: 100px;
 }
 

.grid-container 
{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-row-gap: 20px;
  grid-column-gap: 20px;
  grid-auto-rows: minmax(100px, auto);
  # border: 1px solid black;
}

.grid3 { grid-column: 1 / 4; }
.grid4 { grid-column: 1 / 5; }
.grid12 { grid-column: 1 / 3; }
.grid22 { grid-column: 3 / 5; }
.grid23 { grid-column: 2 / 4; }
.grid14 { grid-column: 1; }
.grid24 { grid-column: 2; }
.grid34 { grid-column: 3; }
.grid44 { grid-column: 4; }


.photocol-1
{
  display: inline-block;
  height: 100%;
  width: 98%;
  padding: 1%;
  overflow: hidden;
}

.photocol-2 
{
  display: inline-block;
  height: 100%;
  width: 47%;
  padding: 1%;
  overflow: hidden;
}

.photocol-4 
{
  display: inline-block;
  width: 24%;
}

.flex-item-2 {
    background-color: lightblue;
    width: 600px;
    height: 100px;
    margin: 0px;
}

.flex-item-4 {
    background-color: lightblue;
    width: 25%;
    height: 400px;
    margin: 0px;
}

.flex-container 
{
  display: flex;
  width: 100%;
  height: 25%;
  padding: 0px 2px 2px 2px;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}

.flex-container-short 
{
  display: flex;
  width: 100%;
  height: 10%;
}

.flex-container-tall
{
  display: flex;
  width: 100%;
  height: 30%;
  padding: 0px 2px 2px 2px;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;

}

.flex-half
 {
  width: 48%;
  padding: 1%;
 }

.flex-quarter
 {
  width: 23%;
  padding: 1%;
 }