/* Mike O Styles */


@font-face {
    font-family:'A';
    src: url("../fonts/A Regular.eot");
    src: url("../fonts/A Regular.eot?#iefix") format('embedded-opentype'),
    url("../fonts/A Regular.woff2") format('woff2'),
    url("../fonts/A Regular.woff") format('woff'),
    url("../fonts/A Regular.svg#A Regular") format('svg');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-00FE;
}

@font-face {
    font-family: 'proxima_nova_altblack';
    src: url("proxima_nova_alt_black-webfont.woff2") format('woff2'),
    url("proxima_nova_alt_black-webfont.woff") format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'proxima_nova_alt_rgbold';
    src: url("../fontsproxima_nova_alt_bold-webfont.woff2") format('woff2'),
    url("../fontsproxima_nova_alt_bold-webfont.woff") format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'proxima_nova_blblack';
    src: url("../fonts/proxima_nova_black-webfont.a93155361e0b.woff2") format('woff2'),
    url("../fonts/proxima_nova_black-webfont.b988f858c7aa.woff") format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'proxima_nova_rgbold';
    src: url("../fonts/proxima_nova_bold-webfont.7b36d5982bfc.woff2") format('woff2'),
    url("../fonts/proxima_nova_bold-webfont.5dcbe5abe8c2.woff") format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'proxima_nova_thextrabold';
    src: url("../fonts/proxima_nova_extrabold-webfont.f897cb0abb64.woff2") format('woff2'),
    url("../fonts/proxima_nova_extrabold-webfont.1aeb176b58e0.woff") format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'proxima_nova_ltsemibold';
    src: url("../fonts/proxima_nova_semibold-webfont.53b410fec0be.woff2") format('woff2'),
    url("../fonts/proxima_nova_semibold-webfont.c3a5ac4516f0.woff") format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'proxima_nova_ththin';
    src: url("../fonts/proxima_nova_thin-webfont.00a3a5494661.woff2") format('woff2'),
    url("../fonts/proxima_nova_thin-webfont.ca72955e014d.woff") format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'proxima_nova_rgregular';
    src: url("../fonts/proximanova-regular-webfont.81a735f91219.woff2") format('woff2'),
    url("../fonts/proximanova-regular-webfont.10b0cd99c11e.woff") format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'proxima_nova_altthin';
    src: url("../fonts/proxima_nova_alt_thin-webfont.73019b07aff8.woff2") format('woff2'),
    url("../fonts/proxima_nova_alt_thin-webfont.c9dc0bacfcea.woff") format('woff');
    font-weight: normal;
    font-style: normal;

}



a {
    text-decoration: none;
}

input.billing-checkbox {
    margin-left:20px;
}

div#main-banner {
    width:100%;
    height:360px;
    background-image: url("../images/1920x600-banner-blue.fa4243ce7e87.jpg");
    background-size:cover;
}

div#billing-inital-upfront-cost-box {
    background-color:#E3F1DE;
    padding:15px;
    border:1px solid #3BA61F;
    border-radius: 3px;
    width:100%;
    float:left;
}

div#billing-on-going-cost-box {
    border:1px solid #3BA61F;
    padding:15px;
    border-radius: 3px;
    margin-top:20px;
    width:100%;
    float:left;
}

div#billing-warning-box {
    border:1px solid #a61f1f;
    padding:15px;
    border-radius: 3px;
    margin-top:20px;
    width:100%;
    float:left;
}

div.billing-pricing-area-left {
    float:left;
    width:55%;
}

div.billing-pricing-area-right {
    float:right;
    width:40%;
    padding-right:1%;
}

div.billing-pricing-area-right span {
    font-size:22px;
    color:#3BA61F;
    font-weight:700;
    font-family: "proxima_nova_rgbold";
}

div.billing-pricing-area-right table {
    margin-right: 5px;
    float:right;
}

div.billing-on-going-cost-box-content {
    float:left;
    width:100%;
}

p.green-cost-heading {
    font-weight: 700;
    color:#3ba61f;
    margin-bottom: 5px;
    font-size:20px;
    font-family: "proxima_nova_ltsemibold";
    margin-top:0px;
    margin-left:0px;
}

p.red-warning-heading {
    font-weight: 700;
    color:#a61f1f;
    margin-bottom: 5px;
    font-size:20px;
    font-family: "proxima_nova_ltsemibold";
    margin-top:0px;
    margin-left:0px;
}

p.green-cost-text {
    margin-top:0px;
    color:#3ba61f;
    max-width:350px;
    font-size:16px;
    margin-left:0px;
}

p.red-warning-text {
    margin-top:0px;
    color:#a61f1f;
    font-size:16px;
    margin-left:0px;
}

div#main-banner-text-section {
    max-width:960px;
    margin-left:auto;
    margin-right:auto;
    padding-top:90px;
}

div#main-banner-text-section .preamble {
    color: #fff;
    font-size: 36px;
    line-height: 1.2;
    text-align: center;
    display: block;
    font-weight: bold;
}

div#main-banner-text-section h1 {
    color:#fff;
    font-size:60px;
    line-height: 72px;
    text-align: center;
    margin-bottom:0px;
    margin-top:10px;
}

div#main-banner-text-section p {
    color:#fff;
    margin-top:20px;
    font-size:18px;
    font-weight:300;
    font-family:"proxima_nova_ththin";
    text-align: center;
    width:80%;
    max-width: 80%;
    margin-left:auto;
    margin-right:auto;

}

body {
    font-family: 'proxima_nova_rgregular';
    font-size:14px;
    line-height: 1.6em;
    color:#404040;
    margin:0px;
}

ul.ticks li {
    list-style: none;
    color:#3ba61f;
    font-size:16px;
    line-height:24px;
}

div.grey-divider {
    width:100%;
    border-bottom:1px solid #ebebeb;
    float:left;
    margin-top:10px;
    margin-bottom:20px;
}

ul.ticks {
    padding-left:0px;
}

ul.ticks li:before {
    content: "✓";
    padding-right: 10px;
    font-weight: 700;
    color:#3ba61f;
}

h1 {
    font-family: "proxima_nova_rgbold";

}

h2 {
    color: #404040;
    font-family: "proxima_nova_ththin";
    font-size: 32px;
    font-weight: bold;
    line-height: 36px;
    margin-bottom: 30px;
}

h3 {
    font-size:18px;
    margin-left:auto;
    margin-right: auto;
}

h4 {

}

p {
    font-family: "proxima_nova_rgregular";
}

label.billing-label {
    font-size:16px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

h2.billing-plan-heading {

}

div.body-guest-inner-sleeve {
    margin-top:0px !important;
}

div#demo-book-area {
    margin-left: auto;
    margin-right: auto;
    max-width: 650px;
}

div#demo-book-area div#field-wrapper-organisation-name {
    padding-top:30px;
}

div#demo-book-area div#field-wrapper-blurb label
{
    margin-bottom:30px;
    width:80%;
    padding-left:15%;
    text-align: left;
    margin-top:30px;
}

div#demo-book-area div#field-wrapper-blurb textarea {
    margin-bottom:30px;
    height:80px;
    width:70%;
    margin-left:15%;
    font-family: "proxima_nova_rgregular";
    font-size: 16px;
    border: 1px solid #0088CC;
    padding:20px;

}

div.field-wrapper {
    background-color:#f7f9fa;
    float:left;
    width:95%;
    padding:10px;
    border-radius: 5px;
}

div#demo-book-area h2 {
    text-align: center;
}

label.required {
    font-weight: bold;
}

label.required::after {
    color: red;
    content: ' *';
}

form label {
    float:left;
    width:40%;
    color: #404040;
    font-family: "proxima_nova_rgregular";
    font-size: 16px;
    line-height: 1.6em;
    text-align: right;
    padding-right:30px;
}

div#demo-book-area form input {
    float:left;
    width:50%;
    border: 1px solid #0088CC;
    height:22px;
    margin-top:0px;
    padding:5px;
    font-size:16px;
    color:#404040;
}

div#demo-book-area form {
    padding:30px;
    float:left;
}

div#header-logo {
    float:left;
    width:20%;
    margin-top:-20px;
}

div#header-nav {
    float:left;
    width:80%;
    margin-top:-14px;
}

div#header-container {
    background-color:#FFF;
    padding-top:45px;
    padding-bottom:36px;
    height:30px;
}

div#header-nav ul {
    float:right;
}

p.upfront-cost, p.monthly-cost {
    font-size:34px;
    margin-bottom: 0px;
}

p.cost-description {
    margin-top: 0px;
}

p.billing-plan-description {
    white-space: pre-line;
    margin-bottom: 60px;
    text-align: center;
    max-width:80%;
    margin-left:auto;
    margin-right:auto;
    font-size:16px;
    line-height: 1.6em;
}

div.page-wrapper {
    padding: 40px 40px;
    margin-left: auto;
    margin-right: auto;
    max-width: 960px;
    width:90%;
}

div.table-page-wrapper {
    padding: 40px 40px;
    margin-left: auto;
    margin-right: auto;
    max-width:90%;
}

div#header-nav ul li {
    float:left;
    margin-right:25px;
    list-style: none;
}

div#header-nav ul li a{
    color:#08c;
    font-size:16px;
}



div.wrapper {
    margin-left:auto;
    margin-right:auto;
    width:90%;
    max-width: 960px;
}

div.wrapper p {
    text-align: center;
    max-width:80%;
    margin-left:auto;
    margin-right:auto;
    font-size:16px;
    line-height: 1.6em;
}

div.wrapper ul {
    font-size:16px;
    line-height: 1.6em;
    list-style-position: inside;
}

div.wrapper ol {
    font-size:16px;
    line-height: 1.6em;
    list-style-position: inside;
}

div.container {
    width:100%;
}


div#page-container {
    min-height:300px;
    margin-top:40px;
}


nav ul {
    list-style-type: none;
    padding: 0;
}
div#footer-container {
    margin-top:48px;
    background-color:#015391;
    padding-top:20px;
    padding-bottom:20px;
    width:100%;
    float:left;
}

div.footer-cols {
    display: flex;
}

div.footer-col {
    flex: 1 1;
}

div.footer-col h3 {
    color:#fff;
    font-size:16px;
    margin-bottom: 25px;
    margin-left:0px;
    text-align: left;
}

div.footer-col ul {
    padding-left:0px;
}

div.footer-col ul li {
    list-style: none;
    margin-bottom: 5px;
    line-height:1.6em;
}

div.footer-copyright-links {
    float:left;
}

div.footer-copyright-links p {
    float:left;
    width:100%;
    color:#fff;
}
div.footer-copyright-links ul {
    padding-left:0px;
}

div.footer-copyright-links ul li{
    list-style: none;
    margin-right:20px;
    float:left;
}

div.footer-copyright-links ul li a{
    border-bottom: 1px solid rgba(255, 255, 255, 0.165);
    color: rgba(255, 255, 255, 0.55);
    padding-bottom: 0em;
    transition: border-color 0.15s ease-out 0s, color 0.15s ease-out 0s;
    font-size:15px;
    text-decoration: none;
    float:left;
}

div.footer-col ul li a {
    border-bottom: 1px solid rgba(255, 255, 255, 0.165);
    color: rgba(255, 255, 255, 0.55);
    padding-bottom: 0.05em;
    transition: border-color 0.15s ease-out 0s, color 0.15s ease-out 0s;
    font-size:15px;
    text-decoration: none;
}


div.footer-copyright {
    color:#fff;
    float:left;
    margin-top:30px;
    margin-bottom:0px;
    width:100%;
}

div#demo-book-area input.billing-plan-submit-button,
div#demo-book-area a.billing-plan-submit-link {
    margin-top: 85px;
}

input.billing-plan-submit-button,
a.billing-plan-submit-link {
    background-color:#3BA61F;
    border-radius: 5px;
    border:none !important;
    text-transform: uppercase;
    color: #fff !important;
    cursor: pointer;
    font-size: 20px;
    float:left;
    margin-left:20%;
    height: 53px !important;
    width:100%;
    border:none;
    font-family:"proxima_nova_rgbold";
    max-width:400px;
    margin-top: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
}

input.billing-plan-submit-button:hover,
a.billing-plan-submit-link:hover {

    background-position: 0 -43px;

}

input.billing-plan-submit-button.loading,
a.billing-plan-submit-button.link {
    pointer-events: none;
    cursor: pointer;
    opacity: 0.6;
}

.billing-plan-text-input {
    font-size: 1.5rem;
    padding: 0.25rem;
    margin-top: 0.25rem;
    max-width: 200px;
    text-transform: uppercase;
}

div.rangeslider__handle {
    background-image: url("../images/pricing_slider_circle.ea712d5fc30b.png") !important;
    background-position: 0 0 !important;
    background-repeat: no-repeat !important;
    border-radius: 0px !important;
    background-color:transparent !important;
    background-size:contain !important;
    box-shadow: none !important;
    border:none !important;
}

.rangeslider-horizontal .rangeslider__handle::after {
    background-color:transparent !important;
    box-shadow: none !important;
}

span#cloud-safe-footer {
    float:right;
}

/* Mike O Styles END*/

span.billing-value {
    font-size:22px;
    color:#0088CC;
    margin-bottom: 0px;
    margin-top:0px;
    margin-left:5px;
}

p.billing-item-group-description {
    color:#000;
    max-width:60%;
    padding:5px;
    margin-top:0px;
}


div.billing-item {
    padding:15px;
    width:100%;
    max-width:600px;
    background-color:#F7F9FA;
    margin-bottom: 30px;
    border:1px solid #D8DADB;
    border-radius: 4px;
}

div.maxed-out {
    background-color:#FFF0F2;
}

div.billing-item-group {
    margin-bottom: 5px;
    border-style: solid;
    border:none;
    padding:0px;
}

div#billing-intro-container {
    margin-top:60px;
}

div#billing-intro-container h3 {
    text-align: center;
}

div#billing-intro-container div.wrapper {
}

div#react-container {

}

div.billing-plan-app {
    max-width:600px;
    margin-left:auto;
    margin-right:auto;
}

div.subtle-billing-item-group {
    margin-bottom: 5px;
    border-style: solid;
    border-width: 1px;
    border-color: #f0f0f0;
    border-radius: 10px;
}

div.billing-item-group-heading-wrapper {
    display: -webkit-flex;
    display: flex;
}

.billing-item-group-heading {
    float: left;
    color:#0088cc;
    margin-top:0px;
    margin-left:0px;
    font-family: "proxima_nova_ltsemibold";
    font-size:20px;
}

.collapse-button {
    cursor: pointer;
    float: left;
    margin-left: 10px;
    margin-top: -2px;
    margin-bottom: 18px;
    font-family: "proxima_nova_ltsemibold";
    font-size:18px;
    color:#fff;
    background-color:#0088cc;
    border-radius: 30px;
    width:25px;
    height:25px;

    background-position: center 0px !important;
    background-repeat: no-repeat !important;
    border:none;
}

.billing-item-group-content {
    clear: both;
}

.billing-plan-features > ul > li {
    margin-bottom: 1em;
}

.billing-plan-features > ul > li:last-child {
    margin-bottom: 0;
}

/**
* Rangeslider
*/
.rangeslider {
    margin: 20px 0;
    position: relative;
    background: #fff;
}
.rangeslider,
.rangeslider .rangeslider__fill {
    display: block;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.4);
}
.rangeslider .rangeslider__handle {
    background: #fff;
    border: 1px solid #ccc;
    cursor: pointer;
    display: inline-block;
    position: absolute;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), 0 -1px 3px rgba(0, 0, 0, 0.4);
}
.rangeslider .rangeslider__handle .rangeslider__active {
  opacity: 1;
}
.rangeslider .rangeslider__handle-tooltip {
  width: 40px;
  height: 40px;
  text-align: center;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.8);
  font-weight: normal;
  font-size: 14px;
  transition: all 100ms ease-in;
  border-radius: 4px;
  display: inline-block;
  color: white;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
}
.rangeslider .rangeslider__tooltip span {
    margin-top: 12px;
    display: inline-block;
    line-height: 100%;
}
.rangeslider .rangeslider__tooltip:after {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
}
/**
* Rangeslider - Horizontal slider
*/
.rangeslider-horizontal {
  height: 25px;
  border-radius: 10px;
}
.rangeslider-horizontal .rangeslider__fill {
  height: 100%;
  background-color: #CFE1EE;
  border-radius: 10px;
  top: 0;
}
.rangeslider-horizontal .rangeslider__handle {
  width: 40px;
  height: 40px;
  border-radius: 30px;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
}
.rangeslider-horizontal .rangeslider__handle:after {
  content: ' ';
  position: absolute;
  width: 16px;
  height: 16px;
  top: 6px;
  left: 6px;
  border-radius: 50%;
  background-color: #dadada;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) inset, 0 -1px 3px rgba(0, 0, 0, 0.4) inset;
}
.rangeslider-horizontal .rangeslider__handle-tooltip {
  top: -55px;
}
.rangeslider-horizontal .rangeslider__handle-tooltip:after {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid rgba(0, 0, 0, 0.8);
  left: 50%;
  bottom: -8px;
  transform: translate3d(-50%, 0, 0);
}
/**
* Rangeslider - Vertical slider
*/
.rangeslider-vertical {
  margin: 20px auto;
  height: 150px;
  max-width: 10px;
  background-color: transparent;
}
.rangeslider-vertical .rangeslider__fill,
.rangeslider-vertical .rangeslider__handle {
  position: absolute;
}
.rangeslider-vertical .rangeslider__fill {
  width: 100%;
  background-color: #CFE1EE;
  box-shadow: none;
  bottom: 0;
}
.rangeslider-vertical .rangeslider__handle {
  width: 30px;
  height: 10px;
  left: -10px;
  box-shadow: none;
}
.rangeslider-vertical .rangeslider__handle-tooltip {
  left: -100%;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
}
.rangeslider-vertical .rangeslider__handle-tooltip:after {
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid rgba(0, 0, 0, 0.8);
  left: 100%;
  top: 12px;
}
/**
* Rangeslider - Reverse
*/
.rangeslider-reverse.rangeslider-horizontal .rangeslider__fill {
  right: 0;
}
.rangeslider-reverse.rangeslider-vertical .rangeslider__fill {
  top: 0;
  bottom: inherit;
}
/**
* Rangeslider - Labels
*/
.rangeslider__labels {
  position: relative;
}
.rangeslider-vertical .rangeslider__labels {
  position: relative;
  list-style-type: none;
  margin: 0 0 0 24px;
  padding: 0;
  text-align: left;
  width: 250px;
  height: 100%;
  left: 10px;
}
.rangeslider-vertical .rangeslider__labels .rangeslider__label-item {
  position: absolute;
  transform: translate3d(0, -50%, 0);
}
.rangeslider-vertical .rangeslider__labels .rangeslider__label-item::before {
  content: '';
  width: 10px;
  height: 2px;
  background: black;
  position: absolute;
  left: -14px;
  top: 50%;
  transform: translateY(-50%);
  z-index: -1;
}
.rangeslider__labels .rangeslider__label-item {
  position: absolute;
  font-size: 14px;
  cursor: pointer;
  display: inline-block;
  top: 10px;
  transform: translate3d(-50%, 0, 0);
}

div#mobile-nav {
    display:none;
}



@media (max-width:910px) {

    div#demo-book-area div#field-wrapper-blurb textarea {
        margin-left:5%;
        height:160px;
    }

    div#demo-book-area div#field-wrapper-blurb label {
        width:80%;
    }

    div#demo-book-area div.field-wrapper {
        padding:5%;
        padding-top:10px;
        padding-bottom:10px;
        margin-left:5%;
        width:80%;
    }


    div#demo-book-area form {
        margin-left:-20px;
        padding:10px;
    }

    input.billing-plan-submit-button,
    a.billing-plan-submit-link {
        font-size:16px;
    }

    div#demo-book-area {
        margin-left: auto;
        margin-right: auto;
        max-width: 90%;
    }



    input.billing-plan-submit-button,
    a.billing-plan-submit-link {
        margin-left:0px;
    }


    div#main-banner-text-section h1 {
        font-size:36px;
        line-height: 42px;
    }

    div.field-wrapper{
        background-color:#f7f9fa;
    }



    div#demo-book-area div.field-wrapper form label {
        float:left;
        width:100%;
        font-weight: bold;
        color:red;
        margin-bottom: 10px;
        max-width:90%;
    }

    div#demo-book-area form input {
        float:left;
        width:100%;
        margin-bottom: 20px;
        padding:8px;
        max-width:95%;
    }

    div#demo-book-area form label {
        width:100%;
        text-align: center;
        margin-bottom:20px;
        font-size:18px;
    }


    div.footer-col {
        width:100%;
    }

    div.billing-pricing-area-right  {
        width:100%;
    }

    div#billing-inital-upfront-cost-box {
        max-width: 85%;
    }

    div#billing-on-going-cost-box {
        max-width: 85%;
    }

    h1,h2,h3,h4,h5 {
        max-width: 100%;
        text-align: center;
    }
    p {
        margin-left:auto;
        margin-right:auto;
        max-width:80%;
    }

    div.page-wrapper {
        padding:20px;
    }

    h2.billing-plan-heading {
        font-size:40px;
    }


    /* Hides everything pushed outside of it */
    .site-wrap {
        overflow: hidden;
        width: 100%;
        height: 100%;
    }
    /* Adds a transition and the resting translate state */
    .push-wrap {
        -webkit-transition: all 300ms ease 0;
        -moz-transition: all 300ms ease 0;
        -o-transition: all 300ms ease 0;
        transition: all 300ms ease 0;

        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0);

        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    /* Will animate the content to the right 275px revealing the hidden nav */
    .show-nav .push-wrap {
        -webkit-transform: translate(275px, 0);
        -moz-transform: translate(275px, 0);
        -ms-transform: translate(275px, 0);
        -o-transform: translate(275px, 0);
        transform: translate(275px, 0);

        -webkit-transform: translate3d(275px, 0, 0);
        -moz-transform: translate3d(275px, 0, 0);
        -ms-transform: translate3d(275px, 0, 0);
        -o-transform: translate3d(275px, 0, 0);
        transform: translate3d(275px, 0, 0);
    }
    /* Positions the nav fixed below the push wrapper */
    nav {
        width: 275px;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
    }

    div#mobile-nav {
        display:block;
    }
    .js .slicknav_menu {
        display:block;
    }
    div#header-container {
        display:none;
    }

}

input[type="text"], input[type="email"], textarea {
    width: 99%;
}

#footer-guest {
    clear: both;
    text-align: center;
    font-size:16px;
    line-height: 1.6em;
    padding: 40px 0px 0px 0px;
    margin-top: 20px;
}

p.billing-title {
    margin:0 0 6px;
}

p.billing-image {
    margin:0 0 16px;
}

div.image-bullets {
    display: inline-block;
}

div.image-bullets div {
    display: flex;
    flex-direction: row;
}

div.space-around {
    display: flex;
    justify-content: space-around;
}

div.image-bullets img {
    padding-top: 10px;
    height: 158px;
    width: auto;
}

div.payment-method-container {
    border: 1px solid #D8DADB;
    background-color: #F7F9FA;
    padding:15px;
    border-radius: 3px;
    margin-top:20px;
    width:100%;
    float:left;
    margin-bottom:20px;
}

div.payment-method-container .billing-label {
    padding-left: 10px;
}

div.partner-invite-link {
    background: #f4f4f4;
    padding: 10px;
    border-radius: 5px;
    margin-top: 16px;
}

table.report-table tbody tr:nth-child(1n) {
    background-color: #e9e9e9;
}

table.report-table tbody tr:nth-child(2n + 2) {
    background-color: #f4f4f4;
}

table.report-table thead tr {
    background-color: #CFDEEA;
    color: #0088cc;
}

table.report-table td.alert-cell {
    font-weight: bold;
}

table.report-table td {
    padding: 3px;
}

table.report-table thead th.sortable {
    cursor: ns-resize;
}

table.report-table thead th.sortable:hover {
    background-color: #e2f2ff;
}

div#demo-book-area form textarea {
    float:left;
    width:50%;
    border: 1px solid #0088CC;
    height:80px;
    margin-top:0px;
    padding:5px;
    font-size:16px;
    color:#404040;
}

ul.errorlist li {
    font-weight: bold;
    color: #a42b2b;
    text-align: right;
}

p.warning, h2.warning {
    font-weight: bold;
    color: #a42b2b;
    text-align: center;
}

p.note-well {
    font-weight: bold;
}

form.partner-link-edit label {
    float:left;
    width:30%;
    color: #404040;
    font-family: "proxima_nova_rgregular";
    font-size: 16px;
    line-height: 1.6em;
    text-align: right;
    padding-right:30px;
}

form.partner-link-edit div.field-wrapper {
    background-color: #f7f9fa;
    float: left;
    width: 95%;
    padding: 10px;
    border-radius: 5px;
    margin-left: 12px;
}

form.partner-link-edit input {
    float:left;
    width:50%;
    border: 1px solid #0088CC;
    height:22px;
    margin-top:0px;
    padding:5px;
    font-size:16px;
    color:#404040;
}

form.partner-link-edit input.billing-plan-submit-button,
form.partner-link-edit a.billing-plan-submit-link {
    margin-top: 30px;
    margin-bottom: 20px;
    width: 60%;
}

span.action-description {
    font-size: 18px;
}

span.action-incomplete {
    font-weight: bold;
}

span.action-footer {
    font-weight: bold;
}

span.bold {
    font-weight: bold;
}

h3.clickable {
    cursor: pointer;
}

form.crm label {
    float: left;
    width: 30%;
    color: #404040;
    font-family: "proxima_nova_rgregular";
    font-size: 16px;
    line-height: 1.6em;
    text-align: right;
    padding-right: 30px;
}

form.crm input, select {
    float: left;
    width: 50%;
    border: 1px solid #0088CC;
    margin-top: 0px;
    padding: 5px;
    font-size: 16px;
    color: #404040;
}

form.crm input[type="submit"] {
    font-size: 14px;
    color: #fff;
}

form.crm select {
    width: 51.4%;
}

table.note-table input[type=submit], table.action-list input[type=submit] {
    width: auto;
    border: 1px solid #0088CC;
    margin-top: 0px;
    padding: 5px;
    font-size: 16px;
}

form.crm {
    margin-top: 16px;
}

p.billing-email {
    font-size: 16px;
    font-weight: normal;
}

table.note-table input[type=submit], form.crm input[type=submit], button.toggle-new {
    width: auto;
    margin-top: 8px;
    margin-bottom: 24px;
    margin-right: 32px;
    float: right;
}

table.action-list input[type=submit].action-complete {
    background-color: green;
    color: white;
}

table.action-list input[type=submit].action-delete {
    background-color: red;
    color: white;
}

table.action-list {
    width: 100%;
    border-collapse: collapse;
}

td.action-description {
    width: 82%;
}
table.action-list td, table.note-table td {
    padding: 4px 8px 4px 8px;
}

table.action-list tr:nth-child(odd), table.note-table tr:nth-child(odd) {
    background-color: white;
}

div.note-footer {
    float: left;
    margin-top: 16px;
    margin-bottom: 16px;
}

table.note-table {
    table-layout: fixed;
    width: 100%;
}

p.note-text, form textarea {
    font-family: monospace;
    font-size: 16px;
    word-wrap: break-word;
}

div.flow-buttons {
    float: right;
    display: flex;
    clear: both;
}

span.pinned {
    font-size: 22px;
    float: right;
}

span.separator {
    font-weight: normal;
}

div.clear {
    clear: both;
}

div.flex-row {
    display: flex;
    flex-direction: row;
}

div.flex-column {
    display: flex;
    flex-direction: column;
}

div.subscription-link {
    width: 98%;
}

a.subscription-link {
    font-size: 16px;
}

div.subscription-link form.crm {
    width: 100%;
}

table.search-form label {
    width: auto;
    font-family: "Open Sans", verdana, arial, sans-serif;
    font-weight: normal;
    font-size: 17px;
    fill: rgb(68, 68, 68);
}

li.advice {
    list-style: disc;
}

div.react-tags__search-input {
    margin-top: 12px;
}

div.react-tags__selected {
    margin-top: 12px;
}

div.new-label-section {
    margin: 8px 0 8px 0;
    padding: 12px;
    border-radius: 4px;
    background-color: #f4f4f4;
    align-items: center;
}

button.react-tags__selected-tag {
    margin-right: 8px;
}

.embedded-email {
    width: 100%;
}

table.activity-feed {
    border-collapse: collapse;
}

table.activity-feed tr:nth-child(even) {
    background-color: #f4f4f4;
}

table.activity-feed td.time {
    white-space: nowrap;
}

table.activity-feed td.icon {
    padding: 0 16px 0 16px;
}

table.activity-feed td.content {
    max-width:800px;
}

p.activity-feed a {
    word-break: break-word;
}

div.activity-feed-right {
    max-width: 60%;
    white-space: pre;
    overflow-wrap: break-word;
    word-wrap: break-word;

    -ms-word-break: break-all;
    word-break: break-all;
    word-break: break-word;

    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

div.report-link-block a {
    margin: 0 6px 0 6px;
}

div.count-container {
    display: flex;
    flex-direction: row;
}

div.count-container div {
    margin: 0 16px 0 16px;
}

div.all-time-chart {
    width: fit-content;
}

div.field-wrapper-spacer {
    clear: both;
    padding-top: 8px;
    min-height: 20px;
}

div.rounded-icon {
    background-repeat: no-repeat;
    background-size: 100%;
    background-position-x: center;
    background-position-y: center;
    border-radius: 15px;
    text-align: center;
    vertical-align: middle;
    line-height: 30px;
    font-size: 15px;
    font-weight: bold;
    border: #404040 1px solid;
}

div.rounded-icon.person {
    width: 30px;
    height: 30px;
}

div.rounded-icon.note {
    width: 3em;
    height: 3em;
}

img.activity-icon {
    width: 30px;
    height: auto;
}

span.dwatchdog-alert {
    color: #de0000;
    font-weight: bold;
}

div.report-container {
    clear: both;
    padding: 24px 0 16px 0;
}

div.send-buttons {
    float: right;
    padding: 8px 8px 0 8px;
}

.button-icon {
    width: auto;
    height: 24px;
    filter: invert(100%);
}

.message-button {
    min-width: auto;
    padding: 2px 6px 2px 6px;
}

.message-button:disabled {
    filter: grayscale(100%);
}

.pad-row td {
    padding: 14px;
}

div.ms-list {
  width: 100%;
  max-width: 500px;
}

*, ::after, ::before {
    box-sizing: inherit;
}

table.search-form input {
    width: auto;
    margin-bottom: 24px;
}

.container {
    max-width: 100%;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  margin-bottom: 8px;
  font-weight: 700;
}

h2, .h2 {
    margin-bottom: 30px;
}

textarea#id_description {
    max-width: 51.4%;
    max-height: 5em;
}

div.date {
    max-width: 51.4%;
}

table {
    min-width: 100%;
}

table.search-form {
    min-width: auto;
}

.report-table th {
    padding: 4px 8px 4px 8px;
}

.day-event.complete {
background-color: #d4ffd4;
}

.day-event.overdue {
  background-color: #ffbebe;
}

#dlist-search-form div.date {
    max-width: 100%;
}

.tags-stack {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    align-items: start;
}

.plan-buttons {
    display: flex;
    margin: -1em -1em 0 0;
}

.plan-button {
    flex: 1 0;
    margin: 1em 1em 0 0;
    font-size: 2em;
    border-radius: 0.25em;
    background: #0188cc;
    text-align: center;
    position: relative;
}

.plan-button.active {
    background-color: #feba12;
    pointer-events: none;
}

.plan-button.active a {
    font-weight: bold;
}

.plan-button a {
    display: block;
    padding: 1em;
    color: white;
}

/* New Billing Calculator */
.billing-calculator-title {
    padding-top: 0;
    padding-bottom: 0;
}

.billing-calculator-title h1 {
    font-size: 3rem;
    line-height: 1;
}

.billing-calculator-title h2 {
    margin-bottom: 0;
}

.billing-calculator-description {
    font-size: 1rem;
    padding: 2rem;
    border-radius: 1rem;
    background-color: #cae8ff;
    margin-bottom: 2rem;
    white-space: pre-wrap;
}

.billing-calculator-description h3 {
    margin-top: 0;
}

.billing-calculator-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    font-size: 1rem;
}

.billing-calculator-container > * {
    border-radius: 2rem;
    padding: 2rem;
}

.billing-calculator-container h2 {
    font-family: "proxima_nova_rgregular", Arial, sans-serif;
    margin-top: 0;
    margin-bottom: 1rem;
}

.billing-calculator-right {
    background-color: #015391;
    color: white;
}

.billing-calculator-right h2 {
    color: white;
}

.billing-calculator-right .billing-value {
    color: white;
}

.billing-calculator-amount {
    font-weight: bold;
    display: flex;
    gap: 1rem;
    align-content: end;
}

.billing-calculator-dollars {
    font-size: 2rem;
    line-height: 1.2;
    color: #93dfff;
}

.billing-calculator-cents {
    font-size: 1.5rem;
    line-height: 1.2;
    color: #93dfff;
}

.invalidated {
    position: relative;
    height: min-content;
    margin-top: 0.25rem;
}

.invalidated::after {
    display: block;
    content: "";
    position: absolute;
    left: -2%;
    width: 104%;
    top: 46%;
    height: 8%;
    background-color: red;
    rotate: -5deg;
    border-radius: 2px;
    z-index: 1;
}

.invalidated .billing-calculator-dollars {
    font-size: 1.5rem;
}

.invalidated .billing-calculator-cents {
    font-size: 1.25rem;
}

.billing-calculator-cost-breakdown {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.billing-calculator-container .billing-plan-text-input {
    padding: 0.5rem;
    border-radius: 0.5rem;
    border: 0;
}

.billing-calculator-nav-container {
    margin-top: 70px;
    display: flex;
    justify-content: center;
}

.billing-calculator-nav-spinner {
    color: #3BA61F;
}

.billing-calculator-nav-submit {
    background-color: #3BA61F;
    border-radius: 5px;
    text-transform: uppercase;
    color: #fff;
    cursor: pointer;
    font-size: 20px;
    height: 53px;
    width: 100%;
    border: none;
    font-family: "proxima_nova_rgbold", Arial, sans-serif;
    max-width: 400px;
}

.billing-calculator-nav-submit:hover {
    background-color: #2a7917;
}

@media (max-width: 960px) {
    .billing-calculator-container {
        grid-template-columns: 1fr;
    }

    .billing-calculator-left {
        padding: 0 0 1rem 0;
    }

    h3 {
        text-align: left !important;
    }
}
