* {
    box-sizing: border-box;
}

.row::after {
    content: "";
    clear: both;
    display: table;
}

[class*="col-"] {
    float: left;
    padding: 10px;
}

body {
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    /* margin: 0px 50px; */
    /* padding: 0px; */
    background-color: #fafafa;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: black;
    text-decoration: none;
    font-size: 17px;
}

a:hover {
    color: #ff9a19;
}

ul {
    list-style-position: outside;
    padding-left: 1.2em;
    /* font-family: Geneva; */
    font-size: 11pt;
}

.header {
    border-bottom: 1px solid lightgray;
}

.footer {
    border-top: 1px solid lightgray;
}

.footer a {
    color: #7d818c;
}

.footer a:hover {
    color: #ff9a19;
}

.separator {
    border-bottom: 1px solid lightgray;
}

.menu-bar {
    display: flex; 
    align-items: center;
    padding: 15px 0px 15px 0px
}

.menu-left {
    flex-grow: 1;
    text-align: left;
    padding: 0px 20px 0px 0px;
}

.menu-right {
    text-align: right;
    padding: 0px 0px 0px 20px;
}

/* Style the links inside the navigation bar */
.menu-bar a {
    float: left;
    color: #7d818c;
    /* text-align: center; */
    padding: 4px 4px;
    text-decoration: none;
    font-size: 17px;
    border-radius: 4px;
}

/* Change the color of links on hover */
.menu-bar a:hover {
    background-color: #ddd;
    color: black;
}

/* Add a color to the active/current link */
.menu-bar a.active {
    background-color: #4caf50;
    color: white;
}

/* For mobile phones: */
[class*="col-"] {
    width: 100%;
}

.left {
    text-align: center;
}

.center {
    text-align: center;
}

.right {
    text-align: center;
}

.block {
    padding: 15px 0px;
}

@media only screen and (min-width: 600px) {
    /* For tablets: */
    .col-s-1 {width: 8.33%;}
    .col-s-2 {width: 16.66%;}
    .col-s-3 {width: 25%;}
    .col-s-4 {width: 33.33%;}
    .col-s-5 {width: 41.66%;}
    .col-s-6 {width: 50%;}
    .col-s-7 {width: 58.33%;}
    .col-s-8 {width: 66.66%;}
    .col-s-9 {width: 75%;}
    .col-s-10 {width: 83.33%;}
    .col-s-11 {width: 91.66%;}
    .col-s-12 {width: 100%;}

    .left {
        float: left!important;
        text-align: left;
    }

    .right {
        float: right!important;
        text-align: right;
    }
}

@media only screen and (min-width: 992px) {
    /* For desktop: */
    body {
        padding: 0px 10%;
    }
    
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}

    .left {
        float: left!important;
        text-align: left;
    }

    .right {
        float: right!important;
        text-align: right;
    }

    .block {
        padding: 15px 10% 15px 10%;
    }
}

.icon {
    border-radius: 8px;
}

.blog-heading {
    padding: 30px;
}

.blog-date {
    padding: 10px;
}

.blog-title {
    font-size: 200%;
    font-weight: bold;
    padding: 10px;
}

.support-section-heading {
    /* font-size: 125%; */
    font-weight: bold;
    border-bottom: 1px solid lightgray;
    margin: 10px 0px;
}

.support-question {
    padding: 5px 0;
    /* font-size: 125% */
    font-weight: bold;
}

.support-answer {
    padding: 5px 0;
}

.support-section-title {
    color: gray;
    font-size: 125%;
}

.support-topic-title {
    font-weight: bold;
    font-size: 200%;
    padding: 10px 0;
}

.support-prose {
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    font-size: 13pt;
}

.support-prose a {
    font-weight: bold;
}

.support-heading {
    display: flex;
    align-items: center;
    font-size: 125%;
    font-weight: bold;
}

.app-literal {
    white-space: nowrap;
    border-radius: 4px;
    background-color: #e3e3e3;
    padding-right: 4px;
    padding-left: 4px;
    /* color: #ff9a19; */
}

.app-button {
    width: auto;
    max-height: 14pt;
    vertical-align: text-top;
}

.feature {
    margin: 10px;
}