body {
    height: 100%;
    width: 100%;
    padding: 0;
    margin:  0;
    font-family: Times New Roman, sans-serif;
}
h1.page-title,
h2.page-title,
h3.page-title,
p,
ul.list-homepage {
    text-align: center;
}
.content p {
    text-align: left;
}
#home.content p {
    text-align: center;
    margin-top: 20px;
}
ul {
    margin: 0;
    padding: 0;
}
li {
    list-style-type: none;
    margin-bottom: 1em;
    line-height: 1;
}
h1 {
    font-size: 1.3em;
    line-height: 1.3em;
}
h1, h2, h3, h4, h5, h6 {
 font-weight: 600;
}

h1 {
    color: #3d311e;
    font-size: 3em;
    line-height: 1.25em;
}
h2 {
    color: #3d311e;
    font-size: 2em;
    line-height: 1.25em;
}
h3 {
    color: #3d311e;
    font-size: 1.2rem;
    line-height: 1.25em;
}
.content h3:not(.no-margin) {
    margin-top: 3.5rem;
}
.content.my-tech-journey h3:not(.no-margin) {
    margin-top: 6rem;
}
img { display: block; margin: 0 auto; border-radius: 100%; width: 240px;}

.card {
    border: none;
}

.card-h2 span,
time {
    display: inline-block;
}
.l-clearfix:after {
    clear: both;
}
a {
    transition-duration: 0.3s;
}
a.link {
    text-decoration: underline;
}
a:hover {
    cursor: pointer;
}
button {
    font-size: 16px;
    font-family: "Source Sans Pro", sans-serif;
}
tfoot {
    border-top: solid 1px transparent;
}
table.navigation-board tr:hover {
    cursor: pointer;
    transition-duration: 0.3s;
}
table.navigation-board tr:hover a {
    text-decoration: underline;
    transition-duration: 0.3s;
}

.navbar-nav {
    font-family: Roboto,"Helvetica Neue",Arial,sans-serif;
}
.nav-link {
    color: black;
    margin-right: 20px;
    margin-left: 20px;
}

img.full-width{
    float: none;
    max-width: 100%;
    margin: 0 auto;
    border-radius: 0;
    border: none;
    width: auto;
    /*margin: 1rem 0;*/
}
img.full-width.methodistcrm-features-register {
    max-width: 20rem;
}
.feature-image.screenshot.data-security,
.feature-image.screenshot.member-features,
.feature-image.screenshot.search {
    margin-top: 7rem;
    /*margin-bottom: 2rem;*/
}
.full-width.methodistcrm-features-backups {
    max-width: 93%;
    float: left;
    position: relative;
}

.full-width.methodistcrm-features-store,
.full-width.methodistcrm-features-search--quick {
    max-width: 88%;
    float: left;
    position: relative;
}
.features-partial {
    outline: 0;
    /*padding: 12rem 0;*/
    overflow: hidden;
}
.feature-image {
    margin: 0;
    width: auto;
    max-width: 100%;
    position: relative;
    /*height: 32rem;*/
}
.feature-image.android-app {
    height: 37rem;
}
.feature-image.data-security {
    height: 39rem;
}
.feature-image.search {
    height: 30rem;
}
.feature-image.member-features {
    height: 30rem;
}
.features-partial .feature-image > img {
    display: inline-block;
    vertical-align: middle;
    /*height: 100%;*/
    transition: opacity 1s, transform .8s, -webkit-transform .8s;
    /*position: absolute;*/
    opacity: 1;
    top: 0;
}
.features-partial:nth-child(2n) .feature-image > img {
    right: 0;
}
.features-partial .feature-image.screenshot img,
.feature-image.screenshot img {
    box-shadow: 0 10px 50px 0 rgba(47, 72, 103, 0.3);
}

.features-partial .feature-image.screenshot img {
    border-radius: 5px;
}

.features-partial .feature-image.screenshot img {
    box-shadow: 0 10px 50px 0 rgba(47, 72, 103, 0.3);
    border-radius: 5px;
}
.features-partial .feature-image .overlay-images img {
    height: 25rem;
    position: absolute;
}
.features-partial .feature-image .overlay-images img:nth-child(1) {
    left: 37rem;
    top: -5rem;
}
.features-partial#member-features .feature-image .overlay-images img:nth-child(1) {
    width: 31rem;
    height: auto;
    top: -6rem;
    left: 24rem;
}
.features-partial#quick-search .feature-image .overlay-images img:nth-child(1) {
    width: 31rem;
    height: auto;
    top: -6rem;
    left: 24rem;
}
.features-partial#member-features .feature-image .overlay-images img:nth-child(2) {
    width: 25rem;
    height: auto;
    left: 17rem;
    bottom: 1rem;
}
.features-partial#data_security .feature-image .overlay-images img:nth-child(1) {
    height: 40rem;
    left: auto;
    right: -5rem;
}
.contact ul a,
.nav a,
.sidebar-toggle {
    text-decoration: none;
}
table.navigation-board td {
    padding: 0;
}
table.navigation-board a {
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    padding: 0.5em;
    text-decoration: none;
}
td,
th {
    text-align: right;
    padding: 0.5em;
}
td:first-child,
th:first-child {
    text-align: left;
}
th {
    font-weight: 600;
}
table.small {
    font-size: 0.75em;
}
table.black {
    border: 1px solid #ccc;
}
table.black th {
    background: #ccc;
    color: #222;
}
table.black tr:nth-child(odd) {
    background: #fafafa;
}
table.black tr:nth-child(even) {
    background: #eee;
}
table.black a {
    color: #222;
}
table.navigation-board.black tr:hover {
    background: #ccc;
}
table.blue {
    border: 1px solid #bdcce5;
}
table.blue th {
    background: #bdcce5;
    color: #23457d;
}
table.blue td {
    color: #242e40;
}
table.blue tr:nth-child(odd) {
    background: #f4f6fb;
}
table.blue tr:nth-child(even) {
    background: #dee6f3;
}
table.blue tfoot .highlight {
    border-top: double 3px #6589c4;
    font-weight: 600;
    color: #23457d;
    background: #fff;
}
table.blue tfoot tr:nth-child(even),
table.blue tfoot tr:nth-child(odd) {
    background: #f4f6fb;
}
table.blue a {
    color: #23457d;
}
table.navigation-board.blue tr:hover {
    background: #bdcce5;
}
table.green {
    border: 1px solid #cddbc3;
}
table.green th {
    background: #cddbc3;
    color: #4a682d;
}
table.green td {
    color: #343d1e;
}
table.green tr:nth-child(odd) {
    background: #f7f9f5;
}
table.green tr:nth-child(even) {
    background: #e7eee2;
}
table.green tfoot .highlight {
    border-top: double 3px #8cac74;
    font-weight: 600;
    color: #4a682d;
    background: #fff;
}
table.green tfoot tr:nth-child(even),
table.green tfoot tr:nth-child(odd) {
    background: #f7f9f5;
}
table.green a {
    color: #4a682d;
}
table.navigation-board.green tr:hover {
    background: #cddbc3;
}
table.orange {
    border: 1px solid #fad6b6;
}
table.orange th {
    background: #fad6b6;
    color: #b15c0f;
}
table.orange td {
    color: #613811;
}
table.orange tr:nth-child(odd) {
    background: #fef8f3;
}
table.orange tr:nth-child(even) {
    background: #fdebdb;
}
table.orange tfoot .highlight {
    border-top: double 3px #f3a056;
    font-weight: 600;
    color: #b15c0f;
    background: #fff;
}
table.orange tfoot tr:nth-child(even),
table.orange tfoot tr:nth-child(odd) {
    background: #fef8f3;
}
table.orange a {
    color: #b15c0f;
}
table.navigation-board.orange tr:hover {
    background: #fad6b6;
}
table.purple {
    border: 1px solid #ebe8f3;
}
table.purple th {
    background: #ebe8f3;
    color: #7864ac;
}
table.purple a,
table.purple td {
    color: #30282b;
}
table.purple tr:nth-child(odd) {
    background: #f8f7fb;
}
table.purple tr:nth-child(even) {
    background: #fff;
}
table.purple tfoot .highlight {
    border-top: double 3px #a092c4;
    font-weight: 600;
    color: #30282b;
    background: #fff;
}
table.purple tfoot tr:nth-child(even),
table.purple tfoot tr:nth-child(odd) {
    background: #f8f7fb;
}
table.navigation-board.purple tr:hover {
    background: #d6d0e6;
}
table.red {
    border: 1px solid #efc7c1;
}
table.red th {
    background: #efc7c1;
    color: #973928;
}
table.red td {
    color: #56291c;
}
table.red tr:nth-child(odd) {
    background: #fcf6f5;
}
table.red tr:nth-child(even) {
    background: #f7e4e1;
}
table.red a {
    color: #973928;
}
table.navigation-board.red tr:hover {
    background: #efc7c1;
}
table.teal {
    border: 1px solid #e2eeec;
}
table.teal th {
    background: #e2eeec;
    color: #398981;
}
table.teal a,
table.teal td {
    color: #32685f;
}
table.teal tr:nth-child(odd) {
    background: #f5f9f8;
}
table.teal tr:nth-child(even) {
    background: #fff;
}
table.teal tfoot .highlight {
    border-top: double 3px #74aca6;
    font-weight: 600;
    color: #32685f;
    background: #fff;
}
table.teal tfoot tr:nth-child(even),
table.teal tfoot tr:nth-child(odd) {
    background: #f5f9f8;
}
table.navigation-board.teal tr:hover {
    background: #c3dbd9;
}
table.yellow {
    border: 1px solid #f3eac5;
}
table.yellow th {
    background: #f3eac5;
    color: #5a4c20;
}
table.yellow td {
    color: #5a4c20;
}
table.yellow tr:nth-child(odd) {
    background: #fefcf7;
}
table.yellow tr:nth-child(even) {
    background: #faf5e3;
}
table.yellow a {
    color: #a28a32;
}
table.yellow tfoot .highlight {
    border-top: double 3px #e4ce79;
    font-weight: 600;
    color: #a28a32;
    background: #fff;
}
table.yellow tfoot tr:nth-child(even),
table.yellow tfoot tr:nth-child(odd) {
    background: #fefcf7;
}
table.navigation-board.yellow tr:hover {
    background: #f3eac5;
}
input {
    width: 100%;
}
time {
    color: #645336;
    font-family: "Roboto Slab", serif;
    font-size: 1.125em;
    font-weight: 300;
    margin-bottom: 2.22222222em;
}
.card-image {
    float: right;
}
.card-image img {
    float: none;
    border-radius: 3px;
}
.card {
    position: relative;
    width: 100%;
    min-height: 215px;
    /*border: 1px solid #f3eac5;*/
    border-radius: 3px;
    /*box-shadow: 0 2px 0 #f3eac5;*/
    background: #fff;
    color: #241e14;
    margin-bottom: 20px;
}
.card-h2 {
    color: #a28a32;
    background: #f3eac5;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    font-size: 1.25em;
}
.card-h2 span {
    padding: 10px 20px;
}
.card-icon {
    font-size: 1.2em;
}
.card-icon.brown {
    color: #fff;
    background: #95805d;
}
.card-content,
.header-content {
    padding: 20px;
}
.card.black {
    border-color: #eee;
    box-shadow: 0 2px 0 #ccc;
}
.card.black .card-h2 {
    color: #000;
    background: #eee;
}
.card.blue {
    border-color: #dee6f3;
    box-shadow: 0 2px 0 #bdcce5;
}
.card.blue .card-h2 {
    color: #2457ab;
    background: #dee6f3;
}
.card.green {
    border-color: #e7eee2;
    box-shadow: 0 2px 0 #cddbc3;
}
.card.green .card-h2 {
    color: #5b8939;
    background: #e7eee2;
}
.card.orange {
    border-color: #fdebdb;
    box-shadow: 0 2px 0 #fad6b6;
}
.card.orange .card-h2 {
    color: #ef780e;
    background: #fdebdb;
}
.card.purple {
    border-color: #ebe8f3;
    box-shadow: 0 2px 0 #d6d0e6;
}
.card.purple .card-h2 {
    color: #7864ac;
    background: #ebe8f3;
}
.card.red {
    border-color: #f7e4e1;
    box-shadow: 0 2px 0 #efc7c1;
}
.card.red .card-h2 {
    color: #ca4632;
    background: #f7e4e1;
}
.card.teal {
    border-color: #e2eeec;
    box-shadow: 0 2px 0 #c3dbd9;
}
.card.teal .card-h2 {
    color: #398981;
    background: #e2eeec;
}
.card.yellow {
    border-color: #faf5e3;
    box-shadow: 0 2px 0 #f3eac5;
}
.card.yellow .card-h2 {
    color: #a28a32;
    background: #f3eac5;
}
.material-icons {
    font-size: 16px;
    vertical-align: bottom;
}

.tab-pane p:first-child {
    margin-top: 1rem;
}

/**** Responsive Styles ****/

@media (max-width: 1020px) {

}
@media (max-width: 960px) {
    .overlay-images {
        display: none;
    }
    .feature-image img {
        width: 100%;
        height: auto;
    }
    .feature-image {
        margin-top: 1rem;
    }
    .full-width.methodistcrm-features-backups,
    .full-width.methodistcrm-features-store,
    .full-width.methodistcrm-features-search--quick {
        max-width: 100%;
        float: none;
    }
    .content.my-tech-journey h3:not(.no-margin) {
        margin-top: 4rem;
    }
    .feature-image.screenshot.data-security,
    .feature-image.screenshot.member-features,
    .feature-image.screenshot.search {
        margin-top: 0rem;
        margin-bottom: 0rem;
    }
    .feature-image.member-features,
    .feature-image.screenshot.search,
    .feature-image.android-app {
        height: 15rem;
    }
    .feature-image.data-security {
        height: 18rem;
        margin-top: 1.5rem;
    }
}
@media (max-width: 560px) {
    .card-content {
        padding: 10px;
    }
}
.contact {
    border-top: solid 1px #23457d;
    color: #6589c4;
}
.contact h2 {
    padding: 20px 0 5px;
    font-family: "Source Sans Pro", sans-serif;
    line-height: 20px;
}
.contact h2 a {
    display: block;
    padding: 10px;
    background: 0 0;
    margin-bottom: 0;
    cursor: default;
}
.contact p,
.contact ul a {
    margin-bottom: 10px;
}
.contact ul a {
    display: block;
    color: #6589c4;
    background: #242e40;
    padding: 10px;
}
.contact ul a:hover {
    background: #bdcce5;
    color: #242e40;
}
.content {
    /*padding-top: 20px;*/
    /*padding-left: 260px;*/
}
.content .single-thumbnail {
    width: 100%;
}
.content blockquote,
.content p {
    color: #3d311e;
    line-height: 2em;
    margin-bottom: 30px;
}

.content p.feature-intro {
    margin-bottom: 10px;
}
.content a {
    color: #398981;
}
.content a:hover {
    color: #ef780e;
}
.content h2 {
    margin: 20px 0;
}
.content ol,
.content ul.list-homepage {
    margin: 2em;
}
.content ul.list-normal {
    margin-left: 2rem;
    margin-bottom: 2rem;
}
.content ul.list-normal li {
    list-style-type: disc;
}
.content ol {
    list-style-type: decimal;
}
.content ul.list-homepage {
    list-style-type: disc;
}
.content li {
    color: #3d311e;
    margin-bottom: 1em;
}
.content blockquote {
    padding: 1em;
    border-left: solid 10px #f3eac5;
    background: #faf5e3;
    font-style: italic;
}
.content img:not(.full-width) {
    float: right;
    width: 240px;
    margin: 20px 0 20px 20px;
}
.content img.profile-photo {
    float: none;
    margin: 0 auto;
}
.content strong {
    font-weight: 600;
}
.content em {
    font-style: italic;
}
.content-wrap {
    width: 50%;
    margin: 0 auto;
}
@media (max-width: 1440px) {
    .content-wrap {
        width: 65%;
    }
}
@media (max-width: 1200px) {
    .content-wrap {
        width: 80%;
    }
}
@media (max-width: 960px) {
    .content {
        width: 100%;
    }
    .sidebar {
        width: 40px;
    }
    .s-sidebar-toggled .sidebar {
        width: 240px;
    }
}
@media (max-width: 600px) {
    .content-wrap h2 {
        font-size: 1.75em;
    }
}
@media (max-width: 560px) {

    .content-wrap {
        width: 100%;
    }
}
@media (max-width: 500px) {
    .content-wrap img {
        width: 100%;
        margin: 0 0 20px;
    }
}