/* Web design copyright 2005-2016 Sam Trenholme
*
* This design depends on modern (Clear Type, etc.) font rendering and
* uses 100% open source fonts. It is designed to be compatible across
* many PC and tablet browsers; it works on Firefox 3.6 (2010), Internet
* Explorer 9 (2011) and higher.
*
*/
/*
* The following fonts are used as a basis for the web fonts here:
*
* A modified Adobe Source Sans Pro (called UserAuto) is used for the
* headings and bold text:
*
* https://www.google.com/fonts/specimen/Source+Sans+Pro
*
* http://sourceforge.net/projects/sourcesans.adobe/
*
* https://typekit.com/fonts/source-sans-pro
*
* A modified Bitstream Charter is used for the body text:
*
* http://practicaltypography.com/charter.html
*
* The fonts as used on this webpage can be downloaded here (True Type,
* EOT, and WOFF):
*
* http://samiam.org/fonts/webpage-2014-07-18-fonts.zip
*
* I also true type versions of the fonts, as well as small caps and a
* non-bold (“Romanâ€) sans serif as used in my résumé in that zip file.
*
* As an aside, a non-free opentype version of Bitstream Charter is here:
*
* http://www.myfonts.com/fonts/bitstream/charter-bt-pro/
*
*/
@font-face {
font-family: 'UserAuto';
src: url('/fonts/webpage-2014-07-18/Chortle2014f.woff');
}
@font-face {
font-family: 'UserAuto';
src: url('/fonts/webpage-2014-07-18/Chortle2014f-Italic.woff');
font-style: italic;
}
@font-face {
font-family: 'UserAuto';
src: url('/fonts/webpage-2014-07-18/UserAltA-Bold.woff');
font-weight: bold;
}
html {
overflow-y: scroll;
overflow: -moz-scrollbars-vertical;
font-synthesis: none;
height: 95%;
}
body {
font-family: UserAuto, Georgia,
"Liberation Serif", "Times New Roman",
sans-serif;
color: #000;
background-color: #cae6c7;
padding: 0;
margin: 0;
height: 100%;
font-size: 14pt;
}
table {
color: #000;
}
.iframe {
background: #cae6c7;
font-family: UserAuto, Georgia,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 12pt;
border: 0;
margin: 0;
padding: 2px;
}
.iframe b {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 15pt;
font-weight: bold;
}
.iframe img {
display: block !important;
display: none;
position: absolute;
left: 0px;
top: 408px;
}
h1 {
font-size: 24.5pt;
padding-top: 5px;
margin-top: 0;
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-weight: bold;
}
.hh3 {
margin-bottom: 0px;
}
.hh3r {
text-align: right;
margin-bottom: 0px;
}
h2 {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 16.7pt;
font-weight: bold;
}
.h2month {
border-bottom: 1px solid #888;
text-align: right;
}
h3 {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 16pt;
font-weight: bold;
}
.iframe ul {
list-style: none;
margin-top: 2px;
margin-left: 0;
margin-bottom: 0;
border: 0;
padding: 0;
}
.iframe li {
border-top: 1px solid black;
margin-top: 1px;
}
.iframe a {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
text-decoration: none;
color: #000;
font-size: 13pt;
font-weight: bold;
}
.iframe a:hover {
color: #202020;
background-color: #ffff99;
text-decoration: none;
}
@media screen and (min-width: 680px) {
.leftpic {
float: left;
margin-right: 5px;
}
.rightpic {
float: right;
margin-left: 5px;
}
}
.blogpicl {
float:left;
margin-left: 5px;
margin-right: 5px;
border: 1px solid #888;
height: 120px; /* IE9 bug */
}
.blogpicl img {
border: 0px;
}
.blogpic {
float:right;
margin-left: 5px;
margin-right: 5px;
border: 1px solid #888;
height: 120px; /* IE9 bug */
}
.blogpic img {
border: 0px;
}
.blogtable {
margin-top: 10px;
margin-bottom: 10px;
}
.blogtable table {
border: 1px solid black;
border-collapse: collapse;
font-size: 10pt;
}
.blogtable td {
border: 1px solid black;
padding: 2px;
}
.blogentries {
list-style: none;
margin-left: 0;
bargin-bottom: 0;
border: 0;
padding: 0;
}
.m8 a {
color: #3b5e35;
background: transparent;
}
.blogmor {
font-family: UserAuto, Georgia,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 14pt;
font-weight: normal;
text-decoration: underline;
color: #000;
}
.blogmor:hover {
text-decoration: none;
}
.blogx {
font-family: UserAuto, Georgia,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 14pt;
border-top: 1px solid #555;
background: #cae6c7;
padding-bottom: 3px;
}
.blogx a {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 14pt;
font-weight: bold;
text-decoration: none;
color: #000;
background: #cae6c7;
}
.blogy {
font-family: UserAuto, Georgia,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 14pt;
border-top: 1px solid #555;
background: #bad4b8;
color: #000;
padding-bottom: 3px;
}
.blogy a {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 14pt;
font-weight: bold;
text-decoration: none;
color: #000;
background: #bad4b8;
}
.blogtaglist {
font-family: UserAuto, Georgia,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 14pt;
}
.blogtaglistr {
font-family: UserAuto, Georgia,
"Liberation Serif", "Times New Roman",
sans-serif;
font-size: 12pt;
text-align: right;
font-style: italic;
}
.blogtitleb {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-weight: bold;
font-size: 16pt;
}
.blogtitlebr {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-weight: bold;
font-size: 16pt;
text-align: right;
}
.blogtitle {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-weight: bold;
font-size: 16pt;
margin-top: 1.2em;
}
.blogtitlem {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-weight: bold;
font-size: 16pt;
margin-top: 1.2em;
text-align: right;
}
.blogtitle b {
font-weight: bold;
}
.blogmonth {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-weight: bold;
font-size: 16pt;
}
.blogmonthr {
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-weight: bold;
font-size: 16pt;
text-align: right;
}
.blogmonth b {
font-weight: bold;
}
.wall {
color: black;
border: 4px solid #cae6c7;
border-top: 10px solid #cae6c7;
border-right: 2px solid #cae6c7;
margin-bottom: 2px;
text-align: left;
}
@media screen and (min-width: 800px) {
.wall { width: 634px; }
}
.wtext {
display: none;
font-size: 0;
color: #c0a080;
}
.whead {
background: #c0a080 url(me/Clouds-bg-8.jpg);
padding: 4px;
}
@media screen and (max-width: 800px) {
.wtext {
display: inline;
font-size: large;
font-weight: bold;
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
text-shadow: #000 1px 1px;
color: #fff;
}
.wimage {
display: none;
}
}
@media screen and (min-width: 800px) {
.whead {
background: #c0a080 url(me/Clouds-bg-ie8.jpg) top left
no-repeat;
background: url(me/businessman-bg.png) right bottom
no-repeat, #c0a080
url(me/Clouds-bg-8.jpg) top repeat;
background-size: 99px 100px, 287px 102px;
padding-left: 6px;
padding-bottom: 2px;
}
}
@media only screen and (-Webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {
.whead { background: url(me/businessman-bg.png) right bottom
no-repeat, #c0a080
url(me/Clouds-bg-8-ret.jpg) top repeat;
background-size: 99px 100px, 287px 102px;
}
}
.wlinks {
background: #fff;
color: #222;
padding-left: 4px;
font-family: UserAuto, Calibri,
"Liberation Serif", "Times New Roman",
sans-serif;
font-weight: bold;
font-size: 14pt;
letter-spacing: 1px;
}
.wlinks a {
text-decoration: none;
color: #222;
}
.wlinks a:hover {
color: #202020;
background-color: #ffff99;
}
.moyet {
display: none;
}
.up { margin-top: -8px; }
.ql { border-bottom: 2px solid black;
padding: 1px 2px 1px 2px;
}
.qlp {
padding: 2px 2px 2px 5px; }
.stuff { margin: 2px;
}
#tbl { padding: 0px; }
#tbl td {
border: solid #c0c0c0;
border-width: 1px 0px 0px 0px;
padding: 0px; }
.nocss { display: none; }
.m8 {
padding: 5px;
}
.m8b {
background-color: #cae6c7;
padding: 3px;
padding-left: 2px;
padding-right: 5px;
padding-top: 0px;
margin-top: -32px;
color: #000;
width: 165px;
border-radius: 0px;
text-align: center;
}
head:first-child+body .m8 a:hover {
color: #000000;
background-color: #ffff99;
text-decoration: none;
}
tt { font-family: monospace; font-size: 11pt; }
code { font-family: monospace; font-size: 11pt; }
pre { font-family: monospace; font-size: 11pt; }
.usenet {
max-width: 590px;
overflow: visible;
}
.usenet pre {
font-family: monospace;
font-size: 9.5pt;
}
.usenet a:visited {
color: #c00080;
}
.lside {
display: table-cell;
direction: ltr;
vertical-align: top;
padding: 1px;
text-align: left;
}
html>/**/body .lside {
width: 640px;
}
.rside {
vertical-align: top;
direction: ltr;
width: 187px;
padding: 1px;
}
.stable {
margin-left: auto;
margin-right: auto;
vertical-align: top;
background: #cae6c7;
height: 100%;
padding-left: 10px;
}
@media screen and (max-width: 849px) {
.m1 {margin-top: 30px;}
.m1r {margin-top: 30px;}
.m1b {margin-top: 30px;}
}
@media screen and (min-width: 850px) {
.rside {
display: table-cell;
}
.stable {
display: table;
/*direction: rtl;*/
padding-right: 10px;
border-right: 2px solid #444;
border-left: 2px solid #444;
border-bottom: 2px solid #444;
margin-bottom: 10px;
}
body {
background-color: #70b566;
background-image: url(/pics/aVGrad4l.png);
background-size: 100px 500px;
background-repeat: repeat-x;
background-attachment: scroll;
}
.m1r { margin-top: 42px; }
.m1 { margin-top: 42px; }
}