#hellopack {
    color: #53627C;
    font-family: 'Open Sans', sans-serif
}

#hellopack * {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

#hellopack h1,
#hellopack h2,
#hellopack h3,
#hellopack h4 {
    margin: 0;
    padding: 0;
    color: #162134;
    font-weight: 700
}

#hellopack h1,
#hellopack h2 {
    padding: 0 0 12px 0;
    font-size: 26px;
    line-height: 32px
}

#hellopack h3,
#hellopack h4 {
    padding: 0 0 16px 0;
    font-size: 16px;
    line-height: 20px
}

#hellopack .postbox-header h2.hndle {
    font-size: 14px;
    line-height: 1.4;
    color: #1d2327
}

#hellopack a:not(.hellopack-button) {
    color: #3273dc;
    text-decoration: none;
    -webkit-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out
}

#hellopack a:not(.hellopack-button):link,
#hellopack a:not(.hellopack-button):visited,
#hellopack a:not(.hellopack-button):hover,
#hellopack a:not(.hellopack-button):focus,
#hellopack a:not(.hellopack-button):active {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

#hellopack p a[target="_blank"]:not(.hellopack-button):after,
#hellopack li a[target="_blank"]:not(.hellopack-button):after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    height: 10px;
    width: 10px;
    margin: -1px 2px 0 4px;
    background-repeat: no-repeat;
    background-size: 10px 10px;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%20width%3D%2716%27%20height%3D%2716%27%3E%0D%0A%3Cpath%20fill%3D%22%233273dc%22%20d%3D%22M15%2C0H8v2h4.6L6.3%2C8.3l1.4%2C1.4L14%2C3.4V8h2V1C16%2C0.4%2C15.6%2C0%2C15%2C0z%22%3E%3C%2Fpath%3E%0D%0A%3Cpath%20fill%3D%22%233273dc%22%20d%3D%22M14%2C16H1c-0.6%2C0-1-0.4-1-1V2c0-0.6%2C0.4-1%2C1-1h4v2H2v11h11v-3h2v4C15%2C15.6%2C14.6%2C16%2C14%2C16z%22%3E%3C%2Fpath%3E%0D%0A%3C%2Fsvg%3E")
}

#hellopack p a[target="_blank"]:not(.hellopack-button):hover,
#hellopack p a[target="_blank"]:not(.hellopack-button):focus,
#hellopack li a[target="_blank"]:not(.hellopack-button):hover,
#hellopack li a[target="_blank"]:not(.hellopack-button):focus {
    color: #3273dc;
    text-decoration: underline
}

#hellopack p {
    margin: 0 0 16px 0;
    color: #53627C;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px
}

[hidden] {
    display: none
}

body[class*="gridbuilder-"][class*="_page_hellopack-"] {
    overflow-y: scroll;
    overflow-x: hidden
}

body[class*="gridbuilder-"][class*="_page_hellopack-"] #wpbody-content>div:not(#screen-meta):not(#hellopack):not(.clear) {
    display: none
}

#wpbody-content>svg {
    display: none
}

#hellopack * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

#hellopack svg use {
    pointer-events: none
}

#hellopack #hellopack_form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: inherit
}

#hellopack .hellopack-admin-section {
    margin-bottom: 55px
}

#hellopack .hellopack-admin-section-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0
}

#hellopack .hellopack-admin-section-subtitle {
    margin-bottom: 16px
}

#hellopack .hellopack-notice {
    font-size: 13px;
    font-style: italic;
    margin: 0;
    padding: 2px 0 0 0
}

#hellopack .hellopack-notice:before {
    content: "\2731 ";
    font-size: 12px;
    font-style: normal
}

#hellopack .hellopack-nota-bene {
    margin: 24px 0 0 0
}

#hellopack .hellopack-nota-bene span {
    position: relative;
    display: inline-block;
    padding: 18px;
    border-radius: 4px;
    border: 2px solid #3273dc
}

#hellopack .hellopack-nota-bene span svg {
    position: absolute;
    display: block;
    overflow: hidden;
    z-index: 2;
    top: -10px;
    left: -10px;
    width: 20px;
    height: 20px;
    color: #3273dc;
    background-color: white;
    border-radius: 100%
}

#hellopack .hellopack-nota-bene span strong {
    color: #162134;
    font-weight: 700
}

#hellopack .hellopack-nota-bene.hellopack-warning span {
    border-color: #ff3960
}

#hellopack .hellopack-nota-bene.hellopack-warning span svg {
    color: #ff3960
}

#hellopack .hellopack-number-list {
    counter-reset: item;
    margin: 13px 0 13px 20px
}

#hellopack .hellopack-number-list li {
    margin: 0;
    font-weight: 400;
    line-height: 22px;
    list-style-type: none
}

#hellopack .hellopack-number-list li:before {
    content: counter(item) ". ";
    counter-increment: item;
    font-weight: bold;
    line-height: 26px
}

#hellopack .hellopack-unordered-list {
    margin: 13px 0 13px 20px
}

#hellopack .hellopack-unordered-list.hellopack-plugin-list {
    display: inline-block;
    margin-right: 40px;
    vertical-align: middle
}

#hellopack .hellopack-unordered-list li {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    list-style-type: disc
}

#hellopack .hellopack-admin-section a.hellopack-featured-image {
    position: relative;
    display: inline-block;
    width: 140px;
    height: 140px;
    padding: 20px;
    vertical-align: middle;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

#hellopack .hellopack-admin-section a.hellopack-featured-image:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border-radius: 4px;
    border: 2px solid #3273dc
}

#hellopack .hellopack-admin-section a.hellopack-featured-image:hover,
#hellopack .hellopack-admin-section a.hellopack-featured-image:focus {
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1)
}

#hellopack .hellopack-admin-section a.hellopack-featured-image svg {
    position: absolute;
    top: -10px;
    left: -10px;
    width: 20px;
    height: 20px;
    padding: 2px;
    fill: white;
    background-color: #3273dc;
    border-radius: 100%
}

#hellopack .hellopack-admin-section a.hellopack-featured-image img {
    position: relative;
    top: -10px
}

#hellopack .hellopack-admin-section a.hellopack-featured-image span {
    position: absolute;
    bottom: 12px;
    left: 0;
    right: 0;
    color: #162134;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-align: center;
    text-transform: uppercase
}

#hellopack .hellopack-admin-section a.hellopack-featured-image a:after {
    display: none
}

#hellopack .hellopack-table-wrapper {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden
}

#hellopack .hellopack-table {
    border-collapse: collapse;
    table-layout: fixed;
    white-space: nowrap
}

#hellopack .hellopack-table thead {
    color: #162134;
    font-size: 13px;
    font-weight: bold;
    line-height: 22px;
    text-transform: uppercase
}

#hellopack .hellopack-table tbody {
    font-weight: 600
}

#hellopack .hellopack-table tbody tr:nth-child(odd) {
    background-color: #f4f8fb
}

#hellopack .hellopack-table tbody tr:nth-child(even) input {
    background-color: white
}

#hellopack .hellopack-table tbody tr:nth-child(even) input:not([type="range"]):hover {
    background-color: #e0e4e9
}

#hellopack .hellopack-table tbody tr:nth-child(even) .hellopack-select:not(:hover) {
    background-color: white
}

#hellopack .hellopack-table td {
    height: 50px;
    width: 150px;
    padding: 8px 16px
}

#hellopack .hellopack-table td .hellopack-settings-field label {
    display: none
}

#hellopack .hellopack-table td:first-child {
    width: 100px
}

#hellopack .hellopack-table td .hellopack-settings-field {
    padding: 0;
    display: inline-block
}

#hellopack .hellopack-table td>* {
    vertical-align: middle
}

#hellopack .hellopack-table [data-colname="label"] svg {
    width: 24px;
    height: 24px
}

#hellopack .hellopack-table [data-colname="ratio"] input {
    text-align: center
}

@media screen and (max-width: 782px) {
    #hellopack .hellopack-admin-section-action {
        display: block;
        text-align: center
    }

    #hellopack .hellopack-admin-section-action a,
    #hellopack .hellopack-admin-section-action button {
        margin: 8px 4px
    }
}

#hellopack .hellopack-button {
    position: relative;
    display: inline-block;
    height: 40px;
    max-height: 40px;
    margin: 0;
    padding: 12px 16px;
    color: white;
    background-color: #3273dc;
    border: none;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 105, 255, 0.3);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 105, 255, 0.3);
    outline: none;
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    cursor: pointer;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    -webkit-transition: background-color 0.2s ease-in-out, -webkit-box-shadow 0.3s ease;
    transition: background-color 0.2s ease-in-out, -webkit-box-shadow 0.3s ease;
    transition: box-shadow 0.3s ease, background-color 0.2s ease-in-out;
    transition: box-shadow 0.3s ease, background-color 0.2s ease-in-out, -webkit-box-shadow 0.3s ease
}

#hellopack .hellopack-button svg {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin: 0 8px 0 0;
    vertical-align: top
}

#hellopack .hellopack-button:hover {
    background-color: #2981ff;
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 105, 255, 0.2);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 105, 255, 0.2)
}

#hellopack .hellopack-button:active,
#hellopack .hellopack-button:focus {
    outline: none;
    border: none
}

#hellopack .hellopack-button.hellopack-green {
    background-color: #23d160;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(62, 207, 142, 0.3);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(62, 207, 142, 0.3)
}

#hellopack .hellopack-button.hellopack-green:hover {
    background-color: #5fd7a1;
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(62, 207, 142, 0.2);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(62, 207, 142, 0.2)
}

#hellopack .hellopack-button.hellopack-red {
    background-color: #ff3960;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(248, 84, 100, 0.3);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(248, 84, 100, 0.3)
}

#hellopack .hellopack-button.hellopack-red:hover {
    background-color: #fa7b88;
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(248, 84, 100, 0.2);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(248, 84, 100, 0.2)
}

#hellopack .hellopack-button.hellopack-blue {
    background-color: #3273dc;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 105, 255, 0.3);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 105, 255, 0.3)
}

#hellopack .hellopack-button.hellopack-blue:hover {
    background-color: #2981ff;
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 105, 255, 0.2);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 105, 255, 0.2)
}

#hellopack .hellopack-button.hellopack-purple {
    background-color: #7a54cd;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(122, 84, 205, 0.3);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(122, 84, 205, 0.3)
}

#hellopack .hellopack-button.hellopack-purple:hover {
    background-color: #9374d6;
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(122, 84, 205, 0.2);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(122, 84, 205, 0.2)
}

#hellopack .hellopack-button.hellopack-button-small {
    padding: 8px 12px;
    height: 32px;
    max-height: 32px;
    font-size: 12px
}

#hellopack .hellopack-button.hellopack-button-small svg {
    width: 14px
}

#hellopack .hellopack-button:focus {
    -webkit-box-shadow: inset 0 0 0, 0 0 0 4px rgba(108, 117, 125, 0.15);
    box-shadow: inset 0 0 0, 0 0 0 4px rgba(108, 117, 125, 0.15)
}

#hellopack .hellopack-browse-demo {
    margin: 0 8px 8px 0
}

#hellopack .hellopack-uploader {
    position: relative;
    min-height: 250px;
    margin: 16px 4px 4px 4px;
    padding: 0
}

#hellopack .hellopack-uploader>label {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f4f8fb;
    border-radius: 4px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    cursor: pointer;
    -webkit-transition: background-color 300ms ease-out;
    transition: background-color 300ms ease-out
}

#hellopack .hellopack-uploader>label:before {
    content: "";
    position: absolute;
    top: -4px;
    left: -4px;
    right: -4px;
    bottom: -4px;
    border: 2px dashed #f4f8fb;
    border-radius: 4px;
    -webkit-transition: border-color 300ms ease-out;
    transition: border-color 300ms ease-out
}

#hellopack .hellopack-uploader>label:hover {
    background-color: #e0e4e9
}

#hellopack .hellopack-uploader>label:hover:before {
    border-color: #e0e4e9
}

#hellopack .hellopack-uploader>label>svg.hellopack-upload-icon {
    width: 48px;
    height: 48px;
    color: #3273dc;
    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    pointer-events: none
}

#hellopack .hellopack-uploader.hellopack-is-dragover label {
    background-color: #e0e4e9
}

#hellopack .hellopack-uploader.hellopack-is-dragover label:before {
    border-color: #e0e4e9
}

#hellopack .hellopack-uploader.hellopack-is-dragover label>svg.hellopack-upload-icon {
    opacity: 0.8
}

#hellopack .hellopack-uploader input[type="file"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-width: unset;
    max-height: unset;
    opacity: 0
}

#hellopack .hellopack-uploader input[type="file"]:focus+label {
    background-color: #e0e4e9
}

#hellopack .hellopack-uploader input[type="file"]:focus+label:before {
    border-color: #e0e4e9
}

#hellopack .hellopack-uploader input[type="file"]:focus+label>svg.hellopack-upload-icon {
    opacity: 0.8
}

#hellopack .hellopack-uploader .hellopack-uploader-message {
    font-size: 16px;
    line-height: 32px
}

#hellopack .hellopack-uploader .hellopack-uploader-remove {
    position: absolute;
    display: none;
    z-index: 1;
    bottom: 0;
    left: 50%;
    width: 32px;
    height: 32px;
    margin: -16px;
    padding: 0;
    background-color: #ff3960;
    border-radius: 16px
}

#hellopack .hellopack-uploader .hellopack-uploader-remove svg {
    width: 16px;
    height: 16px;
    margin: 8px;
    color: white;
    pointer-events: none
}

#hellopack .hellopack-uploader .hellopack-import-list {
    position: relative;
    z-index: 1;
    width: 100%;
    margin: 0;
    padding: 16px;
    background-color: white
}

#hellopack .hellopack-uploader .hellopack-import-list~label {
    pointer-events: none
}

#hellopack .hellopack-uploader .hellopack-import-list~.hellopack-uploader-remove {
    display: block
}

#hellopack input,
#hellopack select.hellopack-select {
    height: 32px;
    max-height: 32px;
    max-width: 100%;
    margin: 0;
    padding: 8px;
    border: 0;
    border-radius: 4px;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #4c5866;
    background-color: #f4f8fb;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    outline: none;
    cursor: pointer;
    -webkit-transition: background-color .3s ease-in-out, opacity .3s ease-in-out;
    transition: background-color .3s ease-in-out, opacity .3s ease-in-out
}

#hellopack input:hover,
#hellopack select.hellopack-select:hover,
#hellopack input:focus,
#hellopack select.hellopack-select:focus,
#hellopack input:active,
#hellopack select.hellopack-select:active {
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: #e0e4e9
}

#hellopack input[type="submit"] {
    height: 46px;
    max-height: 46px;
    padding: 12px 20px;
    color: white;
    background-color: #3273dc
}

#hellopack input[type="submit"]:hover {
    opacity: 0.9
}

#hellopack input[type="search"] {
    color: #162134
}

#hellopack input:disabled {
    color: rgba(83, 98, 124, 0.6);
    cursor: default
}

#hellopack input:disabled:hover,
#hellopack input:disabled:focus,
#hellopack input:disabled:active {
    background-color: #f4f8fb
}

#hellopack input::-webkit-input-placeholder {
    color: #53627C
}

#hellopack input:-moz-placeholder {
    color: #53627C;
    opacity: 1
}

#hellopack input::-moz-placeholder {
    color: #53627C;
    opacity: 1
}

#hellopack input::-ms-input-placeholder {
    color: #53627C
}

#hellopack input:-ms-input-placeholder {
    color: #53627C
}

#hellopack input::-webkit-search-cancel-button {
    display: none
}

#hellopack input[name="hellopack[shortcode]"][disabled] {
    cursor: pointer
}

#hellopack textarea {
    max-width: 100%;
    padding: 8px;
    border: 0;
    border-radius: 4px;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: #f4f8fb;
    color: #4c5866;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    -webkit-transition: background-color .3s ease-in-out, opacity .3s ease-in-out;
    transition: background-color .3s ease-in-out, opacity .3s ease-in-out
}

#hellopack textarea:hover,
#hellopack textarea:focus,
#hellopack textarea:active {
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: #e0e4e9
}

#hellopack textarea::-webkit-input-placeholder {
    color: #53627C
}

#hellopack textarea:-moz-placeholder {
    color: #53627C;
    opacity: 1
}

#hellopack textarea::-moz-placeholder {
    color: #53627C;
    opacity: 1
}

#hellopack textarea:-ms-input-placeholder {
    color: #53627C
}

#hellopack textarea::-ms-input-placeholder {
    color: #53627C
}

#hellopack input[type="number"] {
    -moz-appearance: textfield
}

#hellopack input[type="number"]:hover,
#hellopack input[type="number"]:focus {
    -moz-appearance: number-input
}

#hellopack select.hellopack-select {
    height: 32px;
    max-height: 32px;
    padding: 8px 32px 8px 8px;
    background-color: #f4f8fb;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none
}

#hellopack select.hellopack-select::-ms-expand {
    display: none
}

#hellopack select.hellopack-select::-ms-clear {
    display: none
}

#hellopack select.hellopack-select.hellopack-select-has-clear {
    padding: 4px 52px 4px 10px
}

#hellopack select.hellopack-select[multiple] {
    overflow: hidden
}

#hellopack select.hellopack-select[multiple]>option {
    opacity: 0
}

#hellopack th>input.hellopack-select-item+label,
#hellopack td>input.hellopack-select-item+label,
#hellopack div>input.hellopack-select-item+label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: white;
    text-align: center;
    border: 2px solid rgba(83, 98, 124, 0.5);
    border-radius: 4px;
    color: #162134;
    font-weight: bold;
    text-indent: 28px;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap;
    -webkit-transition: -webkit-box-shadow 0.3s ease;
    transition: -webkit-box-shadow 0.3s ease;
    transition: box-shadow 0.3s ease;
    transition: box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease
}

#hellopack th>input.hellopack-select-item+label span,
#hellopack td>input.hellopack-select-item+label span,
#hellopack div>input.hellopack-select-item+label span {
    display: none
}

#hellopack th>input.hellopack-select-item+label svg,
#hellopack td>input.hellopack-select-item+label svg,
#hellopack div>input.hellopack-select-item+label svg {
    position: absolute;
    left: 0;
    top: 0;
    width: 16px;
    height: 16px;
    padding: 2px;
    opacity: 0;
    color: #e0e4e9;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: -webkit-transform .2s ease, color .2s ease;
    -webkit-transition: color .2s ease, -webkit-transform .2s ease;
    transition: color .2s ease, -webkit-transform .2s ease;
    transition: transform .2s ease, color .2s ease;
    transition: transform .2s ease, color .2s ease, -webkit-transform .2s ease
}

#hellopack th>input.hellopack-select-item+label:hover svg,
#hellopack td>input.hellopack-select-item+label:hover svg,
#hellopack div>input.hellopack-select-item+label:hover svg {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack th>input.hellopack-select-item:checked+label svg,
#hellopack td>input.hellopack-select-item:checked+label svg,
#hellopack div>input.hellopack-select-item:checked+label svg {
    color: #23d160;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: none;
    transition: none
}

#hellopack th>input.hellopack-select-item:focus+label,
#hellopack td>input.hellopack-select-item:focus+label,
#hellopack div>input.hellopack-select-item:focus+label {
    -webkit-box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15);
    box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15)
}

#hellopack input.hellopack-password,
#hellopack input[type="password"] {
    width: 300px;
    padding: 4px 32px 4px 10px
}

#hellopack input.hellopack-password::-ms-reveal,
#hellopack input[type="password"]::-ms-reveal {
    display: none
}

#hellopack input.hellopack-password::-ms-clear,
#hellopack input[type="password"]::-ms-clear {
    display: none
}

#hellopack .hellopack-search-field {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: auto;
    min-height: 40px;
    max-width: 100%;
    margin: 0 0 16px 16px
}

#hellopack .hellopack-search-field input {
    position: relative;
    height: auto;
    min-height: 40px;
    min-width: 80px;
    width: 236px;
    max-width: 236px;
    padding: 12px 8px 12px 40px;
    font-weight: bold;
    text-overflow: ellipsis;
    text-transform: uppercase
}

#hellopack .hellopack-search-field svg {
    position: relative;
    z-index: 1;
    left: 40px;
    margin-left: -40px;
    height: 40px;
    width: 40px;
    padding: 12px 0
}

#hellopack .hellopack-input-submit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 360px
}

#hellopack .hellopack-input-submit [type="file"] {
    display: none
}

#hellopack .hellopack-input-submit input,
#hellopack .hellopack-input-submit .hellopack-password-holder {
    position: relative;
    width: 100%;
    min-width: 80px;
    min-height: 40px;
    border-radius: 4px 0 0 4px;
    vertical-align: top
}

#hellopack .hellopack-input-submit input>svg,
#hellopack .hellopack-input-submit .hellopack-password-holder>svg {
    height: 40px
}

#hellopack .hellopack-input-submit button {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    min-height: 40px;
    padding: 4px 18px;
    border: 0;
    border-radius: 0 4px 4px 0;
    vertical-align: top
}

#hellopack .hellopack-select-apply {
    display: inline-block;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

#hellopack .hellopack-select-apply select,
#hellopack .hellopack-select-apply .hellopack-select,
#hellopack .hellopack-select-apply .hellopack-select-wrapper {
    height: 40px;
    max-height: 40px;
    border-radius: 4px 0 0 4px;
    font-weight: bold;
    text-transform: uppercase
}

#hellopack .hellopack-select-apply select .hellopack-select-placeholder,
#hellopack .hellopack-select-apply .hellopack-select .hellopack-select-placeholder,
#hellopack .hellopack-select-apply .hellopack-select-wrapper .hellopack-select-placeholder {
    font-weight: bold
}

#hellopack .hellopack-select-apply button {
    -webkit-box-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-radius: 0 4px 4px 0;
    font-weight: 600;
    text-transform: uppercase
}

#hellopack .hellopack-select-apply:after {
    content: "";
    display: block;
    clear: both
}

#hellopack .hellopack-select-apply .hellopack-select-open .hellopack-select {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

#hellopack .hellopack-select-apply .hellopack-select-open .hellopack-select.hellopack-select-top-position {
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

#hellopack .hellopack-upload-file,
#hellopack .hellopack-input-submit {
    display: inline-block;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 360px
}

#hellopack .hellopack-upload-file [type="file"],
#hellopack .hellopack-input-submit [type="file"] {
    display: none
}

#hellopack .hellopack-upload-file input,
#hellopack .hellopack-upload-file .hellopack-password-holder,
#hellopack .hellopack-input-submit input,
#hellopack .hellopack-input-submit .hellopack-password-holder {
    position: relative;
    width: 100%;
    min-width: 80px;
    border-radius: 4px 0 0 4px;
    vertical-align: top
}

#hellopack .hellopack-upload-file button,
#hellopack .hellopack-input-submit button {
    -webkit-box-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    height: 32px;
    padding: 4px 18px;
    border: 0;
    border-radius: 0 4px 4px 0;
    vertical-align: top
}

#hellopack .hellopack-upload-file button {
    font-size: 13px
}

@media screen and (max-width: 782px) {
    #wpbody select.hellopack-select {
        height: 32px;
        max-height: 32px
    }
}

.hellopack-sr-only {
    position: absolute !important;
    overflow: hidden !important;
    height: 1px !important;
    width: 1px !important;
    padding: 0 !important;
    border: 0 !important;
    opacity: 0.01 !important;
    white-space: nowrap !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    -webkit-clip-path: inset(50%) !important;
    clip-path: inset(50%) !important
}

#hellopack .hellopack-dialog-overlay {
    position: fixed;
    z-index: 99999;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    opacity: 0;
    background-color: rgba(40, 54, 70, 0.4);
    -webkit-transition: opacity .2s ease;
    transition: opacity .2s ease
}

#hellopack .hellopack-dialog-overlay.hellopack-show {
    opacity: 1
}

#hellopack .hellopack-dialog-overlay.hellopack-show .hellopack-dialog {
    -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
    transform: translateX(-50%) translateY(-50%) scale(1)
}

#hellopack .hellopack-dialog-overlay .hellopack-dialog {
    position: absolute;
    display: block;
    width: 420px;
    max-width: 100%;
    height: auto;
    padding: 40px;
    left: 50%;
    top: 50%;
    border-radius: 4px;
    background: white;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    -webkit-transform: translateX(-50%) translateY(-50%) scale(1.2);
    transform: translateX(-50%) translateY(-50%) scale(1.2);
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

#hellopack .hellopack-dialog-overlay .hellopack-dialog h3 {
    font-size: 18px
}

#hellopack .hellopack-dialog-overlay .hellopack-dialog span {
    position: relative;
    display: block;
    font-size: 16px;
    line-height: 20px;
    margin: 0 0 42px 0
}

#hellopack .hellopack-dialog-overlay .hellopack-dialog div {
    text-align: right
}

#hellopack .hellopack-dialog-overlay .hellopack-dialog .hellopack-dialog-cancel {
    margin: 0 16px 0 0;
    background-color: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: red
}

.hellopack-popup {
    position: fixed;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 99999;
    padding: 24px 0;
    bottom: 0;
    right: 0;
    left: 160px;
    margin: 0 auto;
    min-width: 233px;
    text-align: center;
    max-width: 308px;
    opacity: 0;
    visibility: hidden;
    background-color: #ffffff;
    will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: none;
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    border-radius: 4px 4px 0 0;
    will-change: opacity, transform;
    -webkit-transform-origin: 50% 100% 0;
    transform-origin: 50% 100% 0;
    -webkit-transform: translate(0, 100px);
    transform: translate(0, 100px);
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out
}

.hellopack-popup .hellopack-popup-icon {
    position: relative;
    width: 48px;
    height: 48px
}

.hellopack-popup.hellopack-show {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
}

.hellopack-popup.hellopack-loading .hellopack-popup-icon {
    outline: 1px solid transparent;
    border-radius: 50%;
    border-width: 3px;
    border-right-style: solid;
    border-top-style: solid;
    border-bottom-style: solid;
    border-color: #eef2f5;
    border-left: 3px solid #3273dc;
    -webkit-animation: hellopack-keyframes-rotate 1.1s infinite linear;
    animation: hellopack-keyframes-rotate 1.1s infinite linear
}

.hellopack-popup.hellopack-success {
    background-color: #eefbf5
}

.hellopack-popup.hellopack-success .hellopack-popup-icon {
    border: 3px #b9edd6 solid;
    border-radius: 50%
}

.hellopack-popup.hellopack-success .hellopack-popup-icon:after {
    content: "";
    position: absolute;
    left: 14px;
    top: 6px;
    height: 20px;
    width: 12px;
    border: solid #23d160;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.hellopack-popup.hellopack-error {
    background-color: #fff6f7
}

.hellopack-popup.hellopack-error .hellopack-popup-icon {
    border: 3px #fdd3d7 solid;
    border-radius: 50%
}

.hellopack-popup.hellopack-error .hellopack-popup-icon:before,
.hellopack-popup.hellopack-error .hellopack-popup-icon:after {
    content: "";
    position: absolute;
    left: 20px;
    top: 7px;
    height: 28px;
    width: 3px;
    background-color: #ff3960
}

.hellopack-popup.hellopack-error .hellopack-popup-icon:before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.hellopack-popup.hellopack-error .hellopack-popup-icon:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.hellopack-popup .hellopack-popup-msg {
    position: relative;
    display: inline-block;
    padding: 24px 24px 0 24px;
    line-height: 20px;
    font-size: 14px;
    font-weight: 600;
    color: #162134
}

body.folded .hellopack-popup {
    left: 36px
}

@media only screen and (max-width: 960px) {
    body.auto-fold .hellopack-popup {
        left: 0
    }
}

.hellopack-tooltip {
    position: absolute;
    display: block;
    visibility: hidden;
    pointer-events: none;
    z-index: 9999;
    top: 0;
    left: 0;
    max-width: 320px;
    padding: 4px 12px;
    background: rgba(37, 56, 88, 0.9);
    color: white;
    border-radius: 4px;
    opacity: 0;
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    -webkit-transform: translate(0, -10px);
    transform: translate(0, -10px);
    -webkit-transition: -webkit-transform .15s ease-in-out, opacity .15s ease-in-out, visibility .15s ease-in-out;
    -webkit-transition: opacity .15s ease-in-out, visibility .15s ease-in-out, -webkit-transform .15s ease-in-out;
    transition: opacity .15s ease-in-out, visibility .15s ease-in-out, -webkit-transform .15s ease-in-out;
    transition: transform .15s ease-in-out, opacity .15s ease-in-out, visibility .15s ease-in-out;
    transition: transform .15s ease-in-out, opacity .15s ease-in-out, visibility .15s ease-in-out, -webkit-transform .15s ease-in-out
}

.hellopack-tooltip.hellopack-tooltip-large {
    max-width: 300px;
    padding: 8px 16px
}

.hellopack-tooltip span {
    content: "";
    position: absolute;
    left: 50%;
    left: 50%;
    top: 100%;
    margin: 0 0 0 -6px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 5px solid rgba(37, 56, 88, 0.9)
}

.hellopack-tooltip span.top {
    top: -5px;
    border-top: none;
    border-bottom: 5px solid rgba(37, 56, 88, 0.9)
}

.hellopack-tooltip.hellopack-show {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
}

.hellopack-dragging [data-tooltip],
.hellopack-resizing [data-tooltip] {
    pointer-events: none
}

@-webkit-keyframes hellopack-keyframes-translateX {
    100% {
        -webkit-transform: translate(100%, 0) skewX(-20deg)
    }
}

@keyframes hellopack-keyframes-translateX {
    100% {
        -webkit-transform: translate(100%, 0) skewX(-20deg);
        transform: translate(100%, 0) skewX(-20deg)
    }
}

@-webkit-keyframes hellopack-keyframes-from-right {
    0% {
        opacity: 0;
        -webkit-transform: translate(20px, 0)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0)
    }
}

@keyframes hellopack-keyframes-from-right {
    0% {
        opacity: 0;
        -webkit-transform: translate(20px, 0);
        transform: translate(20px, 0)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
}

@-webkit-keyframes hellopack-keyframes-zoom-out {
    0% {
        opacity: 0;
        -webkit-transform: scale(1)
    }

    1% {
        opacity: 0;
        -webkit-transform: scale(0.8)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1)
    }
}

@keyframes hellopack-keyframes-zoom-out {
    0% {
        opacity: 0;
        -webkit-transform: scale(1)
    }

    1% {
        opacity: 0;
        -webkit-transform: scale(0.8);
        transform: scale(0.8)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1)
    }
}

@-webkit-keyframes hellopack-keyframes-rotate {
    0% {
        -webkit-transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes hellopack-keyframes-rotate {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes hellopack-keyframes-fading {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes hellopack-keyframes-fading {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes hellopack-keyframes-loading {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0.9
    }

    100% {
        opacity: 1
    }
}

@keyframes hellopack-keyframes-loading {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0.9
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes hellopack-keyframes-reveal {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes hellopack-keyframes-reveal {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes hellopack-keyframes-from-top {
    0% {
        opacity: 0;
        -webkit-transform: translate(0, -12px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0)
    }
}

@keyframes hellopack-keyframes-from-top {
    0% {
        opacity: 0;
        -webkit-transform: translate(0, -12px);
        transform: translate(0, -12px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
}

@-webkit-keyframes hellopack-keyframes-from-bottom {
    0% {
        opacity: 0;
        -webkit-transform: translate(0, 12px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0)
    }
}

@keyframes hellopack-keyframes-from-bottom {
    0% {
        opacity: 0;
        -webkit-transform: translate(0, 12px);
        transform: translate(0, 12px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
}

@-webkit-keyframes hellopack-dash {
    to {
        stroke-dashoffset: 0
    }
}

@keyframes hellopack-dash {
    to {
        stroke-dashoffset: 0
    }
}

#hellopack .hellopack-status-table .hellopack-list-table-column:first-child {
    max-width: 200px
}

#hellopack .hellopack-status-table [role="tooltip"] {
    position: relative;
    display: inline-block;
    width: 16px;
    height: 20px;
    cursor: pointer;
    color: #687a9a;
    -webkit-transition: color 0.3s ease-in-out;
    transition: color 0.3s ease-in-out
}

#hellopack .hellopack-status-table [role="tooltip"]:hover {
    color: #3273dc
}

#hellopack .hellopack-status-table [role="tooltip"]+span {
    padding: 0 5px
}

#hellopack .hellopack-status-table [role="tooltip"] svg {
    height: 20px;
    width: 16px;
    vertical-align: top;
    stroke-width: 1.5;
    overflow: visible
}

@media screen and (max-width: 480px) {
    .hellopack-status-table .hellopack-list-table-column:first-child {
        display: none
    }
}

#hellopack .hellopack-plugin-info {
    margin: 0;
    padding: 0;
    list-style-type: none
}

#hellopack .hellopack-plugin-info li div:first-child {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    width: 42px;
    min-width: 42px;
    max-width: 42px;
    text-align: center
}

#hellopack .hellopack-plugin-info li div:first-child svg {
    width: 16px;
    height: 20px;
    vertical-align: top
}

#hellopack .hellopack-plugin-info li div:nth-child(2) {
    font-weight: 600
}

#hellopack .hellopack-plugin-info li div:nth-child(3) {
    font-weight: 600
}

#hellopack .hellopack-plugin-info li .hellopack-button {
    margin: -6px 0 0
}

#hellopack .hellopack-admin-panel .hellopack-notice {
    margin: 32px 0 0 0
}

/*

#hellopack .hellopack-admin-panel [data-method="refresh_status"] {
    position: absolute;
    top: 60px;
    right: 60px
}

#hellopack .hellopack-admin-panel [data-method="refresh_status"]~a {
    margin: 40px 0 0
}

*/

#hellopack .hellopack-admin-panel .hellopack-password-holder,
#hellopack .hellopack-admin-panel .hellopack-input-submit-wrapper,
#hellopack .hellopack-admin-panel input[name="license_email"] {
    position: relative;
    display: inline-block;
    width: 300px;
    max-width: 100%
}

#hellopack .hellopack-admin-panel .hellopack-input-submit-wrapper {
    text-align: center
}

#hellopack .hellopack-admin-panel .hellopack-input-submit-wrapper input {
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    cursor: pointer;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap
}

#hellopack .hellopack-admin-panel .hellopack-input-submit-wrapper:focus-within {
    -webkit-box-shadow: inset 0 0 0, 0 0 0 4px rgba(108, 117, 125, 0.15);
    box-shadow: inset 0 0 0, 0 0 0 4px rgba(108, 117, 125, 0.15)
}

#hellopack .hellopack-admin-panel [data-method="activate_plugin"] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background: unset !important;
    padding: unset !important;
    margin: unset !important;
    line-height: unset !important;
    max-height: unset !important;
    height: unset !important;
    width: unset !important;
    max-width: unset !important
}

#hellopack .hellopack-admin-panel [data-method="deactivate_plugin"] {
    margin-top: 40px
}

#hellopack .hellopack-admin-panel [data-method="deactivate_plugin"]+a {
    margin: 40px 8px 0
}

@media screen and (max-width: 782px) {
    #hellopack .hellopack-admin-panel [data-method="refresh_status"] {
        display: none
    }

    #hellopack .hellopack-admin-panel .hellopack-plugin-info li div:nth-child(4) {
        display: none
    }
}

@media screen and (max-width: 480px) {

    #hellopack .hellopack-admin-panel [data-method="deactivate_plugin"]+a,
    #hellopack .hellopack-admin-panel .hellopack-plugin-info li div:nth-child(2) {
        display: none
    }
}

#hellopack .hellopack-preloader {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 9999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

#hellopack .hellopack-preloader svg {
    width: 100px;
    height: 100px;
    fill: none;
    stroke: #3273dc;
    stroke-width: 20px;
    stroke-dasharray: 1870;
    stroke-dashoffset: 3800;
    overflow: visible;
    -webkit-animation: hellopack-dash 2s linear infinite;
    animation: hellopack-dash 2s linear infinite
}

#hellopack .hellopack-preloader svg * {
    fill: none
}

#hellopack .hellopack-preloader span {
    position: relative;
    margin: 32px 32px;
    color: #162134;
    font-size: 22px;
    font-weight: bold;
    line-height: 28px;
    -webkit-animation: hellopack-keyframes-fading 1s infinite;
    animation: hellopack-keyframes-fading 1s infinite
}

#hellopack .hellopack-toggle {
    position: relative;
    display: block;
    height: 30px;
    width: 68px;
    margin: 1px 0
}

#hellopack .hellopack-toggle:before {
    content: "";
    position: absolute;
    z-index: 2;
    left: 16px;
    top: 10px;
    height: 12px;
    width: 2px;
    background: white;
    opacity: 0.5;
    pointer-events: none
}

#hellopack .hellopack-toggle span {
    display: block;
    position: relative;
    z-index: 0;
    height: 100%;
    width: 100%;
    border-radius: 4px;
    pointer-events: none;
    background-color: #f4f8fb;
    -webkit-transition: background-color 200ms cubic-bezier(0.445, 0.05, 0.55, 0.95), -webkit-box-shadow 0.3s ease;
    transition: background-color 200ms cubic-bezier(0.445, 0.05, 0.55, 0.95), -webkit-box-shadow 0.3s ease;
    transition: box-shadow 0.3s ease, background-color 200ms cubic-bezier(0.445, 0.05, 0.55, 0.95);
    transition: box-shadow 0.3s ease, background-color 200ms cubic-bezier(0.445, 0.05, 0.55, 0.95), -webkit-box-shadow 0.3s ease
}

#hellopack .hellopack-toggle span:before,
#hellopack .hellopack-toggle span:after {
    content: "";
    position: absolute
}

#hellopack .hellopack-toggle span:before {
    opacity: 0.5;
    top: 10px;
    height: 8px;
    width: 8px;
    right: 10px;
    border: 2px solid #a2b0c1;
    border-radius: 6px;
    color: #a2b0c1;
    pointer-events: none;
    -webkit-transition: opacity 200ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: opacity 200ms cubic-bezier(0.68, -0.55, 0.265, 1.55)
}

#hellopack .hellopack-toggle span:after {
    left: 4px;
    top: 4px;
    height: 22px;
    width: 32px;
    background-color: #ffffff;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 -1px 0px rgba(0, 0, 0, 0.1), 1px 1px 3px rgba(14, 21, 47, 0.1), 0 0 0 1px rgba(147, 154, 170, 0.1);
    box-shadow: inset 0 -1px 0px rgba(0, 0, 0, 0.1), 1px 1px 3px rgba(14, 21, 47, 0.1), 0 0 0 1px rgba(147, 154, 170, 0.1);
    pointer-events: none;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275), width 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -webkit-transition: width 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: width 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275), width 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275), width 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275)
}

#hellopack .hellopack-toggle input {
    position: absolute;
    display: block;
    z-index: 1;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    opacity: 0
}

#hellopack .hellopack-toggle input:focus+span,
#hellopack .hellopack-toggle input:hover+span {
    background-color: #e0e4e9
}

#hellopack .hellopack-toggle input:active+span:after {
    -webkit-box-shadow: 1px 1px 1px rgba(14, 21, 47, 0.05);
    box-shadow: 1px 1px 1px rgba(14, 21, 47, 0.05);
    -webkit-transform: scale(0.9);
    transform: scale(0.9)
}

#hellopack .hellopack-toggle input:checked+span {
    background-color: #3273dc
}

#hellopack .hellopack-toggle input:checked+span:before {
    opacity: 0
}

#hellopack .hellopack-toggle input:checked+span:after {
    -webkit-transform: translateX(28px);
    transform: translateX(28px)
}

#hellopack .hellopack-toggle input:checked:active+span:after {
    -webkit-box-shadow: 1px 1px 1px rgba(14, 21, 47, 0.05);
    box-shadow: 1px 1px 1px rgba(14, 21, 47, 0.05);
    -webkit-transform: translateX(28px) scale(0.9);
    transform: translateX(28px) scale(0.9)
}

#hellopack .hellopack-toggle input:checked:focus+span {
    -webkit-box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15);
    box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15)
}

#hellopack .hellopack-checkbox-list {
    margin: 0
}

#hellopack .hellopack-checkbox-item {
    margin: 0 0 8px 0;
    height: 32px
}

#hellopack .hellopack-checkbox-item input {
    display: none
}

#hellopack .hellopack-checkbox-item input:hover+label svg,
#hellopack .hellopack-checkbox-item input:checked+label svg {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack .hellopack-checkbox-item input:checked+label svg {
    color: #3273dc
}

#hellopack .hellopack-checkbox-item label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    width: 32px;
    height: 32px;
    padding: 8px;
    background-color: #f4f8fb;
    border-radius: 4px;
    -webkit-transition: all .3s;
    transition: all .3s
}

#hellopack .hellopack-checkbox-item label:hover {
    background-color: #e0e4e9
}

#hellopack .hellopack-checkbox-item label svg {
    display: block;
    width: 16px;
    height: 16px;
    opacity: 0;
    color: #53627C;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    -webkit-transition: all .3s;
    transition: all .3s
}

#hellopack .hellopack-checkbox-item label span {
    position: absolute;
    display: inline-block;
    vertical-align: top;
    top: 0;
    left: 40px;
    line-height: 32px;
    font-weight: 600
}

#hellopack .hellopack-checkbox-list .hellopack-list-item input:hover+label svg.hellopack-check-icon {
    opacity: 1
}

#hellopack .hellopack-checkbox-list .hellopack-list-item input:checked+label {
    border-color: #3273dc;
    background-color: rgba(0, 105, 255, 0.035)
}

#hellopack .hellopack-checkbox-list .hellopack-list-item input:checked+label:not(:hover) svg.hellopack-check-icon {
    color: #3273dc
}

#hellopack .hellopack-checkbox-list .hellopack-list-item input:focus+label {
    -webkit-box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15);
    box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15)
}

#hellopack .hellopack-select-wrapper {
    position: relative;
    display: inline-block;
    max-width: 100%;
    vertical-align: top
}

#hellopack .hellopack-select-wrapper>select {
    position: relative;
    pointer-events: none
}

#hellopack .hellopack-select-wrapper>select[multiple] {
    position: relative;
    display: block;
    height: 0;
    min-height: 0;
    padding: 0
}

#hellopack .hellopack-select-wrapper .hellopack-select-placeholder {
    position: absolute;
    display: block;
    overflow: hidden;
    height: 32px;
    width: 100%;
    top: 50%;
    margin: -16px 0 0 0;
    padding: 8px 24px 8px 8px;
    font-size: 13px;
    line-height: 16px;
    white-space: nowrap;
    text-overflow: ellipsis
}

#hellopack .hellopack-select-wrapper .hellopack-select-placeholder.hellopack-select-selected {
    color: #4c5866
}

#hellopack .hellopack-select-wrapper .hellopack-select-has-clear+.hellopack-select .hellopack-select-placeholder {
    padding: 8px 44px 8px 8px
}

#hellopack .hellopack-select-wrapper .hellopack-selection {
    position: relative;
    display: block;
    margin: 0;
    padding: 2px 32px 2px 2px;
    list-style-type: none
}

#hellopack .hellopack-select-wrapper .hellopack-selection li {
    position: relative;
    display: inline-block;
    margin: 2px;
    padding: 4px 8px 4px 24px;
    color: white;
    background: #3273dc;
    border-radius: 4px;
    font-size: 13px;
    line-height: 16px;
    cursor: default
}

#hellopack .hellopack-select-wrapper .hellopack-selection li span {
    position: absolute;
    top: 50%;
    left: 8px;
    width: 10px;
    height: 10px;
    margin: -5px 0 0 0;
    cursor: pointer;
    -webkit-transition: opacity .15s ease;
    transition: opacity .15s ease
}

#hellopack .hellopack-select-wrapper .hellopack-selection li span:before,
#hellopack .hellopack-select-wrapper .hellopack-selection li span:after {
    content: "";
    position: absolute;
    height: 2px;
    width: 100%;
    top: 50%;
    left: 0;
    margin-top: -1px;
    background: white
}

#hellopack .hellopack-select-wrapper .hellopack-selection li span:before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

#hellopack .hellopack-select-wrapper .hellopack-selection li span:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

#hellopack .hellopack-select-wrapper .hellopack-selection li span:hover {
    opacity: 0.8
}

#hellopack .hellopack-select-wrapper div.hellopack-select {
    position: absolute;
    display: block;
    top: 0;
    min-height: 32px;
    width: 100%;
    margin: 0;
    padding: 0;
    font-weight: 600;
    line-height: normal;
    background-color: #f4f8fb;
    border-radius: 4px;
    cursor: pointer;
    -webkit-transition: background-color .3s ease-in-out, opacity .3s ease-in-out;
    transition: background-color .3s ease-in-out, opacity .3s ease-in-out
}

#hellopack .hellopack-select-wrapper div.hellopack-select:after {
    content: "";
    position: absolute;
    height: 16px;
    width: 16px;
    right: 16px;
    top: 50%;
    margin: -8px -8px 0 0;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill%3D%22%2353627C%22%20d%3D%22M8%2011.4L2.6%206%204%204.6l4%204%204-4L13.4%206z%22%3E%3C/path%3E%3C/svg%3E")
}

#hellopack .hellopack-select-wrapper div.hellopack-select:hover {
    background-color: #e0e4e9
}

#hellopack .hellopack-select-wrapper select.hellopack-select:hover+div.hellopack-select,
#hellopack .hellopack-select-wrapper select.hellopack-select:focus+div.hellopack-select,
#hellopack .hellopack-select-wrapper select.hellopack-select:active+div.hellopack-select {
    background-color: #e0e4e9
}

#hellopack .hellopack-select-wrapper select[multiple]+div.hellopack-select {
    position: relative
}

#hellopack .hellopack-select-wrapper.hellopack-select-open .hellopack-select {
    background-color: #e0e4e9;
    border-radius: 4px 4px 0 0
}

#hellopack .hellopack-select-wrapper.hellopack-select-open .hellopack-select:after {
    z-index: 10000;
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

#hellopack .hellopack-select-wrapper.hellopack-select-open .hellopack-select.hellopack-select-top-position {
    border-radius: 0 0 4px 4px
}

#hellopack .hellopack-select-wrapper .hellopack-select-clear {
    position: absolute;
    top: 50%;
    right: 28px;
    width: 10px;
    height: 10px;
    margin: -5px 0 0 0;
    cursor: pointer
}

#hellopack .hellopack-select-wrapper .hellopack-select-clear:before,
#hellopack .hellopack-select-wrapper .hellopack-select-clear:after {
    content: "";
    position: absolute;
    height: 1.75px;
    width: 100%;
    top: 50%;
    left: 0;
    margin-top: -1px;
    background: #53627C;
    will-change: opacity;
    -webkit-transition: background .15s ease;
    transition: background .15s ease
}

#hellopack .hellopack-select-wrapper .hellopack-select-clear:hover:before,
#hellopack .hellopack-select-wrapper .hellopack-select-clear:hover:after {
    background: #ff3960
}

#hellopack .hellopack-select-wrapper .hellopack-select-clear:before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

#hellopack .hellopack-select-wrapper .hellopack-select-clear:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.hellopack-select-container {
    position: absolute;
    display: block;
    overflow: hidden;
    z-index: 9999;
    top: 0;
    left: 0;
    background-color: white;
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    border-radius: 0 0 4px 4px;
    font-family: 'Open Sans', sans-serif
}

.hellopack-select-container.hellopack-select-top-position {
    -webkit-box-shadow: 0 -8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 -8px 20px 0 rgba(14, 21, 47, 0.1);
    border-radius: 4px 4px 0 0
}

.hellopack-select-container.hellopack-select-has-search {
    padding: 32px 0 0 0
}

.hellopack-select-container.hellopack-select-has-search:not(.hellopack-select-multiple) {
    border-radius: 4px
}

.hellopack-select-container.hellopack-select-has-search.hellopack-select-top-position {
    padding: 0 0 32px 0
}

.hellopack-select-container .hellopack-select-search {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 32px;
    margin: 0;
    padding: 8px 16px 8px 30px;
    background-color: #e0e4e9;
    color: #162134;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.hellopack-select-container .hellopack-select-icon {
    position: absolute;
    top: 10px;
    left: 8px;
    fill: #3273dc
}

.hellopack-select-container.hellopack-select-top-position .hellopack-select-search {
    top: auto;
    bottom: 0
}

.hellopack-select-container.hellopack-select-top-position .hellopack-select-icon {
    top: auto;
    bottom: 8px
}

.hellopack-select-container .hellopack-select-results {
    overflow: auto;
    max-height: 256px;
    margin: 0;
    list-style-type: none
}

.hellopack-select-container .hellopack-select-results li {
    position: relative;
    color: #53627C;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    list-style-type: none;
    margin: 0;
    padding: 8px 16px;
    cursor: pointer;
    -webkit-transition: all .15s ease-in-out;
    transition: all .15s ease-in-out
}

.hellopack-select-container .hellopack-select-results li:not(.hellopack-select-message) {
    word-break: break-word
}

.hellopack-select-container .hellopack-select-results li.hellopack-select-group {
    padding: 0
}

.hellopack-select-container .hellopack-select-results li.hellopack-select-group strong {
    position: relative;
    display: block;
    margin: 0;
    padding: 16px 16px 8px;
    border-bottom: 2px solid #f4f8fb;
    color: #162134;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase
}

.hellopack-select-container .hellopack-select-results li.hellopack-select-group li {
    padding: 8px 24px
}

.hellopack-select-container .hellopack-select-results li.hellopack-select-option:not(.hellopack-select-disabled):not(.hellopack-selected):hover {
    color: #162134;
    background-color: #f4f8fb;
    font-weight: 600
}

.hellopack-select-container .hellopack-select-results li.hellopack-select-option.hellopack-selected {
    color: #3273dc;
    background: #f4f8fb
}

.hellopack-select-container .hellopack-select-results li.hellopack-select-option.hellopack-select-disabled {
    opacity: 0.5;
    cursor: default;
    text-decoration: line-through
}

.hellopack-select-container .hellopack-select-results .hellopack-select-message {
    color: #53627C;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    text-align: center
}

.hellopack-select-container ::-webkit-scrollbar {
    width: 8px
}

.hellopack-select-container ::-webkit-scrollbar-button {
    width: 0;
    height: 0
}

.hellopack-select-container ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.3)
}

.hellopack-select-container ::-webkit-scrollbar-thumb {
    background: #53627C
}

.hellopack-select-container[id="hellopack-select-hellopack[user__in][]"] .hellopack-select-option,
.hellopack-select-container[id="hellopack-select-hellopack[user__not_in][]"] .hellopack-select-option,
.hellopack-select-container[id="hellopack-select-hellopack[author__in][]"] .hellopack-select-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

.hellopack-select-container[id="hellopack-select-hellopack[user__in][]"] .hellopack-select-option img,
.hellopack-select-container[id="hellopack-select-hellopack[user__not_in][]"] .hellopack-select-option img,
.hellopack-select-container[id="hellopack-select-hellopack[author__in][]"] .hellopack-select-option img {
    width: 32px;
    height: 32px;
    background-color: #e0e4e9;
    border-radius: 4px
}

.hellopack-select-container[id="hellopack-select-hellopack[user__in][]"] .hellopack-select-option .hellopack-author-detail,
.hellopack-select-container[id="hellopack-select-hellopack[user__not_in][]"] .hellopack-select-option .hellopack-author-detail,
.hellopack-select-container[id="hellopack-select-hellopack[author__in][]"] .hellopack-select-option .hellopack-author-detail {
    margin: 0 8px;
    top: 8px;
    left: 56px;
    right: 0
}

.hellopack-select-container[id="hellopack-select-hellopack[user__in][]"] .hellopack-select-option .hellopack-author-detail .hellopack-user-name,
.hellopack-select-container[id="hellopack-select-hellopack[user__in][]"] .hellopack-select-option .hellopack-author-detail .hellopack-user-role,
.hellopack-select-container[id="hellopack-select-hellopack[user__not_in][]"] .hellopack-select-option .hellopack-author-detail .hellopack-user-name,
.hellopack-select-container[id="hellopack-select-hellopack[user__not_in][]"] .hellopack-select-option .hellopack-author-detail .hellopack-user-role,
.hellopack-select-container[id="hellopack-select-hellopack[author__in][]"] .hellopack-select-option .hellopack-author-detail .hellopack-user-name,
.hellopack-select-container[id="hellopack-select-hellopack[author__in][]"] .hellopack-select-option .hellopack-author-detail .hellopack-user-role {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.hellopack-select-container[id="hellopack-select-hellopack[user__in][]"] .hellopack-select-option .hellopack-author-detail .hellopack-user-role,
.hellopack-select-container[id="hellopack-select-hellopack[user__not_in][]"] .hellopack-select-option .hellopack-author-detail .hellopack-user-role,
.hellopack-select-container[id="hellopack-select-hellopack[author__in][]"] .hellopack-select-option .hellopack-author-detail .hellopack-user-role {
    padding: 2px 0 0 0;
    font-size: 12px;
    font-style: italic;
    font-weight: 400;
    line-height: 13px
}

.hellopack-select-container[id="hellopack-select-hellopack[user__in][]"] .hellopack-select-option.hellopack-select-option .hellopack-user-role,
.hellopack-select-container[id="hellopack-select-hellopack[user__not_in][]"] .hellopack-select-option.hellopack-select-option .hellopack-user-role,
.hellopack-select-container[id="hellopack-select-hellopack[author__in][]"] .hellopack-select-option.hellopack-select-option .hellopack-user-role {
    color: #53627C
}

.hellopack-select-container[id="hellopack-select-hellopack[post__not_in][]"] .hellopack-select-option span span,
.hellopack-select-container[id="hellopack-select-hellopack[tax_query][]"] .hellopack-select-option span span,
.hellopack-select-container[id="hellopack-select-hellopack[parent]"] .hellopack-select-option span span,
.hellopack-select-container[id="hellopack-select-hellopack[include][]"] .hellopack-select-option span span,
.hellopack-select-container[id="hellopack-select-hellopack[exclude][]"] .hellopack-select-option span span,
.hellopack-select-container[id="hellopack-select-hellopack[post__in][]"] .hellopack-select-option span span,
.hellopack-select-container[id="hellopack-select-hellopack[term__not_in][]"] .hellopack-select-option span span,
.hellopack-select-container[id="hellopack-select-hellopack[term__in][]"] .hellopack-select-option span span {
    font-size: 12px;
    font-weight: 400;
    font-style: italic
}

.hellopack-select-container .hellopack-select-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.hellopack-select-container .hellopack-select-option svg.hellopack-facet-icon {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 14px;
    height: 16px;
    width: 16px;
    vertical-align: top;
    stroke-width: 1.5;
    overflow: visible;
    margin: 0 8px 0 0
}

.hellopack-disable-scroll {
    pointer-events: none
}

.hellopack-disable-scroll * {
    pointer-events: auto
}

#hellopack input.hellopack-radio+label {
    position: relative;
    display: inline-block;
    height: 32px;
    padding: 8px;
    background-color: #f4f8fb;
    border-radius: 4px;
    color: #53627C;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    -webkit-transition: background-color .3s ease-out, color .3s ease-out;
    transition: background-color .3s ease-out, color .3s ease-out
}

#hellopack input.hellopack-radio+label:hover {
    color: #4c5866;
    background-color: #e0e4e9
}

#hellopack input.hellopack-radio:checked+label {
    background-color: #3273dc;
    color: white
}

#hellopack input.hellopack-radio:focus+label {
    -webkit-box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15);
    box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15)
}

#hellopack .hellopack-radio-list {
    position: relative;
    margin: -4px
}

#hellopack .hellopack-radio-list .hellopack-radio-item {
    position: relative;
    display: inline-block;
    margin: 4px
}

#hellopack .hellopack-radio-list .hellopack-list-item input:checked+label {
    border-color: #3273dc;
    background-color: rgba(0, 105, 255, 0.035)
}

#hellopack .hellopack-radio-list .hellopack-list-item input:checked+label:after {
    background-color: #3273dc
}

#hellopack .hellopack-radio-list .hellopack-list-item input:focus+label {
    -webkit-box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15);
    box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15)
}

#hellopack .wp-picker-container {
    position: relative !important;
    display: block !important;
    margin-bottom: -32px !important
}

#hellopack input.wp-color-picker {
    position: absolute !important;
    z-index: 2 !important;
    top: 4px !important;
    left: 4px !important;
    height: 20px !important;
    width: 64px !important;
    min-width: 40px !important;
    padding: 2px 8px !important;
    margin: 0 !important;
    color: #fff !important;
    background-color: rgba(14, 21, 47, 0.5) !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    line-height: 16px !important;
    text-transform: uppercase !important;
    -webkit-transition: opacity .2s ease, -webkit-transform .2s ease;
    transition: opacity .2s ease, -webkit-transform .2s ease;
    transition: opacity .2s ease, transform .2s ease;
    transition: opacity .2s ease, transform .2s ease, -webkit-transform .2s ease
}

#hellopack .iris-strip,
#hellopack .wp-picker-input-wrap input,
#hellopack .iris-palette-container {
    will-change: opacity, transform;
    -webkit-transition: opacity .2s ease, -webkit-transform .2s ease;
    transition: opacity .2s ease, -webkit-transform .2s ease;
    transition: opacity .2s ease, transform .2s ease;
    transition: opacity .2s ease, transform .2s ease, -webkit-transform .2s ease
}

#hellopack .hellopack-color.is-dragging .iris-strip,
#hellopack .hellopack-color.is-dragging .wp-picker-input-wrap input,
#hellopack .hellopack-color.is-dragging .iris-palette-container {
    opacity: 0 !important;
    -webkit-transform: scale(0.75);
    transform: scale(0.75)
}

#hellopack .iris-picker.iris-border {
    z-index: auto !important;
    margin: 0 !important;
    width: 100% !important;
    border: none !important
}

#hellopack .iris-border .iris-picker-inner {
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    bottom: 0 !important
}

#hellopack .iris-square {
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    border-radius: 5px !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

#hellopack .iris-square .iris-square-inner {
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

#hellopack .iris-picker {
    height: 190px !important;
    padding: 0 !important
}

#hellopack .iris-picker .iris-square-handle {
    width: 26px !important;
    height: 26px !important;
    border-color: rgba(128, 128, 128, 0.2) !important;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
    opacity: 1 !important
}

#hellopack .iris-picker .iris-square-handle:after {
    border-width: 4px !important;
    border-color: white !important
}

#hellopack .wp-picker-container .iris-strip {
    position: absolute !important;
    top: 32px !important;
    right: 40px !important;
    width: 8px !important;
    height: 116px !important;
    margin: 0 !important;
    border-radius: 10px !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
    background-color: white !important
}

#hellopack .wp-picker-container .iris-strip .iris-slider-offset .ui-slider-handle {
    width: 13px !important;
    height: 13px !important;
    left: -3px !important;
    background-color: white !important;
    border: none !important;
    border-radius: 10px !important;
    -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2) !important;
    -webkit-transition: box-shadow .5s ease;
    -webkit-transition: -webkit-box-shadow .5s ease;
    transition: -webkit-box-shadow .5s ease;
    transition: box-shadow .5s ease;
    transition: box-shadow .5s ease, -webkit-box-shadow .5s ease
}

#hellopack .wp-picker-container .iris-strip .iris-slider-offset .ui-slider-handle:before {
    border: none !important
}

#hellopack .wp-picker-container .iris-alpha-slider {
    right: 20px !important
}

#hellopack .wp-picker-container .iris-alpha-slider .iris-alpha-slider-bg {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    border-radius: 10px
}

#hellopack .hellopack-color-position-left .wp-picker-container .iris-strip {
    right: auto !important;
    left: 46px !important
}

#hellopack .hellopack-color-position-left .wp-picker-container .iris-alpha-slider {
    right: auto !important;
    left: 20px !important
}

#hellopack .hellopack-color-position-left input.wp-color-picker {
    left: auto !important;
    right: 5px !important
}

#hellopack .iris-picker .iris-palette-container {
    left: 0 !important;
    bottom: -12px !important;
    width: 100% !important;
    margin: 0 2.5px !important;
    text-align: center !important
}

#hellopack .iris-picker .iris-palette-container .iris-palette {
    display: inline-block !important;
    float: none !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 4px !important;
    border-radius: 100% !important;
    -webkit-box-shadow: 0 0 10px 0 rgba(14, 21, 47, 0.5) !important;
    box-shadow: 0 0 10px 0 rgba(14, 21, 47, 0.5) !important
}

#hellopack .wp-color-result {
    display: none !important
}

#hellopack .hellopack-color {
    max-width: 100%
}

#hellopack .hellopack-color .hellopack-color-picker,
#hellopack .hellopack-color .hellopack-color-clear {
    position: relative;
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    height: 32px;
    margin: 0;
    padding: 8px 12px 8px 47px;
    background-color: #f4f8fb;
    border-radius: 4px;
    color: #4c5866;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    cursor: pointer;
    -webkit-transition: background-color .3s ease-in-out, opacity .3s ease-in-out;
    transition: background-color .3s ease-in-out, opacity .3s ease-in-out
}

#hellopack .hellopack-color .hellopack-color-picker:hover,
#hellopack .hellopack-color .hellopack-color-clear:hover {
    background-color: #e0e4e9
}

#hellopack .hellopack-color .hellopack-color-picker:hover .hellopack-color-picker-input,
#hellopack .hellopack-color .hellopack-color-clear:hover .hellopack-color-picker-input {
    background-color: #e0e4e9
}

#hellopack .hellopack-color .hellopack-color-picker:before {
    content: "";
    position: absolute
}

#hellopack .hellopack-color .hellopack-color-picker .hellopack-color-picker-input {
    position: absolute;
    display: block;
    width: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #f4f8fb;
    border-radius: 4px;
    color: transparent;
    text-indent: -9999px
}

#hellopack .hellopack-color .hellopack-color-picker .hellopack-color-picker-input:hover,
#hellopack .hellopack-color .hellopack-color-picker .hellopack-color-picker-input:focus {
    background-color: #e0e4e9
}

#hellopack .hellopack-color .hellopack-color-picker:before,
#hellopack .hellopack-color .hellopack-color-picker .hellopack-color-picker-preview {
    position: absolute;
    z-index: 2;
    left: 4px;
    top: 4px;
    height: 24px;
    width: 32px;
    border-radius: 4px
}

#hellopack .hellopack-color .hellopack-color-picker .hellopack-color-picker-text {
    position: relative
}

#hellopack .hellopack-color .hellopack-color-clear {
    display: none;
    margin: 0 8px;
    padding: 8px 12px
}

#hellopack .hellopack-color .hellopack-color-holder {
    position: relative;
    display: none;
    width: 300px;
    max-width: 100%;
    margin: 8px 0 50px 0
}

#hellopack .hellopack-color .hellopack-color-inner {
    position: relative
}

#hellopack .hellopack-color .hellopack-gradient-holder {
    position: relative;
    width: 100%;
    margin: 0 0 -20px 0
}

#hellopack .hellopack-color .hellopack-gradient-holder * {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

#hellopack .hellopack-color[data-color-type="gradient"] .wp-picker-container {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    margin-bottom: 0 !important
}

#hellopack .hellopack-color .hellopack-gradient-preview-holder {
    position: relative;
    overflow: hidden;
    height: 190px;
    width: 100%;
    margin: 0;
    border-radius: 4px;
    background-color: #f4f8fb;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

#hellopack .hellopack-color .hellopack-gradient-canvas {
    width: 100%;
    height: 16px;
    background-color: #f4f8fb;
    border-radius: 10px;
    cursor: cell
}

#hellopack .hellopack-color .iris-alpha-slider,
#hellopack .hellopack-color .hellopack-gradient-canvas,
#hellopack .hellopack-color .hellopack-gradient-point-bg,
#hellopack .hellopack-color .hellopack-color-picker:before,
#hellopack .hellopack-color .hellopack-gradient-preview-holder {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAFSOl20AAAABlBMVEXAwMD///8raYe0AAAAJklEQVQI12NoYHBgAOEDDAZADCINGD4AIT8QfoBCfij8z4BASBwAQ+4SQ+mhofkAAAAASUVORK5CYII=");
    background-position: 50% 50%
}

#hellopack .hellopack-color ul.hellopack-color-types {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0 0 8px;
    padding: 0;
    border-radius: 4px
}

#hellopack .hellopack-color ul.hellopack-color-types li {
    display: inline-block;
    overflow: hidden;
    width: 50%;
    margin: 0;
    padding: 8px;
    background-color: #f4f8fb;
    color: #4c5866;
    font-size: 11px;
    font-weight: bold;
    line-height: 16px;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
    vertical-align: top;
    text-overflow: ellipsis;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

#hellopack .hellopack-color ul.hellopack-color-types li:hover {
    color: #3273dc
}

#hellopack .hellopack-color ul.hellopack-color-types li.hellopack-color-type-active {
    color: #3273dc;
    background-color: #e0e4e9
}

#hellopack .hellopack-color ul.hellopack-gradient-types {
    position: relative;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 2px;
    pointer-events: none
}

#hellopack .hellopack-color ul.hellopack-gradient-types li {
    position: relative;
    display: inline-block;
    vertical-align: top;
    height: 20px;
    margin: 2px;
    padding: 5px 6px;
    background-color: rgba(14, 21, 47, 0.4);
    color: white;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    line-height: 10px;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    opacity: 0.8;
    pointer-events: auto;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

#hellopack .hellopack-color ul.hellopack-gradient-types li:hover {
    background-color: rgba(14, 21, 47, 0.7)
}

#hellopack .hellopack-color ul.hellopack-gradient-types li.hellopack-gradient-type-active {
    opacity: 1;
    background-color: rgba(14, 21, 47, 0.7)
}

#hellopack .hellopack-color ul.hellopack-gradient-types li svg {
    width: 10px;
    height: 10px;
    pointer-events: none;
    vertical-align: top
}

#hellopack .hellopack-color ul.hellopack-gradient-types li.hellopack-gradient-reverse {
    margin-left: auto
}

#hellopack .hellopack-color .hellopack-gradient-point-controls {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 4px -2px
}

#hellopack .hellopack-color .hellopack-gradient-point-controls>* {
    position: relative;
    display: inline-block;
    vertical-align: top;
    height: 20px;
    margin: 0 2px;
    padding: 5px 6px;
    background-color: #f4f8fb;
    border-radius: 4px;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    color: #4c5866;
    cursor: pointer;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

#hellopack .hellopack-color .hellopack-gradient-point-controls>*:hover {
    background-color: #e0e4e9
}

#hellopack .hellopack-color .hellopack-gradient-point-controls svg {
    width: 10px;
    height: 10px;
    pointer-events: none;
    vertical-align: top
}

#hellopack .hellopack-color .hellopack-gradient-point-controls .hellopack-gradient-point-position {
    height: 20px;
    width: 44px
}

#hellopack .hellopack-color .hellopack-gradient-point-controls .hellopack-gradient-point-delete {
    margin-left: auto
}

#hellopack .hellopack-color .hellopack-gradient-point-controls .hellopack-gradient-point-color.hellopack-gradient-point-active,
#hellopack .hellopack-color .hellopack-gradient-point-controls .hellopack-gradient-point-delete.hellopack-gradient-point-active {
    color: #3273dc
}

#hellopack .hellopack-color .hellopack-gradient-point-controls .hellopack-gradient-point-color:hover {
    color: #3273dc
}

#hellopack .hellopack-color .hellopack-gradient-point-controls .hellopack-gradient-point-delete:hover {
    color: #ff3960
}

#hellopack .hellopack-color .hellopack-gradient-preview {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: inherit;
    border-radius: 4px
}

#hellopack .hellopack-color .hellopack-gradient-presets-holder {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal;
    -webkit-box-orient: horizontal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    top: 0;
    left: 0;
    right: 0;
    height: 190px;
    margin: 0;
    padding: 6px;
    background-color: #f4f8fb;
    border-radius: 4px
}

#hellopack .hellopack-color .hellopack-gradient-presets-holder .hellopack-gradient-preset {
    -webkit-box-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: calc((100% - 68px) / 9);
    height: calc((100% - 40px) / 5);
    margin: 4px;
    padding: 0;
    border-radius: 4px;
    cursor: pointer;
    vertical-align: top
}

#hellopack .hellopack-color .hellopack-gradient-points {
    position: absolute;
    height: 32px;
    top: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0
}

#hellopack .hellopack-color .hellopack-gradient-points .hellopack-gradient-point {
    position: absolute;
    top: 4px !important;
    left: 0;
    width: 16px;
    height: 16px;
    margin: 0 -8px;
    padding: 0;
    border-radius: 4px;
    border: 2px solid white;
    -webkit-box-shadow: 0 0 10px 0 rgba(14, 21, 47, 0.3);
    box-shadow: 0 0 10px 0 rgba(14, 21, 47, 0.3);
    opacity: 0.5;
    cursor: pointer;
    -webkit-transform: scale(0.8) translateY(-4px);
    transform: scale(0.8) translateY(-4px);
    -webkit-transition: -webkit-transform .15s ease, opacity .15s ease;
    -webkit-transition: opacity .15s ease, -webkit-transform .15s ease;
    transition: opacity .15s ease, -webkit-transform .15s ease;
    transition: transform .15s ease, opacity .15s ease;
    transition: transform .15s ease, opacity .15s ease, -webkit-transform .15s ease
}

#hellopack .hellopack-color .hellopack-gradient-points .hellopack-gradient-point::before {
    content: "";
    position: absolute;
    top: -1px;
    left: -4px;
    width: 0;
    height: 0;
    margin-left: 2px;
    border: 5.7px solid;
    border-radius: 0 2px 0 0;
    border-color: white white transparent transparent;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-box-shadow: 1px -1px 5px 0 rgba(14, 21, 47, 0.2);
    box-shadow: 1px -1px 5px 0 rgba(14, 21, 47, 0.2);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

#hellopack .hellopack-color .hellopack-gradient-points .hellopack-gradient-point::after {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    width: 12px;
    height: 12px;
    background: inherit;
    border-radius: 4px;
    border: 2px solid white
}

#hellopack .hellopack-color .hellopack-gradient-points .hellopack-gradient-point:hover {
    opacity: 0.75
}

#hellopack .hellopack-color .hellopack-gradient-points .hellopack-gradient-point.hellopack-gradient-point-active {
    z-index: 2;
    opacity: 1;
    -webkit-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0)
}

#hellopack .hellopack-color .hellopack-gradient-points .hellopack-gradient-point .hellopack-gradient-point-bg {
    position: absolute;
    top: 0;
    width: 12px;
    height: 12px;
    background-color: white;
    border-radius: 4px
}

#hellopack .hellopack-gradient-angle {
    position: absolute;
    display: none;
    top: 50%;
    left: 50%;
    height: 110px;
    width: 110px;
    margin: -55px;
    border: 2px solid rgba(255, 255, 255, 0.6);
    border-radius: 100%;
    -webkit-box-shadow: 0 0 5px 0 rgba(14, 21, 47, 0.3), inset 0 0 5px 0 rgba(14, 21, 47, 0.3);
    box-shadow: 0 0 5px 0 rgba(14, 21, 47, 0.3), inset 0 0 5px 0 rgba(14, 21, 47, 0.3);
    cursor: move;
    cursor: grab;
    cursor: -webkit-grab;
    will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-transition: -webkit-transform .15s ease, opacity .15s ease;
    -webkit-transition: opacity .15s ease, -webkit-transform .15s ease;
    transition: opacity .15s ease, -webkit-transform .15s ease;
    transition: transform .15s ease, opacity .15s ease;
    transition: transform .15s ease, opacity .15s ease, -webkit-transform .15s ease
}

#hellopack .hellopack-gradient-angle.is-dragging {
    cursor: grabbing;
    cursor: -webkit-grabbing
}

#hellopack .hellopack-gradient-angle svg {
    -webkit-filter: drop-shadow(0 0 5px rgba(14, 21, 47, 0.5));
    filter: drop-shadow(0 0 5px rgba(14, 21, 47, 0.5))
}

#hellopack .hellopack-gradient-angle .hellopack-angle-pivot {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

#hellopack .hellopack-gradient-angle .hellopack-angle-pivot:before {
    content: '';
    position: absolute;
    top: 4px;
    right: 0;
    left: 0;
    width: 10px;
    height: 10px;
    margin: 0 auto;
    background-color: white;
    -webkit-box-shadow: 0 0 5px 0 rgba(14, 21, 47, 0.3);
    box-shadow: 0 0 5px 0 rgba(14, 21, 47, 0.3);
    border-radius: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

#hellopack .hellopack-gradient-angle .hellopack-angle-input {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    width: 50px;
    margin: -15px auto 0;
    text-align: center;
    background-color: transparent;
    color: white;
    font-size: 14px;
    font-weight: 600;
    text-shadow: 1px 1px 4px rgba(14, 21, 47, 0.5)
}

#hellopack .hellopack-gradient-angle .hellopack-angle-input:hover,
#hellopack .hellopack-gradient-angle .hellopack-angle-input:focus,
#hellopack .hellopack-gradient-angle .hellopack-angle-input:active {
    background-color: transparent
}

#hellopack .hellopack-gradient-center {
    position: absolute;
    display: none;
    top: 50%;
    left: 50%;
    width: 60px;
    height: 60px;
    margin: -32px;
    border: 2px solid rgba(255, 255, 255, 0.6);
    border-radius: 100%;
    cursor: pointer;
    opacity: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0 0 5px 0 rgba(14, 21, 47, 0.3), inset 0 0 5px 0 rgba(14, 21, 47, 0.3);
    box-shadow: 0 0 5px 0 rgba(14, 21, 47, 0.3), inset 0 0 5px 0 rgba(14, 21, 47, 0.3);
    cursor: move;
    cursor: grab;
    cursor: -webkit-grab;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-transition: -webkit-transform .15s ease, opacity .15s ease;
    -webkit-transition: opacity .15s ease, -webkit-transform .15s ease;
    transition: opacity .15s ease, -webkit-transform .15s ease;
    transition: transform .15s ease, opacity .15s ease;
    transition: transform .15s ease, opacity .15s ease, -webkit-transform .15s ease
}

#hellopack .hellopack-gradient-center:before {
    content: "";
    position: absolute;
    background-color: white;
    border-radius: 4px;
    top: 50%;
    left: 50%;
    height: 10px;
    width: 10px;
    margin: -5px;
    border-radius: 100%;
    background-color: white;
    -webkit-box-shadow: 0 0 5px 0 rgba(14, 21, 47, 0.3);
    box-shadow: 0 0 5px 0 rgba(14, 21, 47, 0.3)
}

#hellopack .hellopack-gradient-center.is-dragging {
    cursor: grabbing;
    cursor: -webkit-grabbing
}

#hellopack [data-gradient-type="linear"] .hellopack-gradient-angle {
    display: block;
    opacity: 0
}

#hellopack [data-gradient-type="linear"] .hellopack-gradient-preview-holder:hover .hellopack-gradient-angle {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack [data-gradient-type="linear"] .is-focused.hellopack-gradient-angle,
#hellopack [data-gradient-type="linear"] .is-dragging.hellopack-gradient-angle {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack [data-gradient-type="radial"] .hellopack-gradient-center {
    display: block;
    opacity: 0
}

#hellopack [data-gradient-type="radial"] .hellopack-gradient-preview-holder:hover .hellopack-gradient-center {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack [data-gradient-type="radial"] .is-dragging.hellopack-gradient-center {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack input[type="range"] {
    position: relative;
    display: inline-block;
    vertical-align: top;
    height: 32px;
    width: 186px;
    margin: 0;
    padding: 0;
    background-color: transparent;
    background-image: transparent;
    background-repeat: no-repeat;
    border: none;
    -webkit-appearance: none
}

#hellopack input[type="range"]:after,
#hellopack input[type="range"]:before {
    content: "";
    position: absolute;
    top: 13px;
    bottom: 13px;
    left: 0;
    right: 0;
    border-radius: 6px
}

#hellopack input[type="range"]:after {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#3273dc), to(#3273dc));
    background-image: linear-gradient(#3273dc, #3273dc);
    background-size: inherit;
    background-repeat: no-repeat
}

#hellopack input[type="range"]:before {
    background-color: #f4f8fb;
    -webkit-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out
}

#hellopack input[type="range"]:hover:before,
#hellopack input[type="range"]:focus:before {
    outline: none;
    background-color: #e0e4e9
}

#hellopack input[type="range"]:focus+input,
#hellopack input[type="range"]:hover+input {
    background-color: #e0e4e9
}

#hellopack input[type="range"]::-webkit-slider-runnable-track {
    z-index: 1;
    height: 6px;
    border-radius: 3px
}

#hellopack input[type="range"]::-webkit-slider-thumb {
    height: 16px;
    width: 16px;
    margin-top: -5.5px;
    border-radius: 8px;
    background-color: white;
    border: 2px solid #3273dc;
    cursor: pointer;
    -webkit-appearance: none
}

#hellopack input[type=range]::-moz-range-track {
    height: 6px;
    background-color: #f4f8fb;
    border-radius: 3px;
    -webkit-transition: background-color .3s ease-in-out;
    -moz-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out
}

#hellopack input[type=range]:hover::-moz-range-track {
    background-color: #e0e4e9
}

#hellopack input[type="range"]::-moz-range-thumb {
    height: 12px;
    width: 12px;
    border-radius: 8px;
    background-color: white;
    border: 2px solid #3273dc;
    cursor: pointer;
    -webkit-appearance: none
}

#hellopack input[type=range]::-moz-range-track {
    height: 6px;
    background-color: #f4f8fb;
    border-radius: 6px
}

#hellopack input[type="range"]::-moz-range-progress {
    height: 6px;
    background-color: #3273dc;
    border-radius: 6px
}

#hellopack input[type="range"]::-ms-track {
    height: 6px;
    width: 100%;
    background-color: #f4f8fb;
    border-color: transparent;
    border-radius: 6px;
    border-width: 0;
    color: transparent;
    cursor: pointer;
    -webkit-transition: background-color .3s ease-in-out;
    -ms-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out
}

#hellopack input[type="range"]:hover::-ms-track {
    background-color: #e0e4e9
}

#hellopack input[type="range"]::-ms-thumb {
    height: 12px;
    width: 12px;
    margin-top: 0;
    border-radius: 8px;
    background-color: white;
    border: 2px solid #3273dc;
    cursor: pointer
}

#hellopack input[type="range"]::-ms-fill-lower {
    height: 6px;
    background-color: #3273dc;
    border-radius: 6px
}

#hellopack input[type="range"]::-ms-fill-upper {
    background-color: transparent
}

#hellopack input[type="range"]::-ms-tooltip {
    display: none
}

#hellopack .hellopack-range-slider-value {
    width: 68px;
    margin: 0 0 0 8px;
    padding: 3px 8px
}

#hellopack .hellopack-password-holder>svg {
    position: absolute;
    right: 0;
    top: 0;
    height: 32px;
    width: 32px;
    padding: 8px;
    color: #4c5866;
    opacity: 0;
    cursor: pointer;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    -webkit-transition: all .15s ease-out;
    transition: all .15s ease-out
}

#hellopack .hellopack-password-holder>svg:hover {
    color: #3273dc;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack .hellopack-password-holder input:hover+svg,
#hellopack .hellopack-password-holder input:focus+svg,
#hellopack .hellopack-password-holder input:active+svg {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack .hellopack-password-holder input:hover+svg:hover,
#hellopack .hellopack-password-holder input:focus+svg:hover,
#hellopack .hellopack-password-holder input:active+svg:hover {
    color: #3273dc
}

#hellopack .hellopack-password-holder input[type="text"]+svg {
    color: #3273dc;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack .hellopack-image {
    position: relative;
    display: block;
    height: 100px;
    width: 100px;
    margin: 0;
    border: 2px dashed #f4f8fb;
    border-radius: 4px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    cursor: pointer;
    -webkit-transition: border-color 300ms ease-out;
    transition: border-color 300ms ease-out
}

#hellopack .hellopack-image:before {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    bottom: 4px;
    right: 4px;
    background-color: #f4f8fb;
    -webkit-transition: background-color 300ms ease-out;
    transition: background-color 300ms ease-out
}

#hellopack .hellopack-image:hover>svg {
    opacity: 0.8
}

#hellopack .hellopack-image:first-child:hover {
    border-color: #e0e4e9
}

#hellopack .hellopack-image:first-child:hover:before {
    background-color: #e0e4e9
}

#hellopack .hellopack-image>svg {
    position: absolute;
    width: 32px;
    height: 32px;
    top: 50%;
    left: 50%;
    margin: -16px 0 0 -16px;
    padding: 8px;
    background-color: #3273dc;
    border-radius: 100%;
    color: white;
    -webkit-transition: opacity 300ms ease-out;
    transition: opacity 300ms ease-out
}

#hellopack .hellopack-image .hellopack-image-background {
    position: absolute;
    display: none;
    overflow: hidden;
    top: -2px;
    left: -2px;
    bottom: -2px;
    right: -2px;
    border-radius: 4px;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat
}

#hellopack .hellopack-image .hellopack-image-background[style^="background-image"] {
    display: block;
    background-color: #e0e4e9
}

#hellopack .hellopack-image .hellopack-image-background[style^="background-image"]+.hellopack-image-delete {
    display: block
}

#hellopack .hellopack-image .hellopack-image-delete {
    position: absolute;
    visibility: hidden;
    display: none;
    z-index: 2;
    width: 20px;
    height: 20px;
    top: -8px;
    right: -8px;
    background-color: white;
    border-radius: 100%;
    color: white;
    opacity: 0;
    cursor: pointer;
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    -webkit-transition: all 150ms ease-out;
    transition: all 150ms ease-out
}

#hellopack .hellopack-image .hellopack-image-delete svg {
    position: absolute;
    display: block;
    width: 20px;
    height: 20px;
    top: 0px;
    left: 0px;
    padding: 6px;
    background-color: #ff3960;
    border-radius: 100%;
    stroke-width: 1px;
    stroke: white;
    pointer-events: none;
    -webkit-transition: opacity 300ms ease-out;
    transition: opacity 300ms ease-out
}

#hellopack .hellopack-image .hellopack-image-delete:hover svg {
    opacity: 0.8
}

#hellopack .hellopack-image:hover .hellopack-image-delete {
    visibility: visible;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack .hellopack-gallery {
    position: relative;
    display: block;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -4px;
    max-width: 1080px
}

#hellopack .hellopack-gallery .hellopack-image {
    position: relative;
    float: left;
    margin: 4px;
    cursor: move;
    cursor: grab;
    cursor: -webkit-grab
}

#hellopack .hellopack-gallery .hellopack-image:first-child {
    cursor: pointer
}

#hellopack .hellopack-gallery .hellopack-image.ui-sortable-helper {
    cursor: grabbing;
    cursor: -webkit-grabbing
}

#hellopack .hellopack-gallery .hellopack-image.ui-sortable-helper .hellopack-image-delete {
    display: none
}

#hellopack .hellopack-gallery .hellopack-image:not(:first-child) .hellopack-image-delete {
    display: block
}

#hellopack .hellopack-gallery .hellopack-image:not(:first-child) .hellopack-image-background {
    display: block;
    background-color: #e0e4e9
}

#hellopack .hellopack-gallery .hellopack-image .hellopack-image-filename {
    position: absolute;
    bottom: -2px;
    left: -2px;
    right: -2px;
    padding: 16px 4px 4px;
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.5)));
    background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.5) 100%);
    color: white;
    font-size: 11px;
    font-weight: 600;
    line-height: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

#hellopack .hellopack-settings #hellopack-card-style-tab .hellopack-admin-section:nth-child(1) {
    margin-bottom: 0
}

#hellopack .hellopack-settings #hellopack-card-style-tab .hellopack-admin-section:nth-child(1) p {
    margin-bottom: 0
}

#hellopack .hellopack-settings #hellopack-card-style-tab .hellopack-admin-section:nth-child(2) a.hellopack-button {
    margin-top: 16px
}

#hellopack input[name^="hellopack[cards]["]+.hellopack-select-wrapper .hellopack-select {
    border-radius: 4px 0 0 4px
}

#hellopack input[name^="hellopack[cards]["]~button {
    border-radius: 0 4px 4px 0
}

#hellopack .CodeMirror {
    border-radius: 4px
}

#hellopack .hellopack-code {
    display: none
}

#hellopack .hellopack-settings .hellopack-meta-clauses {
    position: relative;
    display: block;
    margin: 0;
    padding: 8px;
    border: 2.5px solid #f4f8fb;
    border-radius: 4px
}

#hellopack .hellopack-settings .hellopack-meta-clauses .hellopack-meta-clauses {
    margin: 8px 8px 16px 8px
}

#hellopack .hellopack-settings .hellopack-meta-clauses:hover .hellopack-meta-clauses:hover .hellopack-meta-clause+.hellopack-delete-metakey {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack .hellopack-settings .hellopack-meta-clauses:hover .hellopack-meta-clauses:hover .hellopack-meta-clause+.hellopack-delete-metakey:hover {
    opacity: 0.8
}

#hellopack .hellopack-settings .hellopack-meta-clauses .hellopack-settings-field {
    padding: 0
}

#hellopack .hellopack-settings .hellopack-meta-clauses>.hellopack-settings-field {
    margin: 8px 8px
}

#hellopack .hellopack-settings .hellopack-meta-clauses>.hellopack-settings-field .hellopack-field-label {
    width: auto;
    padding: 8px 12px 8px 0;
    color: #4c5866;
    font-weight: 600
}

#hellopack .hellopack-settings .hellopack-meta-clauses>.hellopack-settings-field+.hellopack-meta-clause .hellopack-delete-metakey {
    display: none
}

#hellopack .hellopack-settings .hellopack-meta-clause {
    position: relative;
    display: inline-block;
    -webkit-box-flex: auto 0 1;
    -ms-flex: auto 0 1;
    flex: auto 0 1;
    min-height: 300px;
    width: 272px;
    max-width: 100%;
    padding: 20px;
    margin: 8px;
    background-color: #f4f8fb;
    border-radius: 4px;
    vertical-align: middle
}

#hellopack .hellopack-settings .hellopack-meta-clause.hellopack-add-metakey {
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    -webkit-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out
}

#hellopack .hellopack-settings .hellopack-meta-clause.hellopack-add-metakey svg {
    position: absolute;
    pointer-events: none;
    top: 50%;
    left: 50%;
    margin: -20px 0 0 -20px;
    width: 40px;
    height: 40px;
    padding: 12px;
    background-color: #3273dc;
    color: white;
    border-radius: 100%;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 105, 255, 0.3);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 105, 255, 0.3);
    -webkit-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out
}

#hellopack .hellopack-settings .hellopack-meta-clause.hellopack-add-metakey:hover {
    background-color: #e0e4e9
}

#hellopack .hellopack-settings .hellopack-meta-clause.hellopack-add-metakey:hover svg {
    background-color: #2981ff;
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 105, 255, 0.2);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 105, 255, 0.2)
}

#hellopack .hellopack-settings .hellopack-meta-clause:hover .hellopack-delete-metakey {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
    transform: scale(1)
}

#hellopack .hellopack-settings .hellopack-meta-clause:hover .hellopack-delete-metakey:hover {
    opacity: 0.8
}

#hellopack .hellopack-settings .hellopack-meta-clause .hellopack-field-label {
    width: 100%
}

#hellopack .hellopack-settings .hellopack-meta-clause input,
#hellopack .hellopack-settings .hellopack-meta-clause select,
#hellopack .hellopack-settings .hellopack-meta-clause .hellopack-select {
    background-color: white
}

#hellopack .hellopack-settings .hellopack-meta-clause input:hover,
#hellopack .hellopack-settings .hellopack-meta-clause input:focus,
#hellopack .hellopack-settings .hellopack-meta-clause input:active,
#hellopack .hellopack-settings .hellopack-meta-clause select:hover,
#hellopack .hellopack-settings .hellopack-meta-clause select:focus,
#hellopack .hellopack-settings .hellopack-meta-clause select:active,
#hellopack .hellopack-settings .hellopack-meta-clause .hellopack-select:hover,
#hellopack .hellopack-settings .hellopack-meta-clause .hellopack-select:focus,
#hellopack .hellopack-settings .hellopack-meta-clause .hellopack-select:active {
    background-color: #e0e4e9
}

#hellopack .hellopack-settings .hellopack-meta-clause .hellopack-select-open .hellopack-select {
    background-color: #e0e4e9
}

#hellopack .hellopack-settings .hellopack-add-relation {
    margin: 8px
}

#hellopack .hellopack-settings .hellopack-delete-metakey {
    position: absolute;
    visibility: hidden;
    top: -12px;
    right: -12px;
    width: 24px;
    height: 24px;
    padding: 0;
    background-color: #ff3960;
    color: white;
    border-radius: 100%;
    opacity: 0;
    cursor: pointer;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    -webkit-transition: all .15s ease;
    transition: all .15s ease
}

#hellopack .hellopack-settings .hellopack-delete-metakey svg {
    position: relative;
    display: inline-block;
    pointer-events: none;
    width: 24px;
    height: 24px;
    padding: 6px
}

#hellopack .hellopack-table-card-sizes [data-colname="ratio"] input {
    text-align: center
}

@media screen and (max-width: 1380px) {

    #hellopack .hellopack-table-card-sizes [data-colname="height"] .hellopack-range-slider,
    #hellopack .hellopack-table-card-sizes [data-colname="columns"] .hellopack-range-slider {
        display: none
    }
}

@media screen and (max-width: 1280px) {
    #hellopack .hellopack-table-card-sizes thead {
        font-size: 12px
    }

    #hellopack .hellopack-table-card-sizes td {
        width: auto;
        padding: 8px 6px
    }

    #hellopack .hellopack-table-card-sizes [data-colname="height"] .hellopack-ui-slider,
    #hellopack .hellopack-table-card-sizes [data-colname="columns"] .hellopack-ui-slider {
        display: none
    }
}

@media screen and (max-width: 1280px) {
    #hellopack .hellopack-table-card-sizes [data-colname="size"] {
        display: none
    }
}

@media screen and (max-width: 782px) {
    #hellopack .hellopack-table-card-sizes thead {
        font-size: 10px
    }

    #hellopack .hellopack-table-card-sizes td {
        padding: 8px 2px
    }
}

#hellopack .hellopack-nota-builder-info {
    margin: -16px 0 48px 0
}

#hellopack .hellopack-available-facets {
    margin: 0 0 16px 0
}

#hellopack .hellopack-available-facets ul {
    min-height: 133px;
    max-height: 173px;
    overflow-y: auto;
    margin: 4px 0;
    padding: 4px;
    max-width: 1000px;
    border: 2.5px solid #f4f8fb;
    border-radius: 4px
}

#hellopack .hellopack-layout-label {
    padding: 8px 2px
}

#hellopack .hellopack-layout-inner {
    max-width: 1000px;
    min-width: 220px;
    margin: 32px 0 0
}

#hellopack .hellopack-layout-facet {
    position: relative;
    display: inline-block;
    overflow: hidden;
    vertical-align: middle;
    height: 32px;
    min-width: 32px;
    padding: 8px;
    margin: 4px;
    background-color: #3273dc;
    border-radius: 4px;
    color: white;
    cursor: move;
    cursor: grab;
    cursor: -webkit-grab;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 105, 255, 0.3);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 105, 255, 0.3)
}

#hellopack .hellopack-layout-facet svg {
    height: 16px;
    width: 14px;
    margin: 0 4px;
    stroke-width: 1.5;
    vertical-align: top
}

#hellopack .hellopack-layout-facet span {
    position: relative;
    display: inline-block;
    overflow: hidden;
    margin: 0 4px;
    max-width: calc(100% - 30px);
    font-size: 14px;
    line-height: 17px;
    vertical-align: top;
    white-space: nowrap;
    text-overflow: ellipsis
}

#hellopack .hellopack-layout-facet[data-facet="prev-button"],
#hellopack .hellopack-layout-facet[data-facet="next-button"],
#hellopack .hellopack-layout-facet[data-facet="page-dots"] {
    background-color: #7a54cd;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(122, 84, 205, 0.3);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(122, 84, 205, 0.3)
}

#hellopack .hellopack-layout-facet.ui-sortable-helper {
    cursor: grabbing;
    cursor: -webkit-grabbing;
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1)
}

#hellopack .hellopack-layout {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    padding: 0 4px;
    margin: 4px 0;
    border: 2.5px solid #f4f8fb;
    border-radius: 4px
}

#hellopack .hellopack-layout .hellopack-layout-buttons {
    position: absolute;
    visibility: hidden;
    opacity: 0;
    top: -20px;
    right: 0;
    height: 22px;
    margin: 0;
    background-color: #f4f8fb;
    border-radius: 4px 4px 0 0;
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-transition: all .15s ease-out;
    transition: all .15s ease-out
}

#hellopack .hellopack-layout .hellopack-layout-buttons li {
    display: inline-block;
    width: 28px;
    height: 22px;
    cursor: pointer;
    text-align: center
}

#hellopack .hellopack-layout .hellopack-layout-buttons li svg {
    width: 16px;
    height: 16px;
    margin: 4px;
    pointer-events: none;
    -webkit-transition: color .3s ease-out;
    transition: color .3s ease-out
}

#hellopack .hellopack-layout .hellopack-layout-buttons li:hover,
#hellopack .hellopack-layout .hellopack-layout-buttons li.hellopack-layout-button-active {
    color: #3273dc
}

#hellopack .hellopack-layout>.hellopack-layout-buttons {
    top: -22px
}

#hellopack .hellopack-layout:hover>.hellopack-layout-buttons {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

#hellopack .hellopack-layout .hellopack-layout-main {
    -webkit-box-flex: 100%;
    -ms-flex: 100%;
    flex: 100%
}

#hellopack .hellopack-layout .hellopack-layout-main .hellopack-layout-area ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

#hellopack .hellopack-layout .hellopack-layout-area {
    position: relative;
    display: block;
    min-height: 64px;
    margin: 24px 8px;
    padding: 0;
    cursor: default
}

#hellopack .hellopack-layout .hellopack-layout-area:hover .hellopack-layout-buttons {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

#hellopack .hellopack-layout .hellopack-layout-area .hellopack-layout-facets {
    position: relative;
    display: block;
    width: 100%;
    min-height: 64px;
    margin: 0;
    padding: 12px 8px;
    border-radius: 4px;
    background-color: #f4f8fb;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

#hellopack .hellopack-layout .hellopack-layout-area .hellopack-layout-facets .hellopack-layout-facet-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 18px;
    font-size: 14px;
    font-weight: 600;
    line-height: 32px;
    text-transform: uppercase;
    text-align: center
}

#hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-left"],
#hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-right"] {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 200px;
    flex: 0 0 200px;
    width: 200px
}

#hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-left"] .hellopack-layout-facets,
#hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-right"] .hellopack-layout-facets {
    height: 100%
}

#hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-left"] .hellopack-layout-facets .hellopack-layout-facet,
#hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-right"] .hellopack-layout-facets .hellopack-layout-facet {
    display: block
}

#hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-left"] .hellopack-layout-facets .hellopack-layout-facet-placeholder,
#hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-right"] .hellopack-layout-facets .hellopack-layout-facet-placeholder {
    height: auto;
    top: 50%;
    margin: -34px 0 0 0
}

#hellopack .hellopack-layout .hellopack-layout-grid {
    position: relative;
    height: 250px;
    margin: 0 8px
}

#hellopack .hellopack-layout .hellopack-layout-grid .hellopack-layout-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 250px;
    clear: both;
    margin: 0 -10px
}

#hellopack .hellopack-layout .hellopack-layout-grid .hellopack-layout-wrapper .hellopack-layout-item {
    -webkit-box-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    height: 106px;
    width: 150px;
    margin: 10px;
    border-radius: 4px;
    background-color: #e0e4e9;
    background-image: url(../svg/placeholder.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-size: 130px;
    background-position: 50%
}

#hellopack .hellopack-layout .hellopack-layout-grid .hellopack-layout-area {
    position: absolute;
    display: block;
    z-index: 10;
    left: 0;
    top: 50%;
    width: 64px;
    margin: 0;
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

#hellopack .hellopack-layout .hellopack-layout-grid .hellopack-layout-area[data-area="area-right"] {
    left: auto;
    right: 0
}

#hellopack .hellopack-layout .hellopack-layout-grid .hellopack-layout-area .hellopack-layout-facet-placeholder {
    padding: 0 14px;
    font-size: 11px;
    line-height: 16px;
    top: 50%;
    height: auto;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

#hellopack .hellopack-layout-style {
    position: absolute;
    display: none;
    z-index: 10;
    height: auto !important;
    width: 360px;
    bottom: 100%;
    right: -57.5px;
    margin: 0 0 28px;
    padding: 24px 20px 12px;
    background: white;
    border-radius: 4px;
    border: 1px solid rgba(147, 154, 170, 0.2);
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    animation: bounce .4s ease;
    -webkit-animation: hellopack-keyframes-zoom-out 0.3s cubic-bezier(0.19, 1.59, 0.49, 0.96)
}

#hellopack .hellopack-layout-style:after,
#hellopack .hellopack-layout-style:before {
    content: '';
    position: absolute;
    right: 60px;
    bottom: -10px;
    height: 0;
    width: 0;
    border: 10px solid;
    border-bottom: none;
    border-left-color: transparent;
    border-right-color: transparent;
    border-top: 10px solid rgba(147, 154, 170, 0.1)
}

#hellopack .hellopack-layout-style:after {
    bottom: -8px;
    border-top: 10px solid white
}

#hellopack .hellopack-layout-style[style]+.hellopack-layout-buttons {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

#hellopack .hellopack-layout-style .hellopack-settings-field {
    margin: 0 0 12px 0
}

#hellopack .hellopack-layout-style .hellopack-settings-field .hellopack-field-input,
#hellopack .hellopack-layout-style .hellopack-settings-field .hellopack-color-holder {
    width: 100%
}

#hellopack .hellopack-layout-style .hellopack-settings-field:last-child {
    display: none
}

#hellopack .hellopack-layout-style div:not(.hellopack-field-group) .hellopack-field-label {
    margin: 0;
    padding: 0 0 4px 0;
    color: #162134;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    cursor: default
}

#hellopack .hellopack-layout-style .hellopack-field-group {
    margin: -8px
}

#hellopack .hellopack-layout-style .hellopack-field-group .hellopack-settings-field {
    width: 20%
}

@media screen and (max-width: 1330px) {
    #hellopack .hellopack-available-facets {
        width: 100%;
        margin: 0
    }

    #hellopack .hellopack-layout-inner {
        width: 100%
    }
}

@media screen and (max-width: 1180px) {
    #hellopack .hellopack-layout {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    #hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-left"],
    #hellopack .hellopack-layout .hellopack-layout-area[data-area="sidebar-right"] {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        width: auto
    }
}

#hellopack .hellopack-animation-placeholder {
    border-radius: 4px;
    max-width: 100%
}

#hellopack .hellopack-animation-placeholder~button {
    width: 100%
}

#hellopack input[name="hellopack[loader_type]"]+label span {
    display: none
}

#hellopack input[name="hellopack[loader_type]"]~.hellopack-loader-holder {
    position: absolute;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    pointer-events: none
}

#hellopack input[name="hellopack[loader_type]"]~.hellopack-loader-holder>div {
    position: relative;
    height: 50px;
    width: 50px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    will-change: transform
}

#hellopack input[name="hellopack[loader_type]"]~.hellopack-loader-holder>div div {
    background: #253858;
    border-color: #253858;
    -webkit-animation-play-state: paused;
    animation-play-state: paused
}

#hellopack input[name="hellopack[loader_type]"]:checked+label+.hellopack-loader-holder .hellopack-loader {
    -webkit-animation-play-state: running;
    animation-play-state: running
}

#hellopack input[name="hellopack[loader_type]"]:checked+label+.hellopack-loader-holder .hellopack-loader div {
    -webkit-animation-play-state: running;
    animation-play-state: running
}

#hellopack .hellopack-list-item:hover .hellopack-loader-holder .hellopack-loader {
    -webkit-animation-play-state: running;
    animation-play-state: running
}

#hellopack .hellopack-list-item:hover .hellopack-loader-holder .hellopack-loader div {
    -webkit-animation-play-state: running;
    animation-play-state: running
}

#hellopack .hellopack-icon-picker {
    position: relative;
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    height: 32px;
    margin: 0;
    padding: 0;
    color: #4c5866;
    background-color: #f4f8fb;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    cursor: pointer;
    -webkit-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out
}

#hellopack .hellopack-icon-picker svg {
    position: relative;
    display: inline-block;
    margin: 8px;
    width: 16px;
    height: 16px;
    stroke-width: 2;
    vertical-align: middle
}

#hellopack .hellopack-icon-picker span {
    display: inline-block;
    vertical-align: top;
    height: 32px
}

#hellopack .hellopack-icon-picker .hellopack-icon-picker-svg {
    width: 32px
}

#hellopack .hellopack-icon-picker .hellopack-icon-picker-label {
    padding: 8px 16px;
    border-left: 2px solid white
}

#hellopack .hellopack-icon-picker:hover {
    background-color: #e0e4e9
}

#hellopack .hellopack-icon-picker.hellopack-open {
    background-color: #e0e4e9;
    border-radius: 4px 4px 0 0
}

#hellopack .hellopack-icons-popup {
    position: fixed;
    display: none;
    z-index: 99999;
    overflow: hidden;
    top: 0;
    left: 0;
    width: 100%;
    height: 296px;
    border-radius: 4px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    pointer-events: none;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out
}

#hellopack .hellopack-icons-popup.hellopack-show {
    display: block
}

#hellopack .hellopack-icons-popup input {
    margin: 0 0 0 32px;
    width: calc(100% - 32px);
    border-left: 2px solid white;
    pointer-events: auto;
    -webkit-transition: none;
    transition: none
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-holder {
    height: 100%;
    max-height: calc(100% - 32px);
    background-color: white;
    pointer-events: auto;
    overflow-y: scroll
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-holder::-webkit-scrollbar {
    width: 8px
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-holder::-webkit-scrollbar-button {
    width: 0;
    height: 0
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-holder::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.3)
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-holder::-webkit-scrollbar-thumb {
    background: #53627C
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-wrapper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-wrapper .hellopack-icon-item {
    position: relative;
    display: inline-block;
    -webkit-box-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    width: 40px;
    max-width: 44px;
    height: 40px;
    margin: 2px;
    padding: 10px;
    border: 2px solid transparent;
    border-radius: 4px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: border-color .2s ease-out;
    transition: border-color .2s ease-out
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-wrapper .hellopack-icon-item:before {
    content: ''
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-wrapper .hellopack-icon-item:hover,
#hellopack .hellopack-icons-popup .hellopack-icons-popup-wrapper .hellopack-icon-item.hellopack-icon-selected {
    color: #3273dc;
    border-color: #3273dc
}

#hellopack .hellopack-icons-popup .hellopack-icons-popup-wrapper .hellopack-icon-item svg {
    width: 16px;
    height: 16px;
    stroke-width: 2
}

#hellopack .hellopack-icons-popup.hellopack-show {
    opacity: 1;
    visibility: visible;
    -webkit-transform: perspective(250px) rotateX(0deg);
    transform: perspective(250px) rotateX(0deg)
}

#hellopack .hellopack-settings .hellopack-table-wrapper+.hellopack-add-row {
    margin: 16px 0 0
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table td:first-child,
#hellopack .hellopack-settings .hellopack-repeater.hellopack-table td:last-child {
    min-width: 40px;
    width: 40px;
    padding: 0
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table tr.ui-sortable-helper {
    background-color: white;
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    cursor: drag
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table tr.ui-sortable-helper input,
#hellopack .hellopack-settings .hellopack-repeater.hellopack-table tr.ui-sortable-helper .hellopack-select {
    background-color: white;
    pointer-events: none
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table tr.ui-sortable-helper .hellopack-delete-sort-option {
    display: none
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table .hellopack-repeater-sort {
    cursor: move;
    cursor: -webkit-grab;
    cursor: grab
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table .hellopack-repeater-sort.hellopack-dragging {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table .hellopack-handle-icon {
    display: block;
    margin: 8px auto;
    width: 16px;
    height: 16px;
    opacity: 0.65;
    -webkit-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table .hellopack-delete-row {
    width: 24px;
    height: 24px;
    padding: 5px;
    border-radius: 100%
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table .hellopack-delete-row svg {
    margin: 0;
    padding: 1px
}

#hellopack .hellopack-settings .hellopack-repeater.hellopack-table tbody tr:first-child .hellopack-delete-row {
    display: none
}

#hellopack .hellopack-repeater td[data-colname="or"] {
    max-width: 60px;
    text-align: center
}

#hellopack-admin-header {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto;
    /* padding: 0 48px; */
    background-color: white;
    max-width: 1080px;
}

h1#hellopack-admin-plugin {
    position: relative;
    margin: 0;
    padding: 16px;
    cursor: default;
    font-size: 18px;
    line-height: 18px;
    letter-spacing: -0.5px
}

h1#hellopack-admin-plugin a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

#hellopack-admin-version {
    margin: 0;
    padding: 6px 8px;
    background-color: #eef2f5;
    border-radius: 4px;
    font-size: 13px;
    line-height: 13px;
    color: #53627C
}

#hellopack-admin-main {
    position: relative;
    display: block;
    margin: 50px 50px 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    min-width: 300px;
    min-height: calc(100vh - 238px);
    padding: 0;
    background-color: white;
    border: none;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1)
}

#hellopack-admin-content {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: inherit
}

.hellopack-grids-page #hellopack-admin-content,
.hellopack-cards-page #hellopack-admin-content,
.hellopack-facets-page #hellopack-admin-content {
    padding: 60px;
    animation: hellopack-keyframes-from-right .7s;
    -webkit-animation: hellopack-keyframes-from-right .7s
}

@media screen and (max-width: 1180px) {
    #hellopack-admin-version {
        display: none
    }
}

@media screen and (max-width: 782px) {
    .auto-fold #wpcontent {
        padding: 0
    }

    h1#hellopack-admin-plugin {
        padding: 8px 0
    }

    #hellopack-admin-header {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 0 32px
    }

    #hellopack-admin-main {
        margin: 32px 32px 0
    }

    .hellopack-grids-page #hellopack-admin-content,
    .hellopack-cards-page #hellopack-admin-content,
    .hellopack-facets-page #hellopack-admin-content {
        padding: 32px 24px
    }
}

@media screen and (max-width: 480px) {
    #hellopack-admin-main {
        margin: 32px 16px 0
    }
}

#hellopack.hellopack-add-ons-page #hellopack-admin-main,
#hellopack.hellopack-dashboard-page #hellopack-admin-main {
    margin: 0;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: unset;
    -webkit-box-shadow: none;
    box-shadow: none
}

#hellopack.hellopack-add-ons-page #hellopack-admin-content,
#hellopack.hellopack-dashboard-page #hellopack-admin-content {
    max-width: 1180px;
    margin: 30px auto 0;
    padding: 0 50px
}

#hellopack .hellopack-admin-panel {
    position: relative;
    display: block;
    margin: 0 0 50px;
    padding: 60px;
    background-color: white;
    border: none;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1)
}

#hellopack .hellopack-admin-panel .hellopack-settings>div {
    max-width: 100%
}

#hellopack .hellopack-admin-panel .hellopack-settings .hellopack-field-label {
    width: 200px;
    font-weight: 600
}

#hellopack .hellopack-admin-panel .hellopack-select {
    min-width: 200px
}

#hellopack .hellopack-admin-columns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 32px -16px 0
}

#hellopack .hellopack-admin-column {
    width: 50%;
    padding: 0 16px
}

#hellopack .hellopack-admin-column:last-child {
    padding: 0 16px
}

@media screen and (max-width: 1080px) {
    #hellopack .hellopack-admin-column {
        width: 100%;
        padding: 0 16px 32px
    }
}

@media screen and (max-width: 782px) {

    #hellopack.hellopack-add-ons-page #hellopack-admin-content,
    #hellopack.hellopack-dashboard-page #hellopack-admin-content {
        margin: 0;
        padding: 32px 32px 0
    }

    #hellopack.hellopack-add-ons-page .hellopack-admin-panel,
    #hellopack.hellopack-dashboard-page .hellopack-admin-panel {
        margin: 0 0 32px;
        padding: 32px 24px
    }
}

@media screen and (max-width: 480px) {

    #hellopack.hellopack-add-ons-page #hellopack-admin-content,
    #hellopack.hellopack-dashboard-page #hellopack-admin-content {
        padding: 32px 16px 0
    }
}

#hellopack .hellopack-add-ons-cards {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -9px
}

#hellopack .hellopack-add-ons-cards .hellopack-add-ons-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 9px;
    width: calc(100% / 3 - 18px);
    border: 2px solid #f4f8fb;
    border-radius: 4px
}

#hellopack .hellopack-add-ons-cards .hellopack-add-ons-card img {
    display: block;
    width: 100%;
    background: #f4f8fb;
    border-radius: 4px 4px 0 0
}

#hellopack .hellopack-add-ons-cards .hellopack-add-ons-card button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 8px 16px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: auto 16px 16px 16px
}

#hellopack .hellopack-add-ons-cards .hellopack-add-ons-card button[disabled] {
    cursor: default
}

#hellopack .hellopack-add-ons-cards .hellopack-add-ons-card button:not([data-name]) {
    opacity: 0.5;
    background: #53627C;
    cursor: not-allowed
}

#hellopack .hellopack-add-ons-cards .hellopack-add-ons-card h3 {
    padding: 16px 16px 8px
}

#hellopack .hellopack-add-ons-cards .hellopack-add-ons-card p {
    margin: 8px 16px 24px
}

#hellopack .hellopack-add-ons-cards .hellopack-add-ons-card.hellopack-disabled {
    opacity: 0.5
}

#hellopack .hellopack-add-ons-cards .hellopack-add-ons-card.hellopack-disabled button {
    background: #53627C;
    cursor: not-allowed
}

#hellopack .hellopack-add-ons-card button.hellopack-loading {
    -webkit-animation: hellopack-keyframes-loading 1s infinite linear;
    animation: hellopack-keyframes-loading 1s infinite linear
}

#hellopack .hellopack-add-ons-card button.hellopack-loading:before {
    content: "";
    position: relative;
    margin: 0 8px;
    width: 12px;
    height: 12px;
    outline: 1px solid transparent;
    border-radius: 50%;
    border-width: 2px;
    border-right-style: solid;
    border-top-style: solid;
    border-bottom-style: solid;
    border-color: white;
    border-left: 2px solid #3273dc;
    -webkit-animation: hellopack-keyframes-rotate 1s infinite linear;
    animation: hellopack-keyframes-rotate 1s infinite linear
}

@media screen and (max-width: 1280px) {
    #hellopack .hellopack-add-ons-cards .hellopack-add-ons-card {
        width: calc(100% / 2 - 18px)
    }
}

@media screen and (max-width: 782px) {
    #hellopack .hellopack-add-ons-cards .hellopack-add-ons-card {
        width: calc(100% - 18px)
    }
}

#hellopack #hellopack-admin-navigation {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    margin: 0;
    margin-left: auto;
    min-width: 300px;
    max-width: 100%
}

#hellopack #hellopack-admin-navigation li {
    position: relative;
    overflow: hidden;
    height: 80px;
    padding: 0;
    margin: 0;
    vertical-align: top
}

#hellopack #hellopack-admin-navigation li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 80px;
    padding: 32px 16px;
    font-weight: 700;
    font-size: 12px;
    line-height: 16px;
    text-transform: uppercase;
    color: #53627C
}

#hellopack #hellopack-admin-navigation li a:focus {
    outline: none;
    -webkit-box-shadow: inset 0 0 0px 1px #3273dc;
    box-shadow: inset 0 0 0px 1px #3273dc
}

#hellopack #hellopack-admin-navigation li .hellopack-bubble-info {
    position: absolute;
    display: block;
    right: 0;
    top: 16px;
    height: 16px;
    min-width: 16px;
    padding: 0 4px;
    background-color: #ff3960;
    border-radius: 8px;
    color: white;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
    -webkit-box-shadow: 1px 1px 4px 0px rgba(14, 21, 47, 0.25);
    box-shadow: 1px 1px 4px 0px rgba(14, 21, 47, 0.25)
}

#hellopack #hellopack-admin-navigation li svg {
    width: 16px;
    height: 16px;
    margin: 0 8px 0 0;
    vertical-align: top
}

#hellopack #hellopack-admin-navigation li.hellopack-active {
    border-bottom: 2px solid #3273dc
}

#hellopack #hellopack-admin-navigation li.hellopack-active a {
    color: #3273dc
}

#hellopack #hellopack-admin-navigation li:hover:not(.hellopack-active) {
    background-color: rgba(255, 255, 255, 0.5)
}

#hellopack #hellopack-admin-navigation li:hover:not(.hellopack-active) a {
    color: #162134
}

@media screen and (max-width: 1180px) {
    #hellopack #hellopack-admin-navigation li {
        width: 64px
    }

    #hellopack #hellopack-admin-navigation li svg {
        margin: 0 auto
    }

    #hellopack #hellopack-admin-navigation li span:first-of-type {
        display: none
    }
}

@media screen and (max-width: 782px) {
    #hellopack #hellopack-admin-navigation {
        margin: 0 -32px
    }

    #hellopack #hellopack-admin-navigation li {
        height: 64px;
        width: 60px
    }

    #hellopack #hellopack-admin-navigation li a {
        height: 64px;
        padding: 24px 16px
    }
}

#hellopack .hellopack-list-table-pagination {
    display: inline-block;
    margin: 0 0 0 24px
}

#hellopack .hellopack-list-table-pagination li {
    display: inline-block;
    height: 32px;
    min-width: 32px;
    margin: 0 4px 6px;
    padding: 0 11px;
    border-radius: 4px;
    color: #53627C;
    font-size: 14px;
    font-weight: bold;
    line-height: 32px;
    list-style: none;
    text-align: center;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out
}

#hellopack .hellopack-list-table-pagination li[data-page] {
    background-color: #f4f8fb;
    color: #162134;
    cursor: pointer
}

#hellopack .hellopack-list-table-pagination li[data-page]:hover:not([aria-current]) {
    background-color: #e0e4e9
}

#hellopack .hellopack-list-table-pagination li[aria-current] {
    background-color: #3273dc;
    color: white
}

#hellopack .hellopack-list-table-pagination li:last-child {
    margin: 0 0 0 4px
}

#hellopack h4 {
    padding: 0
}

#hellopack h4 svg {
    width: 16px;
    height: 16px;
    margin: 0 12px 0 0;
    color: #3273dc
}

#hellopack .hellopack-list-table-empty {
    position: relative;
    display: inline-block;
    width: 100%;
    margin: 80px 0 0 0
}

#hellopack .hellopack-list-table-empty h3 {
    padding: 0 0 12px 0;
    font-size: 20px;
    line-height: 28px;
    text-align: center
}

#hellopack .hellopack-list-table-empty .hellopack-import-list {
    margin: 60px auto 30px auto
}

#hellopack .hellopack-list-table-empty .hellopack-list-table-nb {
    max-width: 1080px;
    margin: 0 auto;
    padding: 16px 0 0;
    font-style: italic;
    text-align: center
}

#hellopack .hellopack-import-list-controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 0 16px 0
}

#hellopack .hellopack-import-list-controls .hellopack-search-field {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    margin: 0 0 8px 0
}

#hellopack .hellopack-import-list-controls .hellopack-import-list-number {
    position: relative;
    line-height: 22px;
    pointer-events: none
}

#hellopack .hellopack-list {
    display: inline-block;
    max-width: 1080px;
    margin: -4px;
    padding: 0
}

#hellopack .hellopack-list.hellopack-list-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

#hellopack .hellopack-list.hellopack-list-flex .hellopack-list-item {
    -webkit-box-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    margin: 4px
}

#hellopack .hellopack-list.hellopack-list-flex .hellopack-list-item[hidden] {
    height: 0;
    padding: 0;
    margin-bottom: 0;
    margin-top: 0
}

#hellopack .hellopack-import-list {
    max-width: 1080px;
    margin-top: 30px
}

#hellopack .hellopack-import-list ul {
    max-width: none;
    margin-bottom: 16px;
    -webkit-animation: hellopack-keyframes-from-bottom .6s;
    animation: hellopack-keyframes-from-bottom .6s
}

#hellopack .hellopack-list-item {
    position: relative;
    display: inline-block;
    width: 100px;
    height: 118px;
    padding: 24px 6px;
    margin: 4px 4px 0 4px;
    background-color: #f4f8fb;
    border-radius: 4px;
    text-align: center;
    cursor: pointer
}

#hellopack .hellopack-list-item input+label {
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: auto;
    padding: 22px 6px;
    border: 2px solid transparent;
    border-radius: 4px;
    background-color: #f4f8fb;
    will-change: border-color, background-color;
    -webkit-transition: border-color 0.3s, background-color 0.3s, -webkit-box-shadow 0.3s;
    transition: border-color 0.3s, background-color 0.3s, -webkit-box-shadow 0.3s;
    transition: border-color 0.3s, box-shadow 0.3s, background-color 0.3s;
    transition: border-color 0.3s, box-shadow 0.3s, background-color 0.3s, -webkit-box-shadow 0.3s
}

#hellopack .hellopack-list-item input+label svg.hellopack-check-icon {
    position: absolute;
    width: 12px;
    height: 12px;
    top: 8px;
    left: 8px;
    margin: 0;
    color: #53627C;
    opacity: 0.5;
    -webkit-transition: all .3s;
    transition: all .3s
}

#hellopack .hellopack-list-item input+label:hover {
    background-color: #e0e4e9
}

#hellopack .hellopack-list-item input+label:hover span {
    color: #4c5866
}

#hellopack .hellopack-list-item input+label:hover svg.hellopack-check-icon {
    opacity: 1
}

#hellopack .hellopack-list-item input:hover+label span,
#hellopack .hellopack-list-item input:checked+label span {
    color: #162134
}

#hellopack .hellopack-list-item input:checked+label {
    border-color: #23d160;
    background-color: rgba(62, 207, 142, 0.035)
}

#hellopack .hellopack-list-item input:checked+label:not(:hover) svg.hellopack-check-icon {
    opacity: 1;
    color: #23d160
}

#hellopack .hellopack-list-item input:checked[type="radio"]+label:after {
    opacity: 1
}

#hellopack .hellopack-list-item input:focus+label {
    -webkit-box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15);
    box-shadow: 0 0 0 4px rgba(108, 117, 125, 0.15)
}

#hellopack .hellopack-list-item input[type="radio"]+label:after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    top: 8px;
    left: 8px;
    margin: 0;
    background-color: #53627C;
    border-radius: 8px;
    opacity: 0.5;
    -webkit-transition: all .3s;
    transition: all .3s
}

#hellopack .hellopack-list-item input[type="radio"]:hover+label:after {
    opacity: 1
}

#hellopack .hellopack-list-item span {
    position: relative;
    display: block;
    display: -webkit-box;
    overflow: hidden;
    min-height: 16px;
    max-height: 32px;
    color: #53627C;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    pointer-events: none;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: color .3s ease;
    transition: color .3s ease
}

#hellopack .hellopack-list-item svg {
    position: relative;
    display: block;
    height: 48px;
    width: 36px;
    margin: 0 auto 22px auto;
    color: #53627C;
    pointer-events: none;
    stroke-width: 2.5px;
    -webkit-transition: color .3s ease, stroke .3s ease;
    transition: color .3s ease, stroke .3s ease
}

#hellopack .hellopack-list-item svg use {
    width: 50px
}

#hellopack .hellopack-list-no-result {
    display: none;
    width: 100%;
    margin: 4px;
    padding: 49px 0;
    background-color: #f4f8fb;
    border-radius: 4px;
    text-align: center
}

#hellopack.hellopack-grids-page .hellopack-list.hellopack-list-flex .hellopack-list-item {
    width: calc(100% / 3 - (4px * 3));
    min-width: 110px
}

#hellopack.hellopack-facets-page .hellopack-list.hellopack-list-flex .hellopack-list-item {
    width: calc(100% / 8 - (4px * 4));
    min-width: 110px
}

#hellopack .hellopack-index-stats {
    margin: 8px 0 0;
    font-size: 13px;
    font-style: italic
}

#hellopack .hellopack-index-stats.hellopack-loading {
    -webkit-animation: hellopack-keyframes-fading 1s infinite;
    animation: hellopack-keyframes-fading 1s infinite
}

#hellopack .hellopack-settings-header {
    position: static;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    z-index: 9;
    height: 60px;
    background-color: white;
    border-bottom: 2.5px solid #f4f8fb;
    border-radius: 4px 4px 0 0;
    position: sticky;
    top: 32px
}

#hellopack .hellopack-settings-header .hellopack-settings-header-left {
    display: block;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: 240px
}

#hellopack .hellopack-settings-header .hellopack-settings-header-right {
    display: block;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 9px;
    text-align: right
}

#hellopack .hellopack-settings-header .hellopack-settings-header-right button {
    margin: 0 4px
}

#hellopack .hellopack-settings {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    border-radius: 0 0 4px 4px
}

#hellopack .hellopack-settings .hellopack-settings-content {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 24px 40px 0;
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0
}

#hellopack .hellopack-settings .hellopack-settings-content>.hellopack-settings-tab-content {
    animation: hellopack-keyframes-from-right .7s;
    -webkit-animation: hellopack-keyframes-from-right .7s
}

#hellopack .hellopack-settings .hellopack-settings-content .hellopack-admin-section {
    margin-bottom: 48px
}

#hellopack .hellopack-settings .hellopack-settings-tabs {
    display: block;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 240px;
    max-width: 240px;
    background-color: #f4f8fb;
    border-radius: 0 0 0 4px;
    text-transform: uppercase
}

#hellopack .hellopack-settings .hellopack-settings-tabs ul {
    padding: 0;
    margin: 0
}

#hellopack .hellopack-settings .hellopack-settings-tabs li {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 17px 6px;
    border-left: 2px solid transparent;
    color: #53627C;
    cursor: pointer;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.5px;
    line-height: 16px;
    text-transform: uppercase;
    -webkit-transition: background-color 200ms ease-out, border 200ms ease-out;
    transition: background-color 200ms ease-out, border 200ms ease-out
}

#hellopack .hellopack-settings .hellopack-settings-tabs li:hover {
    color: #162134
}

#hellopack .hellopack-settings .hellopack-settings-tabs li[aria-selected="true"] {
    background-color: white;
    border-color: #3273dc;
    color: #3273dc
}

#hellopack .hellopack-settings .hellopack-settings-tabs li>span {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    left: 0;
    -webkit-transition: left 200ms ease-out, color 200ms ease-out;
    transition: left 200ms ease-out, color 200ms ease-out
}

#hellopack .hellopack-settings .hellopack-settings-tabs li>span svg {
    position: relative;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin: 0 14px;
    vertical-align: top
}

#hellopack .hellopack-settings .hellopack-settings-tabs li:hover>span,
#hellopack .hellopack-settings .hellopack-settings-tabs li[aria-selected="true"]>span {
    left: 8px
}

#hellopack .hellopack-settings .hellopack-settings-field {
    position: relative;
    display: block;
    padding: 4px 0;
    font-size: 14px;
    line-height: 18px
}

#hellopack .hellopack-settings .hellopack-settings-field [data-tooltip]:not(input) {
    position: absolute;
    width: 20px;
    height: 20px;
    padding: 2px;
    top: 6px;
    right: -28px;
    color: #687a9a;
    cursor: pointer
}

#hellopack .hellopack-settings .hellopack-settings-field [data-tooltip]:not(input) svg {
    width: 16px;
    height: 16px;
    pointer-events: none;
    -webkit-transition: color .15s ease-out;
    transition: color .15s ease-out
}

#hellopack .hellopack-settings .hellopack-settings-field [data-tooltip]:not(input):hover svg {
    color: #3273dc
}

#hellopack .hellopack-settings .hellopack-settings-field .hellopack-field-group+[data-tooltip]:not(input) {
    right: -44px
}

#hellopack .hellopack-settings .hellopack-settings-field .hellopack-list+[data-tooltip],
#hellopack .hellopack-settings .hellopack-settings-field .hellopack-image+[data-tooltip],
#hellopack .hellopack-settings .hellopack-settings-field .hellopack-meta-clauses+[data-tooltip] {
    top: -2px
}

#hellopack .hellopack-settings .hellopack-settings-field .hellopack-gallery+[data-tooltip] {
    top: -2px
}

#hellopack .hellopack-settings .hellopack-settings-field .hellopack-layout-holder+[data-tooltip] {
    top: 20px
}

#hellopack .hellopack-settings .hellopack-settings-field .hellopack-field-desc {
    font-size: 13px;
    font-style: italic;
    margin: 0;
    padding: 2px 0 0 0
}

#hellopack .hellopack-settings .hellopack-field-label {
    position: relative;
    display: inline-block;
    width: 216px;
    padding: 6px 16px 6px 0;
    line-height: 20px;
    vertical-align: top
}

#hellopack .hellopack-settings .hellopack-field-input {
    position: relative;
    display: inline-block;
    max-width: 100%;
    vertical-align: top
}

#hellopack .hellopack-settings .hellopack-field-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: -4px;
    padding: 0;
    font-size: 14px;
    line-height: 18px
}

#hellopack .hellopack-settings .hellopack-field-group .hellopack-settings-field {
    position: relative;
    display: inline-block;
    margin: 0 2.5%
}

#hellopack .hellopack-settings .hellopack-field-group .hellopack-settings-field .hellopack-field-label {
    display: block;
    margin: 6px 0 0;
    padding: 0 0 2px 0;
    color: #53627C;
    line-height: 14px;
    font-size: 13px;
    font-weight: 400
}

#hellopack .hellopack-settings [data-field-condition] {
    display: none
}

#hellopack .hellopack-settings-collapse-tabs {
    position: relative;
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 13px
}

#hellopack .hellopack-settings-collapse-tabs svg {
    height: 32px;
    width: 32px;
    padding: 8px;
    background-color: #f4f8fb;
    border-radius: 4px;
    -webkit-transition: background-color .3s ease-out;
    transition: background-color .3s ease-out
}

#hellopack .hellopack-settings-collapse-tabs input {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    opacity: 0
}

#hellopack .hellopack-settings-collapse-tabs input:checked+svg {
    color: #3273dc
}

#hellopack .hellopack-settings-collapse-tabs input:hover+svg,
#hellopack .hellopack-settings-collapse-tabs input:focus+svg {
    background-color: #e0e4e9
}

#hellopack .hellopack-settings-collapsed .hellopack-settings-header .hellopack-settings-header-left {
    max-width: 60px
}

#hellopack .hellopack-settings-collapsed.hellopack-builder-header .hellopack-builder-header-left {
    max-width: 50px;
    border: none
}

#hellopack .hellopack-settings-collapsed .hellopack-settings .hellopack-settings-tabs {
    min-width: 60px;
    max-width: 60px
}

#hellopack .hellopack-settings-collapsed .hellopack-settings .hellopack-settings-tabs li span span {
    display: none
}

#hellopack .hellopack-settings-collapsed .hellopack-settings .hellopack-settings-tabs li:hover>span,
#hellopack .hellopack-settings-collapsed .hellopack-settings .hellopack-settings-tabs li[aria-selected="true"]>span {
    left: 0
}

#hellopack .hellopack-settings-collapsed~.hellopack-builder .hellopack-builder-left-panel {
    max-width: 0;
    border: none
}

#hellopack .hellopack-settings-collapsed~.hellopack-builder .hellopack-builder-left-panel>div {
    visibility: hidden;
    opacity: 0
}

@media screen and (max-width: 782px) {
    #hellopack .hellopack-settings-header {
        top: 46px
    }
}

@media screen and (max-width: 960px) {
    #hellopack .hellopack-settings-header .hellopack-settings-header-left {
        max-width: 60px
    }

    #hellopack .hellopack-settings-header .hellopack-button.hellopack-button-icon {
        overflow: hidden;
        width: 40px;
        height: 40px;
        padding: 0
    }

    #hellopack .hellopack-settings-header .hellopack-button.hellopack-button-icon svg {
        margin: 0 12px
    }

    #hellopack .hellopack-settings .hellopack-settings-content {
        padding: 22px 22px 0
    }

    #hellopack .hellopack-settings .hellopack-settings-tabs {
        min-width: 60px;
        max-width: 60px
    }

    #hellopack .hellopack-settings .hellopack-settings-tabs li span span {
        display: none
    }

    #hellopack .hellopack-settings .hellopack-settings-tabs li:hover>span,
    #hellopack .hellopack-settings .hellopack-settings-tabs li[aria-selected="true"]>span {
        left: auto
    }

    #hellopack .hellopack-settings .hellopack-settings-field [data-tooltip]:not(input) {
        display: none
    }
}

@media screen and (max-width: 600px) {
    #hellopack .hellopack-settings-header {
        top: 0
    }
}

#hellopack .hellopack-card-settings-holder {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    top: 60px;
    right: 0;
    bottom: 0;
    left: 0
}

#hellopack .hellopack-card-settings {
    position: relative;
    overflow: hidden;
    height: 100%;
    width: 845px;
    max-height: 640px;
    max-width: 845px;
    margin: 0 auto;
    padding: 0;
    background-color: white;
    border-radius: 4px;
    -webkit-animation: hellopack-keyframes-zoom-out 0.3s cubic-bezier(0.19, 1.59, 0.49, 0.96);
    animation: hellopack-keyframes-zoom-out 0.3s cubic-bezier(0.19, 1.59, 0.49, 0.96)
}

#hellopack .hellopack-card-settings>h2 {
    padding: 8px 18px;
    margin: 0;
    border: none;
    font-size: 16px;
    text-transform: uppercase;
    border-bottom: 2px solid #f4f8fb
}

#hellopack .hellopack-card-settings .hellopack-settings {
    height: calc(100% - 50px)
}

#hellopack .hellopack-card-settings .hellopack-settings .hellopack-settings-content {
    overflow: hidden;
    overflow-y: auto;
    padding: 10px 28px 0
}

#hellopack .hellopack-card-settings .hellopack-settings .hellopack-settings-content .hellopack-settings-tab-content:first-child .hellopack-field-label {
    width: 100%
}

#hellopack .hellopack-card-settings .hellopack-settings .hellopack-settings-content h2 {
    margin: 0;
    padding: 0 0 8px 0;
    line-height: 20px;
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase
}

#hellopack .hellopack-card-settings .hellopack-settings .hellopack-settings-content h3,
#hellopack .hellopack-card-settings .hellopack-settings .hellopack-settings-content h4 {
    padding: 0 0 8px 0
}

#hellopack .hellopack-card-settings .hellopack-settings .hellopack-admin-section {
    margin-bottom: 26px
}

#hellopack .hellopack-card-settings .hellopack-settings .hellopack-admin-section:first-child {
    margin-top: 8px
}

#hellopack .hellopack-card-settings>.hellopack-button {
    position: absolute;
    top: 8px;
    right: 48px;
    vertical-align: middle
}

#hellopack .hellopack-card-settings .hellopack-card-settings-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 32px;
    height: 32px;
    padding: 8px;
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #162134;
    -webkit-transition: color .3s;
    transition: color .3s
}

#hellopack .hellopack-card-settings .hellopack-card-settings-close:after {
    display: none
}

#hellopack .hellopack-card-settings .hellopack-card-settings-close:hover {
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #ff3960
}

#hellopack .hellopack-card-settings .hellopack-card-settings-close svg {
    width: 16px;
    height: 16px;
    pointer-events: none
}

#hellopack.postbox {
    padding: 0
}

#hellopack.postbox .inside {
    margin: 0;
    padding: 0
}

#hellopack.postbox>h2 {
    font-size: 14px;
    padding: 8px 12px;
    margin: 0;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.4;
    text-transform: none
}

#hellopack.postbox>h2 span {
    color: #191e23
}

#hellopack.postbox h3 {
    margin: 0;
    border: 0;
    color: #191e23;
    letter-spacing: 0
}

#side-sortables #hellopack.postbox h2,
#side-sortables #hellopack.postbox h3,
#side-sortables #hellopack.postbox label,
#side-sortables #hellopack.postbox p,
#side-sortables #hellopack.postbox .hellopack-settings-tabs li {
    font-size: 13px;
    letter-spacing: 0;
    text-transform: none
}

#side-sortables #hellopack.postbox h3 {
    padding: 0 0 8px 0;
    font-weight: 600
}

#side-sortables #hellopack.postbox .hellopack-settings {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0;
    width: 100%
}

#side-sortables #hellopack.postbox .hellopack-field-label {
    padding: 4px 0 8px 0
}

#side-sortables #hellopack.postbox .hellopack-admin-section {
    margin-bottom: 26px
}

#side-sortables #hellopack.postbox .hellopack-settings-tabs {
    min-width: 100%;
    height: 46px
}

#side-sortables #hellopack.postbox .hellopack-settings-tabs li {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 50%;
    padding: 15px 0px;
    border: none;
    font-weight: 600;
    text-align: center
}

#side-sortables #hellopack.postbox .hellopack-settings-tabs li span {
    width: 100%;
    left: 0;
    right: 0
}

#side-sortables #hellopack.postbox .hellopack-settings-tabs li span svg {
    display: none
}

#side-sortables #hellopack.postbox .hellopack-settings-tabs li[aria-selected="true"] {
    border-color: #3273dc
}

#side-sortables #hellopack.postbox .hellopack-settings-tabs li:hover>span,
#side-sortables #hellopack.postbox .hellopack-settings-tabs li[aria-selected="true"]>span {
    -webkit-transform: none;
    transform: none
}

#side-sortables #hellopack.postbox .hellopack-settings-content {
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0;
    padding: 16px
}

#side-sortables #hellopack.postbox .hellopack-settings-content p {
    margin: 0 0 4px 0;
    font-size: 12px;
    line-height: 16px
}

#side-sortables #hellopack.postbox .hellopack-settings-content p br {
    display: none
}

#side-sortables #hellopack.postbox .hellopack-settings-content .hellopack-settings-field {
    padding: 2px 0
}

#side-sortables #hellopack.postbox .hellopack-settings-content .hellopack-radio-list .hellopack-radio-item {
    margin: 2px
}

@media screen and (max-width: 680px) {
    #hellopack .hellopack-card-settings>h2 {
        color: transparent
    }
}

#hellopack .hellopack-grid-preview-holder {
    position: fixed;
    display: none;
    z-index: 99999;
    top: 40px;
    right: 40px;
    bottom: 40px;
    left: 40px;
    -webkit-animation: hellopack-keyframes-from-bottom .3s
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-overlay {
    position: absolute;
    top: -100px;
    right: -100px;
    bottom: -100px;
    left: -100px;
    background-color: rgba(40, 54, 70, 0.4)
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-inner {
    position: absolute;
    display: block;
    overflow: hidden;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    max-width: 1920px;
    min-width: 290px;
    margin: 0 auto;
    padding: 60px 0 0;
    background-color: white;
    border-radius: 4px;
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1)
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-inner:after {
    content: "";
    position: absolute;
    top: 60px;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(40, 54, 70, 0.8);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.25s, visibility 0.25s;
    transition: opacity 0.25s, visibility 0.25s
}

#hellopack .hellopack-grid-preview-holder[data-disabled] .hellopack-grid-preview-inner:after {
    opacity: 1;
    visibility: visible
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header {
    position: absolute;
    display: block;
    z-index: 2;
    height: 60px;
    top: 0;
    right: 0;
    left: 0;
    -webkit-box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    box-shadow: 0 8px 20px 0 rgba(14, 21, 47, 0.1);
    text-align: center
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header ul {
    position: relative;
    display: block;
    margin: 0;
    padding: 0
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header ul li {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 0;
    padding: 18px 12px;
    cursor: pointer;
    -webkit-transition: color .3s;
    transition: color .3s
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header ul li:hover,
#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header ul li.hellopack-active {
    color: #3273dc
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header ul li svg {
    width: 24px;
    height: 24px;
    pointer-events: none;
    vertical-align: middle
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-search-field {
    margin: 10px 16px
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-search-field input {
    min-width: 320px
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-close,
#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-update {
    position: absolute;
    top: 0;
    right: 0;
    width: 44px;
    height: 60px;
    padding: 20px 12px;
    cursor: pointer;
    -webkit-transition: color .3s;
    transition: color .3s
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-close:hover,
#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-update:hover {
    color: #ff3960
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-close svg,
#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-update svg {
    width: 20px;
    height: 20px;
    pointer-events: none;
    vertical-align: middle
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-update {
    right: 44px
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-update:hover {
    color: #23d160
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header.hellopack-grid-preview-small {
    text-align: left
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header.hellopack-grid-preview-small ul {
    margin: 0 8px
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header.hellopack-grid-preview-small ul li {
    padding: 18px 8px
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header.hellopack-grid-preview-small .hellopack-grid-preview-close {
    width: 36px;
    padding: 20px 6px
}

#hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header.hellopack-grid-preview-small .hellopack-grid-preview-update {
    display: none
}

#hellopack .hellopack-grid-preview-holder .hellopack-preloader {
    top: 60px
}

#hellopack .hellopack-grid-preview-holder iframe[name="hellopack_preview"] {
    position: relative;
    width: 100%;
    height: 100%;
    vertical-align: top;
    opacity: 0;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s
}

@media screen and (max-width: 680px) {
    #hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header {
        text-align: left
    }
}

@media screen and (max-width: 480px) {
    #hellopack .hellopack-grid-preview-holder {
        top: 18px;
        right: 18px;
        bottom: 18px;
        left: 18px
    }

    #hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header ul {
        margin: 0 8px
    }

    #hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header ul li {
        padding: 18px 8px
    }

    #hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-close {
        width: 36px;
        padding: 20px 6px
    }

    #hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-update {
        display: none
    }

    #hellopack .hellopack-grid-preview-holder .hellopack-grid-preview-header .hellopack-grid-preview-update {
        right: 36px
    }
}

#hellopack .hellopack-list-table-controls {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin: 80px 0 0 0;
    border-radius: 4px 0 0 4px
}

#hellopack .hellopack-list-table-bulk-actions select,
#hellopack .hellopack-list-table-bulk-actions .hellopack-select,
#hellopack .hellopack-list-table-bulk-actions .hellopack-select-wrapper {
    margin: 0 0 16px 0
}

#hellopack .hellopack-list-table-search {
    margin-left: auto
}

#hellopack .hellopack-list-table-counter {
    margin: -8px 0 0;
    line-height: 22px;
    text-align: right;
    pointer-events: none
}

#hellopack .hellopack-list-table-rows {
    margin: 0;
    padding: 0;
    -webkit-animation: hellopack-keyframes-from-bottom .6s;
    animation: hellopack-keyframes-from-bottom .6s;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease
}

#hellopack .hellopack-list-table-rows.hellopack-loading {
    opacity: 0.5
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-state="true"],
#hellopack .hellopack-list-table-rows .hellopack-list-table-column span[data-state="true"] {
    color: #23d160;
    font-weight: bold
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-state="false"],
#hellopack .hellopack-list-table-rows .hellopack-list-table-column span[data-state="false"] {
    color: #ff3960;
    font-weight: bold
}

#hellopack.hellopack-cards-page .hellopack-list-table-rows {
    -webkit-animation: none;
    animation: none
}

#hellopack.hellopack-cards-page .hellopack-list-table-rows iframe {
    opacity: 0;
    background-color: #f4f8fb;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease
}

#hellopack.hellopack-cards-page .hellopack-list-table-rows .hellopack-grid-preview-inner {
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease
}

#hellopack.hellopack-cards-page .hellopack-list-table-rows.hellopack-loading .hellopack-grid-preview-inner {
    opacity: 0
}

#hellopack.hellopack-cards-page .hellopack-list-table-rows.hellopack-loading iframe {
    opacity: 0
}

#hellopack.hellopack-cards-page .hellopack-list-table-rows.hellopack-loading {
    opacity: 1
}

#hellopack .hellopack-list-table-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    /*    height: 50px; */
    margin: 0;
    padding: 0;
    /*   border-radius: 4px;; */
    list-style: none
}

#hellopack .hellopack-list-table-row:nth-child(odd) {
    background-color: #f4f8fb
}

#hellopack .hellopack-list-table-row.hellopack-list-table-noresult {
    height: 250px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center
}

#hellopack .hellopack-list-table-row.hellopack-list-table-noresult h4 {
    font-size: 22px;
    font-weight: bold;
    line-height: 28px
}

#hellopack .hellopack-list-table-row .hellopack-list-table-column {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 15px 8px;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px
}

#hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="type"],
#hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="select"],
#hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="favorite"] {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    width: 42px;
    min-width: 42px;
    max-width: 42px;
    text-align: center
}

#hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="type"]>input+label,
#hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="select"]>input+label,
#hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="favorite"]>input+label {
    vertical-align: top
}

#hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="actions"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    width: 186px;
    min-width: 186px;
    max-width: 186px
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column>* {
    white-space: nowrap
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="name"] a {
    color: #53627C
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="name"] a:hover,
#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="name"] a:focus {
    color: #3273dc
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="name"] a span {
    position: relative;
    display: inline-block;
    padding: 0 4px;
    margin: 2px 0;
    background-color: #23d160;
    border-radius: 4px;
    color: white;
    font-size: 9px;
    height: 16px;
    letter-spacing: 1px;
    line-height: 16px;
    vertical-align: top;
    text-transform: uppercase
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="favorite"] button {
    height: 20px;
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    outline: none;
    color: #53627C;
    cursor: pointer;
    -webkit-appearance: none
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="favorite"] use {
    -webkit-transition: color 0.3s ease, fill 0.3s ease;
    transition: color 0.3s ease, fill 0.3s ease
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="favorite"] .hellopack-star-empty {
    fill: transparent
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="favorite"] .hellopack-star-empty:hover * {
    color: #f7ab13
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="favorite"] .hellopack-star-fill {
    color: #f7ab13;
    fill: #f7ab13
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="favorite"] .hellopack-star-fill:hover * {
    fill: transparent
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="favorite"] button.hellopack-star-empty:focus {
    color: #f7ab13;
    fill: #f7ab13
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="favorite"] button.hellopack-star-fill:focus {
    fill: transparent
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="favorite"] svg {
    height: 20px;
    width: 16px;
    cursor: pointer
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="shortcode"] {
    overflow: visible
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="shortcode"] span {
    overflow: hidden;
    height: 20px;
    padding: 0 24px 0 0;
    white-space: normal;
    cursor: pointer
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="shortcode"] span+svg {
    width: 16px;
    height: 16px;
    line-height: 16px;
    margin: 0 0 0 -16px;
    padding: 0;
    opacity: 0;
    pointer-events: none;
    vertical-align: middle;
    will-change: transform;
    will-change: transform;
    -webkit-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="shortcode"] span+svg:hover {
    opacity: 1;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1)
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="shortcode"] span:hover+svg {
    opacity: 1;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1)
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="shortcode"] span.hellopack-shortcode-copied+svg {
    color: #23d160
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="type"] span {
    display: block
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="type"] svg {
    height: 20px;
    width: 16px;
    vertical-align: top;
    stroke-width: 1.5;
    overflow: visible
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-column[data-colname="modified_date"] abbr {
    cursor: default;
    border-bottom: 1px dotted;
    text-decoration: none
}

#hellopack .hellopack-list-table-header .hellopack-list-table-row {
    background-color: transparent
}

#hellopack .hellopack-list-table-header .hellopack-list-table-column[data-colname="type"]>span,
#hellopack .hellopack-list-table-header .hellopack-list-table-column[data-colname="select"]>span,
#hellopack .hellopack-list-table-header .hellopack-list-table-column[data-colname="favorite"]>span {
    display: none
}

#hellopack .hellopack-list-table-header .hellopack-list-table-column[data-colname="actions"]>* {
    display: none
}

#hellopack .hellopack-list-table-header .hellopack-list-table-column>span {
    display: inline-block;
    position: relative;
    vertical-align: top;
    color: #162134;
    font-weight: 700;
    line-height: 20px;
    text-transform: uppercase
}

#hellopack .hellopack-list-table-header .hellopack-list-table-column .hellopack-list-table-indicators {
    position: relative;
    display: inline-block;
    width: 15px;
    margin: 0 5px
}

#hellopack .hellopack-list-table-header .hellopack-list-table-column .hellopack-list-table-indicators span {
    position: relative;
    display: block;
    width: 8px;
    height: 7px;
    margin: 2px auto;
    color: #a5b0c3;
    cursor: pointer
}

#hellopack .hellopack-list-table-header .hellopack-list-table-column .hellopack-list-table-indicators span:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid;
    -webkit-transition: color 0.3s ease-in-out;
    transition: color 0.3s ease-in-out
}

#hellopack .hellopack-list-table-header .hellopack-list-table-column .hellopack-list-table-indicators span:last-child:after {
    border-bottom: none;
    border-top: 6px solid
}

#hellopack .hellopack-list-table-header .hellopack-list-table-column .hellopack-list-table-indicators span:hover,
#hellopack .hellopack-list-table-header .hellopack-list-table-column .hellopack-list-table-indicators span.hellopack-sorting-active {
    color: #3273dc
}

#hellopack [data-type="cards"] .hellopack-list-table-row {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

#hellopack [data-type="cards"] .hellopack-list-table-row .hellopack-list-table-column {
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    width: auto;
    max-width: none
}

#hellopack [data-type="cards"] .hellopack-list-table-row .hellopack-list-table-column>span {
    display: inline-block
}

#hellopack .hellopack-list-table-rows .hellopack-list-table-cards {
    position: relative;
    background-color: #f4f8fb;
    min-height: 500px;
    border-radius: 4px
}

#hellopack .hellopack-list-table-rows iframe {
    position: relative;
    width: 100%;
    height: 100%;
    vertical-align: top;
    -webkit-animation: hellopack-keyframes-from-bottom .3s;
    animation: hellopack-keyframes-from-bottom .3s
}

#hellopack .hellopack-list-table-wrapper .hellopack-delete-item {
    background-color: rgba(248, 84, 100, 0.1)
}

#hellopack .hellopack-list-table-wrapper .hellopack-duplicate-item {
    background-color: rgba(62, 207, 142, 0.1)
}

#hellopack .hellopack-list-table-wrapper .hellopack-favorite-item {
    opacity: 0.75
}

#hellopack .hellopack-list-table-actions {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

#hellopack .hellopack-list-table-actions a,
#hellopack .hellopack-list-table-actions button {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
    color: #53627C;
    background: none;
    border: none;
    outline: none;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out
}

#hellopack .hellopack-list-table-actions a:hover,
#hellopack .hellopack-list-table-actions a:focus,
#hellopack .hellopack-list-table-actions button:hover,
#hellopack .hellopack-list-table-actions button:focus {
    color: #23d160
}

#hellopack .hellopack-list-table-actions a[data-action^="preview"]:hover,
#hellopack .hellopack-list-table-actions a[data-action^="preview"]:focus,
#hellopack .hellopack-list-table-actions button[data-action^="preview"]:hover,
#hellopack .hellopack-list-table-actions button[data-action^="preview"]:focus {
    color: #7a54cd
}

#hellopack .hellopack-list-table-actions a[data-action^="delete"]:hover,
#hellopack .hellopack-list-table-actions a[data-action^="delete"]:focus,
#hellopack .hellopack-list-table-actions button[data-action^="delete"]:hover,
#hellopack .hellopack-list-table-actions button[data-action^="delete"]:focus {
    color: #ff3960
}

#hellopack .hellopack-list-table-actions a[data-action^="duplicate"]:hover,
#hellopack .hellopack-list-table-actions a[data-action^="duplicate"]:focus,
#hellopack .hellopack-list-table-actions button[data-action^="duplicate"]:hover,
#hellopack .hellopack-list-table-actions button[data-action^="duplicate"]:focus {
    color: #253858
}

#hellopack .hellopack-list-table-actions a[data-action^="export"]:hover,
#hellopack .hellopack-list-table-actions a[data-action^="export"]:focus,
#hellopack .hellopack-list-table-actions button[data-action^="export"]:hover,
#hellopack .hellopack-list-table-actions button[data-action^="export"]:focus {
    color: #3273dc
}

#hellopack .hellopack-list-table-actions svg {
    width: 24px;
    height: 16px;
    margin: 2px 4px;
    vertical-align: top;
    pointer-events: none
}

#hellopack .hellopack-list-table-footer {
    margin: 36px 0 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

#hellopack .hellopack-list-table-footer .hellopack-select-wrapper select,
#hellopack .hellopack-list-table-footer .hellopack-select-wrapper .hellopack-select {
    width: 60px;
    font-weight: bold;
    text-align: left
}

#hellopack .hellopack-list-table-footer .hellopack-select-wrapper select .hellopack-select-placeholder,
#hellopack .hellopack-list-table-footer .hellopack-select-wrapper .hellopack-select .hellopack-select-placeholder {
    font-weight: bold
}

@media screen and (max-width: 1680px) {
    #hellopack .hellopack-list-table-column[data-colname="shortcode"] {
        display: none
    }
}

@media screen and (max-width: 1280px) {
    #hellopack .hellopack-list-table-column[data-colname="source"] {
        display: none
    }
}

@media screen and (max-width: 880px) {

    #hellopack .hellopack-list-table-search,
    #hellopack .hellopack-list-table-counter {
        display: none
    }

    #hellopack .hellopack-list-table-column[data-colname="modified_date"] {
        display: none
    }
}

@media screen and (max-width: 660px) {
    #hellopack .hellopack-list-table-bulk-actions {
        display: none
    }

    #hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="type"],
    #hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="select"],
    #hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="favorite"] {
        display: none
    }

    #hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="actions"] {
        max-width: 80px;
        min-width: 80px
    }

    #hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="actions"] [data-action="export_items"],
    #hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="actions"] [data-action="preview_grid"],
    #hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="actions"] [data-action="duplicate_items"] {
        display: none
    }
}

@media screen and (max-width: 480px) {
    #hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="actions"] {
        max-width: 48px;
        min-width: 48px
    }

    #hellopack .hellopack-list-table-row .hellopack-list-table-column[data-colname="actions"] [data-action="delete_items"] {
        display: none
    }
}

#hellopack .hellopack-button.hellopack-indexing {
    z-index: 0;
    background-size: 0 100%;
    -webkit-animation: hellopack-keyframes-loading 1s infinite;
    animation: hellopack-keyframes-loading 1s infinite
}

#hellopack .hellopack-button.hellopack-indexing:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.15)), to(rgba(0, 0, 0, 0.15)));
    background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15));
    background-size: inherit;
    background-repeat: no-repeat;
    -webkit-transition: background 0.5s ease-in-out;
    transition: background 0.5s ease-in-out
}

#hellopack input[name="hellopack_id"][value="0"]~div .hellopack-button[data-action="index"] {
    display: none
}

#hellopack .hellopack-admin-section-action .hellopack-button[data-action="index_all"] {
    margin: 0 8px 0 auto
}

#hellopack .hellopack-t-red {
    color: #ff3960;
}

#hellopack .hellopack-t-green {
    color: #23d160;
}

#hellopack #hp_api_status_text .hellopack-license-status>strong svg {
    position: relative;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin: 0 14px;
    vertical-align: top;
}

#hellopack .notice-error {
    position: relative;
    display: block;
    margin: 0 0 20px;
    padding: 20px;
    background-color: #ffffff;
    border-left: 5px solid #ff3960;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

#hellopack .notice-error>p {
    margin: 0px;
    color: #162134;
}

#hellopack .description {
    margin-top: 15px;
    display: block !important;
}

/*
#hellopack .form-table tr:nth-child(6) {
    display: none;
}


#hellopack .form-table tr:nth-child(5) {
    visibility: hidden;
}

#hp_check_api {
    visibility: visible;
}
*/

#hellopack li.hellopack-list-table-row {
    margin-bottom: 5px;
}

#hellopack li.hellopack-list-table-row>div {
    padding: 15px 8px;
    font-size: 14px;
    line-height: 20px;
}

#hellopack ul.hellopack-tester-list .hellopack-list-table-name {
    flex: 1;
    flex-basis: 50px;
    font-weight: 600;
}

#hellopack ul.hellopack-tester-list .hellopack-list-table-description {
    flex: 2;
    flex-basis: 200px;
}

#hellopack ul.hellopack-tester-list .ok {
    border-left: 5px solid #23d160;
}

#hellopack ul.hellopack-tester-list .bug {
    border-left: 5px solid #ff3960;
}

#hellopack .notice-success {
    position: relative;
    display: block;
    margin: 0 0 20px;
    padding: 20px;
    background-color: #ffffff;
    border: none;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    border-left: 5px solid #23d160;
}

#hellopack .notice-success>p {
    margin: 0px;
    color: #162134;
}

#hellopack .notice {
    display: flex;
}

#hellopack .notice>p {
    margin-right: 20px;
}

#hellopack .notice p:nth-child(3) {
    display: none;
}

#hellopack #hellopack-system-info-raw-code {
    display: block;
    width: 100%;
    height: 200px;
    margin-top: 20px;
}

ul#hellopack-admin-navigation {
    justify-content: flex-end !important;
}

#hellopack .hellopack-header {
    background-color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1)
}

#hellopack .hellopack-text-icon {
    max-height: 25px;
    max-width: 25px;
}

#hellopack .hellopack-whitelabel {
    display: flex;
    align-items: center;
    color: #162134;
    font-size: 26px;
    line-height: 32px;
}

#hellopack .hellopack-whitelabel svg {
    margin-right: 5px;
    height: 1em;
    width: auto;
    max-height: 25px;
    max-width: 24px;
    color: #23d160 !important;
}

#hellopack_settings_main #hellopack .form-table tr:nth-child(2) {
    display: none !important;
}