/*Common*/
html
{
    height: 100%
}

body
{
    background:  #fff;
    color:       #282828;
    font-family: 'Roboto', sans-serif;
    font-size:   14px;
    line-height: 1.5;
    min-width:   320px;
    min-height:  100%;
    padding-top: 90px
}

body #backdrop
{
    cursor:     pointer;
    position:   fixed;
    left:       0;
    top:        0;
    width:      100%;
    height:     100%;
    background: rgba(0, 0, 0, 0.5);
    z-index:    20
}

.ya-loader
{
    width:               70px;
    height:              70px;
    border-radius:       50%;
    margin:              0 auto;
    background-color:    transparent;
    border:              5px solid #c0c0c0;
    border-top-color:    #559e2a;
    border-bottom-color: #559e2a;
    animation:           1s spin linear infinite
}

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

a
{
    color: #000
}

a, button
{
    transition: all .3s ease
}

a:active, button:active, a:focus, button:focus
{
    outline:    none !important;
    box-shadow: none !important
}

a.disabled
{
    pointer-events: none;
    cursor:         default;
}

a.available
{
    pointer-events: auto;
    cursor:         pointer;
}

.margin-0-top
{
    margin-top: 0 !important
}

.margin-5-top
{
    margin-top: 5px !important
}

.margin-10-top
{
    margin-top: 10px !important
}

.margin-20-top
{
    margin-top: 20px !important
}

.margin-30-top
{
    margin-top: 30px !important
}

.margin-40-top
{
    margin-top: 40px !important
}

.margin-0-bottom
{
    margin-bottom: 0 !important
}

.margin-10-bottom
{
    margin-bottom: 10px !important
}

.margin-20-bottom
{
    margin-bottom: 20px !important
}

.margin-30-bottom
{
    margin-bottom: 30px !important
}

.margin-40-bottom
{
    margin-bottom: 40px !important
}

.margin-60-bottom
{
    margin-bottom: 60px !important
}

.margin-20-bottom-minus
{
    margin-bottom: -20px !important
}

.margin-0-right
{
    margin-right: 0 !important
}

.margin-20-right
{
    margin-right: 20px !important
}

.margin-0-left
{
    margin-left: 0 !important
}

.margin-25-left
{
    margin-left: 25px !important
}

.padding-90-top
{
    padding-top: 90px;
}

.padding-30-top
{
    padding-top: 30px;
}

.padding-10-top
{
    padding-top: 10px;
}

.padding-15-bottom
{
    padding-bottom: 15px;
}

.padding-0-bottom
{
    padding-bottom: 0 !important;
}

.padding-0-top
{
    padding-top: 0 !important;
}

.padding-0-left
{
    padding-left: 0 !important;
}

.vertical-align-bottom
{
    vertical-align: bottom !important;
}

.text-link a
{
    color:           #559e2a;
    font-size:       20px;
    text-decoration: underline;
    background:      url('/images/icons/ico_arrow_right_green.svg') no-repeat right 6px;
    padding:         0 30px 0 0;
    font-weight:     500
}

.text-link a:hover
{
    text-decoration: none
}

.deed-radio
{
    top: 3px !important;
}

.fz16
{
    font-size: 16px
}

.fz18
{
    font-size: 18px
}

.green
{
    color: #559e2a
}

.btn
{
    border-radius: 4px;
    padding:       0 15px;
    line-height:   40px;
    height:        40px;
    font-family:   'Arvo', serif;
    font-weight:   700;
    transition:    all .3s ease;
    cursor:        pointer;
}

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

.btn.disable
{
    outline:      none !important;
    box-shadow:   none !important;
    background:   #a7a7a7 !important;
    color:        #fff;
    border-color: #a7a7a7 !important;
    cursor:       not-allowed
}

.btn.disable:hover, .btn.disable:active, .btn.disable:focus
{
    outline:      none !important;
    box-shadow:   none !important;
    background:   #a7a7a7 !important;
    color:        #fff !important;
    border-color: #a7a7a7 !important
}

.btn-primary
{
    background:     #559e2a;
    border-color:   #559e2a;
    font-size:      16px;
    line-height:    40px;
    height:         40px;
    opacity:        0.3;
    pointer-events: none;
    text-align:     center;
}

.btn-primary-light-40 .for-mobile, .btn-primary .for-mobile
{
    display: none;
}

.btn-primary.clickable
{
    pointer-events: auto;
}

.btn-primary.active
{
    opacity:        1;
    pointer-events: auto;
}

.btn-primary.initial-active
{
    opacity:        1;
    pointer-events: auto;
}

.btn-primary:hover, .btn-primary:active, .btn-primary:disabled
{
    background:   #559e2a;
    border-color: #559e2a;
    opacity:      0.3;
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle
{
    background:   #559e2a;
    border-color: #559e2a;
    opacity:      1;
}

.btn-primary.active:hover
{
    color:          #559e2a !important;
    background:     #fff !important;
    border-color:   #559e2a !important;
    box-shadow:     0 10px 20px 0 rgba(31, 84, 0, 0.2);
    opacity:        1;
    pointer-events: auto;
}

.btn-primary.active.processing:hover
{
    background: #559e2a !important;
}

span.loading,
div.loading,
i.loading
{
    border-radius:       50%;
    width:               24px;
    height:              24px;
    margin:              0 auto;
    background-color:    transparent;
    border:              5px solid #c0c0c0;
    border-top-color:    white;
    border-bottom-color: white;
    animation:           1s spin linear infinite;
    display:             none;
    position:            relative;
    top:                 6px;
}

.btn-primary.processing
{
    opacity:        0.5 !important;
    pointer-events: none;
}

.btn-primary.processing > span
{
    display: none;
}

.btn-primary.processing > .loading
{
    display: inline-block;
}

.list-checkbox a
{
    text-decoration: underline;
    color:           #559e2a;
}

.list-checkbox a:hover
{
    text-decoration: none;
}

.btn-primary-40
{
    color:        #fff;
    background:   #559e2a;
    border-color: #559e2a;
    font-size:    16px;
    line-height:  40px;
    height:       40px
}

.btn-primary-40:hover, .btn-primary-40:active
{
    color:        #559e2a !important;
    background:   #fff !important;
    border-color: #559e2a !important;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2)
}

.btn-primary-50
{
    color:        #fff;
    background:   #559e2a;
    border-color: #559e2a;
    font-size:    16px;
    line-height:  50px;
    height:       50px
}

.btn-primary-50:hover, .btn-primary-50:active
{
    color:        #559e2a !important;
    background:   #fff !important;
    border-color: #559e2a !important;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2)
}

.btn-primary-light-40
{
    color:        #559e2a;
    background:   #fff;
    border-color: #559e2a;
    font-size:    16px;
    line-height:  40px;
    height:       40px
}

.btn-primary-light-40:hover, .btn-primary-light-40:active
{
    color:        #fff !important;
    background:   #559e2a !important;
    border-color: #559e2a !important;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2)
}

.btn-primary-light-50
{
    color:        #559e2a;
    background:   #fff;
    border-color: #559e2a;
    font-size:    16px;
    line-height:  50px;
    height:       50px
}

.btn-primary-light-50:hover, .btn-primary-light-50:active
{
    color:        #fff !important;
    background:   #559e2a !important;
    border-color: #559e2a !important;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2)
}

.btn-black-light-40
{
    color:        #000;
    background:   #fff;
    border-color: #000;
    font-size:    16px;
    line-height:  40px;
    height:       40px
}

.btn-black-light-40:hover, .btn-black-light-40:active
{
    color:        #559e2a !important;
    background:   #fff !important;
    border-color: #559e2a !important;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2)
}

.btn-black-light-50
{
    color:        #000;
    background:   #fff;
    border-color: #000;
    font-size:    16px;
    line-height:  50px;
    height:       50px
}

.btn-black-light-50:hover, .btn-black-light-50:active
{
    color:        #559e2a !important;
    background:   #fff !important;
    border-color: #559e2a !important;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2)
}

.btn-primary-b
{
    color:        #fff;
    background:   #559e2a;
    border-color: #559e2a;
    font-size:    20px;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2);
    line-height:  70px;
    height:       70px
}

.btn-primary-b:hover, .btn-primary-b:active
{
    color:        #559e2a !important;
    background:   #fff !important;
    border-color: #559e2a !important
}

.btn-white-40
{
    color:        #559e2a;
    background:   #fff;
    border-color: #fff;
    font-size:    16px;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2);
    line-height:  40px;
    height:       40px
}

.btn-white-40:hover, .btn-white-40:active
{
    opacity:      1;
    background:   none !important;
    border-color: #fff !important;
    color:        #fff !important
}

.btn-white-50
{
    color:        #559e2a;
    background:   #fff;
    border-color: #fff;
    font-size:    16px;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2);
    line-height:  50px;
    height:       50px
}

.btn-white-50:hover, .btn-white-50:active
{
    opacity:      1;
    background:   none !important;
    border-color: #fff !important;
    color:        #fff !important
}

.btn-white-b
{
    color:        #559e2a;
    background:   #fff;
    border-color: #fff;
    font-size:    20px;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2);
    line-height:  70px;
    height:       70px
}

.btn-white-b:hover, .btn-white-b:active
{
    opacity:      1;
    background:   none !important;
    border-color: #fff !important;
    color:        #fff !important
}

.btn-orange
{
    color:        #ffc400;
    border-color: #ffc400;
    font-size:    16px;
    box-shadow:   0 10px 20px 0 rgba(31, 84, 0, 0.2);
    line-height:  50px;
    height:       50px;
    padding:      0 20px
}

.btn-orange:hover, .btn-orange:active, .btn-orange:focus
{
    opacity:      1;
    background:   #ffc400 !important;
    border-color: #ffc400 !important;
    color:        #fff !important
}

.bg
{
    height:   100%;
    overflow: hidden;
    position: absolute;
    left:     0;
    top:      0;
    width:    100%;
    z-index:  0
}

.bg .wrap-skew
{
    height: 100%
}

.bg .bg-skew-right
{
    position:                 absolute;
    left:                     0;
    top:                      0;
    height:                   100%;
    width:                    100%;
    background-image:         linear-gradient(140deg, #559e2a 0, #2a9b9e 100%);
    transform:                perspective(568px) rotateX(-20deg);
    transform-origin:         bottom left;
    border-radius:            0 0 100px 0
}

.bg-light-blue
{
    background: #f4f8fe
}

.group-list .row
{
    align-items: flex-end;
}

.row-list
{
    margin-bottom: -30px
}

.row-list .row-item
{
    margin-bottom: 30px
}

.row-list-20
{
    margin-bottom: -20px
}

.row-list-20 .row-item
{
    margin-bottom: 20px
}

.row-list-10
{
    margin-bottom: -10px
}

.row-list-10 .row-item
{
    margin-bottom: 10px
}

.attention
{
    background-image: linear-gradient(140deg, #559e2a 0, #2a9b9e 100%);
    box-shadow:       0 -10px 30px 0 rgba(0, 18, 66, 0.05);
    padding:          15px 0;
    position:         fixed;
    left:             0;
    bottom:           0;
    width:            100%;
    z-index:          10;
    transition:       all .5s ease;
    transform:        translate(0, 100%)
}

.attention .attention-inner
{
    color:      #fff;
    text-align: center
}

.attention .attention-inner .img
{
    margin: 0 30px 0 0
}

.attention .attention-inner .img img
{
    display:        inline-block;
    vertical-align: middle;
    height:         24px;
    width:          auto;
    margin-top:     -1px;
    filter:         brightness(0) invert(1)
}

.attention .attention-inner .img span
{
    display:        inline-block;
    vertical-align: middle;
    color:          #fff;
    font-weight:    700;
    font-family:    'Arvo', serif;
    font-size:      18px;
    padding-left:   6px
}

.attention .attention-inner p
{
    font-weight:    700;
    font-family:    'Roboto', sans-serif;
    font-size:      16px;
    margin:         0 20px 0 0;
    display:        inline-block;
    vertical-align: middle
}

.attention .attention-inner p:last-child
{
    margin-right: 0
}

.attention .attention-inner .confirm span
{
    text-decoration: underline;
    cursor:          pointer
}

.attention .attention-inner .confirm span:hover
{
    color:           #ffac00;
    text-decoration: none
}

.attention.attention-alert
{
    transform: translate(0, 0)
}

.tab-content .tab-pane
{
    padding: 30px 0 0 0
}


font[face="Roboto-Bold, sans-serif"]
{
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
}

[v-cloak] > *
{
    display: none;
}

.flex
{
    display: flex
}

.animate
{
    transition: all .3s ease
}

.error-404
{
    text-align: center
}

.error-404 .water-fill
{
    animation: wave 1.5s infinite linear, fill-up 15s infinite ease-out alternate
}

.error-404 h3
{
    font-size:   24px;
    font-weight: 500;
    font-family: 'Roboto', sans-serif
}

.error-404 .back,
.feedback-sent .back
{
    text-transform: uppercase;
    font-weight:    500;
    margin:         15px 0 0 0
}

.error-404 .back a,
.feedback-sent .back a
{
    color: #559e2a
}

.error-404 .img-error
{
    margin: 20px 0 0 0
}

.error-404 .img-error svg
{
    max-width: 350px
}

.error-404 .img-error #Fill-29
{
    display: none
}

.error-404 .img-error #home_left path,
.error-404 .img-error #home_left polygon
{
    animation: home_left 3s infinite linear
}

.error-404 .img-error #home_right path,
.error-404 .img-error #home_right polygon
{
    animation: home_right 3s infinite linear
}

h1
{
    font-size:   50px;
    font-family: 'Arvo', serif;
    font-weight: 700
}

h1 span
{
    display:  inline-block;
    position: relative
}

h1 span:after
{
    content:    "";
    display:    none;
    background: #579d33;
    position:   absolute;
    left:       0;
    bottom:     9px;
    width:      100%;
    height:     8px;
    opacity:    .3
}

h1 em
{
    display:     block;
    font-size:   20px;
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
    font-style:  normal;
    padding-top: 5px
}

h1 em.fz16
{
    font-size: 16px
}

h2,
.h2
{
    font-size:     36px;
    font-family:   'Arvo', serif;
    font-weight:   700;
    color:         #282828;
    margin-bottom: 40px
}

h2 a, .h2 a
{
    color: #559e2a;
}

h2 a:hover,
h2 a:active,
h2 a:focus,
.h2 a:hover,
.h2 a:active,
.h2 a:focus
{
    text-decoration: underline;
    color:           #559e2a;
}

h2 span,
.h2 span
{
    display:  inline-block;
    position: relative
}

h2 span:after,
.h2 span:after
{
    content:    "";
    display:    none;
    background: #579d33;
    position:   absolute;
    left:       0;
    bottom:     9px;
    width:      100%;
    height:     8px;
    opacity:    .3
}

h2 em,
.h2 em
{
    display:     block;
    font-size:   20px;
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
    font-style:  normal;
    padding-top: 5px
}

h2 em.fz16,
.h2 em.fz16
{
    font-size: 16px
}

h2.ttl-slide,
.h2.ttl-slide
{
    font-size:      16px;
    color:          #5b5c5d;
    text-transform: uppercase;
    opacity:        .8;
    margin-bottom:  20px
}

h3,
.h3
{
    margin:      0;
    font-size:   18px;
    color:       #282828;
    font-family: 'Arvo', serif;
    font-weight: 700
}

h4
{
    font-size: 14px
}

h5
{
    font-size: 14px
}

/*Main content*/
#Main
{
    padding: 0 0 130px 0
}

section
{
    padding: 50px 0
}

section .img-70
{
    width:  70px;
    height: auto
}

section.gradient
{
    background-image: linear-gradient(140deg, #559e2a 0, #2a9b9e 100%)
}

section.gradient h2
{
    color: #fff
}

.feature-on
{
    padding-top: 30px
}

.feature-on h2
{
    margin-bottom: 10px
}

.feature-on.fill-bg
{
    background: #f4f8fe
}

.feature-on.feature-on-partner
{
    padding-bottom: 160px
}

.feature-on .feature-on-inner ul
{
    list-style:      none;
    margin:          0;
    padding:         0;
    text-align:      center;
    display:         flex;
    justify-content: center;
    align-items:     center;
    flex-flow:       nowrap
}

.feature-on .feature-on-inner ul li
{
    display:        inline-block;
    vertical-align: middle;
    padding-right:  60px
}

.feature-on .feature-on-inner ul li:last-child
{
    padding-right: 0
}

.feature-on .feature-on-inner .img
{
    text-align:  center;
    margin:      0;
    height:      100%;
    display:     flex;
    align-items: center
}

.feature-on .feature-on-inner .img img
{
    max-height: 120px
}

.feature-on .feature-on-inner .img a:hover
{
    opacity: .8
}

.offered
{
    background-image: linear-gradient(140deg, #559e2a 0, #2a9b9e 100%)
}

.offered h2
{
    color: #fff
}

.offered .product-list
{
    padding: 10px 0 0 0
}

.offered .product-list .inner
{
    height: 100%
}

.offered .product-list .inner a
{
    background:      #fff;
    display:         block;
    border-radius:   60px 8px 8px 8px;
    text-align:      center;
    box-shadow:      0 10px 30px 0 rgba(0, 0, 0, 0.05);
    padding:         50px 15px;
    text-decoration: none;
    color:           #000;
    position:        relative;
    overflow:        hidden;
    transition:      all .8s ease
}

.offered .product-list .inner a span
{
    display: block
}

.offered .product-list .inner a .img
{
    height:     60px;
    position:   relative;
    margin:     0 auto;
    text-align: center;
    display:    inline-block;
    overflow:   hidden
}

.offered .product-list .inner a .img img
{
    height:     60px;
    width:      auto;
    max-width:  inherit;
    transition: all .7s ease
}

.offered .product-list .inner a .img img + img
{
    position: absolute;
    left:     0;
    top:      100%
}

.offered .product-list .inner a .txt
{
    font-size:   22px;
    font-family: 'Arvo', serif;
    font-weight: 700;
    padding-top: 50px
}

.offered .product-list .inner a .txt span
{
    display:       inline-block;
    position:      relative;
    transition:    all .6s ease;
    padding-right: 7px
}

.offered .product-list .inner a .txt span:after
{
    content:    "";
    background: url('/images/icons/ico_arrow_right.svg') no-repeat 0 0;
    width:      18px;
    height:     14px;
    position:   absolute;
    right:      0;
    top:        50%;
    margin-top: -5px;
    opacity:    0
}

.offered .product-list .inner a:before
{
    content:       "";
    background:    #2aa100;
    position:      absolute;
    left:          50%;
    top:           50%;
    width:         150%;
    height:        150%;
    transition:    all .8s ease;
    transform:     translate(-50%, -150%);
    border-radius: 100%;
}

.offered .product-list .inner a:after
{
    content:       "";
    background:    #559e2a;
    position:      absolute;
    left:          50%;
    top:           0;
    width:         408px;
    height:        408px;
    border-radius: 50%;
    opacity:       .05;
    transform:     translate(-50%, -70%)
}

.offered .product-list .inner a:hover
{
    box-shadow: 0 20px 40px 0 rgba(34, 87, 8, 0.4);
    background: #2aa100
}

.offered .product-list .inner a:hover .img img
{
    margin-top: -80px;
    opacity:    0
}

.offered .product-list .inner a:hover .img img + img
{
    visibility: visible;
    top:        0;
    margin-top: 0;
    opacity:    1
}

.offered .product-list .inner a:hover .txt span
{
    color:         #fff;
    padding-right: 20px
}

.offered .product-list .inner a:hover .txt span:after
{
    opacity: 1;
    right:   -10px
}

.offered .product-list .inner a:hover:before
{
    opacity:   1;
    transform: translate(-50%, -50%)
}

.offered .product-list .inner a:hover:after
{
    background: #fff;
    opacity:    .07
}

.compare
{
    padding-bottom: 70px
}

.compare .compare-panel
{
    display:         flex;
    flex-direction:  row;
    justify-content: center;
    padding:         30px 0 0 0
}

.compare .compare-panel .compare-box
{
    background:    #fff;
    border-radius: 8px 0 0 8px;
    border:        1px solid #eff4fa;
    max-width:     293px;
    width:         100%
}

.compare .compare-panel .compare-box .ttl-box
{
    background:    #f4f8fe;
    padding:       15px;
    height:        80px;
    border-bottom: 1px solid #eff4fa
}

.compare .compare-panel .compare-box .ttl-box h3
{
    text-align: center
}

.compare .compare-panel .compare-box ul
{
    list-style: none;
    margin:     0;
    padding:    0
}

.compare .compare-panel .compare-box ul li
{
    height:        59px;
    border-bottom: 1px solid #eff4fa;
    display:       flex;
    justify-items: center;
    align-items:   center
}

.compare .compare-panel .compare-box ul li p
{
    margin:  0;
    padding: 5px 20px;
    width:   100%
}

.compare .compare-panel .compare-box ul li p img
{
    display:        inline-block;
    vertical-align: middle
}

.compare .compare-panel .compare-box ul li p span
{
    display:        inline-block;
    vertical-align: middle;
    padding-left:   6px;
    font-size:      16px
}

.compare .compare-panel .compare-box.young
{
    border-radius:  8px;
    box-shadow:     0 0 20px 0 rgba(26, 53, 12, 0.1);
    border-left:    none;
    border-right:   none;
    margin-top:     -20px;
    margin-bottom:  -20px;
    overflow:       hidden;
    padding-bottom: 20px;
    position:       relative;
    z-index:        1;
    max-width:      360px;
    width:          100%
}

.compare .compare-panel .compare-box.young .ttl-box
{
    background: #559e2a;
    padding:    25px 15px;
    height:     100px
}

.compare .compare-panel .compare-box.young .ttl-box img
{
    height: 44px
}

.compare .compare-panel .compare-box.young ul li p span
{
    font-weight: 700
}

.compare .compare-panel .compare-box.young .btn-started
{
    margin:  0;
    padding: 20px 15px
}

.compare .compare-panel .compare-box.young .btn-started .btn
{
    width: 100%
}

.compare .compare-panel .compare-box:first-child
{
    border-right: none
}

.compare .compare-panel .compare-box:last-child
{
    border-left:   none;
    border-radius: 0 8px 8px 0;
}

.how-it-work .step-list
{
    padding: 10px 0 0 0
}

.how-it-work .step-list .step-item
{
    position:       relative;
    padding-bottom: 50px;
    margin-bottom:  -10px;
    overflow:       hidden
}

.how-it-work .step-list .step-item .row-item
{
    padding-left: 80px
}

.how-it-work .step-list .step-item .row-item + .row-item
{
    padding-left:  15px;
    padding-right: 80px
}

.how-it-work .step-list .step-item .point
{
    margin:      0;
    width:       40px;
    height:      40px;
    position:    absolute;
    left:        50%;
    top:         20px;
    margin-left: -20px
}

.how-it-work .step-list .step-item .point span
{
    display:       block;
    width:         40px;
    height:        40px;
    background:    rgba(86, 156, 51, 0.1);
    border-radius: 40px;
    position:      relative
}

.how-it-work .step-list .step-item .point span:after
{
    content:       "";
    display:       inline-block;
    background:    #559e2a;
    width:         8px;
    height:        8px;
    border-radius: 10px;
    position:      absolute;
    left:          50%;
    top:           50%;
    transform:     translate(-50%, -50%);
    z-index:       1
}

.how-it-work .step-list .step-item .line
{
    background: #559e2a;
    content:    "";
    position:   absolute;
    left:       50%;
    top:        70px;
    transform:  translate(-50%, 0);
    width:      2px;
    height:     100%
}

.how-it-work .step-list .step-item .line.line2
{
    background: #62c3f8
}

.how-it-work .step-list .step-item:after
{
    content:    "";
    background: #354f71;
    position:   absolute;
    left:       50%;
    top:        70px;
    transform:  translate(-50%, 0);
    width:      2px;
    height:     100%;
    opacity:    0
}

.how-it-work .step-list .step-item .step-inner img
{
    max-width: inherit;
    width:     100%
}

.how-it-work .step-list .step-item .step-inner .step-num
{
    margin: 20px 0 0 0
}

.how-it-work .step-list .step-item .step-inner .step-num span
{
    display:       inline-block;
    width:         45px;
    height:        45px;
    border-radius: 5px;
    background:    #569c33;
    color:         #fff;
    font-size:     18px;
    font-weight:   700;
    text-align:    center;
    line-height:   45px
}

.how-it-work .step-list .step-item .step-inner .step-des
{
    padding: 20px 0 0 0
}

.how-it-work .step-list .step-item .step-inner .step-des h3
{
    margin-bottom: 10px;
    font-size:     22px
}

.how-it-work .step-list .step-item.even .row-item
{
    padding-right: 80px;
    padding-left:  15px
}

.how-it-work .step-list .step-item.even .row-item + .row-item
{
    padding-right: 15px;
    padding-left:  80px
}

.how-it-work .step-list .step-item.even .step-inner .step-num
{
    text-align: right
}

.how-it-work .step-list .step-item.even .step-inner .step-des
{
    text-align: right
}

.how-it-work .step-list .step-item.blue .point span
{
    background: rgba(98, 195, 248, 0.1)
}

.how-it-work .step-list .step-item.blue .point span:after
{
    background: #62c3f8
}

.how-it-work .step-list .step-item.blue .step-inner .step-num span
{
    background: #62c3f8
}

.how-it-work .step-list .step-item.orange .point span
{
    background: rgba(255, 172, 0, 0.1)
}

.how-it-work .step-list .step-item.orange .point span:after
{
    background: #ffac00
}

.how-it-work .step-list .step-item.orange .step-inner .step-num span
{
    background: #ffac00
}

.how-it-work .step-list .step-item:last-child:after
{
    display: none
}

#Footer
{
    color:      #999;
    background: #000;
    padding:    30px 0
}

#Footer .page-top
{
    margin:       0;
    position:     fixed;
    bottom:       0;
    right:        -55px;
    cursor:       pointer;
    color:        #fff;
    border-style: solid;
    border-width: 0 0 61px 50px;
    border-color: transparent transparent #559e2a;
    transform:    rotate(360deg);
    text-align:   center;
    z-index:      999;
    transition:   all .2s ease
}

#Footer .page-top i
{
    position:  absolute;
    right:     7px;
    bottom:    -55px;
    font-size: 25px;
    display:   block
}

#Footer .page-top:hover
{
    border-color: transparent transparent #559e2a
}

#Footer .page-top.show
{
    right: 0
}

#Footer .footer-top
{
    margin-top: -150px
}

#Footer .footer-top .started-block
{
    border-radius: 10px;
    background:    #559e2a;
    padding:       35px 15px;
    text-align:    center
}

#Footer .footer-top .started-block h2,
#Footer .footer-top .started-block .h2
{
    color:         #fff;
    margin-bottom: 20px
}

#Footer .footer-top .started-block h2 br,
#Footer .footer-top .started-block .h2 br
{
    display: none
}

#Footer .footer-top .started-block h2 em,
#Footer .footer-top .started-block .h2 em
{
    color:       #fff;
    font-style:  normal;
    font-size:   16px;
    padding-top: 10px
}

#Footer .footer-top .started-block .btn-started
{
    margin: 0
}

#Footer .footer-top .started-block .btn-started .btn
{
    max-width: 250px;
    width:     100%
}

#Footer .footer-top .started-block .btn-started .btn:hover
{
    opacity:      1;
    background:   none !important;
    border-color: #fff !important;
    color:        #fff !important
}

#Footer .footer-top .subscrice
{
    max-width: 740px;
    margin:    0 auto;
    position:  relative;
    padding:   10px 230px 0 0
}

#Footer .footer-top .subscrice .form-group
{
    margin:  0;
    width:   100%;
    display: block;
    flex:    unset
}

#Footer .footer-top .subscrice input
{
    background:    url('/images/icons/ico_email2.svg') no-repeat left center;
    border:        none;
    border-bottom: 2px solid #fff;
    height:        60px;
    line-height:   60px;
    border-radius: 0;
    width:         100%;
    padding:       0 0 0 40px;
    color:         #fff;
    outline:       none !important;
    box-shadow:    none !important;
    appearance:    none
}

#Footer .footer-top .subscrice .btn
{
    height:      60px;
    line-height: 60px;
    max-width:   220px;
    width:       100%;
    position:    absolute;
    right:       0;
    top:         10px
}

#Footer .footer-top .subscrice .btn:hover
{
    opacity:      1;
    background:   none !important;
    border-color: #fff !important;
    color:        #fff !important
}

#Footer .footer-top .subscrice ::-webkit-input-placeholder
{
    color:   #fff;
    opacity: .7
}

#Footer .footer-top .subscrice :-ms-input-placeholder
{
    color:   #fff;
    opacity: .7
}

#Footer .footer-top .subscrice ::placeholder
{
    color:   #fff;
    opacity: .7
}

#Footer .footer-bot
{
    padding:       50px 0 0 0;
    margin-bottom: -30px
}

#Footer .footer-bot .f-logo
{
    margin:    0;
    max-width: 210px
}

#Footer .footer-bot .f-logo a
{
    transition: all .3s ease
}

#Footer .footer-bot .f-logo a:hover
{
    opacity: .8
}

#Footer .footer-bot .info
{
    list-style: none;
    margin:     0;
    padding:    15px 0 0 0
}

#Footer .footer-bot .info li
{
    overflow: hidden
}

#Footer .footer-bot .info li img
{
    float:     left;
    max-width: 19px
}

#Footer .footer-bot .info li p
{
    margin: 0 0 0 42px
}

#Footer .footer-bot .info li p a
{
    color:           #999;
    text-decoration: none
}

#Footer .footer-bot .info li p a:hover
{
    color: #559e2a
}

#Footer .footer-bot .info li ul li + li
{
    padding-top: 0
}

#Footer .footer-bot .info li ul.socials li a
{
    background: none;
    color:      #999;
    border:     1px solid #999
}

#Footer .footer-bot .info li ul.socials li a:hover
{
    background: #559e2a;
    color:      #fff;
    border:     1px solid #559e2a
}

#Footer .footer-bot .info li + li
{
    padding-top: 20px
}

#Footer .footer-bot .f-txt
{
    color:          #ddd;
    margin:         15px 0 0 0;
    text-transform: uppercase;
    font-weight:    500
}

#Footer .footer-bot .f-txt a
{
    color:           #ddd;
    text-decoration: none;
    font-weight:     500
}

#Footer .footer-bot .f-txt a:hover
{
    color: #559e2a
}

#Footer .footer-bot .f-nav
{
    list-style: none;
    padding:    20px 0 0 0;
    margin:     0
}

#Footer .footer-bot .f-nav li a
{
    color:           #999;
    text-decoration: none
}

#Footer .footer-bot .f-nav li a:hover
{
    color: #559e2a
}

#Footer .footer-bot .f-nav li + li
{
    padding-top: 5px
}

/*Socials*/
.main-contact
{
    position:   fixed;
    right:      10px;
    bottom:     10px;
    z-index:    1000;
    transition: all .2s ease
}

.main-contact.page-top-show
{
    bottom: 80px
}

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

.main-contact ul li a
{
    display: block
}

.main-contact ul li a span
{
    display:       block;
    width:         60px;
    height:        60px;
    border-radius: 50%;
    background:    #559e2a;
    line-height:   60px;
    text-align:    center
}

.main-contact ul li a img
{
    width:  28px;
    height: auto
}

.main-contact ul li a:hover
{
    opacity: .8
}

.main-contact ul li + li
{
    margin-top: 15px
}

.main-contact.page-top-show
{
    bottom: 80px
}

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

.socials li
{
    display:        inline-block;
    vertical-align: middle;
    margin-right:   10px
}

.socials li a
{
    display:       block;
    width:         48px;
    height:        48px;
    text-align:    center;
    line-height:   48px;
    background:    #559e2a;
    border-radius: 100%;
    color:         #fff
}

.socials li a span
{
    display:   block;
    font-size: 16px
}

.socials li a:hover
{
    opacity: .8
}

.socials li:last-child
{
    margin-right: 0
}

/*Mobile styles*/
@media screen and (max-width: 1199px)
{
    h1
    {
        font-size: 40px
    }

    .socials li
    {
        margin-right: 2px
    }

    .btn-primary-b
    {
        line-height: 50px;
        height:      50px
    }
}

@media screen and (max-width: 1024px)
{
    body
    {
        font-size: 16px
    }
}

@media screen and (max-width: 991px)
{
    body
    {
        padding-top: 60px
    }

    .btn-primary-b
    {
        line-height: 40px;
        height:      40px;
        font-size:   18px
    }

    .nav-tabs li a
    {
        font-size: 18px !important;
        padding:   20px 10px !important
    }

    section
    {
        padding: 40px 0
    }

    .bg .wrap-skew
    {
        max-width: 57%
    }

    #Footer .footer-bot
    {
        padding-top: 30px
    }

    #Footer .footer-bot .f-nav
    {
        padding-top: 10px
    }

    .btn-primary-light-40 .for-mobile, .btn-primary .for-mobile
    {
        display: block;
    }

    .btn-primary-light-40 .for-desktop, .btn-primary .for-desktop
    {
        display: none;
    }

    .compare .compare-panel
    {
        padding-top:    0;
        flex-direction: column;
        align-items:    center
    }

    .compare .compare-panel .compare-box
    {
        border:        1px solid #eff4fa;
        border-radius: 8px;
    }

    .compare .compare-panel .compare-box:first-child
    {
        border:  1px solid #eff4fa;
        display: none !important
    }

    .compare .compare-panel .compare-box:last-child
    {
        border:  1px solid #eff4fa;
        display: none !important
    }

    .compare .compare-panel .compare-box:last-child ul li:last-child
    {
        border-bottom: none
    }

    .compare .compare-panel .compare-box.young
    {
        margin-top:    -5px;
        margin-bottom: -5px
    }

    .how-it-work .step-list .step-item .row-item
    {
        padding-left: 50px
    }

    .how-it-work .step-list .step-item .row-item + .row-item
    {
        padding-left:  15px;
        padding-right: 50px
    }

    .how-it-work .step-list .step-item.even .row-item
    {
        padding-right: 50px;
        padding-left:  15px
    }

    .how-it-work .step-list .step-item.even .row-item + .row-item
    {
        padding-right: 15px;
        padding-left:  50px
    }
}

@media screen and (max-width: 767px)
{
    h1, .h1
    {
        font-size: 26px
    }

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

    h2 span:after, .h2 span:after
    {
        height: 5px;
        bottom: 6px
    }

    h2 em, .h2 em
    {
        font-size: 15px
    }

    .offered .product-list .inner a
    {
        border-radius: 8px;
    }

    .offered .product-list .row-list
    {
        margin-left:   -7.5px;
        margin-right:  -7.5px;
        margin-bottom: -15px
    }

    .offered .product-list .row-list .row-item
    {
        padding-left:  7.5px;
        padding-right: 7.5px;
        margin-bottom: 15px
    }

    .offered .product-list .row-list .row-item:nth-child(1) .inner a
    {
        border-radius: 60px 8px 8px 8px;
    }

    .offered .product-list .row-list .row-item:nth-child(2) .inner a
    {
        border-radius: 8px 60px 8px 8px;
    }

    .offered .product-list .row-list .row-item:nth-last-child(2) .inner a
    {
        border-radius: 8px 8px 8px 60px;
    }

    .offered .product-list .row-list .row-item:last-child .inner a
    {
        border-radius: 8px 8px 60px 8px;
    }

    .how-it-work .step-list .step-item
    {
        padding-bottom: 30px
    }

    .how-it-work .step-list .step-item .line
    {
        display: none
    }

    .how-it-work .step-list .step-item .row-item
    {
        padding-left:  70px;
        padding-right: 15px;
        transform:     none !important;
        opacity:       1 !important;
        order:         inherit
    }

    .how-it-work .step-list .step-item .row-item + .row-item
    {
        padding-left:  70px;
        padding-right: 15px
    }

    .how-it-work .step-list .step-item.even .row-item
    {
        padding-left:  70px;
        padding-right: 15px
    }

    .how-it-work .step-list .step-item.even .row-item + .row-item
    {
        padding-left:  70px;
        padding-right: 15px
    }

    .how-it-work .step-list .step-item.even .step-inner .step-num
    {
        text-align: left
    }

    .how-it-work .step-list .step-item.even .step-inner .step-des
    {
        text-align: left
    }

    .how-it-work .step-list .step-item .point
    {
        left:        0;
        margin-left: 0;
        width:       35px;
        height:      35px
    }

    .how-it-work .step-list .step-item .point span
    {
        width:  35px;
        height: 35px
    }

    .how-it-work .step-list .step-item:after
    {
        left:      16px;
        transform: translate(0);
        opacity:   .1
    }

    .container
    {
        max-width: inherit
    }

    .nav-tabs
    {
        margin:   0 !important;
        padding:  41px 0 0 0 !important;
        position: relative
    }

    .nav-tabs li
    {
        margin:        0 !important;
        padding:       0 !important;
        flex:          none;
        max-width:     inherit;
        border-bottom: 1px solid #eff4fa !important;
        overflow:      hidden;
        display:       none
    }

    .nav-tabs li.active
    {
        display:  block !important;
        position: absolute;
        left:     0;
        top:      0;
        width:    100%
    }

    .nav-tabs li.active a
    {
        position:      relative !important;
        padding-right: 30px !important
    }

    .nav-tabs li.active a:after
    {
        content:     "\f107";
        font-family: FontAwesome;
        position:    absolute;
        right:       10px;
        top:         7px
    }

    .nav-tabs li.active a:hover
    {
        background:   #559e2a !important;
        color:        #fff !important;
        border-color: #559e2a !important
    }

    .nav-tabs li a
    {
        font-size:     18px !important;
        padding:       7px 10px !important;
        border-radius: 0 !important;
        text-align:    left !important;
        box-shadow:    none;
        transition:    all 0s
    }

    .nav-tabs li a:hover
    {
        background:   #559e2a !important;
        color:        #fff !important;
        border-color: #559e2a !important
    }

    .nav-tabs.nav-tabs-show li
    {
        display: block !important
    }

    #Footer .footer-top .subscrice
    {
        padding-right: 160px
    }

    #Footer .footer-top .subscrice input
    {
        height:      50px;
        line-height: 50px
    }

    #Footer .footer-top .subscrice .btn
    {
        height:      50px;
        line-height: 50px;
        max-width:   150px
    }
}

@media screen and (max-width: 639px)
{
    .attention .attention-inner p
    {
        display: block;
        width:   100%;
        margin:  0
    }

    .attention .attention-inner p + p
    {
        margin-top: 10px
    }

    .feature-on .feature-on-inner ul
    {
        display:    block;
        text-align: center
    }

    .feature-on .feature-on-inner ul li
    {
        display:       block;
        padding-right: 0
    }

    .feature-on .feature-on-inner ul li .img
    {
        display: block
    }

    .feature-on .feature-on-inner ul li .img img
    {
        max-height: 100px
    }

    .offered .product-list .inner a
    {
        padding:       40px 10px 30px 10px;
        border-radius: 4px;
    }

    .offered .product-list .inner a .img
    {
        height: 44px
    }

    .offered .product-list .inner a .img img
    {
        height: 44px
    }

    .offered .product-list .inner a .txt
    {
        padding-top: 30px;
        font-size:   14px
    }

    .offered .product-list .inner a .txt span
    {
        padding-right: 0 !important
    }

    .offered .product-list .inner a .txt span:after
    {
        display: none
    }

    .offered .product-list .inner a:after
    {
        width:  308px;
        height: 308px;
        top:    5px
    }

    .offered .product-list .row-list .row-item:nth-child(1) .inner a
    {
        border-radius: 40px 4px 4px 4px;
    }

    .offered .product-list .row-list .row-item:nth-child(2) .inner a
    {
        border-radius: 4px 40px 4px 4px;
    }

    .offered .product-list .row-list .row-item:nth-last-child(2) .inner a
    {
        border-radius: 4px 4px 4px 40px;
    }

    .offered .product-list .row-list .row-item:last-child .inner a
    {
        border-radius: 4px 4px 40px 4px;
    }
}

@media screen and (max-width: 479px)
{
    .table.table-hover thead tr
    {
        border: 1px solid transparent
    }

    .table.table-hover thead tr th
    {
        font-size: 12px
    }

    .table.table-hover tbody tr td
    {
        font-size: 14px
    }

    #Footer .footer-top .started-block h2 br
    {
        display: block
    }

    #Footer .footer-top .subscrice
    {
        padding: 0
    }

    #Footer .footer-top .subscrice input
    {
        height:      40px;
        line-height: 40px
    }

    #Footer .footer-top .subscrice .btn
    {
        height:      40px;
        line-height: 40px;
        max-width:   120px;
        position:    static;
        margin:      10px auto 0
    }
}

/*Animation*/
@-webkit-keyframes animate
{
    0%
    {
        -webkit-transform:     translateY(0) rotate(0deg);
        transform:             translateY(0) rotate(0deg);
        -ms-filter:            "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter:                alpha(opacity=100);
        -webkit-opacity:       1;
        -moz-opacity:          1;
        opacity:               1;
        border-radius:         0;
        -webkit-border-radius: 0;
        -moz-border-radius:    0;
        -o-border-radius:      0
    }
    100%
    {
        -webkit-transform:     translateY(-1000px) rotate(720deg);
        transform:             translateY(-1000px) rotate(720deg);
        -ms-filter:            "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter:                alpha(opacity=0);
        -webkit-opacity:       0;
        -moz-opacity:          0;
        opacity:               0;
        border-radius:         50%;
        -webkit-border-radius: 50%;
        -moz-border-radius:    50%;
        -o-border-radius:      50%
    }
}

@keyframes animate
{
    0%
    {
        -webkit-transform:     translateY(0) rotate(0deg);
        transform:             translateY(0) rotate(0deg);
        -ms-filter:            "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter:                alpha(opacity=100);
        -webkit-opacity:       1;
        -moz-opacity:          1;
        opacity:               1;
        border-radius:         0;
        -webkit-border-radius: 0;
        -moz-border-radius:    0;
        -o-border-radius:      0
    }
    100%
    {
        -webkit-transform:     translateY(-1000px) rotate(720deg);
        transform:             translateY(-1000px) rotate(720deg);
        -ms-filter:            "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter:                alpha(opacity=0);
        -webkit-opacity:       0;
        -moz-opacity:          0;
        opacity:               0;
        border-radius:         50%;
        -webkit-border-radius: 50%;
        -moz-border-radius:    50%;
        -o-border-radius:      50%
    }
}

@keyframes bs-notify-fadeOut
{
    0%
    {
        opacity: .9
    }
    100%
    {
        opacity: 0
    }
}

@-webkit-keyframes home_left
{
    0%
    {
        -webkit-transform: translate(0, 0);
        transform:         translate(0, 0)
    }
    50%
    {
        -webkit-transform: translate(-2%, 0);
        transform:         translate(-2%, 0)
    }
    100%
    {
        -webkit-transform: translate(0, 0);
        transform:         translate(0, 0)
    }
}

@keyframes home_left
{
    0%
    {
        -webkit-transform: translate(0, 0);
        transform:         translate(0, 0)
    }
    50%
    {
        -webkit-transform: translate(-2%, 0);
        transform:         translate(-2%, 0)
    }
    100%
    {
        -webkit-transform: translate(0, 0);
        transform:         translate(0, 0)
    }
}

@-webkit-keyframes home_right
{
    0%
    {
        -webkit-transform: translate(0, 0);
        transform:         translate(0, 0)
    }
    50%
    {
        -webkit-transform: translate(2%, 0);
        transform:         translate(2%, 0)
    }
    100%
    {
        -webkit-transform: translate(0, 0);
        transform:         translate(0, 0)
    }
}

@keyframes home_right
{
    0%
    {
        -webkit-transform: translate(0, 0);
        transform:         translate(0, 0)
    }
    50%
    {
        -webkit-transform: translate(2%, 0);
        transform:         translate(2%, 0)
    }
    100%
    {
        -webkit-transform: translate(0, 0);
        transform:         translate(0, 0)
    }
}

@-webkit-keyframes wave
{
    from
    {
        top: 0;
        x:   -400px
    }
    to
    {
        top: 99%;
        x:   0
    }
}

@keyframes wave
{
    from
    {
        top: 0;
        x:   -400px
    }
    to
    {
        top: 99%;
        x:   0
    }
}

@-webkit-keyframes fill-up
{
    from
    {
        top:    0;
        height: 0;
        y:      120px
    }
    to
    {
        top:    100%;
        height: 130px;
        y:      0
    }
}

@keyframes fill-up
{
    from
    {
        top:    0;
        height: 0;
        y:      120px
    }
    to
    {
        top:    100%;
        height: 130px;
        y:      0
    }
}

.animated
{
    -webkit-animation-duration:  1s;
    animation-duration:          1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode:         both
}

.animated.infinite
{
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count:         infinite
}

.animated.delay-0-1s, .magictime.delay-0-1s
{
    -webkit-animation-delay: .1s;
    animation-delay:         .1s
}

.animated.delay-0-2s, .magictime.delay-0-2s
{
    -webkit-animation-delay: .2s;
    animation-delay:         .2s
}

.animated.delay-0-3s, .magictime.delay-0-3s
{
    -webkit-animation-delay: .3s;
    animation-delay:         .3s
}

.animated.delay-0-4s, .magictime.delay-0-4s
{
    -webkit-animation-delay: .4s;
    animation-delay:         .4s
}

.animated.delay-0-5s, .magictime.delay-0-5s
{
    -webkit-animation-delay: .5s;
    animation-delay:         .5s
}

.animated.delay-0-6s, .magictime.delay-0-6s
{
    -webkit-animation-delay: .6s;
    animation-delay:         .6s
}

.animated.delay-0-7s, .magictime.delay-0-7s
{
    -webkit-animation-delay: .7s;
    animation-delay:         .7s
}

.animated.delay-0-8s, .magictime.delay-0-8s
{
    -webkit-animation-delay: .8s;
    animation-delay:         .8s
}

.animated.delay-0-9s, .magictime.delay-0-9s
{
    -webkit-animation-delay: .9s;
    animation-delay:         .9s
}

.animated.delay-1s, .magictime.delay-1s
{
    -webkit-animation-delay: 1s;
    animation-delay:         1s
}

.animated.delay-1-1s, .magictime.delay-1-1s
{
    -webkit-animation-delay: 1.1s;
    animation-delay:         1.1s
}

.animated.delay-1-2s, .magictime.delay-1-2s
{
    -webkit-animation-delay: 1.2s;
    animation-delay:         1.2s
}

.animated.delay-1-3s, .magictime.delay-1-3s
{
    -webkit-animation-delay: 1.3s;
    animation-delay:         1.3s
}

.animated.delay-1-4s, .magictime.delay-1-4s
{
    -webkit-animation-delay: 1.4s;
    animation-delay:         1.4s
}

.animated.delay-1-5s, .magictime.delay-1-5s
{
    -webkit-animation-delay: 1.5s;
    animation-delay:         1.5s
}

.animated.delay-1-6s, .magictime.delay-1-6s
{
    -webkit-animation-delay: 1.6s;
    animation-delay:         1.6s
}

.animated.delay-1-7s, .magictime.delay-1-7s
{
    -webkit-animation-delay: 1.7s;
    animation-delay:         1.7s
}

.animated.delay-1-8s, .magictime.delay-1-8s
{
    -webkit-animation-delay: 1.8s;
    animation-delay:         1.8s
}

.animated.delay-1-9s, .magictime.delay-1-9s
{
    -webkit-animation-delay: 1.9s;
    animation-delay:         1.9s
}

.animated.delay-2s, .magictime.delay-2s
{
    -webkit-animation-delay: 2s;
    animation-delay:         2s
}

.animated.delay-2-1s, .magictime.delay-2-1s
{
    -webkit-animation-delay: 2.1s;
    animation-delay:         2.1s
}

.animated.delay-2-2s, .magictime.delay-2-2s
{
    -webkit-animation-delay: 2.2s;
    animation-delay:         2.2s
}

.upanddownsmalls
{
    -webkit-animation-name:       animation_13;
    -webkit-animation-direction:  normal;
    -webkit-animation-fill-mode:  both;
    -webkit-animation-play-state: running;
    animation-name:               animation_13;
    animation-direction:          normal;
    animation-fill-mode:          both;
    animation-play-state:         running
}

.upanddownsmall
{
    -webkit-animation-name:       animation_12;
    -webkit-animation-direction:  normal;
    -webkit-animation-fill-mode:  both;
    -webkit-animation-play-state: running;
    animation-name:               animation_12;
    animation-direction:          normal;
    animation-fill-mode:          both;
    animation-play-state:         running
}

.upanddown
{
    -webkit-animation-name:       animation_8;
    -webkit-animation-direction:  normal;
    -webkit-animation-fill-mode:  both;
    -webkit-animation-play-state: running;
    animation-name:               animation_8;
    animation-direction:          normal;
    animation-fill-mode:          both;
    animation-play-state:         running
}

.upanddowninvers
{
    -webkit-animation-name:       animation_9;
    -webkit-animation-direction:  normal;
    -webkit-animation-fill-mode:  both;
    -webkit-animation-play-state: running;
    animation-name:               animation_9;
    animation-direction:          normal;
    animation-fill-mode:          both;
    animation-play-state:         running
}

.animated.duration-1s
{
    -webkit-animation-duration: 1s;
    animation-duration:         1s
}

.animated.duration-2s
{
    -webkit-animation-duration: 2s;
    animation-duration:         2s
}

.animated.duration-3s
{
    -webkit-animation-duration: 3s;
    animation-duration:         3s
}

.fadeInUpCustom
{
    -webkit-animation-name: fadeInUpSmall;
    animation-name:         fadeInUpSmall
}

.fadeInDownCustom
{
    -webkit-animation-name: fadeInDownSmall;
    animation-name:         fadeInDownSmall
}

.fadeInLeftCustom
{
    -webkit-animation-name: fadeInLeftSmall;
    animation-name:         fadeInLeftSmall
}

.fadeInRightCustom
{
    -webkit-animation-name: fadeInRightSmall;
    animation-name:         fadeInRightSmall
}

@-webkit-keyframes animation_8
{
    0%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    50%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 25, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    100%
    {
        transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:   1
    }
}

@keyframes animation_8
{
    0%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    50%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 25, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    100%
    {
        transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:   1
    }
}

@-webkit-keyframes animation_9
{
    0%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    50%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 20, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    100%
    {
        transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:   1
    }
}

@keyframes animation_9
{
    0%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    50%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 20, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    100%
    {
        transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:   1
    }
}

@-webkit-keyframes animation_12
{
    0%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    50%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 20, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    100%
    {
        transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:   1
    }
}

@keyframes animation_12
{
    0%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    50%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 20, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    100%
    {
        transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:   1
    }
}

@-webkit-keyframes animation_13
{
    0%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    50%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 10, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    100%
    {
        transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:   1
    }
}

@keyframes animation_13
{
    0%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    50%
    {
        transform:                 matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 10, 0, 1);
        opacity:                   1;
        animation-timing-function: ease-in-out
    }
    100%
    {
        transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
        opacity:   1
    }
}

@-webkit-keyframes fadeInUpSmall
{
    0%
    {
        opacity:           0;
        -webkit-transform: translateY(20px)
    }
    100%
    {
        opacity:           1;
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes fadeInUpSmall
{
    0%
    {
        opacity:        0;
        -moz-transform: translateY(20px)
    }
    100%
    {
        opacity:        1;
        -moz-transform: translateY(0)
    }
}

@-o-keyframes fadeInUpSmall
{
    0%
    {
        opacity:      0;
        -o-transform: translateY(20px)
    }
    100%
    {
        opacity:      1;
        -o-transform: translateY(0)
    }
}

@keyframes fadeInUpSmall
{
    0%
    {
        opacity:   0;
        transform: translateY(20px)
    }
    100%
    {
        opacity:   1;
        transform: translateY(0)
    }
}

@-webkit-keyframes fadeInDownSmall
{
    0%
    {
        opacity:           0;
        -webkit-transform: translateY(-20px)
    }
    100%
    {
        opacity:           1;
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes fadeInDownSmall
{
    0%
    {
        opacity:        0;
        -moz-transform: translateY(-20px)
    }
    100%
    {
        opacity:        1;
        -moz-transform: translateY(0)
    }
}

@-o-keyframes fadeInDownSmall
{
    0%
    {
        opacity:      0;
        -o-transform: translateY(-20px)
    }
    100%
    {
        opacity:      1;
        -o-transform: translateY(0)
    }
}

@keyframes fadeInDownSmall
{
    0%
    {
        opacity:   0;
        transform: translateY(-20px)
    }
    100%
    {
        opacity:   1;
        transform: translateY(0)
    }
}

@-webkit-keyframes fadeInLeftSmall
{
    0%
    {
        opacity:           0;
        -webkit-transform: translateX(-30px)
    }
    100%
    {
        opacity:           1;
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes fadeInLeftSmall
{
    0%
    {
        opacity:        0;
        -moz-transform: translateX(-30px)
    }
    100%
    {
        opacity:        1;
        -moz-transform: translateY(0)
    }
}

@-o-keyframes fadeInLeftSmall
{
    0%
    {
        opacity:      0;
        -o-transform: translateX(-30px)
    }
    100%
    {
        opacity:      1;
        -o-transform: translateY(0)
    }
}

@keyframes fadeInLeftSmall
{
    0%
    {
        opacity:   0;
        transform: translateX(-30px)
    }
    100%
    {
        opacity:   1;
        transform: translateY(0)
    }
}

@-webkit-keyframes fadeInRightSmall
{
    0%
    {
        opacity:           0;
        -webkit-transform: translateX(30px)
    }
    100%
    {
        opacity:           1;
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes fadeInRightSmall
{
    0%
    {
        opacity:        0;
        -moz-transform: translateX(30px)
    }
    100%
    {
        opacity:        1;
        -moz-transform: translateY(0)
    }
}

@-o-keyframes fadeInRightSmall
{
    0%
    {
        opacity:      0;
        -o-transform: translateX(30px)
    }
    100%
    {
        opacity:      1;
        -o-transform: translateY(0)
    }
}

@keyframes fadeInRightSmall
{
    0%
    {
        opacity:   0;
        transform: translateX(30px)
    }
    100%
    {
        opacity:   1;
        transform: translateY(0)
    }
}

@-webkit-keyframes jump
{
    0%
    {
        -webkit-transform: translate3d(0, 0, 0);
        transform:         translate3d(0, 0, 0)
    }
    40%
    {
        -webkit-transform: translate3d(0, 35%, 0);
        transform:         translate3d(0, 35%, 0)
    }
}

@keyframes jump
{
    0%
    {
        -webkit-transform: translate3d(0, 0, 0);
        transform:         translate3d(0, 0, 0)
    }
    40%
    {
        -webkit-transform: translate3d(0, 35%, 0);
        transform:         translate3d(0, 35%, 0)
    }
}

@-webkit-keyframes moveLeftRight
{
    0%
    {
        -webkit-transform: translate3d(50px, 0, 0);
        transform:         translate3d(50px, 0, 0)
    }
    50%
    {
        -webkit-transform: translate3d(-140px, 0, 0);
        transform:         translate3d(-140px, 0, 0)
    }
}

@keyframes moveLeftRight
{
    0%
    {
        -webkit-transform: translate3d(50px, 0, 0);
        transform:         translate3d(50px, 0, 0)
    }
    50%
    {
        -webkit-transform: translate3d(-240px, 0, 0);
        transform:         translate3d(-240px, 0, 0)
    }
}

@-webkit-keyframes scale
{
    0%
    {
        -webkit-transform: scale(1);
        transform:         scale(1)
    }
    50%
    {
        -webkit-transform: scale(1.3);
        transform:         scale(1.3)
    }
}

@keyframes scale
{
    0%
    {
        -webkit-transform: scale(1);
        transform:         scale(1)
    }
    50%
    {
        -webkit-transform: scale(1.3);
        transform:         scale(1.3)
    }
}

@-webkit-keyframes spin
{
    from
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
    to
    {
        -webkit-transform: rotate(360deg);
        transform:         rotate(360deg)
    }
}

@keyframes spin
{
    from
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
    to
    {
        -webkit-transform: rotate(360deg);
        transform:         rotate(360deg)
    }
}

@-moz-keyframes aboutGriddotV1
{
    0%
    {
        transform: translateY(0)
    }
    50%
    {
        transform: translateY(222px)
    }
    100%
    {
        transform: translateY(0)
    }
}

@-webkit-keyframes aboutGriddotV1
{
    0%
    {
        transform: translateY(0)
    }
    50%
    {
        transform: translateY(222px)
    }
    100%
    {
        transform: translateY(0)
    }
}

@keyframes aboutGriddotV1
{
    0%
    {
        transform: translateY(0)
    }
    50%
    {
        transform: translateY(222px)
    }
    100%
    {
        transform: translateY(0)
    }
}

@-moz-keyframes aboutGriddotH1
{
    0%
    {
        transform: translateX(0)
    }
    50%
    {
        transform: translateX(220px)
    }
    100%
    {
        transform: translateX(0)
    }
}

@-webkit-keyframes aboutGriddotH1
{
    0%
    {
        transform: translateX(0)
    }
    50%
    {
        transform: translateX(220px)
    }
    100%
    {
        transform: translateX(0)
    }
}

@keyframes aboutGriddotH1
{
    0%
    {
        transform: translateX(0)
    }
    50%
    {
        transform: translateX(220px)
    }
    100%
    {
        transform: translateX(0)
    }
}

@-moz-keyframes aboutWheelSpin
{
    0%
    {
        transform: rotate(0deg)
    }
    100%
    {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes aboutWheelSpin
{
    0%
    {
        transform: rotate(0deg)
    }
    100%
    {
        transform: rotate(360deg)
    }
}

@keyframes aboutWheelSpin
{
    0%
    {
        transform: rotate(0deg)
    }
    100%
    {
        transform: rotate(360deg)
    }
}

@-moz-keyframes aboutItemDrop
{
    0%
    {
        transform: translateY(0)
    }
    15%
    {
        transform: translateY(330px)
    }
    100%
    {
        transform: translateY(330px)
    }
}

@-webkit-keyframes aboutItemDrop
{
    0%
    {
        transform: translateY(0)
    }
    15%
    {
        transform: translateY(330px)
    }
    100%
    {
        transform: translateY(330px)
    }
}

@keyframes aboutItemDrop
{
    0%
    {
        transform: translateY(0)
    }
    15%
    {
        transform: translateY(330px)
    }
    100%
    {
        transform: translateY(330px)
    }
}

@-moz-keyframes heartFloatY2
{
    0%
    {
        transform: translateY(0);
        opacity:   0
    }
    10%
    {
        transform: translateY(-20px);
        opacity:   1
    }
    80%
    {
        transform: translateY(-100px);
        opacity:   1
    }
    90%
    {
        transform: translateY(-120px);
        opacity:   0
    }
    100%
    {
        transform: translateY(-120px);
        opacity:   0
    }
}

@-webkit-keyframes heartFloatY2
{
    0%
    {
        transform: translateY(0);
        opacity:   0
    }
    10%
    {
        transform: translateY(-20px);
        opacity:   1
    }
    80%
    {
        transform: translateY(-100px);
        opacity:   1
    }
    90%
    {
        transform: translateY(-120px);
        opacity:   0
    }
    100%
    {
        transform: translateY(-120px);
        opacity:   0
    }
}

@keyframes heartFloatY2
{
    0%
    {
        transform: translateY(0);
        opacity:   0
    }
    10%
    {
        transform: translateY(-20px);
        opacity:   1
    }
    80%
    {
        transform: translateY(-100px);
        opacity:   1
    }
    90%
    {
        transform: translateY(-120px);
        opacity:   0
    }
    100%
    {
        transform: translateY(-120px);
        opacity:   0
    }
}

@-moz-keyframes heartFloatX2
{
    0%
    {
        transform: translateX(-20px)
    }
    50%
    {
        transform: translateX(20px)
    }
    100%
    {
        transform: translateX(-20px)
    }
}

@-webkit-keyframes heartFloatX2
{
    0%
    {
        transform: translateX(-20px)
    }
    50%
    {
        transform: translateX(20px)
    }
    100%
    {
        transform: translateX(-20px)
    }
}

@keyframes heartFloatX2
{
    0%
    {
        transform: translateX(-20px)
    }
    50%
    {
        transform: translateX(20px)
    }
    100%
    {
        transform: translateX(-20px)
    }
}

@-webkit-keyframes animate
{
    0%
    {
        -webkit-transform:     translateY(0) rotate(0deg);
        transform:             translateY(0) rotate(0deg);
        -ms-filter:            "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter:                alpha(opacity=100);
        -webkit-opacity:       1;
        -moz-opacity:          1;
        opacity:               1;
        border-radius:         0;
        -webkit-border-radius: 0;
        -moz-border-radius:    0;
        -o-border-radius:      0
    }
    100%
    {
        -webkit-transform:     translateY(-1000px) rotate(720deg);
        transform:             translateY(-1000px) rotate(720deg);
        -ms-filter:            "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter:                alpha(opacity=0);
        -webkit-opacity:       0;
        -moz-opacity:          0;
        opacity:               0;
        border-radius:         50%;
        -webkit-border-radius: 50%;
        -moz-border-radius:    50%;
        -o-border-radius:      50%
    }
}

@keyframes animate
{
    0%
    {
        -webkit-transform:     translateY(0) rotate(0deg);
        transform:             translateY(0) rotate(0deg);
        -ms-filter:            "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter:                alpha(opacity=100);
        -webkit-opacity:       1;
        -moz-opacity:          1;
        opacity:               1;
        border-radius:         0;
        -webkit-border-radius: 0;
        -moz-border-radius:    0;
        -o-border-radius:      0
    }
    100%
    {
        -webkit-transform:     translateY(-1000px) rotate(720deg);
        transform:             translateY(-1000px) rotate(720deg);
        -ms-filter:            "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter:                alpha(opacity=0);
        -webkit-opacity:       0;
        -moz-opacity:          0;
        opacity:               0;
        border-radius:         50%;
        -webkit-border-radius: 50%;
        -moz-border-radius:    50%;
        -o-border-radius:      50%
    }
}

@keyframes pp
{
    0%
    {
        opacity: 0
    }
    100%
    {
        opacity: 1
    }
}

@keyframes ppc
{
    0%
    {
        opacity: 1
    }
    100%
    {
        opacity: 0
    }
}

@keyframes end-loading
{
    0%
    {
        opacity:    1;
        visibility: visible;
    }
    100%
    {
        opacity:    0;
        visibility: hidden;
    }
}

@-webkit-keyframes end-loading
{
    0%
    {
        opacity:    1;
        visibility: visible;
    }
    100%
    {
        opacity:    0;
        visibility: hidden;
    }
}

@-webkit-keyframes rotation
{
    from
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
    to
    {
        -webkit-transform: rotate(360deg);
        transform:         rotate(360deg)
    }
}

@keyframes rotation
{
    from
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
    to
    {
        -webkit-transform: rotate(360deg);
        transform:         rotate(360deg)
    }
}

@-webkit-keyframes rotation_invert
{
    from
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
    to
    {
        -webkit-transform: rotate(-360deg);
        transform:         rotate(-360deg)
    }
}

@keyframes rotation_invert
{
    from
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
    to
    {
        -webkit-transform: rotate(-360deg);
        transform:         rotate(-360deg)
    }
}

@-webkit-keyframes hammer
{
    0%
    {
        -webkit-transform: rotate(0deg)
    }
    50%
    {
        -webkit-transform: rotate(5deg)
    }
    100%
    {
        -webkit-transform: rotate(0deg)
    }
}

@keyframes hammer
{
    0%
    {
        -webkit-transform: rotate(0deg)
    }
    50%
    {
        -webkit-transform: rotate(5deg)
    }
    100%
    {
        -webkit-transform: rotate(0deg)
    }
}

@-webkit-keyframes hammer2
{
    0%
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
    50%
    {
        -webkit-transform: rotate(-10deg);
        transform:         rotate(-10deg)
    }
    100%
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
}

@keyframes hammer2
{
    0%
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
    50%
    {
        -webkit-transform: rotate(-10deg);
        transform:         rotate(-10deg)
    }
    100%
    {
        -webkit-transform: rotate(0deg);
        transform:         rotate(0deg)
    }
}

@-webkit-keyframes square_box
{
    0%
    {
        opacity: 0;
        filter:  alpha(opacity=0)
    }
    50%
    {
        opacity: 1;
        filter:  alpha(opacity=100)
    }
    100%
    {
        opacity: .5;
        filter:  alpha(opacity=50)
    }
}

@keyframes square_box
{
    0%
    {
        opacity: 0;
        filter:  alpha(opacity=0)
    }
    50%
    {
        opacity: 1;
        filter:  alpha(opacity=100)
    }
    100%
    {
        opacity: .5;
        filter:  alpha(opacity=50)
    }
}

@-webkit-keyframes square_box
{
    0%
    {
        opacity: 0;
        filter:  alpha(opacity=0)
    }
    50%
    {
        opacity: 1;
        filter:  alpha(opacity=100)
    }
    100%
    {
        opacity: .5;
        filter:  alpha(opacity=50)
    }
}

@keyframes square_box
{
    0%
    {
        opacity: 0;
        filter:  alpha(opacity=0)
    }
    50%
    {
        opacity: 1;
        filter:  alpha(opacity=100)
    }
    100%
    {
        opacity: .5;
        filter:  alpha(opacity=50)
    }
}