body {
    font-family: "Lato","proxima-nova","Helvetica Neue",Arial,sans-serif;
    color: #555;
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    min-height: 100vh;
}

#content {
    display: flex;
    flex-grow: 1;
}

.bg-theme {
    background-color: #137657;
}

#stats {
    background-color: #137657;
    color: #aac5b6;
}

#stats .legend {
    font-size: .875rem
}

.jumbotron {
    background-color: #ecefe9;
    border-radius: 0;
}

#herohome {
    background-image: url(../images/hero-bg-mosaic.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center bottom;
    min-height: 200px;
    padding-bottom: 4rem;
}

#herohome .display-4 {
    padding-bottom: .5rem;
}

#herohome #pageSubtitle {
    color: #062d21;
}

.sm-hero-child {
    max-width: 400px;
    margin: auto;
    margin-top: -6.5rem;
}

@media (min-width: 576px) {
    .jumbotron {
        padding: 2rem;
    }
}

.h4 {
    color: #437561;
}

.display-4 {
    color: #0f7657;
    font-size: 2.25rem;
    margin-bottom: 0;
}

@media (min-width: 576px) {
    .display-4 {
        padding: 2rem;
        font-size: 3.5rem;
    }
}

.sm-content-liner {
    width: 100%;
}

#validationAlert {
    position: sticky;
    top: 0;
    z-index: 10000;

}

.sm-alert {
    text-align: center;
    margin-bottom: 0;
    background-color: #b02753;
    color: #fff;
    border: none;
    border-radius: 0;
}

a,
.btn-link {
    color: #009e81;
}

button:focus {
    outline: none
}

.sm-alert a {
    color: #fff;
}

.sm-alert a:focus,
.sm-alert a:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, .2);
}

.sm-link {
  padding: .25rem .25rem;
  border-radius: 4px;
  font-weight: 600;
}

.btn-img > span,
.btn.demo > span {
    padding: 5px;
    background: #fff;
    border-radius: 50%;
    margin-right: .25rem;
}

.btn-img-group > span:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: 0;
}

.btn-img-group > span:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.sm-link:hover,
.sm-link:focus {
    background-color: rgba(0, 158, 129, .2);
    text-decoration: none;
    box-shadow: none !important;
}

a:hover,
a:focus,
.btn-link:hover,
.btn-link:focus {
    color: #009e81;
}

.btn-primary {
    background-color: #009e81;
    border-color: #009e81;
}

.btn-outline-primary {
    color: #009e81;
    border-color: #009e81;
}

.btn-primary:focus,
.btn-outline-primary:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 158, 129, .5);
}

.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled):focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled):focus,
.btn-outline-primary:not(:disabled):not(.disabled):active:focus {
    background-color: #137657;
    border-color: #137657;
    color: #fff;
}

.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:not(:disabled):not(.disabled):active:focus {
    box-shadow: 0 0 0 0.2rem rgba(19, 118, 87, .5);
}

.form-control::placeholder {
    color: #999;
    font-size: .875rem;
}


.taketour,
.tryitout {
    width: 164px;
}


.navbar-brand > img {
    margin-top: -2px;
    margin-right: .5rem;
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255, 255, 255, .75);
}

.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link:hover {
    color: #fff;
    background: rgba(255,255,255,.1);
    border-radius: .25rem;
}

.sm-paw-list {
    padding-left: .25rem;
}

.sm-paw-list li {
    position: relative;
    padding-left: 24px;
    margin-bottom: .375rem;
}

#imageModal .carousel-indicators li::before,
.sm-paw-list li::before {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);

}

.sm-paw-list li::before {
    content: "\f1b0";
    position: absolute;
    top: .25rem;
    left: 0;
    color: rgb(170 197 182);
    background-color: rgb(15 118 87);
    border-radius: 50%;
    width: 1rem;
    height: 1rem;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sm-training-video {
    display: inline-block;
    width: 30%;
}

.sm-training-video iframe {
    width: 100%;
    height: 200px;
}

.sm-tour-preview {
    margin-bottom: -1rem;
    padding-bottom: 2rem;
}

.sm-tour-img {
    max-width: 100%;
}

h1 {
    font-size: 130%;
	color: black;
}

h2 {
    font-size: 110%;
	color: black;
}

.centered {
    text-align: center;
}

.boxshadow {
    box-shadow: 3px 3px 5px #888;
}

img.logo {
    padding: 10px;
}

img.tour {
    border: 1px solid #555;
    padding: 5px;
    margin: 5px;
    background-color: #fff;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    box-shadow: 3px 3px 5px #888;
    -webkit-box-shadow: 3px 3px 5px #888;
    -moz-box-shadow: 3px 3px 5px #888;
}

.sm-other-locales .btn {
    margin-bottom: .5rem;
}

div.tourright {
    padding: 10px;
}

#defaultDemo img {
    max-height: 360px;
}

.sm-available-languages {
    width: 200px;
}

.sm-available-languages button.demo {
    text-align: left;
}

.appstore-badge {
    vertical-align: middle;
    height: 45px;
}

.partners {
    margin-left: auto;
    margin-right: auto;
}

.partners td:first-child {
    width: 120px;
    background-color: #ebeee8;
    vertical-align: middle;
}

.partners td:nth-child(2):not(:last-child) {
    white-space: nowrap;
    width: 120px;
    text-align: center;
}

.partners .partner {
    width: 150px;
    border: 0;
}

.partners .flag {
    border: 0;
}

.testimonials .person {
    text-align: right;
    font-style: italic;
    font-weight: bold;
}

.testimonials .flag {
    border: 0;
    vertical-align: middle;
    margin-left: 5px;
}

#social {
    float: right; 
    width: 292px; 
    padding: 10px
}

#supportform,
#signup { 
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
}

#signup td {
    border-top: 1px solid #999;
    padding: 5px;
}

#signup .signuphelp {
    display: inline-block;
    max-width: 200px;
    border: 1px solid #ccc;
    background-color: #ffffe3;
    border-radius: 6px;
    padding: 7px;
    margin: 2px;
    text-align: center;
    vertical-align: middle;
    font-size: 90%;
}

#pricetable {
    margin-left: auto;
    margin-right: auto;
    max-width: 560px;
}

#pricetable thead th:not(:first-child),
#pricetable tbody td:not(:first-child) {
    text-align: right;
}

.newstable {
    margin-bottom: 15px;
}

.newstable th, .newstable td {
    padding: 10px;
    border-bottom: 1px solid #999;
}

#serverstatustable td:nth-child(2) {
    white-space: no-wrap;
    width: 100px;
}

table.currencyselect {
    width: 100%;
}

.currencyselect td {
    text-align: center;
}

.sm-download-col-download {
    white-space: nowrap;
    min-width: 180px;
}

#asm2 .sm-download-col-download,
#asm3 .sm-download-col-download {
    min-width: 230px;
}

.sm-download-col-download .download {
    width: 100%;
    text-align: left;
}

.sm-download-col-version {
    min-width: 180px;
}

.sm-download-col-download,
.sm-download-col-version,
.sm-download-col-manual,
.sm-download-col-description {
    padding-bottom: .5rem;
    padding-top: .5rem;
}

input:focus, textarea:focus, select:focus {
    box-shadow: 0 0 5px #3a87cd;
    border: 1px solid #3a87cd;
}

textarea {
    width: 100%;
    border-radius: 2px;
    box-shadow: 0 1px 2px #DDD;
    border: 1px solid #aaa;
}

.hidden {
    display: none;
}

p.banner {
   height: 70px;
   border-bottom: solid 1px #555555;
}

p.image {
    text-align: center;
}

p.language { 
    text-align: right;
}

p.doublepara {
    padding: 20px;
}

.errortext {
    color: red;
}

.error {
    color: red;
}

.updated {
    color: #009e00;
}

td.tdonline {
    width: 50%;
    padding: 5px;
    background-color: #dffbdf;
    vertical-align: top;
}

td.tdasm {
    width: 50%;
    padding: 5px;
    background-color: #e0dffb;
    vertical-align: top;
}

.prices-banner {
    text-align: center;
}

.prices-big {
    font-weight: bold;
    font-size: 3rem;
    margin-bottom: 0;
    color: #009e80;
}

.prices-legend {
    font-size: 130%;
}

.explain {
    font-size: 80%;
    font-style: italic;
}

.clock {
    font-weight: 600;
    font-family: monospace;
    padding: .5rem;
    background-color: rgba(255,255,255,.5);
    color: #0c4231;
    font-size: 1.5rem;
    border-radius: .25rem;
    margin-left: .5rem;
}

.highlightbox {
    border: 1px solid #ccc;
    background-color: #ffffe3;
    border-radius: 6px;
    padding: 7px;
    text-align: center;
    display: block;
}

.highlightbox-right {
    border: 1px solid #ccc;
    background-color: #ffffe3;
    border-radius: 6px;
    padding: 7px;
    float: right;
    text-align: center;
}

.muut {
    text-align: left;
}

span.storyhead {
    font-weight: bold;
    font-size: 110%;
}

span.storydate {
    font-weight: normal;
    font-size: .875rem;
    display: block;
    margin-bottom: .5rem;
    color: #009e80;
}

#footer {
    background-color: rgb(29, 56, 62);
    color: #eee;
    font-size: .875rem;
}

#footer a, #footer h2 {
    color: #eee;
}

.footer-copyright {
    background-color: rgb(0, 0, 0, .5);
    color: #aaa;
}

.footer-copyright a {
    color: #aaa !important;
}

#footer .fa-facebook {
    background-color:#3C599F;
    border-radius: 2px;
}

#footer .fa-rss {
    background-color: #F26522;
    border-radius: 2px;
}

#footer .fa-twitter {
    background-color:#32CCFE;
    border-radius: 2px;
}

#footer .fa-phone {
    background-color: #53b200;
    border-radius: 2px;
}

#footer .fa-question {
    background-color: #ff3333;
    border-radius: 2px;
}


#footer .sm-col-connect .fa {
    border-radius: 50%;
    padding: 4px;
    width: 22px;
}


footer > .container a {
  width: 100%;
  display: block;
}

#footer a .fa {
  transition: all 0.25s ease-in;
}

#footer a:hover .fa {
  transform: scale(1.5);
}

a {
    transition: all 0.25s ease-in;
}

a:hover {
    text-decoration: none;
}


footer a {
    opacity: .75;
    position: relative;
}
footer a:hover {
    opacity: 1;
    z-index: 1;
}

.asmver {
    font-weight: bold;
}

nav {
    padding: 25px;
    /*border: 1px dotted #999;*/
    text-align: center;
    font-size: 100%;
    display: block;
}

nav a {
    padding: 5px;
}

nav a.navselected {
    padding: 5px;
    color: #999;
    background-color: #fff;
    text-decoration: none;
    cursor: default;
}


pre {
	background: #eee;
    padding: 10px;
}

.jumbotron .display-4::before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

.jumbotron:not(#herohome) .display-4::before {
    background: #aac5b6;
    color: #ecefe9;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-shadow: 2px 2px 1px #0f7657;
    border-radius: 50%;
    margin-right: .5em;
    height: 72px;
    width: 72px;
    font-size: 2.25rem;
    vertical-align: bottom;
}

#heroabout .display-4::before {
    content: "\f200";
}

#herofaq .display-4::before {
    content: "\f075";
}

#heronews .display-4::before {
    content: "\f1ea";
}

#herodemo .display-4::before {
    content: "\f1b0";
}

#heropartners .display-4::before {
    content: "\f4c6";
}

#herotestimonials .display-4::before {
    content: "\f675";
}

#heropricing .display-4::before {
    content: "\f51e";
}

#herosignup .display-4::before {
    content: "\f07a";
}

#herooss .display-4::before {
    content: "\f019";
}

#heroforum .display-4::before {
    content: "\f086";
}

#herotranslate .display-4::before {
    content: "\f1ab";
}

#herostatus .display-4::before {
    content: "\f233";
}

#herohistory .display-4::before {
    content: "\f66f";
}

#herocontact .display-4::before {
    content: "\f095";
}

#herosupport .display-4::before {
    content: "\f128";
}

#herotraining .display-4::before {
    content: "\f549";
}

#heroerror404 .display-4::before {
    content: "\f06a";
}

#heroerror503 .display-4::before {
    content: "\f05e";
}

#heroprivacy .display-4::before {
    content: "\f21b";
}

#herotos .display-4::before {
    content: "\f24e";
}

.modal-backdrop {
    background-color: #03261f;
}

.modal-backdrop.show {
    opacity: .75;
}

.modal-header {
    border-bottom: none;
}

.modal-footer {
    border-top: none;
}

.modal-body {
    padding-top: 0;
    padding-bottom: 0;
}

.sm-btn-img-modal {
    background-color: #ecefe9;
    border-radius: .5rem;
    cursor: pointer;
    display: flex;
    flex-grow: 1;
    justify-content: center;
    padding: 1rem;
    padding: 1rem;
}

.sm-btn-img-modal:hover {
    background-color: #b3bfa6;
}

.sm-btn-img-modal:hover .text-center {
    font-weight: bold;
}

#imageModal .modal-content {
    background-color: #000;
    border: none;
}

#imageModal .modal-title {
    color: #fff;
}

#imageModal .modal-content,
#imageModal .carousel {
    height: 100%;
}

.modal-dialog-centered.modal-dialog-scrollable .modal-content {
    max-height: 732px;
}

#imageModal .carousel-inner {
    height: calc(100% - 64px);
    overflow: auto;
    position: absolute;
}

#imageModal .carousel-item  {
    display: flex;
    justify-content: center;
    padding: 0 .5rem;
}

#imageModal .carousel-item img {
    border-radius: .5rem;
}

#imageModal .carousel-indicators {
    margin: auto;
    height: 38px;
    bottom: 1rem;
}

#imageModal .close {
    color: #fff;
    text-shadow: none;
}

#imageModal .carousel-inner + button {
    bottom: 1rem;
    position: absolute;
    right: 0;
    z-index: 100;
}

#imageModal .carousel-indicators li {
    background: none;
    color: #fff;
    height: auto;
    text-indent: unset;
    width: auto;
    display: flex;
    align-items: center;
}

#imageModal .carousel-indicators li::before {
    content: "\f030";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    height: 2rem;
    width: 2rem;
}

#localeflag {
    position: absolute;
    top: 5px;
    left: 90%;
    width: 16px;
}

/* Flex width fix for forum */
.moot {
    width: 100%;
}

#monthOptions .card {
    min-height: 200px;
    overflow: hidden;
    position: relative;
}

#monthOptions label {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    z-index: 1;
}

#monthOptions .sm-months {
    display: block;
    font-size: 2rem;
    font-weight: 600;
    margin: 0;
    text-align: center;
}

#monthOptions .sm-cost {
    font-size: 2rem;
    font-weight: 700;
    color: #009e80;
}

#monthOptions .sm-cost-saving:not(:empty) {
    background: #b3bfa6;
    color: #fff;
    font-size: .875rem;
    padding: 0 2rem;
    position: absolute;
    right: -34px;
    transform: rotate(45deg);
    top: 0;
    transform-origin: 32px 28px;
}

input[name=term]:checked + .sm-month-radio::before {
    border: 4px solid #0f7657;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 4px;
}