@charset "UTF-8";

@media only screen and (max-width: 768px) {
    body {
        min-width: 320px;
    }
    body:before,
    .plumber-scheme01,
    .plumber-scheme02 {
        display: none !important;
    }
    h2 {
        margin-bottom: 10px;
    }
    .wrap {
        width: auto;
        padding: 20px;
    }
    .wrap hr.alt {
        margin-left: -20px;
        margin-right: -20px;
    }
    #intro .wrap,
    #footer .wrap,
    #content .wrap,
    #clients .wrap,
    #download .wrap,
    #user-nav .wrap,
    #page-title .wrap {
        border: 0;
    }
    .row,
    .row.compact,
    .row.comfort {
        margin: 0;
    }
    .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12,
    .row.compact .col-1, .row.compact .col-2, .row.compact .col-3, .row.compact .col-4, .row.compact .col-5, .row.compact .col-6, .row.compact .col-7, .row.compact .col-8, .row.compact .col-9, .row.compact .col-10, .row.compact .col-11, .row.compact .col-12,
    .row.comfort .col-1, .row.comfort .col-2, .row.comfort .col-3, .row.comfort .col-4, .row.comfort .col-5, .row.comfort .col-6, .row.comfort .col-7, .row.comfort .col-8, .row.comfort .col-9, .row.comfort .col-10, .row.comfort .col-11, .row.comfort .col-12 {
        float: none;
        width: auto;
        height: auto !important;
        margin: 0;
        padding: 0;
    }
    .col-1:before, .col-2:before, .col-3:before, .col-4:before, .col-5:before, .col-6:before, .col-7:before, .col-8:before, .col-9:before, .col-10:before, .col-11:before, .col-12:before,
    .col-1:after, .col-2:after, .col-3:after, .col-4:after, .col-5:after, .col-6:after, .col-7:after, .col-8:after, .col-9:after, .col-10:after, .col-11:after, .col-12:after {
        display: table;
        content: "";
        clear: both;
    }
    #content .wrap > .row:first-child > [class*="col"] + [class*="col"] > p:first-child,
    #content .wrap > .row:first-child > [class*="col"] + [class*="col"] > .box:first-child {
        margin-top: 20px;
    }
    #content .wrap > .row:first-child > [class*="col"] + [class*="col"] > H1:first-child,
    #content .wrap > .row:first-child > [class*="col"] + [class*="col"] > H2:first-child,
    #content .wrap > .row:first-child > [class*="col"] + [class*="col"] > .title-row:first-child {
        margin-top: 40px;
    }
    #content .wrap > h1.hidden:first-child + .row > [class*="col"] + [class*="col"] > .box:first-child {
        margin-top: 10px;
    }
    .row.form-gap > [class*="col"] {
        padding: 0 !important;
    }
    .row.form-gap [class*="col"] + [class*="col"] .form {
        margin-top: 0 !important;
    }

    .landingpage .col.right {
        text-align: center !important;
    }
    .landingpage .col + .col {
        margin-top: 40px;
    }

    select,
    input.txt {
        width: 100%;
    }

    .btn.wide {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }

    #clients .wrap,
    .borderless #clients .wrap {
        padding-right: 10px;
        padding-left: 10px;
    }

    #logo {
        margin-top: -1px;
    }
    #header {
        height: auto;
        min-height: 65px;
    }
    #header .wrap {
        padding: 20px 20px 0;
    }

    #menu-toggler {
        display: block;
        margin-left: 10px !important;
    }
    #user-box {
        margin-bottom: 19px;
        margin-left: 0;
    }
    #user-box #menu-toggler .icon {
        margin: 0;
    }
    #header .phone {
        float: none;
        clear: both;
        padding: 16px 0 10px 10px;
    }

    #nav {
        position: relative;
        max-height: 0;
        transition-duration: 0.5s;
        overflow: hidden;
    }
    #nav.open {
        max-height: 1000px;
    }
    #nav,
    #nav a,
    #nav li {
        float: none;
        clear: both;
        padding: 0;
    }
    #nav {
        padding-top: 0;
        margin-left: -20px;
        margin-right: -20px;
    }
    #nav li.sub {
        padding: 0;
    }
    #nav li.sub ul {
        display: none !important;
    }
    #nav a,
    #nav li.sub a,
    #nav li.sub a.open,
    #nav li.parent > a,
    #nav li.parent > a.open {
        display: block;
        margin: 0 !important;
        padding: 10px 0 !important;
        border-top: 1px solid #e5e5e5 !important;
        background: #fff !important;
        text-align: center;
    }
    #nav li.sub a:after {
        display: none;
    }
    #nav a:hover,
    #nav a:focus,
    #nav a.active,
    #nav li.sub a:hover,
    #nav li.sub a:focus,
    #nav li.sub a.open:hover,
    #nav li.sub a.open:focus,
    #nav li.parent > a:hover,
    #nav li.parent > a:focus,
    #nav li.parent > a.open:hover,
    #nav li.parent > a.open:focus {
        padding: 10px 0 !important;
        border-bottom: none !important;
        border-top: 1px solid #e5e5e5 !important;
        background: #e7effe !important;
    }
    #nav a.active,
    #nav a.active:hover,
    #nav a.active:focus,
    #nav li.sub a.active,
    #nav li.sub a.active:hover,
    #nav li.sub a.active:focus,
    #nav li.parent > a.active,
    #nav li.parent > a.active:hover,
    #nav li.parent > a.active:focus {
        padding: 10px 0 !important;
        border-bottom: none !important;
        background: #e7effe !important;
        color: #000 !important;
    }
    #nav li.parent {
        padding: 0;
    }
    #nav .submenu,
    #nav .submenu.double {
        display: block !important;
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        margin: 0;
        padding: 0;
        border-left: 10px solid #e5e5e5;
        border-radius: 0;
        background: #faf8f6;
        box-shadow: none;
        opacity: 1 !important;
    }
    #nav .submenu ul,
    #nav .submenu.double ul,
    #nav .submenu.double ul:first-child {
        float: none !important;
        margin: 0;
        padding: 0;
        border: 0;
    }
    #nav .submenu a {
        background: none !important;
    }
    #nav .submenu a:hover,
    #nav .submenu a:focus {
        background: #e7effe !important;
    }
    #nav .submenu li.title {
        border-top: 1px solid #e5e5e5 !important;
        background: #f4f1ed;
        padding: 10px;
        color: #aaa;
        text-align: center;
    }


    /* user nav */

    #user-nav {
        overflow: hidden;
        max-height: 0px;
        transition-duration: 0.5s;
    }
    #user-nav.open {
        max-height: 500px;
    }
    #user-nav .wrap {
        padding: 0;
        background: #999;
    }
    #user-nav ul {
        margin: 0;
    }
    #user-nav a,
    #user-nav li {
        display: block;
        float: none;
        width: 100%;
        text-align: center;
    }
    #user-nav a {
        border-bottom: 1px solid #8b8b8b;
        color: #fff;
        text-transform: none;
        line-height: 30px;
        text-shadow: 0 1px 0 rgba(0,0,0,0.2);
    }
    #user-nav .icon {
        margin-top: 6px;
        color: #fff;
    }
    #user-nav li.active a:before,
    #user-nav li.active a:after {
        display: none;
    }
    #user-nav li.active a {
        background: #777;
    }

    .content-menu {
        margin-top: -40px;
    }
    .content-menu a {
        border-radius: 0 !important;
    }

    .statement {
        font-size: 24px;
        line-height: 30px;
    }
    .statement,
    .statement.small {
        padding-left: 20px;
        padding-right: 20px;
    }
    #hero .btn {
        margin-top: 5px;
    }
    #hero .bg {
        margin-top: 50px;
        width: auto;
        min-width: 200px;
        transform: translateX(0) translateY(0);
        position: static;
        color: #000;
        text-shadow: none;
    }
    #hero .secondary {
        color: #ccc;
    }
    #hero.weknow .bg {
        background-position: 70% 0;
        text-shadow: none;
    }

    #content .front-area .wrap {
        padding: 40px 20px;
    }
    .front-area .aligner {
        position: relative;
        top: 0;
        transform: translateY(0);
    }
    .front-area.clients .wrap:after {
        width: 647px;
        height: 40px;
        background-size: 647px 40px;
    }
    .front-area.measures .wrap:after {
        width: 579px;
        height: 125px;
        margin-top: 40px;
        background: url(area-measures.png);
        background-size: 579px 125px;
    }
    .front-area.user-impact .wrap {
        position: relative;
        z-index: 1;
        min-height: 200px;
        padding-left: 20px !important;
        text-align: center;
    }
    .front-area.user-impact:after {
        display: none;
    }
    .front-area.root-causes .wrap {
        position: relative;
        z-index: 1;
        min-height: 200px;
        padding-right: 0 !important;
        text-align: center;
    }
    .front-area.root-causes ul {
        text-align: left;
    }
    .front-area.root-causes .aligner {
        right: 0;
    }
    .front-area.root-causes:after {
        display: none;
    }

    .front-area.integrate .row:before {
        display: none;
    }
    .front-area.integrate .col-6 {
        margin-top: 20px;
        padding-top: 20px;
    }
    .front-area.integrate .col-6 + .col-6 {
        border-top: 2px solid #aad2ef;
    }


    #what-we-do {
        margin: -20px 0 0;
    }
    #what-we-do li,
    #what-we-do li.alt {
        min-height: 0;
        margin: 10px 0 0;
        padding: 20px;
        border: 2px solid #eee;
        border-radius: 0px;
        text-align: center;
    }
    #what-we-do br {
        display: none;
    }
    #what-we-do li:before,
    #what-we-do li.alt:before {
        display: block;
        position: static;
        float: none;
        margin: 0 0 20px;
        width: 100%;
    }
    #solution .wrap {
        padding-left: 20px;
        padding-right: 20px;
    }
    #solution .col-6 + .col-6 {
        margin: 0;
    }
    #solution .steps {
        position: relative;
        z-index: 6;
        height: 103px;
        margin: 60px 0 0;
    }
    #solution .steps li,
    #solution .steps li + li {
        float: left;
        width: 100%;
        margin: 0 !important;
    }
    #solution .steps li + li {
        margin-top: -1px !important;
    }
    #solution .steps a {
        display: none;
        cursor: default;
    }
    #solution .steps a.active {
        display: block;
        min-height: 70px;
    }
    #solution .steps a:hover,
    #solution .steps a:focus {
        left: 0;
    }
    #solution .steps .active:after {
        display: none;
    }
    #solution .steps li:last-child .icon:after,
    #solution .steps li:last-child .bullet:before,
    #solution .steps li:last-child .bullet:after {
        display: block;
    }

    #solution .container {
        box-shadow: none;
        border: 5px solid #ebe9e7;
    }
    #solution .container .c4 .col-6 {
        float: left;
        width: 43% !important;
        height: 205px !important;
    }
    #solution .container .c1 .col-4 {
        float: left;
        width: 33.3333%;
    }
    #solution .container .content {
        border-radius: 0;
    }
    .technical-problems li {
        width: 100%;
    }
    .how-does-it-work {
        width: auto;
        height: 50vw;
        margin: -8vw -20px 0;
        background: url(what_is_plumbr_gray.png) no-repeat 50% 0;
        background-size: 100%;
        overflow: hidden;
    }
    .how-does-it-work p,
    .how-does-it-work ul {
        display: none;
    }
    .how-does-it-work.alt {
        background: url(what_is_plumbr2.png) no-repeat 50% 0;
        background-size: 100%;
        height: 36vw;
    }
    .how-plumbr-works p {
        margin: 20px 0 0;
    }
    #intro .btn {
        margin-top: 5px;
    }
    #intro .wrap {
        padding: 35px 10px 55px;
        overflow: hidden;
    }
    #intro .prev,
    #intro .next {
        position: absolute;
        top: auto;
        bottom: 0;
        left: 0;
        height: 40px !important;
        min-height: 40px;
        width: 50% !important;
        min-width: 0 !important;
        margin: 0;
    }
    #intro .prev .floating-content,
    #intro .next .floating-content {
        width: 100% !important;
    }
    #intro .prev .floating-content.floating,
    #intro .next .floating-content.floating {
        top: 0 !important;
    }
    #intro .prev {
        left: 0;
    }
    #intro .next {
        left: 50%;
    }
    #intro .prev p,
    #intro .next p {
        height: 40px;
        width: 100%;
        max-width: 100% !important;
    }
    #intro .prev p.floating,
    #intro .next p.floating {
        width: 50% !important;
        box-shadow: 0 1px 0 rgba(0,0,0,0.05), 0 2px 0 rgba(0,0,0,0.04), 0 3px 0 rgba(0,0,0,0.03), 0 4px 0 rgba(0,0,0,0.02), 0 5px 0 rgba(0,0,0,0.01);
    }
    #intro .prev .icon,
    #intro .next .icon {
        height: 40px;
        width: 40px;
        font-size: 30px;
        line-height: 40px;
    }
    #intro .prev .icon {
        margin-left: -40px;
    }
    #intro .next .icon {
        margin-right: -40px;
    }
    #intro .prev a,
    #intro .next a {
        float: none;
        display: block;
        height: 40px;
        margin-top: 0;
        border-top: 1px solid #e5e5e5;
        border-bottom: 1px solid #e5e5e5;
        border-radius: 0;
        box-shadow: none;
    }
    #intro .prev a {
        padding-left: 40px;
        padding-right: 20px;
    }
    #intro .next a {
        padding-right: 40px;
        padding-left: 20px;
        border-left: 1px solid #e5e5e5;
    }
    #intro .prev a:hover,
    #intro .prev a:focus {
        padding: 0 20px 0 40px;
    }
    #intro .next a:hover,
    #intro .next a:focus {
        padding: 0 40px 0 20px;
    }
    #intro .prev a:hover span,
    #intro .prev a:focus span,
    #intro .next a:hover span,
    #intro .next a:focus span {
        width: auto;
    }
    #intro .prev span,
    #intro .next span {
        display: block;
        width: auto;
        font-size: 14px;
        line-height: 40px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    #intro .prev span {
        text-align: left;
    }
    #intro .next span {
        text-align: right;
    }
    #intro.alt .wrap {
        padding-bottom: 35px;
    }
    #intro .border-crossing-btn {
        margin: 20px 0 0;
    }
    #intro h1.hidden {
        display: block !important;
        visibility: visible;
        margin: 0 0 20px;
    }
    #intro .steps {
        display: none;
    }


    .single-pane-of-glass,
    .users-to-application {
        padding-top: 36vw;
        background-size: 100%;
    }
    .single-pane-of-glass {
        padding-top: 24vw;
        margin-top: 40px;
    }
    .single-pane-of-glass .col-4 + .col-4 {
        margin-top: 20px;
        border-top: 1px solid #e5e5e5;
    }
    .users-to-RC {
        padding-top: 0;
        background: none;
    }
    .users-to-RC .rc {
        display: none;
    }
    .users-to-RC p {
        padding: 0;
    }



    .page-message.wide .wrap {
        width: auto;
        padding: 12px 20px 12px 70px;
        border: none;
    }

    .single-quote {
        margin: 20px 0 80px;
        padding: 10px 50px;
    }

    #footer .wrap {
        padding: 0 0 20px;
    }
    #nav-footer {
        margin: 0;
    }
    #nav-footer,
    #nav-footer a,
    #nav-footer li,
    #nav-footer li.social {
        display: block;
        float: none;
        clear: both;
        padding: 0;
    }
    #nav-footer a {
        display: block;
        padding: 10px 0;
        border-bottom: 1px solid #e5e5e5;
        text-align: center;
    }
    #nav-footer a:hover,
    #nav-footer a:focus {
        border: none;
        border-bottom: 1px solid #e5e5e5;
        background: #fff;
        text-decoration: none;
    }
    #footer ul.social a {
        color: #999;
        font-size: 40px;
        line-height: 40px;
    }

    #content .wrap {
        padding: 40px 20px;
    }
    #content .wrap.compact {
        padding: 20px;
    }
    #content .wrap.agent {
        padding-bottom: 130px;
    }
    #content .wrap.agent:after {
        right: auto;
        left: 50%;
        margin-left: -0.5em;
        text-align: center;
    }

    /* Sidebar */

    #content .wrap.split,
    #content .wrap.split-alt,
    #content .wrap.compact.split,
    #content .wrap.compact.split-alt {
        padding: 20px;
    }
    #main,
    #sidebar {
        float: none !important;
        clear: both;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    #sidebar-toggler {
        display: block;
        float: left;
        width: 100%;
        height: 44px;
        margin: -20px 0 20px !important;
    }
    #sidebar-toggler a {
        display: block;
        height: 44px;
        margin: 0 -20px;
        padding: 10px 20px;
        background: #009cd5;
        color: #fff;
        font-size: 16px;
        line-height: 24px;
    }
    #sidebar-toggler a:hover,
    #sidebar-toggler a:focus {
        background: #25baf0;
        text-decoration: none;
    }
    #sidebar-toggler .icon {
        vertical-align: top;
        font-size: 22px;
        line-height: 24px;
    }
    #sidebar-toggler .icon-cancel {
        display: none;
    }
    #sidebar-toggler.open a,
    #sidebar-toggler.floating a {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 120;
        width: 100%;
        margin: 0;
    }
    #sidebar-toggler.open a {
        background: #666;
    }
    #sidebar-toggler.open a:hover {
        background: #555;
    }
    #sidebar-toggler.open .icon-menu {
        display: none;
    }
    #sidebar-toggler.open .icon-cancel {
        display: inline-block;
    }
    #sidebar {
        display: none;
        position: fixed;
        top: 44px;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 100;
        background: #fff;
        width: 100% !important;
        overflow: auto;
        margin: 0 !important;
    }
    #sidebar.open {
        display: block;
    }
    #sidebar .floating-wrap,
    #sidebar .floating-content {
        position: static !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    #sidebar .box {
        margin: 0;
        padding: 0 20px 0;
        border-right: none;
    }
    #sidebar .box:first-child {
        top: 0;
        margin: 0 !important;
    }
    #sidebar .box:first-child::before {
        display: none;
    }
    #sidebar h2 {
        margin: 0 -20px !important;
        padding: 10px 20px;
        background: #666;
        color: #fff;
    }
    #sidebar h2 .icon {
        color: #fff;
    }
    #sidebar h2.style-color01 {
        background: #009cd5;
    }
    #sidebar h2.style-color02 {
        background: #ec7500;
    }
    #sidebar h2.style-color03 {
        background: #6cc042;
    }
    #sidebar ul.support-menu {
        margin: 0;
    }
    #sidebar ul.support-menu a {
        padding: 6px 20px;
        color: #777;
        font-size: 18px;
        line-height: 32px;
        font-weight: bold;
    }
    #sidebar ul.support-menu li {
        border-bottom: 1px solid #e5e5e5;
    }
    #sidebar ul.support-menu ul li {
        border: none;
    }
    #sidebar ul.support-menu ul a {
        font-weight: 400;
    }
    #sidebar .box .support-menu li {
        margin: 0 -20px !important;
    }
    #sidebar .box .support-menu li li {
        margin: 0  !important;
    }
    #sidebar .sidebar-support {
        display: none;
        margin: 0;
        border-width: 0;
    }

    #sidebar .box.menu,
    #sidebar .box.menu.open {
        padding: 0;
    }
    #sidebar .box.menu h2 {
        margin: 0 !important;
        padding: 0 !important;
        background: none;
    }
    #sidebar .box.menu h2 a {
        padding-right: 50px !important;
    }
    #sidebar .box.menu h2 .expander {
        display: block;
        top: 0;
        right: 0;
        bottom: 0;
        margin: 0;
        width: 40px;
        height: auto;
        padding: 0 !important;
        border-radius: 0;
        background: #ccc;
        opacity: 1;
    }
    #sidebar .box.menu h2 a.expander:hover,
    #sidebar .box.menu h2 a.expander:focus {
        background: #009cd5;
    }
    #sidebar .box.menu h2 a.expander .icon {
        position: absolute;
        top: 50%;
        left: 0;
        width: 100%;
        height: 26px;
        margin: -15px 0 0 !important;
    }
    #sidebar .box.banner h2 {
        padding: 0 20px;
        background: none;
    }
    .box.menu.active h2 a {
        background: #eeeeee;
    }
    .box.menu.active h2:before {
        display: none;
    }
    #sidebar .box.menu .l1 a,
    #sidebar .box.menu h2 a {
        padding: 10px 20px;
    }
    #sidebar .box.menu ul.support-menu,
    #sidebar .box.menu.open ul.support-menu {
        margin: 0;
        padding: 0 0 0 20px;
    }
    #sidebar .box.menu .support-menu {
        border-top-color: #fff;
    }
    #sidebar .box.menu.open .support-menu {
        border-top: 1px solid #fff;
    }
    #sidebar .box.menu .support-menu li {
        margin: 0 !important;
        border-bottom: none;
    }
    #sidebar .box.menu .support-menu a {
        font-weight: 400;
        padding: 4px 20px;
    }
    #sidebar .box.menu .support-menu ul a {
        font-size: 16px;
        padding: 2px 20px;
    }
    #sidebar .box.back {
        display: none;
    }
    #sidebar .box.download {
        padding-top: 20px;
    }

    #sidebar h2.blog-cat-title {
        display: none;
    }
    .split-alt #sidebar {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    #sidebar .tags {
        margin: 0;
        font-size: 18px;
    }
    #sidebar .tags a {
        margin: 0 -20px;
        padding: 4px 80px 4px 20px;
        border-bottom: 1px solid #e5e5e5;
        color: #777;
        line-height: 40px;
        font-weight: bold;
    }
    #sidebar .tags a:after,
    #sidebar .tags a:before {
        display: none;
    }
    #sidebar .feature h2 {
        padding: 0 20px;
        background: none;
        color: #000;
    }

    .bg-menu .index,
    .bg-menu .detail {
        display: none;
    }
    .bg-menu a.main,
    .bg-menu a.banner {
        padding: 15px 20px;
    }


    .introduction,
    .introduction.bordered,
    #content .wrap > .introduction:last-child {
        position: relative;
        overflow: hidden;
        margin-left: -20px !important;
        margin-right: -20px !important;
        padding: 0 20px 220px;
    }
    .introduction .col-5,
    .introduction .col-6,
    .introduction .col-7 {
        position: static;
        height: auto !important;
        min-height: 0 !important;
        min-height: 0;
    }
    .introduction .illustration,
    .introduction .visual a.illustration {
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
    }
    .introduction .visual p {
        display: none;
    }
    .introduction .sneakpeak {
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
    }
    .sneakpeak p:hover {
        z-index: 0;
        width: 200px;
        height: 200px;
        margin: 0;
        border-color: #ccc;
        box-shadow: none;
    }
    .sneakpeak .severity:hover { background-position: -50px -50px; }
    .sneakpeak .cause:hover { background-position: -350px -50px; }
    .sneakpeak .solution:hover { background-position: -650px -50px; }
    .sneakpeak .monitoring-error:hover { background-position: -950px -50px; }
    .sneakpeak .monitoring-ok:hover { background-position: -1250px -50px; }
    .sneakpeak .ploting:hover { background-position: -1550px -50px; }
    .sneakpeak .coding:hover { background-position: -1850px -50px; }
    .introduction.alt {
        margin-left: -20px;
        margin-right: -20px;
        padding: 20px;
    }
    .introduction.bordered {
        padding: 20px 20px 300px;
    }
    .introduction.bordered .illustration.laptop {
        bottom: 50px;
    }
    .introduction.bordered .illustration.desktop {
        bottom: 20px;
    }
    .introduction.bordered .illustration.windows {
        bottom: 50px;
    }
    .introduction [class*="col"] {
        display: block;
        padding: 0 !important;
    }
    .introduction .form {
        margin-top: 10px;
    }
    #content.prominent .introduction {
        padding: 20px;
    }
    #content.prominent .introduction .col-6 + .col-6 {
        padding-top: 30px !important;
    }
    #content.prominent .introduction + .introduction {
        margin-top: 10px;
        margin-bottom: 10px;
        padding-top: 30px;
        border-top: 1px solid #e5e5e5;
    }
    .article {
        overflow: auto;
    }
    .article.case-study {
        overflow: visible;
    }
    .article img {
        width: auto !important;
        height: auto !important;
    }
    .article img.alignright {
        max-width: 50% !important;
    }
    .landingpage .article img {
        max-width: 100% !important;
    }

    .stand-out {
        padding: 20px;
        margin: 40px 0 0;
    }
    .stand-out:after {
        display: none;
    }



    .blog-list {
        margin: 0 -20px;
    }
    .blog-list a {
        padding: 20px;
    }
    .blog-list p.img {
        display: none;
    }
    .blog-item.compact {
        height: auto !important;
        margin-top: 0;
    }
    .blog-item.compact p {
        margin-top: 0;
    }

    #content.important .wrap {
        padding: 40px;
    }
    #content.important a.banner.alt {
        margin-left: -40px;
        margin-right: -40px;
    }


    .nr-list.steps.vertical {
        margin-left: 0;
    }
    .nr-list.steps.vertical .list-index {
        display: block;
        float: none;
        margin: 0 0 20px;
    }
    .nr-list.steps.vertical .list-index strong {
        width: auto;
    }
    .nr-list.steps.vertical li {
        margin: 10px 0 0;
    }

    .box.steps {
        display: none;
    }

    .founder {
        height: auto;
        margin: 0;
        padding: 0;
        border-top: 1px solid #e5e5e5;
        background: none #fff !important;
        color: #000 !important;
    }
    .founder .wrap {
        height: 100%;
        padding: 20px !important;
    }
    .founder.alt .wrap {
        padding-right: 50%;
    }
    .pricing {
        padding-bottom: 0;
    }
    .pricing .price {
        margin: 20px 0 0;
    }
    .pricing .price .ribbon {
        margin: 0 16px;
        padding: 0 20px;
        text-align: center;
        background: #00a4d8;
        box-shadow: none;
    }
    .pricing .price .ribbon small:before,
    .pricing .price .ribbon small:after {
        position: absolute;
        top: 0;
        right: -16px;
        border: solid;
        border-width: 16px 8px;
        border-color: #00a4d8 transparent transparent #00a4d8;
        content: '';
    }
    .pricing .price .ribbon small:after {
        top: 32px;
        border-color: transparent transparent #00a4d8 #00a4d8;
    }
    .pricing .price .ribbon small {
        float: none;
        display: inline-block;
        vertical-align: top;
    }
    .pricing .price .meta {
        margin: 0;
        padding: 0;
        text-align: center;
        font-size: 12px;
        color: #999;
    }
    .pricing .price .meta br {
        display: none;
    }
    .pricing .box.grid {
        margin: 20px 0 0 !important;
    }
    .pricing .box.grid ul {
        margin: 0;
    }
    .pricing .action .btn {
        width: 100%;
        margin-bottom: 10px;
    }
    .pricing .plans {
        margin-top: 0;
    }
    .pricing .plans .type {
        margin: 10px 0 0;
        padding-left: 20px;
    }
    .pricing .plans .desc {
        border-bottom: none;
    }
    .pricing .plans .col-6 .col-6 {
        margin: 0 10px 10px;
        border: 4px solid #999;
    }
    .pricing .plans .plan,
    .pricing .plans .desc {
        border: none;
    }
    .pricing .plans .jvm-plans .plan,
    .pricing .plans .jvm-plans .desc {
        border: none;
    }
    .pricing .actions .btn {
        margin-bottom: 5px;
    }
    p.disclaimer.alt {
        border: none;
        padding: 0;
    }

    .box .content {
        min-height: 0px !important;
    }
    .box.agent:after {
        display: none;
    }
    .support-cta {
        margin-top: 20px;
    }



    .feature.floating {
        max-width: 100% !important;
        right: 20px;
        left: 20px;
    }
    .feature.special.alt,
    .feature.special.plus {
        margin: 0 -20px;
        overflow: hidden;
    }
    .feature.special.alt:before,
    .feature.special.alt:after,
    .feature.special.plus:after {
        display: none
    }

    .page-area .wrap,
    #content .page-area .wrap,
    #content .page-area.narrow .wrap {
        width: auto;
        padding: 20px;
    }
    .article .page-area,
    #content .article .page-area {
        margin-left: -20px;
        margin-right: -20px;
    }
    .page-area.gallery .close {
        right: 10px;
    }
    .page-area.gallery .row .col-4 + .col-4 {
        margin-top: 20px;
    }
    .page-area.gallery .row a {
        height: 150px;
    }
    .page-area.gallery .row img {
        width: 100%;
        height: auto;
    }

    .persons li,
    .persons li.alt {
        position: relative;
        padding: 0;
        padding-top: 200px;
        text-align: center;
    }
    .persons li .aligner,
    .persons li.alt .aligner {
        display: block;
        height: auto;
        padding: 20px 0;
    }
    .persons li:before,
    .persons li.alt:before {
        position: absolute;
        top: 0;
        left: 50%;
        margin-left: -100px;
    }
    .single-quote.compact {
        position: relative;
    }

    .persons .single-quote::after,
    .persons li.alt .single-quote::after,
    .persons .single-quote::before,
    .persons li.alt .single-quote::before {
        top: -10px;
        right: auto;
        left: 50%;
        margin: 0 0 0 -10px;
        border-width: 0 10px 10px;
        border-color: transparent transparent #f9fbff;
    }
    .persons .single-quote::before,
    .persons li.alt .single-quote::before {
        top: -11px;
        margin: 0 0 0 -11px;
        border-width: 0 11px 11px;
        border-color: transparent transparent #ccd7eb;
    }

    .speaker .personal,
    .speaker.alt .personal,
    .speaker .personal,
    .speaker .resources {
        float: none;
        width: auto;
    }
    .speaker .about,
    .speaker.alt .about {
        float: none;
        width: auto;
        margin: 20px 0 0;
        padding: 0;
    }
    .speaker .about .chat {
        margin: 0;
    }
    .speaker .about .chat:before,
    .speaker .about .chat:after,
    .speaker.alt .about .chat:before,
    .speaker.alt .about .chat:after {
        top: -14px;
        right: auto;
        left: 50%;
        margin: 0 0 0 -14px;
        border-width: 0 14px 14px 14px;
        border-color: transparent transparent #e5e5e5;
    }
    .speaker .about .chat:after,
    .speaker.alt .about .chat:after {
        top: -11px;
        border-color: transparent transparent #fff;
    }

    .article.press-kit {
        overflow: hidden;
    }
    .press-kit-suffering-users {
        max-width: 110%;
        height: 36vw;
        margin-left: -20px !important;
        margin-right: -20px !important;
        background-size: 100%;
    }
    .press-kit .logos img {
        max-width: 100%;
    }

    .img-grid a {
        margin: 1px;
    }
    .img-grid img {
        max-width: 100%;
    }

    .highlight-facts {
        margin: 20px 0 0;
    }
    .highlight-facts .col-4 + .col-4 {
        margin-top: 5px;
    }

    a.banner.page-end {
        margin-left: -20px;
        margin-right: -20px;
    }
    a.banner.page-end .main {
        display: block;
        padding-bottom: 10px;
    }

    #modal-wrap {
        padding: 20px 20px 0;
    }
    .modal,
    .modal.login,
    .modal.small {
        width: auto;
        left: 0;
        max-width: 100%;
        margin-left: 0;
    }

    #modal-panel {
        right: 20px !important;
        left: 20px !important;
        width: auto !important;
    }


    .modal.signup {
        background-image: none;
    }
    .modal.signup .register {
        width: 100%;
    }
    .modal.signup .desc {
        display: none;
    }


    html.onboarding #footer {
        border-top: 1px solid #e5e5e5;
    }
    html.onboarding #logo {
        position: absolute;
        top: 20px;
        left: 20px;
        height: 60px;
        width: 150px;
    }
    html.onboarding #logo a {
        font-size: 60px;
        line-height: 60px;
        height: 60px;
        width: 150px;
    }
    html.onboarding #promise {
        padding: 0;
        text-align: center;
    }
    html.onboarding input {
        margin-top: 5px !important;
        margin-bottom: 5px !important;
    }
    html.onboarding #content p {
        margin-top: 30px;
    }
    html.onboarding .form.horizontal {
        width: auto;
    }
    html.onboarding .form.horizontal dt {
        float: none;
        margin: 0;
        padding: 0 0 0 15px;
        text-align: left;
    }
    html.onboarding .form.horizontal .field-error {
        margin-top: 0 !important;
    }
}