@font-face {
    font-family: supportFont;
    src: url(../fonts/supportFont.eot?d5t7fc);
    src: url(../fonts/supportFont.eot?#iefixd5t7fc) format('embedded-opentype'), url(../fonts/supportFont.woff?d5t7fc) format('woff'), url(../fonts/supportFont.ttf?d5t7fc) format('truetype'), url(../fonts/supportFont.svg?d5t7fc#supportFont) format('svg');
    font-weight: 400;
    font-style: normal
}

[class*=" supIco-"], [class^=supIco-] {
    font-family: supportFont;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.supIco-valid:before {
    content: "\e600"
}

.supIco-invalid:before {
    content: "\e601"
}

.supIco-chevron-left:before {
    content: "\e603"
}

.supIco-chevron-right:before {
    content: "\e604"
}

.supIco-chevron-left-circle:before {
    content: "\e605"
}

.supIco-chevron-right-circle:before {
    content: "\e606"
}

.supIco-book:before {
    content: "\e607"
}

.supIco-spinner:before {
    content: "\e97f"
}

.form-control:focus{
    transition: all 0.3s;
}
.form-control:focus{
    box-shadow: none;
    border-color: #72b920 !important;
}

.demo-wrapper {
    padding-top: 60px;
    padding-bottom: 60px
}

.support-contact-box {
    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    position: relative
}

.support-contact-box input {
    height: 43px;
    box-shadow: none
}


.support-contact-box select {
    height: 43px;
    line-height: 43px;
    box-shadow: none
}

.support-contact-box textarea {
    margin-left: -3px;
}


.support-contact-box .dropdown-menu {
    display: block
}

.support-contact-box .btn-group {
    display: block
}

.support-dropdown-toggle {
    width: 100%;
    text-align: left
}

.support-dropdown-toggle:focus, .support-dropdown-toggle:hover {
    background-color: #F4F4F4;
    transition: all 0.3s;
}

.support-dropdown-toggle .caret {
    float: right;
    margin-top: 8px;
}

.support-dropdown-menu {
    width: 100%;
    border-radius: 29px;
    transition: 0.3s all;
}

.support-dropdown-menu li {
    line-height: 43px;
    display: block;
    padding: 3px 29px;
    clear: both;
    white-space: nowrap;
    cursor: pointer;
}

.support-dropdown-menu li:hover {
    background-color: #f5f5f5;

}

.support-dropdown-menu li:hover:first-child {
   border-top-right-radius: 28px;
   border-top-left-radius: 28px;
}

.support-dropdown-menu li:hover:last-child {
   border-bottom-right-radius: 28px;
   border-bottom-left-radius: 28px;
}

.support-dropdown-menu.ng-hide-remove {
    -webkit-animation: fade-top-animation .2s ease-out;
    animation: fade-top-animation .2s ease-out;
    display: block!important
}

.support-dropdown-menu.ng-hide-add {
    -webkit-animation: fade-top-animation .2s ease-out;
    animation: fade-top-animation .2s ease-out;
    -webkit-animation-direction: reverse;
    animation-direction: reverse;
    display: block!important
}

.support-dropdown-menu.ng-hide {
    display: none!important
}

.support-submit-btn span.ng-hide-remove {
    -webkit-animation: pop-in-animation .2s ease-in-out;
    animation: pop-in-animation .2s ease-in-out
}

.support-submit-btn .spinner {
    font-size: 20px;
    vertical-align: middle;
    margin-right: 5px
}

.support-alert {
    position: absolute;
    top: 20%;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 28px;
    padding: 10px;
    width: 250px;
    height: auto;
    text-align: center
}

.support-alert .alert-icon {
    font-size: 3.5em;
    display: block;
    margin-bottom: 5px
}

.support-alert .alert-headline {
    font-size: 18px;
    margin-bottom: 0;
    margin-top: 20px;
    font-weight: 400;
    color: white;

}

.support-alert p.small {
    color: white;
    opacity:0.7;

}

.support-alert.ng-hide-remove {
    -webkit-animation: pop-in-animation .2s ease-out;
    animation: pop-in-animation .2s ease-out;
    display: block!important
}

.support-alert.ng-hide-add {
    -webkit-animation: pop-in-animation .2s ease-out;
    animation: pop-in-animation .2s ease-out;
    -webkit-animation-direction: reverse;
    animation-direction: reverse;
    display: block!important
}

.support-alert.ng-hide {
    opacity: 0;
    display: none!important
}

.support-alert-success {
  background-color: #72b920;
  padding: 20px;
  box-shadow: 0 17px 15px 0 rgba(127,127,127,0.21);

}

.support-alert-success .alert-icon {
    color: #ffffff;
    margin-top: 10px;
}

.support-alert-fail {
    background: #ffc6c0
}

.support-alert-fail .alert-icon {
    color: #f96354
}

.ng-valid.ng-dirty {
    border-color: #52ad3e
}

.ng-invalid.ng-dirty {
    border-color: #f96354
}

.support-article-wrapper {

    overflow-x:hidden;
    overflow-y:scroll;
    display: block;
    position: relative;
    min-height: 350px;
}



.support-article-wrapper::-webkit-scrollbar {
      background-color:transparent;
      width: 0.5em;
    }

    .support-article-wrapper::-webkit-scrollbar-track {
        background-color: transparent;
    }
    .support-article-wrapper::-webkit-scrollbar-thumb {
         background:rgba(0,0,0,0.1) !important;
         border-radius: 10px;
       }



.support-article-wrapper .spinner {
    font-size: 3em;
    position: absolute;
    top: 40%;
    left: 20%;
    opacity: .75
}

@media (max-width:767px) {
    .support-article-wrapper {
        min-height: 0;
        padding-bottom: 20px;
        overflow: visible
    }
}

/*::-webkit-scrollbar {
    display: none
}*/


.support-article-list {
    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out
}

.support-article-list h3 {
    font-size: 1.333em;
    margin-top: 0;
    margin-bottom: 20px
}

.support-dimmed {
    opacity: .2
}

@media (max-width:767px) {
    .support-dimmed-xs {
        opacity: .2
    }
}

.support-article-header {
    cursor: pointer;
    margin-top: 20px;
    margin-bottom: 20px;
    position: relative
}

.support-article-header:first-of-type {
    margin-top: 0
}

@media (max-width:767px) {
    .support-article-header {
        margin-top: 15px;
        margin-bottom: 0;
        padding-bottom: 15px;
        border-bottom: 1px solid #e8e8e8
    }
    .support-article-header:first-of-type {
        border-top: 1px solid #e8e8e8;
        padding-top: 15px;
    }
    .support-article-header:first-of-type .support-chevron {
        bottom: 34%;
    }
}

.support-article-headline {
    font-size: 1em;
    font-weight: 400;
    margin: 0;
}

.support-article-headline span {
    font-size: 18px;
    margin-right: 10px
}

@media (max-width:767px) {
    .support-article-headline {
        display: inline-block;
        width: 94%
    }
    .support-article-detail-headline {
        font-size: 24px !important;
        font-weight: 400;
        margin-bottom: 20px;
    }
    .support-article-detail-headline span {
        font-size: 18px;
        margin-right: 10px;
    }
    @media (max-width:767px) {
        .support-article-detail-headline {
            font-weight: 700;
        }
    }
    .support-chevron {
        color: #bcbcbc;
        position: absolute;
        right: 0;
        bottom: 48%;
    }
    .support-faq-link {
        margin-top: 20px;
        font-size: 1em;
    }
    @media (max-width:767px) {
        .support-faq-link {
            display: block;
            margin-top: 15px;
        }
    }
    .support-article-header.ng-enter, .support-article-header.ng-leave, .support-article-header.ng-move {
        -webkit-transition: all ease-in-out .3s;
        transition: all ease-in-out .3s;
        position: relative;
        display: block;
    }
    .support-article-header.ng-enter, .support-article-header.ng-leave.ng-leave-active, .support-article-header.ng-move {
        opacity: 0;
        top: -20px
    }
    .support-article-header.ng-enter.ng-enter-active, .support-article-header.ng-leave, .support-article-header.ng-move.ng-move-active {
        opacity: 1;
        top: 0;
        height: auto;
    }
    .support-full-article {
        display: block;
        position: absolute;
        top: 0;
        font-size: 1em;
        z-index: 100!important;
        background-color: #fff;
        min-height: 100%;
    }
    .support-full-article.ng-hide-remove {
        -webkit-animation: fade-right-animation .5s ease-in-out;
        animation: fade-right-animation .5s ease-in-out;
        display: block!important;
        opacity: 1;
    }
    .support-full-article.ng-hide-add {
        -webkit-animation: fade-left-animation .5s ease-in-out;
        animation: fade-left-animation .5s ease-in-out;
        display: block!important;
        opacity: 1;
    }
    .support-full-article.ng-hide {
        opacity: 0;
        display: none;
    }
    @media (max-width:767px) {
        .support-full-article {
            min-height: 0;
            padding: 15px;
            box-shadow: 0 0 10px #bcbcbc;
        }
    }

    .support-form-icon {
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        width: 43px;
        height: 43px;
        line-height: 44px;
        text-align: center;
        font-size: 16px
    }
    .support-form-icon.ng-hide-remove {
        -webkit-animation: zoom-in-pop-animation .3s ease-in-out;
        animation: zoom-in-pop-animation .3s ease-in-out;
        display: block!important
    }
    .support-form-valid {
        color: #52ad3e
    }
    .support-form-invalid {
        color: #f96354
    }
    .support-icon-small {
        padding-right: 5px;
        font-size: .8em;
        vertical-align: baseline
    }
    .spinning {
        -webkit-animation: spinning-animation 1s infinite linear;
        animation: spinning-animation 1s infinite linear
    }
    @-webkit-keyframes spinning-animation {
        0% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg)
        }
        100% {
            -webkit-transform: rotate(359deg);
            transform: rotate(359deg)
        }
    }
    @keyframes spinning-animation {
        0% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg)
        }
        100% {
            -webkit-transform: rotate(359deg);
            transform: rotate(359deg)
        }
    }
    @-webkit-keyframes fade-right-animation {
        0% {
            opacity: .7;
            -webkit-transform: translate(600px, 0);
            transform: translate(600px, 0)
        }
        85% {
            -webkit-transform: translate(-20px, 0);
            transform: translate(-20px, 0)
        }
        100% {
            opacity: 1;
            -webkit-transform: none;
            transform: none
        }
    }
    @keyframes fade-right-animation {
        0% {
            opacity: .7;
            -webkit-transform: translate(600px, 0);
            transform: translate(600px, 0)
        }
        85% {
            -webkit-transform: translate(-20px, 0);
            transform: translate(-20px, 0)
        }
        100% {
            opacity: 1;
            -webkit-transform: none;
            transform: none
        }
    }
    @-webkit-keyframes fade-left-animation {
        0% {
            opacity: 1;
            -webkit-transform: none;
            transform: none
        }
        100% {
            opacity: .7;
            -webkit-transform: translate(600px, 0);
            transform: translate(600px, 0)
        }
    }
    @keyframes fade-left-animation {
        0% {
            opacity: 1;
            -webkit-transform: none;
            transform: none
        }
        100% {
            opacity: .7;
            -webkit-transform: translate(600px, 0);
            transform: translate(600px, 0)
        }
    }
    @-webkit-keyframes zoom-in-pop-animation {
        0% {
            opacity: 0;
            -webkit-transform: scale(.3);
            transform: scale(.3)
        }
        80% {
            -webkit-transform: scale(1.2);
            transform: scale(1.2)
        }
        100% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1
        }
    }
    @keyframes zoom-in-pop-animation {
        0% {
            opacity: 0;
            -webkit-transform: scale(.3);
            transform: scale(.3)
        }
        80% {
            -webkit-transform: scale(1.2);
            transform: scale(1.2)
        }
        100% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1
        }
    }
    @-webkit-keyframes pop-in-animation {
        0% {
            opacity: 0;
            -webkit-transform: scale(1);
            transform: scale(1)
        }
        85% {
            -webkit-transform: scale(1.1);
            transform: scale(1.1)
        }
        100% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1
        }
    }
    @keyframes pop-in-animation {
        0% {
            opacity: 0;
            -webkit-transform: scale(1);
            transform: scale(1)
        }
        85% {
            -webkit-transform: scale(1.1);
            transform: scale(1.1)
        }
        100% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1
        }
    }
    @-webkit-keyframes fade-top-animation {
        0% {
            opacity: 0;
            -webkit-transform: translate(0, -30px);
            transform: translate(0, -30px)
        }
        80% {
            opacity: .8;
            -webkit-transform: none;
            transform: none
        }
        100% {
            opacity: 1
        }
    }
    @keyframes fade-top-animation {
        0% {
            opacity: 0;
            -webkit-transform: translate(0, -30px);
            transform: translate(0, -30px)
        }
        80% {
            opacity: .8;
            -webkit-transform: none;
            transform: none
        }
        100% {
            opacity: 1
        }
    }