@import url('//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css');
@import url('//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css');
@import url('https://factgraphs.org/css/ie10-viewport-bug-workaround.css');
@import url('https://fonts.googleapis.com/css?family=Nixie+One');
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300');

@charset "UTF-8";

/* CSS Document */

/*Cookie Consent Begin*/
/* SOURCE: https://html-online.com/articles/cookie-consent-warning-strap-website/ */

#cookieConsent {
    background-color: rgba(20,20,20,0.6);
    min-height: 26px;
    font-size: 14px;
    color: #ccc;
    line-height: 26px;
    padding: 8px 0 8px 30px;
    font-family: "Trebuchet MS",Helvetica,sans-serif;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
    z-index: 9999;
}
#cookieConsent a {
    color: #ff6b59;
    text-decoration: none;
}
#closeCookieConsent {
    float: right;
    display: none; /* inline-block */
    cursor: pointer;
    height: 20px;
    width: 20px;
    margin: 2px 10px 0 0;
	font-size:1.3em;
    font-weight: 300;
}
#closeCookieConsent:hover {
    color: #FFF;
}
#cookieConsent a.cookieConsentOK {
    background-color: rgba(131,167,169,0.4); /* rgba(255,107,89,0.3) */
    color: #fff;
	letter-spacing: 2px;
    display: inline-block;
    border-radius: 3px;
    padding: 0 20px;
    cursor: pointer;
    float:none;
    margin: 3px 60px 0 20px;
}
#cookieConsent a.cookieConsentOK:hover {
    background-color: rgba(131,167,169,0.7);
}

/* extra */

p.bottomline { letter-spacing:2px; font-size:14px; color:#ddd; margin:40px 0 40px 0 }

/* smooth fade-in */

.slyfade {
    -webkit-animation: fadein 1s;
    /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s;
    /* Firefox < 16 */
    -ms-animation: fadein 1s;
    /* Internet Explorer */
    -o-animation: fadein 1s;
    /* Opera < 12.1 */
    animation: fadein 1s
}

@keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Firefox < 16 */

@-moz-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Safari, Chrome and Opera > 12.1 */

@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Internet Explorer */

@-ms-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Opera < 12.1 */

@-o-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* subtle backdrops */

.bkgdtxt {
    position: fixed;
    bottom: 0px;
    left: 50px;
    color: #FF6B59;
    opacity: 0.05;
    font-family: 'Open Sans'
}

/* MAIN ??? */

.body {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px
}

/* hidden instructions */

#totally {
    line-height: 23px
}

.whole {
    position: absolute;
    top: 0;
    min-height: 100%;
    background-color: rgba(244, 248, 250, 0.95);
    z-index: 1000
}

.denser {
    background-color: rgba(244, 248, 250, 0.97)
}

.wholewords {
    padding: 50px 40px 20px 40px
}

.wholewords a,
a:visited {
    color: #ccc
}

.wholewords a:hover {
    color: #ff6b59
}

.wholewords h2 {
    color: #333
}

.wholewords h3 {
    margin-bottom: 3px;
    padding-bottom: 0;
    color: #340404;
    font-weight: bold;
    font-family: monospace
}

.wholewords h4 {
    margin-bottom: 3px;
    padding-bottom: 0;
    color: #340404;
    font-weight: bold;
    font-family: monospace
}

.wholewords p {
    color: #000;
    font-family: Segoe, 'Segoe UI', 'Trebuchet MS', Verdana, sans-serif
}

.wholefooter {
    padding-top: 40px;
    font-size: 18px;
    color: #000;
    font-weight: 600;
    letter-spacing: 1px;
    font-family: 'Open Sans', 'Source Sans Pro', sans-serif
}

.wholewords a.howto,a.howto:hover {
    color: #ff6b59
}

.wholewords a.howto:hover {
    color: blue
}

#qna a { color:#ff6b59; text-decoration:none }
#qna a:visited { color:#ff6b59 }
#qna a:hover { color:#6c0 }

.lefthand {
    left: 0
}

.righthand {
    right: 0
}


/* data entry */

.minimalism {
    font-family: 'Nixie One', sans-serif;
    font-size: 28px;
    letter-spacing: 2px;
    background: transparent; 
    color: #39C;
    height: 80px;
    width: 100%;
    padding: 30px 0 0 0;
    outline: none;
    border: 0px;
    border-bottom: 8px solid;
    border-bottom-color: #ddd;
    -moz-border-radius: 0px !important;
    -khtml-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important
}

.tboxism {
    height: 180px; font-size:24px; color:#06ae00
}

.entitled input,
textarea {
    border: 1px dashed #ddd;
    text-align: left;
    font-family: 'Nixie One', sans-serif;
    background: none;
    color: #039
}

.entitled textarea {
    padding: 10px;
    width: 100%
}


/* placeholders */

.labelish {
    font-family: 'Open Sans', sans-serif;
    color: #95a398
}

::-webkit-input-placeholder {
    font-weight: 400;
    color: #95a398
}

:-moz-placeholder {
    font-weight: 400;
    color: #95a398
}

::-moz-placeholder {
    font-weight: 400;
    color: #95a398
}

:-ms-input-placeholder {
    font-weight: 400;
    color: #95a398
}

input:focus::-webkit-input-placeholder {
    opacity: 0.3
}

input:focus:-moz-placeholder {
    opacity: 0.3
}

.taggit::-webkit-input-placeholder {
    font-weight: 300;
    color: #0ACD47
}

.taggit:-moz-placeholder {
    font-weight: 300;
    color: #0ACD47
}

.taggit::-moz-placeholder {
    font-weight: 300;
    color: #0ACD47
}

.taggit:-ms-input-placeholder {
    font-weight: 300;
    color: #0ACD47
}


/* table variants */

.table-wrapper th,
td {
    height: 40px;
    font-family: 'Open Sans', sans-serif;
    font-size: 19px
}

.table-wrapper th {
    font-weight: 400
}

.table-wrapper td {
    font-weight: 300
}

/* a common link */

a.boast { color:#ff6b59 }
a.boast:hover { color:#6c0 }
a.boast:visited { color:#ff6b59 }

#animator {
    position: fixed;
    left: 50%;
    top: 50%;
    margin-left: -50px;
    z-index: 100000
}

#navo {
    position: fixed
}

.topicon,
.topicontriple {
    color: #ddd
}

.seelink a:visited { color:forestgreen }

.greyddd { color:#ddd }

.padtop10 {
    padding-top: 10px
}

.padtop20 {
    padding-top: 20px
}

.padtop30 {
    padding-top: 30px
}

.padtop40 {
    padding-top: 40px
}

.padtop50 {
    padding-top: 50px
}

.padtop60 {
    padding-top: 60px
}

.padbot50 {
    padding-bottom: 50px
}

.padbot40 {
    padding-bottom: 40px
}

.padbot30 {
    padding-bottom: 30px
}

.padbot25 {
    padding-bottom: 25px
}

.padbot20 {
    padding-bottom: 20px
}

.padbot15 {
    padding-bottom: 15px
}

.pad15 {
    padding: 25px 15px 0 15px
}

.hittingbottom {
    padding-bottom:O;
    margin-bottom: 0
}

a.conjure,
a.conjure:visited {
    opacity: 1;
    color: #d3d3d3
}

a.conjure:hover {
    opacity: 0.8;
    color: #ff6b59
}

a.closure,
a.closure:visited {
    opacity: 0.8;
    color: #333
}

a.closure:hover {
    opacity: 0.8;
    color: #ff6b59
}

a.standout,
a.standout:visited {
    opacity: 1;
    color: #ff6b59
}

a.standout:hover {
    opacity: 0.8;
    color: #3e79c7
}

.show {
    display: block
}

.hide {
    display: none
}

.showhow {
    display: block
}

.hidehow {
    display: none
}

.hidden {
    visibility: hidden
}

.unhidden {
    visibility: visible
}

.topfilter {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #fff;
    opacity: 0.9
}

.bottomfilter {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #fff;
    opacity: 0.98
}

#chartdiv {
    font-size: 12px;
    color: #FF6B59;
    opacity: 0.6;
    padding-top: 0px;
    padding-left: 0px
}


/* footer */

.foothold {
    margin: 20px 0 20px 0;
    text-align: center;
    letter-spacing:2px;
    color: #ccc;
    font-family: 'Open Sans', 'Source Sans Pro', sans-serif;
    font-size: 16px;
    width: 100%
}

.footholdfixed {
    position: fixed;
    bottom: 10px;
    left: 0;
    text-align: center;
    letter-spacing:2px;
    color: #ccc;
    font-family: 'Open Sans', 'Source Sans Pro', sans-serif;
    font-size: 16px;
    width: 100%
}

.blurb {
    font-family: 'Open Sans', sans-serif
}

#source,
#description {
    margin-top: 15px
}

.mainbox {
    width: 100%;
    height: 100%
}

/* BUTTONS */

/* blue buttons */

.bluebutton {
    border: 1px solid #fff;
    display: inline;
    cursor: pointer;
    /* z-index: 10000; */
    background-color: #6889ff;
    height: 60px;
    width: auto;
    margin: 0 10px 0 0;
    color: #ffffff;
    font-size: 26px;
    font-family: 'Source Sans Pro', 'Open Sans', sans-serif;
    text-align: center;
    padding: 8px 16px 10px 16px;
    border-radius: 5px;
    -webkit-transition: all 0.15s linear;
    -moz-transition: all 0.15s linear;
    transition: all 0.15s linear;
}

.bluebutton:focus {
    text-decoration: none;
    color:#fff;
}

.bluebutton:hover {
    background: #536dfe;
    text-decoration: none;
    color:yellow;
}

.bluebutton:active {
    background: #5677fc;
    text-decoration: none;
    color:#fff;
}

.bluebutton:visited {
    color:#fff;
}

/* transparent buttons */

.transparentbutton {
    border: 1px solid #fff;
    display: inline;
    cursor: pointer;
    z-index: 10000;
    background-color: rgba(255,107,89,0.1);
    height: 60px;
    width: auto;
    margin: 0 10px 0 0;
    color: #fff;
    font-size: 26px;
    font-family: 'Source Sans Pro', 'Open Sans', sans-serif;
    text-align: center;
    padding: 8px 16px 10px 16px;
    border-radius: 5px;
    -webkit-transition: all 0.15s linear;
    -moz-transition: all 0.15s linear;
    transition: all 0.15s linear;
}

.transparentbutton:focus {
    text-decoration: none;
    color:#fff;
}

.transparentbutton:hover {
    background: rgba(255,107,89,0.3);
    text-decoration: none;
    color:yellow;
}

.transparentbutton:active {
    background: rgba(255,151,138,0.3);
    text-decoration: none;
    color:#fff;
}

.transparentbutton:visited {
    background-color: rgba(255,107,89,0.1);
    color:#fff;
}


/* big green buttons */

.biggreenbutton {
    border: 1px solid #fff;
    display: inline;
    cursor: pointer;
    z-index: 10000;
    background-color: #6c0;
    height: 60px;
    width: auto;
    margin: 0 10px 0 0;
    color: #ffffff;
    font-size: 26px;
    font-family: 'Source Sans Pro', 'Open Sans', sans-serif;
    text-align: center;
    padding: 8px 16px 10px 16px;
    border-radius: 5px;
    -webkit-transition: all 0.15s linear;
    -moz-transition: all 0.15s linear;
    transition: all 0.15s linear;
}

.biggreenbutton:focus {
    text-decoration: none;
    color:#fff;
}

.biggreenbutton:hover {
    background: #5bb700;
    text-decoration: none;
    color:yellow;
}

.biggreenbutton:active {
    background: #84d632;
    text-decoration: none;
    color:#fff;
}

/* red buttons */

.redbutton {
    border: 1px solid #fff;
    display: inline;
    cursor: pointer;
    /* z-index: 10000; */
    background-color: #ff6b59;
    height: 60px;
    width: auto;
    margin: 0 10px 0 0;
    color: #ffffff;
    font-size: 26px;
    font-family: 'Source Sans Pro', 'Open Sans', sans-serif;
    text-align: center;
    padding: 8px 16px 10px 16px;
    border-radius: 5px;
    -webkit-transition: all 0.15s linear;
    -moz-transition: all 0.15s linear;
    transition: all 0.15s linear;
}

.redbutton:focus {
    text-decoration: none
}

.redbutton:hover {
    background-color: #e51c23;
    text-decoration: none;
    color:yellow;
}

.redbutton:active {
    background: #ff5177;
    /*box-shadow: 0 3px 1px #0f608c;*/
    text-decoration: none;
}

/* green buttons */

.greenbutton {
    border: 1px solid #fff;
    display: inline;
    cursor: pointer;
    /* z-index: 10000; */
    background-color: limegreen;
    height: 60px;
    width: auto;
    margin: 0 10px 0 0;
    color: #ffffff;
    font-size: 26px;
    font-family: 'Source Sans Pro', 'Open Sans', sans-serif;
    text-align: center;
    padding: 8px 16px 10px 16px;
    border-radius: 5px;
    -webkit-transition: all 0.15s linear;
    -moz-transition: all 0.15s linear;
    transition: all 0.15s linear;
}

.greenbutton:focus {
    text-decoration: none
}

.greenbutton:hover {
    background-color: green;
    text-decoration: none;
    color:yellow;
}

.greenbutton:active {
    background: #ff5177;
    /*box-shadow: 0 3px 1px #0f608c;*/
    text-decoration: none;
}

.greenbutton:visited { color:#fff }

/* miniature green buttons */

.greenbuttonmini {
    border: none;
    display: inline;
    cursor: pointer;
    /* z-index: 10000; */
    background-color: limegreen;
    height: 19px;
    width: auto;
    margin: 0px 10px 0 0;
    color: #ffffff;
    font-size: 17px;
    font-family: 'Source Sans Pro', 'Open Sans', sans-serif;
    text-align: center;
    padding: 2px 8px 3px 8px;
    border-radius: 5px;
    -webkit-transition: all 0.15s linear;
    -moz-transition: all 0.15s linear;
    transition: all 0.15s linear;
    position:relative;
    top:0px
}

.greenbuttonmini:focus {
    text-decoration: none
}

.greenbuttonmini:hover {
    background-color: green;
    text-decoration: none;
    color:yellow;
}

.greenbuttonmini:active {
    background: #ff5177;
    /*box-shadow: 0 3px 1px #0f608c;*/
    text-decoration: none;
}

.greenbuttonmini:visited {
    text-decoration: none;
    color:#fff
}

/* bootstrap button modifications */

.btn:hover {
    color: red
}

.btn-success:hover,
.btn-success:visited,
.btn-danger:hover,
.btn-danger:visited {
    color: white
}


/* tag button */

.btn-tags {
    margin-right: .5rem;
    margin-bottom: .5rem;
    color:#546684
}

.btn-tags:hover,
.btn-tags:visited {
    color:#546684
}

.btn-tags { background-color:#eee; border:none }
.btn-tags:hover { background-color: #d5e1e6; border:none }
.btn-tags:visited { background-color:#d5e6da; border:none }

.floaticon { font-size: 72px }

/* media queries -- should create a separate css file for this and load based on media */

@media screen and (max-width:5000px) {
    .mainbox {
        padding: 50px 7% 30px 7%;
        height: 100%
    }
    .topicon,
    .topicontriple {
        padding: 80px 0 50px 20px;
        text-align: left;
        font-size: 160px
    }
    h4.infolabel {
        font-size: 28px;
        padding: 0 0 0 0;
        margin: 0 0 0 0
    }
    #license {
        font-size: 14px
    }
    .overlap {
        position: absolute;
        bottom: 0px;
        left: 0;
        width: 100%
    }
    .topfilter,
    .topfilterhalf {
        height: 110px
    }
    .bottomfilter {
        height: 40px
    }
    .whole {
        width: 60%
    }
    .wholewords h2 {
        font-size: 32px; padding-bottom:15px
    }
    .wholewords h3 {
        font-size: 23px
    }
    .wholewords h4 {
        font-size: 23px
    }
    .wholewords p {
        font-size: 20px;
        line-height: 24px
    }
    .entitled input {
        width: 100%;
        height: 80px;
        font-size: 48px;
        margin-bottom: 20px
    }
    .entitled textarea {
        font-size: 32px;
        line-height: 36px;
        margin-bottom: 15px;
        height: 160px
    }
}

@media screen and (max-width:2400px) {
    .mainbox {
        padding: 50px 7% 30px 7%;
        height: 100%
    }
    .topicon,
    .topicontriple {
        padding: 60px 0 40px 20px;
        text-align: left;
        font-size: 120px
    }
    .whole {
        width: 60%
    }
    .wholewords h2 {
        font-size: 32px
    }
    .wholewords h3 {
        font-size: 22px
    }
    .wholewords h4 {
        font-size: 22px
    }
    .wholewords p {
        font-size: 19px;
        line-height: 22px
    }
    .entitled input {
        width: 100%;
        height: 80px;
        font-size: 48px;
        margin-bottom: 20px
    }
    .entitled textarea {
        font-size: 32px;
        line-height: 36px;
        margin-bottom: 20px;
        height: 160px
    }
    #description h4 { font-size: 36px }
    #description p { font-size: 28px }
    #navo { top:10px; letter-spacing: 7px }
}

@media screen and (max-width:1400px) {
    .mainbox {
        padding: 30px 5% 30px 5%;
        height: 100%
    }
    .topicon,
    .topicontriple {
        padding: 50px 0 30px 15px;
        text-align: left;
        font-size: 90px
    }
    h4.infolabel {
        font-size: 24px;
        padding: 0 0 0 0;
        margin: 0 0 0 0
    }
    .overlap {
        position: absolute;
        bottom: 0px;
        left: 0;
        width: 100%
    }
    .topfilter,
    .topfilterhalf {
        height: 100px
    }
    .bottomfilter {
        height: 40px
    }
    .whole {
        width: 70%
    }
    .wholewords h2 {
        font-size: 32px
    }
    .wholewords h3 {
        font-size: 22px
    }
    .wholewords h4 {
        font-size: 22px
    }
    .wholewords p {
        font-size: 19px;
        line-height: 22px
    }
    .entitled input {
        width: 100%;
        height: 60px;
        font-size: 36px;
        margin-bottom: 15px
    }
    .entitled textarea {
        font-size: 26px;
        line-height: 28px;
        margin-bottom: 15px;
        height: 160px
    }
}

@media screen and (max-width:980px) {
    .mainbox {
        padding: 80px 5% 30px 5%;
        height: 100%
    }
    .topicon,
    .topicontriple {
        padding: 40px 0 30px 15px;
        text-align: left;
        font-size: 72px
    }
    h3 {
        font-size: 28px
    }
    h4.infolabel {
        font-size: 14px;
        padding: 0 0 0 0;
        margin: 0 0 0 0
    }
    #logo {
        bottom: 20px;
        right: 20px;
        font-size: 36px
    }
    #license {
        font-size: 13px
    }
    .overlap {
        position: absolute;
        top: -80px;
        left: 10%;
        width: 80%
    }
    .topfilter,
    .topfilterhalf {
        height: 90px
    }
    .bottomfilter {
        height: 0px
    }
    .whole {
        width: 80%
    }
    .wholewords h2 {
        font-size: 32px
    }
    .wholewords h3 {
        font-size: 22px
    }
    .wholewords h4 {
        font-size: 22px
    }
    .wholewords p {
        font-size: 19px;
        line-height: 22px
    }
    .table-wrapper th,
    td {
        font-size: 16px
    }
    .entitled input {
        width: 100%;
        height: 48px;
        font-size: 32px;
        margin-bottom: 12px
    }
    .entitled textarea {
        font-size: 24px;
        line-height: 28px;
        margin-bottom: 15px;
        height: 160px
    }
}

/* small screens */

@media screen and (max-width:480px) {
    .mainbox {
        padding: 100px 5% 20px 4%;
        height: 100%
    }
    .topicon {
        padding: 30px 0 30px 0;
        text-align: center;
        font-size: 64px
    }
    .topicontriple {
        padding: 30px 0 15px 12px;
        text-align: left;
        font-size: 48px
    }
    h3 {
        font-size: 28px
    }
    .tboxism {
    height: 150px; font-size:22px;
}
    h4.infolabel {
        font-size: 15px;
        padding: 0 0 0 0;
        margin: 0 0 0 0
    }
    #logo {
        bottom: 10px;
        right: 10px;
        font-size: 36px
    }
    #license {
        font-size: 13px
    }
    .overlap {
        position: absolute;
        top: -80px;
        left: 0px;
        width: 100%;
        height: 130%
    }
    .topfilter,
    .topfilterhalf {
        height: 50px;
        width: 100%
    }
    .bottomfilter {
        display:none
    }
    .footholdfixed { 
        display:none 
    }
    .whole {
        width: 100%
    }
    .wholewords {
        padding: 30px 20px 20px 20px
    }
    .wholewords h2 {
        font-size: 32px
    }
    .wholewords h3 {
        font-size: 21px
    }
    .wholewords h4 {
        font-size: 21px
    }
    .wholewords p {
        font-size: 18px;
        line-height: 21px
    }
    .minimalism {
        font-size: 24px
    }
    .table-wrapper th,
    td {
        font-size: 14px
    }
    .entitled input {
        height: 40px;
        font-size: 24px;
        width: 100%;
        margin-top: 20px
    }
    .entitled textarea {
        font-size: 21px;
        line-height: 24px;
        margin-top: 20px;
        margin-bottom: 30px;
        height: 120px
    }
    .bluebutton, .biggreenbutton {
        height: 42px;
        font-size: 19px;
        padding: 6px 12px 8px 12px;
        margin-right: 0px
    }
    .transparentbutton {
        height: 42px;
        font-size: 19px;
        padding: 6px 12px 8px 12px;
        margin-right: 0px
    }
    .redbutton {
        height: 45px;
        font-size: 23px;
        padding: 6px 16px 8px 16px;
        margin-right: 0px
    }
    .greenbutton {
        height: 45px;
        font-size: 23px;
        padding: 6px 16px 8px 16px;
        margin-right: 0px
    }
    .tablestuff textarea {
        width: 90%;
        height: 70px;
        font-size: 16px
    }
}

p {
    font-family: 'Open Sans', sans-serif;
    color: #8e8e8e;
    font-weight: 300
}

h4.infolabel {
    font-family: "Trebuchet MS", Verdana, san serif;
    font-weight: bold
}

h5 a,
a:visited {
    color: #090
}

h5 a:hover {
    color: #C60
}

h5 a:focus {
    color: #F00
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0
}

h1 {
    color: #FF6B59;
    opacity: 0.85;
    letter-spacing: 3px;
    font-family: 'Nixie One', 'Open Sans', Verdana, sans-serif
}

h2 {
    color: #FF6B59;
    letter-spacing: 3px;
    font-family: 'Nixie One', 'Open Sans', Verdana, sans-serif;
    margin-bottom: 5px
}

h3 {
    color: #FF6B59;
    letter-spacing: 3px;
    font-weight: bold;
    font-family: 'Nixie One', 'Open Sans', Verdana, sans-serif;
    margin-bottom: 5px
}

h4 {
    margin-bottom: 0px;
    font-family: 'Courier New', sans-serif;
    font-weight: 300;
    color: #333
}

h5 {
    font-family: 'Nixie One', "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
    margin: 0 0 10px 0;
    padding-bottom: 0;
    color: #000
}

h6 {
    color: #999
}

@media screen and (max-width:5000px) {
    p {
        font-size: 20px;
        margin-bottom: 25px
    }
    h1 {
        font-size: 64px;
        margin-bottom: 40px
    }
    h2 {
        font-size: 32px
    }
    h3 {
        font-size: 26px
    }
    h4 {
        font-size: 22px
    }
    h5 {
        font-size: 20px
    }
    h6 {
        font-size: 18px
    }
}

@media screen and (max-width:1400px) {
    p {
        font-size: 19px;
        margin-bottom: 20px
    }
    h1 {
        font-size: 56px;
        margin-bottom: 40px
    }
    h2 {
        font-size: 32px
    }
    h3 {
        font-size: 26px
    }
    h4 {
        font-size: 22px
    }
    h5 {
        font-size: 20px
    }
    h6 {
        font-size: 18px
    }
}

@media screen and (max-width:980px) {
    p {
        font-size: 19px;
        margin-bottom: 20px
    }
    h1 {
        font-size: 48px;
        margin-bottom: 36px
    }
    h2 {
        font-size: 28px
    }
    h3 {
        font-size: 24px
    }
    h4 {
        font-size: 21px
    }
    h5 {
        font-size: 20px
    }
    h6 {
        font-size: 18px
    }
}

@media screen and (max-width:420px) {
    p {
        font-size: 18px;
        margin-bottom: 18px
    }
    h1 {
        font-size: 45px;
        margin-bottom: 30px
    }
    h2 {
        font-size: 26px
    }
    h3 {
        font-size: 24px
    }
    h4 {
        font-size: 20px
    }
    h5 {
        font-size: 20px
    }
    h6 {
        font-size: 18px
    }
}


/* tooltips for navigation */

.shmu-tooltip + .tooltip > .tooltip-inner {
    margin-right: 5px;
    height: 30px;
    font-size: 130%;
    letter-spacing: 2px;
    background-color: #ff6b59;
    opacity: 0.85;
    padding-top:4px
}

.shmu-tooltip + .tooltip > .tooltip-arrow {
    display: none
}