:root { background:whitesmoke; font-family:'PT Serif', serif; box-sizing: border-box; cursor: default; line-height: 1.4; -ms-overflow-style: -ms-autohiding-scrollbar; overflow-y: scroll; text-rendering: optimizeLegibility; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; } * { -moz-tab-size:4; -o-tab-size:4; tab-size:4; } /*! Basic element styles*/ html { font-size: 62.5% } body { font-size: 1.6em; padding: 0; color: #444; font-style: normal; font-weight: 400; } a { color: #1271db; -webkit-transition:.25s ease; transition: .25s ease } a, a:focus, a:hover { text-decoration: none } blockquote, pre { margin:16px 0; margin: 1.6rem 0 } blockquote, figcaption { font-family: serif } article, aside, dl, hr, section { margin-bottom:16px; margin-bottom: 1.6rem } footer, hr { border-top:1px solid rgba(0, 0, 0, .2); border-top: .1rem solid rgba(0, 0, 0, .2) } footer, img, section { max-width: 100% } img, select[multiple] { height: auto } hr { width: 100% } pre, textarea { overflow: auto } legend, ol, textarea, ul { margin-bottom:8px; margin-bottom: .8rem } ::after, ::before, td, th { vertical-align: inherit } footer, nav ul, td, th { text-align: center } [hidden], audio:not([controls]), template { display: none } small { font-size: 75%; color: #777 } big { font-size: 125% } [unselectable] { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } [unselectable], button, input[type=submit] { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none } ::after, ::before { text-decoration: inherit } code, kbd, pre, samp { font-family:'Anonymous Pro', Menlo, Monaco, Consolas, 'Courier New', monospace; } pre { /*box-shadow:rgba(0,0,0,0.1) 0 0 5px;*/ padding:0.25em; } code, pre { font-family:'Anonymous Pro', Menlo, Monaco, Consolas, 'Courier New', monospace; word-break: break-all; word-wrap: break-word; overflow-x: auto; } ::-moz-selection { background-color: #b3d4fc; text-shadow: none } ::selection { background-color: #b3d4fc; text-shadow: none } button::-moz-focus-inner { border: 0 } p { margin:0 0 16px; margin: 0 0 1.6rem } h1, h2, h3, h4, h5, h6 { font-family:'PT Serif', serif; margin:0.5em 0; } h1 { font-size: 1.75em; margin-top:0; font-style: normal } dd { margin-left:40px; margin-left: 4rem } ol, ul { padding-left:20px; padding-left: 2rem } blockquote { border-left:2px solid #1271db; border-left: .2rem solid #1271db; font-style: italic; padding-left:16px; padding-left: 1.6rem } article, aside, details, footer, header, main, section, summary { display: block; height: auto; margin: 0 auto; width: 100% } main { margin: 0 auto; max-width: 76.8em; padding:0 16px 16px; padding: 0 1.6rem 1.6rem } footer { padding:10px 0; padding: 1rem 0 } nav ul { list-style: none; margin: 0.5em auto; } nav a, td, th { padding:8px 16px; padding: .8rem 1.6rem } nav ul li { display: inline } nav a { border-bottom:2px solid transparent; border-bottom: .2rem solid transparent; color: #444; -webkit-transition:.25s ease; transition: .25s ease } nav a:hover { border-color: rgba(0, 0, 0, .2) } nav a:active { border-color: rgba(0, 0, 0, .56) } table { border-collapse: collapse; border-spacing: 0; margin-bottom:16px; margin-bottom: 1.6rem } caption { padding:8px 0; padding: .8rem 0 } thead th { background: #efefef; color: #444 } tr { background: #fff; margin-bottom:8px; margin-bottom: .8rem } td, th { border:1px solid #ccc; border: .1rem solid #ccc } tfoot tr { background: 0 0 } tfoot td { color: #efefef; font-size: .8em; font-style: italic; padding:16px 4px; padding: 1.6rem .4rem } /*! Flexbox grid */ section { -webkit-box-flex: 0; -ms-flex: 0; flex: 0; } .w930 { max-width:930px; } .grid { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; margin:0 auto; padding:0; } .grid-no-wrap { -ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important; } .grid-top {-webkit-box-align:start;-ms-flex-align:start;-ms-grid-row-align:flex-start;align-items:flex-start} .grid-bottom {-webkit-box-align:end;-ms-flex-align:end;-ms-grid-row-align:flex-end;align-items:flex-end} .grid-center {-webkit-box-align:center;-ms-flex-align:center;-ms-grid-row-align:center;align-items:center} .grid-justify-center {-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center} .cell {-webkit-box-flex:1;-ms-flex:1;flex:1}; .cell-top {-ms-flex-item-align: start;align-self: flex-start} .cell-bottom {-ms-flex-item-align: end;align-self: flex-end} .cell-center {-ms-flex-item-align: center;align-self: center} .cell-autoSize {-webkit-box-flex: 0;-ms-flex: none;flex: none} .cell-1of2 {-webkit-box-flex: 0 !important;-ms-flex: 0 0 50% !important;flex: 0 0 50% !important} .cell-1of3 {-webkit-box-flex: 0 !important;-ms-flex: 0 0 33.3333% !important;flex: 0 0 33.3333% !important} .cell-2of3 {-webkit-box-flex: 0 !important;-ms-flex: 0 0 66.6666% !important;flex: 0 0 66.6666% !important} .cell-1of4 {-webkit-box-flex: 0 !important;-ms-flex: 0 0 25% !important;flex: 0 0 25% !important} .grid-fit > .cell { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .grid-full > .cell { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; } .grid-1of2 > .cell { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; } .grid-1of3 > .cell { -webkit-box-flex: 0; -ms-flex: 0 0 33.3333%; flex: 0 0 33.3333%; } .grid-1of4 > .cell { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; } .grid-gutters { margin: 0 0 1em 0; } .grid-gutters > .cell { padding: 1em 0 0 1em; } .grid-guttersLg { margin: -1.5em 0 1.5em -1.5em; } .grid-guttersLg > .cell { padding: 1.5em 0 0 1.5em; } .grid-guttersXl { margin: -2em 0 2em -2em; } .grid-guttersXl > .cell { padding: 2em 0 0 2em; } /*! Misc layout styles*/ .no-top-margin{margin-top:0 !important} .no-top-padding{padding-top:0 !important} .margin5 {margin:0.5em} .padding5 {padding:0.5em} .pagebody { background:#fff; min-height:100%; border-top:2px solid silver; box-shadow:rgba(0,0,0,0.1) 0 0 5px; } .heading { margin-top:16px; margin-bottom:14px; line-height:24px; font-size:22px; } .heading .title { font-family:'PT Serif', serif; color: #000; font-weight:bold; } .heading .tagline { padding-left:15px; font-weight:300; font-size:80%; color:#000; } .bio { background:#f9f9f9; margin:12px; padding:15px; text-align:center; } .bio .logo { height:100px; width:100px; } .bio .title { margin-top:14px; font-weight:600; } .bio .tagline { margin:8px auto 0 auto; font-weight:300; text-align:justify; max-width:80%; font-size:94%; } .recent-posts { padding:15px; } .recent-posts .title { font-family:'PT Serif', serif; margin-top:-12px; border-top:6px solid #fff; padding-top:14px; font-weight:600; font-size:90%; margin-bottom:14px; } .recent-posts .title .showall { float:right; text-decoration:underline; padding-right:10px; font-size:0.80em; } .recent-posts .post { border-top:2px solid #fff; text-decoration:underline; font-size:94%; font-weight:400; display:block; padding-top:8px; padding-bottom:6px; } /*! Admin Styles*/ .admin textarea { font-family:'Anonymous Pro', Menlo, Monaco, Consolas, 'Courier New', monospace; font-size:1em; box-sizing:border-box; width:100%; min-height:15em; border:none; padding:0; overflow:hidden; resize:none; } .admin .edit-left, .admin .edit-right { background:#fff; padding:0.5em; box-shadow: rgba(0,0,0,0.1) 0 0 5px; } @media (min-width:12em) { .small-Grid--gutters { margin: -1em 0 1em -1em; } .small-Grid--gutters > .cell { padding: 1em 0 0 1em; } .small-Grid--guttersLg { margin: -1.5em 0 1.5em -1.5em; } .small-Grid--guttersLg > .cell { padding: 1.5em 0 0 1.5em; } .small-Grid--guttersXl { margin: -2em 0 2em -2em; } .small-Grid--guttersXl > .cell { padding: 2em 0 0 2em; } } @media (min-width:24em) { .med-Grid--gutters { margin: -1em 0 1em -1em; } .med-Grid--gutters > .cell { padding: 1em 0 0 1em; } .med-Grid--guttersLg { margin: -1.5em 0 1.5em -1.5em; } .med-Grid--guttersLg > .cell { padding: 1.5em 0 0 1.5em; } .med-Grid--guttersXl { margin: -2em 0 2em -2em; } .med-Grid--guttersXl > .cell { padding: 2em 0 0 2em; } } @media (min-width:48em) { .large-Grid--gutters { margin: -1em 0 1em -1em; } .large-Grid--gutters > .cell { padding: 1em 0 0 1em; } .large-Grid--guttersLg { margin: -1.5em 0 1.5em -1.5em; } .large-Grid--guttersLg > .cell { padding: 1.5em 0 0 1.5em; } .large-Grid--guttersXl { margin: -2em 0 2em -2em; } .large-Grid--guttersXl > .cell { padding: 2em 0 0 2em; } } @media screen { [hidden~=screen] { display: inherit } [hidden~=screen]:not(:active):not(:focus):not(:target) { clip: rect(0 0 0 0)!important; position: absolute!important } } @media screen and (max-width:40rem) { article, aside, section { clear: both; display: block; max-width: 100% } img { margin-right: 1.6rem } }