/*
Theme Name: Organic Food
Author: DHsign
Version: 2.0.0
Description: Organic Food Ecwid Eshop Responsive Html Template Made by DHsign
*/
/*---------------------------------*/
/* Custom page CSS                 */
/* Mega Menu CSS                   */
/* Off Canvas Toggler CSS          */
/* Off Canvas Menu CSS             */
/* Top Bar CSS                     */
/* Module CSS                      */
/* Header CSS                      */
/* Top Bars CSS                    */
/* Bottom CSS                      */
/* Footer CSS                      */
/* Coming Soon CSS                 */
/* Error Page CSS                  */
/* Slider Section CSS              */
/* Sections CSS                    */
/*---------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700&amp;subset=vietnamese');
@import url('https://fonts.googleapis.com/css?family=Lobster&amp;subset=vietnamese');

body {
    font-family: 'Open Sans', sans-serif;
    font-weight: normal;
    line-height: 24px
}

h1 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 900
}

h2 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700
}

h3 {
    font-family: 'Open Sans', sans-serif;
    font-size: 24px;
    font-weight: normal
}

h4 {
    font-family: 'Open Sans', sans-serif;
    font-weight: normal
}

h5 {
    font-family: 'Open Sans', sans-serif;
    font-weight: normal
}

h6 {
    font-family: Lobster, sans-serif;
    font-size: 24px;
    font-weight: normal
}

.uk-button {
    font-family: 'Open Sans', sans-serif;
    font-weight: normal
}

.readon {
    font-family: 'Open Sans', sans-serif;
    font-weight: normal
}

.form-control {
    display: block;
    height: 40px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    color: #555555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
}

.form-control:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6)
}

.form-control::-moz-placeholder {
    color: #999;
    opacity: 1
}

.form-control:-ms-input-placeholder {
    color: #999
}

.form-control::-webkit-input-placeholder {
    color: #999
}

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    cursor: not-allowed;
    background-color: #eeeeee;
    opacity: 1
}

.btn {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

textarea.form-control {
    height: auto
}

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

[class^="icon-"], [class*=" icon-"] {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: .25em;
    line-height: 14px;
    background-image: none
}

dd > span[class^="icon-"] + time, dd > span[class*=" icon-"] + time {
    margin-left: -0.25em
}

dl.article-info dd.hits span[class^="icon-"], dl.article-info dd.hits span[class*=" icon-"] {
    margin-right: 0
}

[class^="icon-"]:before, [class*=" icon-"]:before {
    font-family: 'IcoMoon';
    font-style: normal;
    speak: none
}

[class^="icon-"].disabled, [class*=" icon-"].disabled {
    font-weight: normal
}

.body-wrapper:after {
    right: 0
}

.body-wrapper:after {
    position: absolute;
    top: 0;
    width: 0;
    height: 0;
    background: rgba(0, 0, 0, 0.8);
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.5s, width 0.1s 0.5s, height 0.1s 0.5s;
    transition: opacity 0.5s, width 0.1s 0.5s, height 0.1s 0.5s;
    z-index: 999
}

a {
    -webkit-transition: color 400ms, background-color 400ms;
    transition: color 400ms, background-color 400ms
}

a, a:hover, a:focus, a:active {
    text-decoration: none
}

label {
    font-weight: normal
}

legend {
    padding-bottom: 10px
}

img {
    display: block;
    max-width: 100%;
    height: auto
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: #444444
}

.btn {
    -webkit-transition: color 400ms, background-color 400ms, border-color 400ms;
    -o-transition: color 400ms, background-color 400ms, border-color 400ms;
    transition: color 400ms, background-color 400ms, border-color 400ms
}

.offline-inner {
    margin-top: 100px
}

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
    display: block;
    height: 40px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    color: #555555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    width: 100%;
    border-radius: 0;
}

select:focus, textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus {
    outline: 0;
}

select::-moz-placeholder, textarea::-moz-placeholder, input[type="text"]::-moz-placeholder, input[type="password"]::-moz-placeholder, input[type="datetime"]::-moz-placeholder, input[type="datetime-local"]::-moz-placeholder, input[type="date"]::-moz-placeholder, input[type="month"]::-moz-placeholder, input[type="time"]::-moz-placeholder, input[type="week"]::-moz-placeholder, input[type="number"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="url"]::-moz-placeholder, input[type="search"]::-moz-placeholder, input[type="tel"]::-moz-placeholder, input[type="color"]::-moz-placeholder, .uneditable-input::-moz-placeholder {
    color: #999;
    opacity: 1
}

select:-ms-input-placeholder, textarea:-ms-input-placeholder, input[type="text"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="datetime"]:-ms-input-placeholder, input[type="datetime-local"]:-ms-input-placeholder, input[type="date"]:-ms-input-placeholder, input[type="month"]:-ms-input-placeholder, input[type="time"]:-ms-input-placeholder, input[type="week"]:-ms-input-placeholder, input[type="number"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder, input[type="url"]:-ms-input-placeholder, input[type="search"]:-ms-input-placeholder, input[type="tel"]:-ms-input-placeholder, input[type="color"]:-ms-input-placeholder, .uneditable-input:-ms-input-placeholder {
    color: #999
}

select::-webkit-input-placeholder, textarea::-webkit-input-placeholder, input[type="text"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="datetime"]::-webkit-input-placeholder, input[type="datetime-local"]::-webkit-input-placeholder, input[type="date"]::-webkit-input-placeholder, input[type="month"]::-webkit-input-placeholder, input[type="time"]::-webkit-input-placeholder, input[type="week"]::-webkit-input-placeholder, input[type="number"]::-webkit-input-placeholder, input[type="email"]::-webkit-input-placeholder, input[type="url"]::-webkit-input-placeholder, input[type="search"]::-webkit-input-placeholder, input[type="tel"]::-webkit-input-placeholder, input[type="color"]::-webkit-input-placeholder, .uneditable-input::-webkit-input-placeholder {
    color: #999
}

select[disabled], select[readonly], fieldset[disabled] select, textarea[disabled], textarea[readonly], fieldset[disabled] textarea, input[type="text"][disabled], input[type="text"][readonly], fieldset[disabled] input[type="text"], input[type="password"][disabled], input[type="password"][readonly], fieldset[disabled] input[type="password"], input[type="datetime"][disabled], input[type="datetime"][readonly], fieldset[disabled] input[type="datetime"], input[type="datetime-local"][disabled], input[type="datetime-local"][readonly], fieldset[disabled] input[type="datetime-local"], input[type="date"][disabled], input[type="date"][readonly], fieldset[disabled] input[type="date"], input[type="month"][disabled], input[type="month"][readonly], fieldset[disabled] input[type="month"], input[type="time"][disabled], input[type="time"][readonly], fieldset[disabled] input[type="time"], input[type="week"][disabled], input[type="week"][readonly], fieldset[disabled] input[type="week"], input[type="number"][disabled], input[type="number"][readonly], fieldset[disabled] input[type="number"], input[type="email"][disabled], input[type="email"][readonly], fieldset[disabled] input[type="email"], input[type="url"][disabled], input[type="url"][readonly], fieldset[disabled] input[type="url"], input[type="search"][disabled], input[type="search"][readonly], fieldset[disabled] input[type="search"], input[type="tel"][disabled], input[type="tel"][readonly], fieldset[disabled] input[type="tel"], input[type="color"][disabled], input[type="color"][readonly], fieldset[disabled] input[type="color"], .uneditable-input[disabled], .uneditable-input[readonly], fieldset[disabled] .uneditable-input {
    cursor: not-allowed;
    background-color: #eeeeee;
    opacity: 1
}

textareaselect, textareatextarea, textareainput[type="text"], textareainput[type="password"], textareainput[type="datetime"], textareainput[type="datetime-local"], textareainput[type="date"], textareainput[type="month"], textareainput[type="time"], textareainput[type="week"], textareainput[type="number"], textareainput[type="email"], textareainput[type="url"], textareainput[type="search"], textareainput[type="tel"], textareainput[type="color"], textarea.uneditable-input {
    height: auto
}

.group-control select, .group-control textarea, .group-control input[type="text"], .group-control input[type="password"], .group-control input[type="datetime"], .group-control input[type="datetime-local"], .group-control input[type="date"], .group-control input[type="month"], .group-control input[type="time"], .group-control input[type="week"], .group-control input[type="number"], .group-control input[type="email"], .group-control input[type="url"], .group-control input[type="search"], .group-control input[type="tel"], .group-control input[type="color"], .group-control .uneditable-input {
    width: 100%
}

legend {
    font-size: 10px
}

.form-actions {
    margin: 0
}

.dl-horizontal dt {
    margin: 8px 0;
    text-align: left
}

.page-header {
    padding-bottom: 15px
}

table.category {
    width: 100%
}

table.category thead > tr, table.category tbody > tr {
    border: 1px solid #f2f2f2
}

table.category thead > tr th, table.category thead > tr td, table.category tbody > tr th, table.category tbody > tr td {
    padding: 10px
}

.contact-form .form-actions {
    background: none;
    border: none
}

@media print {
    .visible-print {
        display: inherit !important
    }

    .hidden-print {
        display: none !important
    }
}

.simpleportfolio .simpleportfolio-filter > ul > li > a {
    background: #2D2D2D;
    border-radius: 2px;
    color: #fff;
    -webkit-transition: 300ms;
    transition: 300ms
}

.grayscale img {
    opacity: 0.4;
    filter: alpha(opacity=40);
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    -webkit-transition: 300ms;
    transition: 300ms;
    display: inline-block
}

.grayscale img:hover {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
    -webkit-transition: 300ms;
    transition: 300ms
}

.no-margin p {
    margin: 0
}

.uk-button {
    font-size: 14px;
    border-radius: 5px;
    color: #444444;
    background: transparent;
    border: 1px solid #444444;
    padding: 5px 12px;
    box-shadow: none;
    text-shadow: none;
    transition: all 0.3s ease-in-out 0s
}

.uk-button:hover, .uk-button:focus {
    color: #fff;
    background: #444444;
    transition: all 0.3s ease-in-out 0s
}

.uk-button-group > .uk-button:not(:first-child):not(:last-child), .uk-button-group > div:not(:first-child):not(:last-child) .uk-button {
    border-radius: 0;
    border-left-color: rgba(0, 0, 0, 0.1);
    border-right-color: rgba(0, 0, 0, 0.1);
}

.uk-button-group > .uk-button:first-child, .uk-button-group > div:first-child .uk-button {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.uk-button-group > .uk-button:last-child, .uk-button-group > div:last-child .uk-button {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0
}

.uk-text-white {
    color: #fff !important
}

.uk-text-white h1, .uk-text-white h2, .uk-text-white h3, .uk-text-white h4, .uk-text-white h5, .uk-text-white h6 {
    color: #fff !important
}

.inverted .uk-button {
    color: #fff;
    background: transparent;
    border: 1px solid #fff
}

.inverted .uk-button:hover, .inverted .uk-button:focus {
    color: #444444;
    background: #fff
}

.uk-button-mini {
    font-size: 10px
}

.uk-button-large {
    font-size: 18px;
    padding: 10px 20px
}

.uk-button-primary, .uk-button-success, .uk-button-danger {
    box-shadow: none;
    text-shadow: none
}

.uk-badge {
    border: 5px;
    padding: 10px
}

.uk-badge-success, .uk-button-success {
    color: #fff;
    background: #4aa222;
    border: 1px solid #4aa222
}

.uk-badge-success:hover, .uk-badge-success:focus, .uk-button-success:hover, .uk-button-success:focus {
    background: rgba(74, 162, 34, 0.8);
    border: 1px solid #4aa222
}

.uk-badge-danger, .uk-button-danger {
    color: #fff;
    background: #dd5b4e;
    border: 1px solid #dd5b4e
}

.uk-badge-danger:hover, .uk-badge-danger:focus, .uk-button-danger:hover, .uk-button-danger:focus {
    background: rgba(221, 91, 78, 0.8);
    border: 1px solid #dd5b4e
}

.uk-badge-warning, .uk-button-warning {
    color: #fff;
    background: #f1c40f;
    border: 1px solid #f1c40f
}

.uk-badge-warning:hover, .uk-badge-warning:focus, .uk-button-warning:hover, .uk-button-warning:focus {
    background: rgba(241, 196, 15, 0.8);
    border: 1px solid #f1c40f
}

.input-mini {
    width: 80px
}

.container1140 {
    width: 1140px;
    max-width: 1140px;
    z-index: 1;
    margin: 0 auto;
    position: relative
}

.container910 {
    width: 910px
}

.padding-0 {
    padding-left: 0;
    padding-right: 0
}

.padding-50 {
    padding: 50px
}

.lato85 {
    font-family: 'Open Sans', serif;
    font-size: 85px;
    letter-spacing: -2px
}

@media (max-width: 380px) {
    .lato24 {
        font-size: 6px;
        letter-spacing: 0;
    }

    .lato36 {
        font-size: 8px;
        letter-spacing: 0;
    }
}

@media (max-width: 485px) {
    .lato84 {
        font-size: 24px;
        line-height: 10px;
        letter-spacing: -1px
    }

    .lato56 {
        font-size: 14px;
        min-height: 0;
        min-width: 0;
        line-height: 12px;
        border-width: 0;
        margin: 4px;
        padding: 0
    }

    .lato36 {
        font-size: 10px;
        letter-spacing: 0;
    }

    .lato30 {
        font-size: 9px;
        letter-spacing: 0;
    }

    .lato24 {
        font-size: 8px;
        letter-spacing: 0;
    }

    .lato18 {
        font-size: 7px;
        letter-spacing: 0;
    }

    .lato16 {
        font-size: 7px;
        letter-spacing: 0;
    }

    .lato100 {
        font-size: 25px;
        line-height: 21px;
        letter-spacing: -2px
    }
}

@media (min-width: 486px) {
    .lato84 {
        font-size: 46px;
        line-height: 40px;
        letter-spacing: -1px
    }

    .lato56 {
        font-size: 34px;
        min-height: 0;
        min-width: 0;
        line-height: 28px;
        border-width: 0;
        padding: 0
    }

    .lato36 {
        font-size: 24px;
        letter-spacing: 0;
    }

    .lato30 {
        font-size: 18px;
        letter-spacing: 0;
    }

    .lato24 {
        font-size: 14px;
        letter-spacing: 0;
    }

    .lato18 {
        font-size: 12px;
        letter-spacing: 0;
    }

    .lato16 {
        font-size: 10px;
        letter-spacing: 0;
    }

    .lato100 {
        font-size: 65px;
        line-height: 61px;
        letter-spacing: -2px
    }
}

@media (min-width: 768px) {
    .lato84 {
        font-size: 66px;
        line-height: 50px;
        letter-spacing: -1px
    }

    .lato56 {
        font-size: 40px;
        min-height: 0;
        min-width: 0;
        line-height: 36px;
        border-width: 0;
        padding: 0
    }

    .lato36 {
        font-size: 24px;
        letter-spacing: -1px;
    }

    .lato30 {
        font-size: 22px;
        letter-spacing: 0;
    }

    .lato24 {
        font-size: 16px;
        letter-spacing: 0;
    }

    .lato18 {
        font-size: 14px;
        letter-spacing: 0;
    }

    .lato16 {
        font-size: 12px;
        letter-spacing: 0;
    }

    .lato100 {
        font-size: 80px;
        line-height: 64px;
        letter-spacing: -3px
    }
}

@media (min-width: 992px) {
    .lato84 {
        font-size: 74px;
        min-height: 0;
        min-width: 0;
        line-height: 66px;
        border-width: 0;
        padding: 0;
        letter-spacing: -2px
    }

    .lato56 {
        font-size: 44px;
        min-height: 0;
        min-width: 0;
        line-height: 40px;
        border-width: 0;
        padding: 0
    }

    .lato36 {
        font-size: 30px;
        letter-spacing: -1px;
    }

    .lato30 {
        font-size: 24px;
        letter-spacing: -1px;
    }

    .lato24 {
        font-size: 18px;
        letter-spacing: 0;
    }

    .lato18 {
        font-size: 16px;
        letter-spacing: 0;
    }

    .lato16 {
        font-size: 14px;
        letter-spacing: 0;
    }

    .lato100 {
        font-size: 90px;
        line-height: 86px;
        letter-spacing: -4px
    }
}

@media (min-width: 1200px) {
    .lato84 {
        font-size: 84px;
        min-height: 0;
        min-width: 0;
        line-height: 70px;
        border-width: 0;
        padding: 0;
        letter-spacing: -2px
    }

    .lato56 {
        font-size: 56px;
        min-height: 0;
        min-width: 0;
        line-height: 50px;
        border-width: 0;
        padding: 0
    }

    .lato36 {
        font-size: 36px
    }

    .lato30 {
        font-size: 30px
    }

    .lato24 {
        font-size: 24px
    }

    .lato18 {
        font-size: 18px;
        letter-spacing: 0;
    }

    .lato16 {
        font-size: 16px;
        letter-spacing: 0;
    }

    .lato100 {
        font-size: 100px;
        line-height: 90px;
        letter-spacing: -5px
    }
}

/*-------------------------------------------------- */
/* Mega Menu CSS                                     */
/*-------------------------------------------------- */
.megamenu-parent {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: 300
}

.megamenu-parent {
    list-style: none;
    padding: 0;
    margin: 30px 0 -30px 0;
    z-index: 9;
    display: block;
    float: right
}

.megamenu-parent > li {
    display: inline-block;
    position: relative;
    padding: 0;
    vertical-align: middle;
    margin-left: 0;
    border-radius: 5px;
}

.megamenu-parent > li.menu-justify {
    position: static
}

.megamenu-parent > li > a {
    display: inline-block;
    padding: 8px 15px;
    letter-spacing: 1px;
    color: #b0382c;
    border-radius: 5px
}

.megamenu-parent > li.has-child > a:after {
    font-family: "FontAwesome";
    content: " \f107"
}

.megamenu-parent .module {
    padding: 10px
}

.megamenu-parent .mega-group {
    list-style: none;
    padding: 0;
    margin: 0
}

.megamenu-parent .mega-group .mega-group-child {
    list-style: none;
    padding: 0;
    margin: 0
}

.megamenu-parent .dropdown {
    margin: 0;
    position: absolute;
    z-index: 99;
    display: none
}

.megamenu-parent .dropdown .dropdown-inner {
    background: #fff;
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.2);
    padding: 20px;
    margin-top: -5px
}

.megamenu-parent .dropdown .dropdown-items {
    list-style: none;
    padding: 0;
    margin: 0
}

.megamenu-parent .dropdown .dropdown-items .has-child > a:after {
    font-family: "FontAwesome";
    content: " \f105";
    float: right
}

.megamenu-parent .dropdown.menu-center {
    margin-left: 45px
}

.megamenu-parent .dropdown.dropdown-main {
    top: 100%
}

.megamenu-parent .dropdown.dropdown-main.menu-right, .megamenu-parent .dropdown.dropdown-main.menu-full {
    left: 0
}

.megamenu-parent .dropdown.dropdown-main.menu-left {
    right: 0
}

.megamenu-parent .dropdown.dropdown-sub {
    top: 0;
    left: 100%
}

.megamenu-parent .dropdown.dropdown-sub .dropdown-inner {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2)
}

.megamenu-parent .dropdown li.menu-item {
    display: block;
    padding: 0;
    position: relative
}

.megamenu-parent .dropdown li.menu-item > a {
    display: block;
    padding: 10px;
    color: #333;
    cursor: pointer
}

.megamenu-parent .dropdown li.menu-item > a.group-title {
    text-transform: uppercase;
    font-weight: bold
}

.megamenu-parent .dropdown li.menu-item > a:hover {
    color: #fff
}

.megamenu-parent .dropdown li.menu-item.active > a:hover {
    color: #fff
}

.megamenu-parent .dropdown-mega > .row {
    margin-top: 30px
}

.megamenu-parent .dropdown-mega > .row:first-child {
    margin-top: 0
}

.megamenu-parent .has-child:hover > .dropdown {
    display: block
}

.megamenu-parent.menu-fade .has-child:hover > .dropdown {
    -webkit-animation: spMenuFadeIn 400ms;
    animation: spMenuFadeIn 400ms
}

.megamenu-parent.menu-zoom .has-child:hover > .dropdown {
    -webkit-animation: spMenuZoom 400ms;
    animation: spMenuZoom 400ms
}

.megamenu-parent.menu-fade-up .has-child:hover > .dropdown {
    -webkit-animation: spMenuFadeInUp 400ms;
    animation: spMenuFadeInUp 400ms
}

/*-------------------------------------------------- */
/* Off Canvas Toggler CSS                            */
/*-------------------------------------------------- */
#offcanvas-toggler {
    margin-top: 2px;
    float: right;
    line-height: 90px
}

#offcanvas-toggler > i {
    display: inline-block;
    padding: 0 0 0 10px;
    font-size: 14px;
    background: transparent;
    margin: 5px 0 27px 0;
    border-radius: 5px;
    cursor: pointer;
    -webkit-transition: color 400ms, background-color 400ms;
    -o-transition: color 400ms, background-color 400ms;
    transition: color 400ms, background-color 400ms
}

#offcanvas-toggler > i:hover {
    color: #fff
}

/*-------------------------------------------------- */
/* Off Canvas Menu CSS                               */
/*-------------------------------------------------- */
.close-offcanvas {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 1;
    color: #000;
    border: 2px solid #eee;
    border-radius: 100%;
    width: 22px;
    height: 22px;
    line-height: 18px;
    text-align: center;
    font-size: 12px
}

.close-offcanvas:hover {
    background: #000;
    color: #fff
}

.offcanvas-menu {
    width: 280px;
    height: 100%;
    background: #fff;
    color: #999;
    position: fixed;
    top: 0;
    opacity: 0;
    z-index: 9999;
    overflow-y: scroll
}

.offcanvas-menu .offcanvas-inner {
    padding: 20px
}

.offcanvas-menu .offcanvas-inner .module {
    margin-top: 20px
}

.offcanvas-menu .offcanvas-inner .module ul > li {
    border: none
}

.offcanvas-menu .offcanvas-inner .module ul > li a {
    border-bottom: 1px dotted #e8e8e8;
    -webkit-transition: 300ms;
    -o-transition: 300ms;
    transition: 300ms;
    padding: 4px 20px
}

.offcanvas-menu .offcanvas-inner .module ul > li a:hover {
    background: #f5f5f5
}

.offcanvas-menu .offcanvas-inner .module ul > li > a:before {
    display: none
}

.offcanvas-menu .offcanvas-inner .module:first-child {
    margin-top: 0
}

.offcanvas-menu .offcanvas-inner .module .module-content > ul {
    margin: 0 -20px
}

.offcanvas-menu .offcanvas-inner .search {
    margin-top: 25px
}

.offcanvas-menu .offcanvas-inner .search input {
    width: 100%;
    border-radius: 0;
    border: 1px solid #eee;
    box-shadow: none;
    -webkit-box-shadow: none
}

.offcanvas-menu {
    -webkit-transition: opacity 400ms cubic-bezier(0.7, 0, 0.3, 1), right 400ms cubic-bezier(0.7, 0, 0.3, 1);
    transition: opacity 400ms cubic-bezier(0.7, 0, 0.3, 1), right 400ms cubic-bezier(0.7, 0, 0.3, 1)
}

.offcanvas-menu {
    right: -280px
}

.offcanvas .offcanvas-menu {
    right: 0
}

.offcanvas {
    width: 100%;
    height: 100%;
    position: relative
}

.offcanvas .body-wrapper:after {
    width: 100%;
    height: 100%;
    opacity: 1;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s
}

.offcanvas .offcanvas-menu {
    opacity: 1
}

.offcanvas .offcanvas-menu ul.nav-child li {
    padding-left: 10px
}

.menu .nav-child.small {
    font-size: inherit
}

/*-------------------------------------------------- */
/* Top Bar CSS                                       */
/*-------------------------------------------------- */
.top-bar {
    padding: 8px 0;
    font-size: 16px;
}

.top-bar .module {
    display: inline-block;
    margin: 0 0 0 20px
}

.top-bar ul.social-icons {
    list-style: none;
    padding: 0;
    margin: -2px -5px -5px -5px;
    display: inline-block;
    float: right
}

.top-bar ul.social-icons > li {
    display: inline-block;
    padding: 2px
}

.top-bar ul.social-icons > li a {
    display: block;
}

.contact-info {
    float: left;
    list-style: none;
    padding: 0;
    margin: 0 -10px
}

.contact-info li {
    display: inline-block;
    margin: 5px 10px;
    font-size: 14px;
}

.contact-info li i {
    margin: 0 3px
}

/*-------------------------------------------------- */
/* Module CSS                                        */
/*-------------------------------------------------- */
.module-content .mod-languages ul.lang-inline {
    margin: 0;
    padding: 0
}

.module-content .mod-languages ul.lang-inline li {
    border: none;
    display: inline-block;
    margin: 0 5px 0 0
}

.module-content .mod-languages ul.lang-inline li a {
    padding: 0 !important
}

.module-content .mod-languages ul.lang-inline li > a:before {
    display: none
}

.module {
    margin-top: 50px
}

.module:first-child {
    margin-top: 0;
}

.contact {
    padding: 50px 0;
}


.module .module-title {
    margin: 0 0 20px;
    line-height: 1
}

.module ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.module ul > li {
    display: block;
    -webkit-transition: 300ms;
    transition: 300ms
}

.module ul > li > a {
    display: block;
    /* padding: 5px 0; */
    /* line-height: 36px; */
    -webkit-transition: 300ms;
    transition: 300ms
}

.module ul > li > a:hover {
    background: none
}

.module ul > li > a:before {
    font-family: FontAwesome;
    content: "\f105";
    margin-right: 8px
}

.module ul > li:last-child {
    border-bottom: none
}

.module .categories-module ul {
    margin: 0 10px
}

.module .latestnews > div {
    padding-bottom: 5px;
    margin-bottom: 5px;
    border-bottom: 1px solid #e8e8e8
}

.module .latestnews > div:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0
}

.module .latestnews > div > a {
    display: block;
    font-weight: 400
}

.module .tagscloud {
    margin: -2px 0
}

.module .tagscloud .tag-name {
    display: inline-block;
    padding: 5px 10px;
    background: #808080;
    color: #fff;
    border-radius: 4px;
    margin: 2px 0
}

.module .tagscloud .tag-name span {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 10px
}

/*-------------------------------------------------- */
/* Header CSS                                        */
/*-------------------------------------------------- */
.header {
    background: #ffffff;
    height: 90px;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.05)
}

.header .logo {
    display: inline-block;
    height: 90px;
    display: table;
}

.header .logo h1 {
    font-size: 24px;
    line-height: 1;
    margin: 0;
    padding: 0;
    display: table-cell;
    vertical-align: middle
}

.header .logo p {
    margin: 5px 0 0
}

@media (max-width: 360px) {
    .header .logo img {
        max-width: 75%;
        height: auto;
    }
}

.header .retina-logo {
    display: none
}

.sticky-wrapper.is-sticky {
    position: relative;
    z-index: 999
}

#offcanvas-toggler {
    display: none;
}

@media (max-width: 1200px) {
    .hidden-xs {
        display: none !important;
    }

    #offcanvas-toggler {
        display: block;
    }
}

@media (min-width: 1201px) {
    .offcanvas-menu {
        display: none;
    }

    .offcanvas .body-wrapper:after {
        width: 0 !important;
        height: 0 !important;
    }
}

/*-------------------------------------------------- */
/* Page Title CSS                                    */
/*-------------------------------------------------- */
.title {
    min-height: 0
}

.page-header {
    margin: 0
}

.page-title {
    padding: 35px 0;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-attachment: fixed;
    background-image: url("../images/bread.png") !important
}

.page-title h2, .page-title h3 {
    margin: 0;
    padding: 0;
    color: #fff;
    display: inline-block;
    float: left
}

.page-title h2 {
    font-size: 24px;
    line-height: 1
}

.page-title h3 {
    font-size: 14px;
    font-weight: normal;
    line-height: 1;
    margin-top: 10px
}

.page-title .breadcrumb {
    background: none;
    padding: 0;
    margin: 0;
    float: right
}

.page-title .breadcrumb > .active {
    color: #fff
}

.page-title .breadcrumb > span, .page-title .breadcrumb > li, .page-title .breadcrumb > li + li:before, .page-title .breadcrumb > li > a {
    color: rgba(255, 255, 255, 0.8)
}

/*-------------------------------------------------- */
/* Top Bars CSS                                      */
/*-------------------------------------------------- */
.top-a {
    padding: 50px 0;
    background: #fff
}

.top-b {
    background: #f7f7f7;
    padding: 50px 0
}

.top-c {
    padding: 50px 0;
    background: #fff
}

.user-section {
    background: #f7f7f7;
    padding: 50px 0
}

.body-innerwrapper {
    overflow-x: hidden;
    -webkit-transition: margin-left 400ms cubic-bezier(0.7, 0, 0.3, 1);
    transition: margin-left 400ms cubic-bezier(0.7, 0, 0.3, 1)
}

.layout-boxed .body-innerwrapper {
    max-width: 1240px;
    margin: 0 auto;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2)
}

.main-body {
    padding: 50px 0
}

.com-sppagebuilder .main-body {
    padding: 0
}

.position-a {
    background: #f7f7f7;
    padding: 50px 0
}

.position-b {
    background: #fff;
    padding: 50px 0
}

.parallax1, .parallax2 {
    margin: 0
}

.parallax1 .module, .parallax2 .module {
    margin: 0
}

.parallax1 .module ul > li, .parallax2 .module ul > li {
    border-bottom: 0
}

.login img {
    display: inline-block;
    margin: 20px 0
}

.login .checkbox input[type="checkbox"] {
    margin-top: 6px
}

.form-links ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.search .btn-toolbar {
    margin-bottom: 20px
}

.search .btn-toolbar span.icon-search {
    margin: 0
}

.search .btn-toolbar button {
    color: #fff
}

.search .phrases .phrases-box .controls label {
    display: inline-block;
    margin: 0 20px 20px
}

.search .phrases .ordering-box {
    margin-bottom: 15px
}

.search .only label {
    display: inline-block;
    margin: 0 20px 20px
}

.search .search-results dt.result-title {
    margin-top: 40px
}

.search .search-results dt, .search .search-results dd {
    margin: 5px 0
}

.filter-search .chzn-container-single .chzn-single {
    height: 34px;
    line-height: 34px
}

.form-search .finder label {
    display: block
}

.form-search .finder .input-medium {
    width: 60%;
    border-radius: 4px
}

.finder .word input {
    display: inline-block
}

.finder .search-results.list-striped li {
    padding: 20px 0
}

.article-info {
    margin: 0 -8px 5px;
    line-height: 12px
}

.article-info > dd {
    display: inline-block;
    font-size: 12px;
    color: #666;
    text-transform: uppercase;
    margin: 0 8px
}

.article-info > dd > i {
    display: inline-block;
    margin-right: 3px
}

article.item {
    margin-bottom: 0
}

.tags {
    margin-top: 20px
}

.tags > span {
    text-transform: uppercase;
    letter-spacing: 2px
}

.content_rating, .content_rating + form {
    display: none
}

.voting-symbol {
    unicode-bidi: bidi-override;
    direction: rtl;
    font-size: 14px;
    display: inline-block
}

.voting-symbol span.star {
    font-family: "FontAwesome";
    font-weight: normal;
    font-style: normal;
    display: inline-block
}

.voting-symbol span.star.active:before {
    content: "\f005"
}

.voting-symbol span.star:before {
    content: "\f006";
    padding-right: 5px
}

.rating span.star:hover:before, .rating span.star:hover ~ span.star:before {
    content: "\f005";
    cursor: pointer
}

.post_rating {
    margin-bottom: 20px
}

.post_rating .ajax-loader, .post_rating .voting-result {
    display: none
}

.post-format {
    position: absolute;
    top: 0;
    left: -68px;
    display: block;
    width: 48px;
    height: 48px;
    font-size: 24px;
    line-height: 48px;
    text-align: center;
    color: #fff;
    border-radius: 5px
}

.entry-image, .entry-gallery, .entry-video, .entry-audio, .entry-link {
    margin-bottom: 30px
}

.entry-status, .entry-quote {
    margin-bottom: 50px
}

.entry-header {
    position: relative;
    margin-bottom: 20px
}

.entry-header.has-post-format {
    margin-left: 68px
}

.entry-header h2 {
    margin: 8px 0 0;
    font-size: 18px;
    line-height: 1
}

.entry-link {
    padding: 100px 50px;
    position: relative;
    z-index: 1
}

.entry-link a h4 {
    margin: 0;
    font-size: 36px;
    color: #fff
}

.entry-link a h4:hover {
    color: rgba(255, 255, 255, 0.85)
}

.entry-link:before {
    position: absolute;
    left: -60px;
    font-size: 300px;
    content: "\f0c1";
    font-family: FontAwesome;
    transform: rotate(90deg);
    top: -75px;
    color: rgba(255, 255, 255, 0.15);
    z-index: -1
}

.entry-quote {
    position: relative;
    padding: 80px 50px;
    color: rgba(255, 255, 255, 0.9)
}

.entry-quote:before {
    position: absolute;
    left: -40px;
    font-size: 300px;
    content: "\f10e";
    font-family: FontAwesome;
    transform: rotate(15deg);
    top: -75px;
    color: rgba(255, 255, 255, 0.15)
}

.entry-quote blockquote small {
    color: #FFF;
    font-weight: 600;
    font-size: 20px
}

.entry-quote blockquote {
    padding: 0;
    margin: 0;
    font-size: 16px;
    border: none
}

.carousel-left, .carousel-right {
    position: absolute;
    top: 50%;
    font-size: 24px;
    width: 36px;
    height: 36px;
    line-height: 36px;
    margin-top: -18px;
    text-align: center;
    color: #fff;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 4px;
    -webkit-transition: 400ms;
    transition: 400ms
}

.carousel-left:hover, .carousel-right:hover {
    color: #fff
}

.carousel-left:focus, .carousel-right:focus {
    color: #fff
}

.carousel-left {
    left: 10px
}

.carousel-right {
    right: 10px
}

.newsfeed-category .category {
    list-style: none;
    padding: 0;
    margin: 0
}

.newsfeed-category .category li {
    padding: 5px 0
}

.newsfeed-category #filter-search {
    margin: 10px 0
}

.category-module, .categories-module, .archive-module, .latestnews, .newsflash-horiz, .mostread, .form-links, .list-striped {
    list-style: none;
    padding: 0;
    margin: 0
}

.category-module li, .categories-module li, .archive-module li, .latestnews li, .newsflash-horiz li, .mostread li, .form-links li, .list-striped li {
    padding: 2px 0
}

.category-module li h4, .categories-module li h4, .archive-module li h4, .latestnews li h4, .newsflash-horiz li h4, .mostread li h4, .form-links li h4, .list-striped li h4 {
    margin: 5px 0
}

.blog article.item {
    margin-bottom: 40px;
    border-bottom: 1px solid #ddd
}

.item-page h2 {
    margin-bottom: 20px !important;
    margin-top: 0 !important
}

.pagination > li > a, .pagination > li > span {
    padding: 8px 16px;
    border-color: #9ab401
}

.pagination > li > a:hover, .pagination > li > span:hover {
    color: #fff !important;
    background: #9ab401;
    border-color: #9ab401 !important
}

.pagination > li:first-child > a, .pagination > li:first-child > span {
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px
}

.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px
}

/*-------------------------------------------------- */
/* Bottom CSS                                        */
/*-------------------------------------------------- */
.bottom {
    padding: 50px 0;
    background: #ffffff
}

.bottom-a {
    padding: 50px 0;
    background: #fafafa
}

.bottom-b {
    color: rgba(255, 255, 255, 0.6);
    background: #58585a;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    background-image: url("../images/bread.png") !important;
    padding: 50px 0
}

.bottom-b a {
    color: rgba(255, 255, 255, 0.6) !important
}

.bottom-b a:hover {
    color: #fff !important
}

.bottom-b .module {
    margin-bottom: 2em;
}
.bottom-b .module .module-title {
    color: rgba(255, 255, 255, 0.6)
}

.bottom-b .module ul > li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding: 5px 0;

}

/*-------------------------------------------------- */
/* Footer CSS                                        */
/*-------------------------------------------------- */
.footer {
    color: #fff;
    text-align: center;
    padding: 20px 0
}

.footer a {
    color: rgba(255, 255, 255, 0.9)
}

.footer a:hover {
    color: #fff
}

.footer-wrapper ul {
    display: inline-block
}

.footer-wrapper ul.nav {
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0 5px
}

.footer-wrapper ul.nav li {
    display: inline-block;
    margin: 0 5px
}

.footer-wrapper ul.nav li a {
    display: block
}

.footer-wrapper ul.nav li a:hover {
    background: none
}

.footer-wrapper .helix-framework {
    display: inline-block
}

.footer-wrapper .helix-framework .helix-logo {
    display: block;
    width: 130px;
    height: 40px;
    text-indent: -9999px;
    background: url(../images/helix-logo-white.html) no-repeat 0 0
}

.footer-wrapper .copyright {
    display: block
}

/*-------------------------------------------------- */
/* Coming Soon CSS                                   */
/*-------------------------------------------------- */
.comingsoon {
    width: 100%;
    height: 100%;
    min-height: 100%
}

.comingsoon body {
    width: 100%;
    height: 100%;
    min-height: 100%;
    color: #fff;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.42857
}

.comingsoon .comingsoon-title {
    margin-top: 130px;
    font-size: 42px;
    margin-bottom: 10px;
    font-weight: 700;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
}

.comingsoon .comingsoon-content {
    font-size: 28px;
    font-weight: 300
}

.comingsoon .days, .comingsoon .hours, .comingsoon .minutes, .comingsoon .seconds {
    display: inline-block;
    margin: 80px 15px
}

.comingsoon .days .number, .comingsoon .hours .number, .comingsoon .seconds .number, .comingsoon .minutes .number {
    width: 115px;
    height: 120px;
    line-height: 120px;
    border: 1px solid #fff;
    border-radius: 5px;
    display: inline-block;
    font-size: 48px;
    font-weight: bold
}

.comingsoon .days .string, .comingsoon .minutes .string, .comingsoon .seconds .string, .comingsoon .hours .string {
    display: block;
    font-size: 18px;
    margin-top: 10px
}

.comingsoon .social-icons li {
    display: inline-block;
    margin: 0 15px
}

.comingsoon .social-icons li a {
    color: rgba(255, 255, 255, 0.7);
    font-size: 24px;
    -webkit-transition: color 400ms;
    transition: color 400ms
}

.comingsoon .social-icons li a:hover {
    color: #fff
}

/*-------------------------------------------------- */
/* Error Page CSS                                    */
/*-------------------------------------------------- */
.error-page {
    width: 100%;
    height: 100%;
    min-height: 100%
}

.error-page body {
    width: 100%;
    height: 100%;
    min-height: 100%;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
}

.error-page .error-page-inner {
    height: 100%;
    min-height: 100%;
    width: 100%;
    display: table;
    text-align: center
}

.error-page .error-page-inner > div {
    display: table-cell;
    vertical-align: middle
}

.error-page .uk-icon-unlink {
    font-size: 100px;
    line-height: 1;
    margin-bottom: 10px
}

.error-page .error-code {
    font-weight: bold;
    font-size: 96px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1;
    margin: 0 0 10px 0;
    padding: 0
}

.error-page .error-message {
    font-size: 24px;
    line-height: 1;
    margin-bottom: 30px
}

.social-share ul {
    display: block;
    padding: 0;
    margin: 20px -5px 0
}

.social-share ul li {
    display: inline-block;
    font-size: 24px;
    margin: 0 5px
}

.contact h3 {
    margin-top: 0
}

/*-------------------------------------------------- */
/* Slider Section CSS                                */
/*-------------------------------------------------- */
.uk-slider-section .uk-overlay-panel {
    padding: 10px
}

.uk-slider-section .uk-slider-caption-30 {
    margin: 30px 0 0 0
}

.uk-slider-section .uk-slider-caption-50 {
    margin: 0
}

@media (min-width: 486px) {
    .uk-slider-section .uk-slider-caption-50 {
        margin: 20px 0 0 0
    }
}

@media (min-width: 768px) {
    .uk-slider-section .uk-slider-caption-50 {
        margin: 25px 0 0 0
    }
}

@media (min-width: 992px) {
    .uk-slider-section .uk-slider-caption-50 {
        margin: 30px 0 0 0
    }
}

@media (min-width: 1200px) {
    .uk-slider-section .uk-slider-caption-50 {
        margin: 50px 0 0 0
    }
}

.uk-slider-section .uk-slider-caption-80 {
    margin: 80px 0 0 0
}

.uk-slider-section .uk-slider-caption-0-200 {
    margin: 0 0 0 40px
}

@media (min-width: 486px) {
    .uk-slider-section .uk-slider-caption-0-200 {
        margin: 10px 0 0 50px
    }
}

@media (min-width: 768px) {
    .uk-slider-section .uk-slider-caption-0-200 {
        margin: 15px 0 0 100px
    }
}

@media (min-width: 992px) {
    .uk-slider-section .uk-slider-caption-0-200 {
        margin: 20px 0 0 150px
    }
}

@media (min-width: 1200px) {
    .uk-slider-section .uk-slider-caption-0-200 {
        margin: 25px 0 0 200px
    }
}

.uk-slider-section .uk-slider-caption-0-300 {
    margin: 0 0 0 50px
}

@media (min-width: 486px) {
    .uk-slider-section .uk-slider-caption-0-300 {
        margin: 0 0 0 100px
    }
}

@media (min-width: 768px) {
    .uk-slider-section .uk-slider-caption-0-300 {
        margin: 0 0 0 160px
    }
}

@media (min-width: 992px) {
    .uk-slider-section .uk-slider-caption-0-300 {
        margin: 0 0 0 220px
    }
}

@media (min-width: 1200px) {
    .uk-slider-section .uk-slider-caption-0-300 {
        margin: 0 0 0 300px
    }
}

.uk-slider-section .uk-slider-caption-0-600 {
    margin: 0 0 0 80px
}

@media (min-width: 380px) {
    .uk-slider-section .uk-slider-caption-0-600 {
        margin: 0 0 0 100px
    }
}

@media (min-width: 486px) {
    .uk-slider-section .uk-slider-caption-0-600 {
        margin: 0 0 0 200px
    }
}

@media (min-width: 768px) {
    .uk-slider-section .uk-slider-caption-0-600 {
        margin: 0 0 0 300px
    }
}

@media (min-width: 992px) {
    .uk-slider-section .uk-slider-caption-0-600 {
        margin: 0 0 0 400px
    }
}

@media (min-width: 1200px) {
    .uk-slider-section .uk-slider-caption-0-600 {
        margin: 0 0 0 500px
    }
}

.uk-slider-section .uk-slider-caption-100-120 {
    margin: 100px 0 0 120px
}

.uk-slider-section .uk-slider-caption-110 {
    margin: 110px 0 0 200px
}

.uk-slider-section .uk-slider-caption-110-138 {
    margin: 110px 0 0 138px
}

.uk-slider-section .uk-slider-caption-130 {
    margin: 130px 0 0 0
}

.uk-slider-section .uk-slider-caption-170 {
    margin: 170px 0 0 0
}

.uk-slider-section .uk-slider-caption-230 {
    margin: 230px 0 0 0
}

.uk-slider-section .uk-slider-caption-215-50 {
    margin: 215px 50px 0 -50px
}

.uk-slider-section .uk-slider-caption--430-50 {
    margin: -430px -50px 0 50px
}

.uk-slider-section .uk-slider-caption--500-200 {
    margin: -500px -200px 0 200px
}

.uk-slider-section .uk-font-80 {
    font-size: 80px;
    line-height: 40px;
    margin: 0 0 22px;
    font-family: "Montserrat Subrayada", sans-serif;
    font-weight: 700;
    letter-spacing: -5px
}

.uk-slider-section .uk-font-60 {
    font-size: 60px;
    line-height: 30px;
    color: #5e6772;
    margin: 0 0 22px;
    font-family: Source Sans Pro, sans-serif;
    font-weight: 700;
    letter-spacing: -5px
}

.uk-slider-section .shadow {
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.5)
}

.uk-slider-section .uk-slider-btn {
    border-radius: 1px;
    box-shadow: none;
    padding: 10px 25px;
    font-size: 18px;
    margin-top: 10px
}

.uk-slider-section .slider-text {
    white-space: nowrap;
    visibility: visible;
    opacity: 0;
    transform: translate3d(0px, -50px, 0px)
}

.uk-slider-section .slider-text .uk-button-large h1, .uk-slider-section .slider-text .uk-button-large h2, .uk-slider-section .slider-text .uk-button-large h3, .uk-slider-section .slider-text .uk-button h1, .uk-slider-section .slider-text .uk-button h2, .uk-slider-section .slider-text .uk-button h3 {
    margin: 0
}

.uk-slider-section .slider-text-2 {
    transform: translate3d(0px, 50px, 0px)
}

.uk-slider-section .slider-text-3 {
    transform: translate3d(-50px, 0px, 0px)
}

.uk-slider-section .slider-text-4 {
    color: #000;
    font-size: 85px;
    min-height: 0;
    min-width: 0;
    line-height: 93px;
    border-width: 0;
    margin: 0;
    padding: 0;
    letter-spacing: -3px
}

.uk-slider-section .slider-text-5 {
    min-height: 0;
    min-width: 0;
    line-height: 93px;
    border-width: 0;
    margin: 0;
    padding: 0;
    letter-spacing: -3px;
    font-size: 85px
}

.uk-slider-section .slider-text-6 {
    color: #000;
    min-height: 0;
    min-width: 0;
    line-height: 27px;
    border-width: 0;
    margin: 5px 0 0 0;
    padding: 0;
    letter-spacing: 0;
    font-size: 25px
}

.uk-slider-section .slider-text-7 {
    font-size: 85px;
    letter-spacing: -4px;
    min-height: 0;
    min-width: 0;
    line-height: 93px;
    border-width: 0;
    margin: 0;
    padding: 0
}

.uk-slider-section .slider-text-8 {
    font-style: italic;
    min-height: 0;
    min-width: 0;
    line-height: 93px;
    border-width: 0;
    margin: 0;
    padding: 0;
    letter-spacing: -4px;
    font-size: 85px
}

.uk-slider-section .slider-text-9 {
    min-height: 0;
    min-width: 0;
    line-height: 27px;
    border-width: 0;
    margin: 0;
    padding: 0;
    letter-spacing: 0;
    font-size: 25px
}

.uk-slider-section .slider-text-10 {
    font-size: 72px;
    min-height: 0;
    min-width: 0;
    line-height: 79px;
    border-width: 0;
    margin: 0;
    padding: 0;
    letter-spacing: -3px
}

.uk-slider-section .slider-text-11 {
    min-height: 0;
    min-width: 0;
    line-height: 79px;
    border-width: 0;
    margin: 0;
    padding: 0;
    letter-spacing: -3px;
    font-size: 72px
}

.uk-slider-section .slider-text-12 {
    min-height: 0;
    min-width: 0;
    line-height: 27px;
    border-width: 0;
    margin: 0;
    padding: 0;
    letter-spacing: 0;
    font-size: 25px
}

.uk-slider-section .slider-box {
    line-height: 24px;
    border-width: 10px;
    margin: 0;
    padding: 80px 40px 40px 40px
}

.uk-slidenav {
    width: 30px;
    height: 50px;
    line-height: 50px;
    font-size: 36px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.2)
}

@media (min-width: 768px) {
    .uk-slidenav {
        width: 30px;
        height: 60px;
        line-height: 60px;
    }
}

@media (min-width: 992px) {
    .uk-slidenav {
        width: 35px;
        height: 80px;
        line-height: 80px;
    }
}

@media (min-width: 1200px) {
    .uk-slidenav {
        width: 40px;
        height: 100px;
        line-height: 100px;
    }
}

.uk-slidenav:hover {
    color: rgba(0, 0, 0, 0.4);
    background-color: rgba(0, 0, 0, 0.1)
}

.uk-slidenav:active {
    color: rgba(0, 0, 0, 0.4);
    background-color: rgba(0, 0, 0, 0.2)
}

.uk-slidenav-position .uk-slidenav-previous {
    left: 0
}

.uk-slidenav-position .uk-slidenav-next {
    right: 0
}

.uk-slider-section .uk-button:disabled {
    background-color: #69bd43;
}

.uk-slider-section .uk-button.uk-button-white:disabled {
    background-color: #fff;
}

.bottom-a .sprocket-strips-container > li, .top-a .sprocket-strips-container > li {
    float: left;
    margin: 0 1% 20px
}

.margin-left-1 {
    margin-left: -1px
}

.alcohol .parallax2 {
    min-height: 200px;
    background-image: url(../images/elements/parallax2.html);
    background-color: rgb(40, 40, 40);
    background-repeat: no-repeat;
    background-size: 1783px 1189px;
    background-position: 50% -106.56px
}

.padding-120 {
    padding: 120px
}

.padding-50 {
    padding: 50px
}

.uk-slider-section h1, .uk-slider-section h2, .uk-slider-section h3, .uk-slider-section .uk-button {
    font-family: 'Open Sans', sans-serif;
    font-weight: 900
}

.uk-slider-section .shop-button {
    min-height: 26.5714px;
    min-width: 0;
    line-height: 20px;
    border-width: 1px;
    margin: 20px 0 0 0;
    padding: 6px 3em;
    letter-spacing: 0;
    font-size: 8px
}

.uk-slider-section .contact-us-button {
    min-height: 20px;
    min-width: 0;
    line-height: 16px;
    border-width: 1px;
    margin: 0;
    padding: 4px 4px;
    letter-spacing: 0;
    font-size: 8px
}

@media (min-width: 768px) {
    .uk-slider-section .shop-button {
        min-height: 26.5714px;
        min-width: 0;
        line-height: 21px;
        border-width: 1px;
        margin: 30px 0 0 0;
        padding: 9px 3em;
        letter-spacing: 0;
        font-size: 10px
    }

    .uk-slider-section .contact-us-button {
        min-height: 26.5714px;
        min-width: 0;
        line-height: 21px;
        border-width: 1px;
        margin: 0;
        padding: 5px 11px;
        letter-spacing: 0;
        font-size: 10px
    }
}

@media (min-width: 992px) {
    .uk-slider-section .shop-button {
        min-height: 26.5714px;
        min-width: 0;
        line-height: 23px;
        border-width: 1px;
        margin: 36px 0 0 0;
        padding: 12px 3em;
        letter-spacing: 0;
        font-size: 11px
    }

    .uk-slider-section .contact-us-button {
        min-height: 26.5714px;
        min-width: 0;
        line-height: 23px;
        border-width: 1px;
        margin: 0;
        padding: 6px 12px;
        letter-spacing: 0;
        font-size: 11px
    }
}

@media (min-width: 1200px) {
    .uk-slider-section .shop-button {
        min-height: 26.5714px;
        min-width: 0;
        line-height: 25px;
        border-width: 1px;
        margin: 40px 0 0 0;
        letter-spacing: 0;
        font-size: 12px
    }

    .uk-slider-section .contact-us-button {
        min-height: 26.5714px;
        min-width: 0;
        line-height: 25px;
        border-width: 1px;
        margin: 0;
        padding: 7px 13px;
        letter-spacing: 0;
        font-size: 12px
    }
}

.width-50-height-50 {
    width: 4px;
    height: 4px
}

@media (min-width: 486px) {
    .width-50-height-50 {
        width: 10px;
        height: 10px
    }
}

@media (min-width: 768px) {
    .width-50-height-50 {
        width: 20px;
        height: 20px
    }
}

@media (min-width: 992px) {
    .width-50-height-50 {
        width: 30px;
        height: 30px
    }
}

@media (min-width: 1200px) {
    .width-50-height-50 {
        width: 50px;
        height: 50px
    }
}

/*-------------------------------------------------- */
/* Sections CSS                                      */
/*-------------------------------------------------- */
.bottom-a .uk-slidenav, .bottom .uk-slidenav, .position-a .uk-slidenav {
    display: block;
    width: 30px;
    height: 30px;
    opacity: 0.5;
    cursor: pointer;
    float: right;
    margin-left: 5px;
    text-align: center;
    font-size: 2em;
    position: relative;
    border-color: transparent;
    border-radius: 5px
}

.bottom-a .uk-slidenav:hover, .bottom .uk-slidenav:hover, .position-a .uk-slidenav:hover {
    opacity: 1
}

.bottom-a .uk-slidenav:before, .bottom .uk-slidenav:before, .position-a .uk-slidenav:before {
    width: 0;
    height: 0;
    position: absolute;
    top: 50%;
    margin-top: -5px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent
}

.bottom-a .uk-slidenav-previous:before, .bottom .uk-slidenav-previous:before, .position-a .uk-slidenav-previous:before {
    left: 50%;
    margin-left: -3px;
    border-right: 5px solid;
    content: "";
    font-family: none
}

.bottom-a .uk-slidenav-next:before, .bottom .uk-slidenav-next:before, .position-a .uk-slidenav-next:before {
    right: 50%;
    margin-right: -3px;
    border-left: 5px solid;
    content: "";
    font-family: none
}

.parallax-section-1 .col-sm-12, .parallax-section-1 .col-md-12, .parallax-section-2 .col-sm-12, .parallax-section-2 .col-md-12, .map .col-sm-12, .map .col-md-12 {
    padding-left: 0;
    padding-right: 0
}

.map-canvas {
    width: 100%;
    height: 550px
}

.map-modal {
    border: 0;
    width: 100%;
    height: 450px
}

.contact h3 {
    margin-top: 0
}

.parallax-section-1 .services-parallax {
    height: 100%;
    background-image: url(../images/elements/services-parallax.jpg);
    background-repeat: no-repeat;
    background-size: 1902px 991px;
    background-position: 50% -33.915px
}

.parallax-section-2 .best-farm-parallax {
    height: 100%;
    background-image: url(../images/elements/slide1.jpg);
    background-color: rgb(105, 189, 67);
    background-repeat: no-repeat;
    background-position: 50% -73.44px
}

.lists-container .panel-default {
    border: 0;
    background-color: #fff
}

.lists-container .panel-heading {
    padding: 0;
    border: 1px solid #ddd;
    border-radius: 5px
}

.lists-container .panel-heading .btn {
    border-radius: 5px
}

.main-body .subnav-portfolio, .position-a .subnav-portfolio {
    margin-top: 0
}

.main-body .portfolio-member, .position-a .portfolio-member {
    border-radius: 5px;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2)
}

.main-body .portfolio-member-image-container, .position-a .portfolio-member-image-container {
    cursor: pointer
}

.main-body .portfolio-box, .position-a .portfolio-box {
    position: absolute;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 20px;
    opacity: 1;
    display: block
}

.uk-grid.customers > * {
    padding-left: 0
}

.testimonials {
    line-height: 1.9em;
    border: 0 !important
}

.sprocket-strips-s-block {
    border-bottom: 0 none !important;
    margin: 0 -4px 3em 0;
    padding: 0 1%;
    vertical-align: top
}

.panel {
    box-shadow: none;
}

.panel-default > .panel-heading + .panel-collapse > .panel-body {
    border: 0;
}

/*
 * Horizontal divider
 * Only works with the default gutter. Does not work with gutter collapse, small or large.
 * Does not work with `uk-push-*`, `uk-pull-*` and not if the columns float into the next row.
 */
.uk-grid-divider:not(:empty) {
    margin-left: 0;
    margin-right: 0;
}

.block {
    display: block;
    width: 100%;
}

/*product css*/
.product-list {
    margin-top: 2em;
}

.product {
    text-align: center;
    margin-bottom: 2.4em !important;
    border: solid 2px #f5f5f5;
    background: #fff;
    transition: all 1s;
    -moz-transition: all 1s;
    -webkit-transition: all 1s;
    -o-transition: all 1s;
}

.product-thumbnail {
    position: relative;
    overflow: hidden;
    padding: 3px;
    margin: 6px;
    border-bottom: solid 1px #f5f5f5;
}

.product-thumbnail img {
    width: 100%;
}

.product-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.5);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    opacity: 0;
}

.product-overlay .read-link {
    display: block;
    font-size: 18px;
    background: #69bd43;
    border-radius: 100%;
    color: #fff;
    width: 50px;
    height: 50px;
    line-height: 50px;
}

.product:hover {
    border-color: #549835;
    box-shadow: 0 0 13px rgba(185, 185, 185, 0.47);
}

.product:hover .product-overlay {
    opacity: 1;
}

.product-title {
    font-size: 14px;
    display: block;
    color: #666;
    margin-bottom: 1em;
}
.product .product-title {
    min-height: 3.6em;
}

h1.product-title {
    margin-top: 0;
    font-size: 24px;
    margin-bottom: .5em;
}

.product-price {
    margin-bottom: .6em;
    font-size: 14px;
    color: #8bc34a;
    font-weight: bold;
}

.product-detail {
    margin-bottom: 4em;
}

.product-detail .product-thumbnail {
    margin: 0;
    padding: 0;
}

.product-attribute-price {
    font-size: 20px;
    color: #f00;
    margin-bottom: 1.2em;
}

.product-attribute-sku {
    color: #999;
}

.product-tab .tab-content {
    padding: 7px;
}

.sidebar {
    margin-bottom: 2em;
}
/*.sidebar .module-title {*/
    /*color: #8bc34a;*/
/*}*/


.menu .menu-children {
    margin-left: 1em;
}

.sidebar .menu .active > a {
    color: #9ab401;
}

.table-cart {
    border: solid 1px #ddd;
}

.table-cart--total {
    border-top: solid 2px #9ab401;
    font-size: 24px;
    text-align: right;
}

.table-cart td {
    vertical-align: middle !important;
    padding: 20px !important;
}

.btn-transparent {
    background: transparent;
}

.btn-remove {
    font-size: 30px;
    color: #aaa;
    outline: none;
}

.btn-remove:focus,
.btn-remove:active {
    outline: none !important;
}

.panel-payment-method {
    border: solid 1px #ddd;
    border-top: solid 3px #9ab401;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.panel-payment-method .panel-heading {
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
}

.panel-payment-method .panel-body {
    background: #fafafa;
}

.modal-content {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.cart-empty {
    background: #fafafa;
    color: #999;
}

.cart-empty .icon-remove {
    margin: 20px;
    width: 90px;
    height: 90px;
    line-height: 90px;
    font-size: 70px;
    color: #fff;
    background: #aaa;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
}


@media all and (max-width: 767px) {
    .module-featured dd {
        text-align: center!important;
    }
    .module-featured .uk-description-list-horizontal {
        margin-bottom: 3em;
    }
}

.panel-contact {
    border-bottom: solid 1px #ddd;
    margin-bottom: 2em;
    padding-bottom: 3em;
    padding-top: 2em;
    position: relative;
}
.btn-map {
    position: absolute;
    bottom: 2em;
    right: 0;
}

#provider-slide img {
    width: 100%;
}
#provider-slide .slick-dots {
    display: none!important;
}
#provider-slide .slick-arrow {
    display: none;
}

/*home slider*/
#home_slider .slick-arrow {
    opacity: .8;
    z-index: 800;
    width: 50px;
    height: 50px;
}
#home_slider .slick-arrow:before {
    font-size: 50px;
    color: #8bc34a;
}
#home_slider .slick-next {
    right: 20px;
}
#home_slider .slick-prev {
    left: 20px;
}

@media (max-width: 1140px) {
    #home_slider .slick-arrow {
        display: none!important;
    }
}





.phone {
    position: fixed;
    bottom: 34%;
    left: -90px;
    z-index: 9999;
}
.quick-alo-phone .quick-alo-show {
    visibility: visible;
}
.quick-alo-phone {
    position: fixed;
    visibility: hidden;
    background-color: transparent;
    width: 82px;
    height: 64px;
    right: 150px;
    top: 60%;
    cursor: pointer;
    z-index: 200000 !important;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transition: visibility .5s;
}
.quick-alo-phone .quick-alo-green .quick-alo-ph-circle {
    border-color: #9ab401;
    opacity: 0.5;
}
.quick-alo-ph-circle {
    position: absolute;
    width: 160px;
    height: 160px;
    top: 50px;
    left: 50px;
    border: 2px solid #8bc34a;
    background-color: transparent;
    border-radius: 100%;
    opacity: .1;
    animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    transition: all .5s;
    transform-origin: 50% 50%;
}
.quick-alo-phone .quick-alo-green .quick-alo-ph-circle-fill {
    background-color: #8bc34a;
    opacity: .75 !important;
}
.quick-alo-ph-circle-fill {
    position: absolute;
    width: 100px;
    height: 100px;
    top: 80px;
    left: 80px;
    background-color: #8bc34a;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: .1;
    animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
    transition: all .5s;
    transform-origin: 50% 50%;
}
.quick-alo-phone.quick-alo-green .quick-alo-ph-img-circle {
    background-color: #8bc34a;
}
.quick-alo-ph-img-circle {
    position: absolute;
    width: 60px;
    height: 60px;
    top: 100px;
    left: 100px;
    background: #8bc34a url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABrklEQVRYR82XjTEEQRCFX0dABlwEiAARkAEyIAJEoERACETARUAIJwIyeOqptfbm5qeP3lpTdVVXVzPd3/R0v+4zTLxsYv/4XwAkrwDsV6JyZmaLyKj1ESB5AOCpYfzazAQZttYFuDWz8zDvwE8OkNwF8NIwvjCz2SgAMkqSDuOzyDxYqgKSrwB2GhBKxHsHqGtLCiDDJ42Tj2Z27LLu2JQCnAK4a5x7M7Nth23XlhRgE8B74+SemempQtaKEpKsPUPo++sGOYCSIIU7zwJ05ficSLLkV6H/CIn7wEi2GRVkOVwFixEoREE/hz9DsR2TVKkp2zeSsI9bBUNnJNV4bhIA5cFhVCk2B5JCWVYhSEopjwAob6qa4QGQOKkqcj1iJSdIpmoqWEHIhr7Ph1BNgC4haxAPAC7UITPOc1UrCOXR12TlAnBAyKhAdHvPUg4pIn6AAYQc1ebG8QC+LXfD66XHU2HP7yKQlKhGODWu1gCTY/g7wCAaendNyltrRCQOIAERjCc/ejV1V4H3dp2ES4jU1vVJpXxpogoHSEE7oOEIp9G+/3c1OkArcpMDfAIqL6EhVS6JOAAAAABJRU5ErkJggg==") no-repeat center center;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: .99;
    animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    transform-origin: 50% 50%;
}
.quick-alo-phone .quick-alo-green .quick-alo-hover .quick-alo-ph-img-circle,
.quick-alo-phone.quick-alo-green:hover .quick-alo-ph-img-circle {
    background-color: #8bc34a;
}

@-moz-keyframes quick-alo-circle-anim {
    0% {
        -moz-transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1;
        -moz-opacity: .1;
        -webkit-opacity: .1;
        -o-opacity: .1
    }
    30% {
        -moz-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5;
        -moz-opacity: .5;
        -webkit-opacity: .5;
        -o-opacity: .5
    }
    100% {
        -moz-transform: rotate(0) scale(1) skew(1deg);
        opacity: .6;
        -moz-opacity: .6;
        -webkit-opacity: .6;
        -o-opacity: .1
    }
}
@-webkit-keyframes quick-alo-circle-anim {
    0% {
        -webkit-transform: rotate(0) scale(.5) skew(1deg);
        -webkit-opacity: .1
    }
    30% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        -webkit-opacity: .5
    }
    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        -webkit-opacity: .1
    }
}
@-o-keyframes quick-alo-circle-anim {
    0% {
        -o-transform: rotate(0) kscale(.5) skew(1deg);
        -o-opacity: .1
    }
    30% {
        -o-transform: rotate(0) scale(.7) skew(1deg);
        -o-opacity: .5
    }
    100% {
        -o-transform: rotate(0) scale(1) skew(1deg);
        -o-opacity: .1
    }
}
@-moz-keyframes quick-alo-circle-fill-anim {
    0% {
        -moz-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        -moz-transform: rotate(0) -moz-scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        -moz-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}
@-webkit-keyframes quick-alo-circle-fill-anim {
    0% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}
@-o-keyframes quick-alo-circle-fill-anim {
    0% {
        -o-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        -o-transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        -o-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}
@-moz-keyframes quick-alo-circle-img-anim {
    0% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        -moz-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        -moz-transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        -moz-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        -moz-transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        -moz-transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        -moz-transform: rotate(0) scale(1) skew(1deg)
    }
}
@-webkit-keyframes quick-alo-circle-img-anim {
    0% {
        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }
}
@-o-keyframes quick-alo-circle-img-anim {
    0% {
        -o-transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        -o-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        -o-transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        -o-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        -o-transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        -o-transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        -o-transform: rotate(0) scale(1) skew(1deg)
    }
}
@-moz-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        -ms-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}
@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        -ms-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}
@-o-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        -ms-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}

@media all and (min-width: 767px) {
    .phone { display: none }
}


/**/
.the-article-tools {
    top: 300px;
    z-index: 1000;
    position: fixed;
    margin-left: 5px;
    width: 43px;
    left: 0;
    padding: 0;
}



.the-article-tools li {
    width: 43px;
    height: 43px;
    display: block;
    cursor: pointer;
    font-size: 16px;
    line-height: 46px;
    text-align: center;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    border-radius: 50%;
}

.the-article-tools li a,
.the-article-tools li button {
    color: #FFF;
    display: block;
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    box-shadow: none
}

.the-article-tools li span.label {
    display: none;
    height: 30px;
    line-height: 30px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    position: absolute;
    left: 60px;
    top: 7px;
    white-space: nowrap;
    padding: 0 15px 0 6px;
    background: #555;
    color: #FFF
}

.the-article-tools li span.label:before {
    content: "";
    top: 0;
    left: -14px;
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-right: 15px solid #555;
    border-bottom: 15px solid transparent
}

.the-article-tools li:hover span.label {
    display: block
}

.the-article-tools li.btnZalo {
    background: #018fe5
}

.the-article-tools li.btnZalo .ti-zalo {
    background: url(../images/icon_zalomessage.png?1529826111637) no-repeat 50% 50%;
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: 20px;
    vertical-align: middle;
    margin-right: 2px;
    position: relative;
    top: -2px
}

.ti-viber {
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: 20px;
    vertical-align: middle;
    margin-right: 2px;
    position: relative;
    top: -2px
}

.the-article-tools li.btnZalo span.label {
    background: #018fe5;
    color: #FFF
}

.the-article-tools li.btnZalo span.label:before {
    border-right-color: #018fe5
}

.the-article-tools li.btnFacebook {
    background: #3b5998;
}

.the-article-tools li.btnFacebook .ti-facebook {
    background: url(../images/messenger.svg?1529826111637) no-repeat 50% 50%;
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: 20px;
    vertical-align: middle;
    margin-right: 2px;
    position: relative;
    top: -2px
}



.the-article-tools li.btnFacebook span.label {
    background: #306199;
    color: #FFF
}

.the-article-tools li.btnFacebook span.label:before {
    border-right-color: #306199
}

.the-article-tools li.btnphone {
    background: #1eaf8b
}

.the-article-tools li.btnphone button {
    background: #ee3c00;
}

.the-article-tools li.btnphone span.label {
    background: #1eaf8b;
    color: #FFF
}

.the-article-tools li.btnphone span.label:before {
    border-right-color: #1eaf8b
}

.back-hotline {
    position: fixed;
    right: 10px;
    bottom: 55px;
    z-index: 999;
    cursor: pointer;
    height: 35px;
    width: 35px;
    line-height: 35px;
    border-radius: 3px;
    background-color: #1eaf8b;
    color: #fff;
    display: none
}

@media (max-width: 991px) {
    .back-hotline {
        display: block
    }
}

.back-hotline button {
    color: #fff !important;
    display: block;
    width: 100%;
    height: 100%;
    font-size: 20px;
    border: none;
    outline: none;
    box-shadow: none;
    background-color: #1eaf8b;
    border-radius: 3px;
    padding: 0;
    margin: 0
}

.back-zalo {
    position: fixed;
    right: 10px;
    bottom: 100px;
    z-index: 999;
    cursor: pointer;
    height: 35px;
    width: 35px;
    line-height: 35px;
    border-radius: 3px;
    background-color: #018fe5;
    color: #fff;
    display: none
}

@media (max-width: 991px) {
    .back-zalo {
        display: block
    }
}

.back-zalo a {
    color: #fff;
    display: block;
    width: 100%;
    height: 100%;
    font-size: 20px
}

.back-zalo a .ti-zalo {
    background: url(../images/icon_zalomessage.png?1529826111637) no-repeat 50% 50%;
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: 20px;
    vertical-align: middle;
    margin-right: 0px;
    position: relative;
    top: -2px
}

#hotlineModal .modal-content {
    border-radius: 0
}

#hotlineModal .modal-content .modal-header {
    background-color: #1ba0e2
}

#hotlineModal .modal-content .modal-header .modal-title {
    padding-left: 0;
    min-height: 1px;
    text-align: center;
    color: #fff
}

#hotlineModal .modal-content .modal-header button {
    position: absolute;
    right: 10px;
    z-index: 99
}

#hotlineModal .modal-content .on-content {
    margin-bottom: 5px;
    padding-bottom: 5px;
    border-bottom: 1px solid #f7f7f7
}

#hotlineModal .modal-content .on-sup-info ul {
    margin-bottom: 10px
}

#hotlineModal .modal-content .on-sup-info ul li {
    display: table
}

#hotlineModal .modal-content .on-sup-info ul li i {
    display: table-cell;
    width: 20px
}

#hotlineModal .modal-content .on-sup-info ul:last-child {
    margin-bottom: 0
}

.the-article-tools li.btnViber {
    background: #db6f00;
}

.the-article-tools li.btnViber .ti-zalo {
    background: url(../images/icon_zalomessage.png?1529826111637) no-repeat 50% 50%;
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: 20px;
    vertical-align: middle;
    margin-right: 2px;
    position: relative;
    top: -2px
}

.the-article-tools li.btnViber span.label {
    background: #ec2472;
    color: #FFF
}

.the-article-tools li.btnViber span.label:before {
    border-right-color: #ec2472
}