* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

body,
html {
    outline: 0;
    margin: 0;
    padding: 0
}

html {
    font-size: 17px
}

body {
    color: #000;
    font-weight: 400;
    background: #fff;
    font-family: Montserrat, sans-serif;
    font-style: 400;
    line-height: 140%
}

    body.rtl {
        text-align: right;
        direction: rtl;
        font-family: Tajawal, sans-serif;
        font-weight: 400
    }

        body.rtl .ui-widget {
            font-family: Tajawal, sans-serif
        }

.ui-widget {
    font-family: Montserrat, sans-serif
}

:focus {
    outline: 0
}

dt,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
    margin: 0;
    line-height: 110%
}

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

p {
    margin: 0 0 10px 0
}

ol,
ul {
    list-style: none;
    margin: 0;
    padding: 0
}

input:focus,
option,
select,
select:focus,
textarea:focus {
    outline: 0
}

a {
    color: #cba101;
    text-decoration: none;
    -webkit-transition: all .3s linear;
    -moz-transition: all .3s linear;
    -o-transition: all .3s linear;
    -ms-transition: all .3s linear;
    transition: all .3s linear;
    outline: 0
}

    a:active,
    a:focus {
        outline: 0 !important;
        text-decoration: none
    }

    a:hover {
        text-decoration: none;
        color: #000
    }

.btn,
button,
input[type=submit] {
    cursor: pointer;
    background-color: #ffcb05;
    border: 2px solid #ffcb05;
    font-size: .9rem;
    display: inline-block;
    line-height: 100%;
    color: #000;
    padding: 15px 28px;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    font-weight: 500;
    border-radius: 0;
    font-family: inherit;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-transition: all .3s linear;
    -moz-transition: all .3s linear;
    -o-transition: all .3s linear;
    -ms-transition: all .3s linear;
    transition: all .3s linear;
    outline: 0
}

    .btn:hover,
    input[type=submit]:hover {
        background-color: transparent;
        color: #000
    }

    .btn.white {
        background-color: #fff;
        border-color: #ffcb05
    }

        .btn.white:hover {
            border-color: #fff
        }

.hundred {
    float: left;
    width: 100%
}

.fleft {
    float: left
}

.fright {
    float: right
}

.red {
    color: #f80101
}

.text-yellow {
    color: #f8981d
}

.clr {
    clear: both
}

.text-center {
    text-align: center
}

small {
    font-size: .7rem
}

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

.mr-top-15 {
    margin-top: 15px !important
}

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

.mr-top-25 {
    margin-top: 25px !important
}

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

.mr-top-35 {
    margin-top: 35px !important
}

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

.mr-top-45 {
    margin-top: 45px !important
}

.mr-top-50 {
    margin-top: 50px !important
}

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

.mr-bot-15 {
    margin-bottom: 15px !important
}

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

.mr-bot-25 {
    margin-bottom: 25px !important
}

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

.mr-bot-35 {
    margin-bottom: 35px !important
}

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

.mr-bot-45 {
    margin-bottom: 45px !important
}

.mr-bot-50 {
    margin-bottom: 50px !important
}

strong {
    font-weight: 700
}

.container {
    margin: 0 auto;
    width: 100% !important;
    padding: 0 60px
}

.bound {
    margin: 0 auto;
    max-width: 800px
}

.table {
    display: table;
    width: 100%;
    float: left
}

    .table .col {
        display: table-cell;
        vertical-align: top
    }

.light-grey {
    color: #595959
}

.pointer {
    cursor: pointer
}

.mobile {
    display: none !important
}

#menu {
    display: none
}

    #menu.mm-current {
        display: block
    }

    #menu .social {
        display: inline-block;
        padding-left: 25px;
        margin-top: 15px
    }

        #menu .social a {
            margin-right: 8px;
            max-width: 26px
        }

    #menu li.button a {
        color: #fff;
        background-color: #000;
        font-weight: 500
    }

a.float:hover {
    color: #fff;
    background-color: #1dc35b
}

#menu li.call a {
    font-size: 1.28rem;
    background-color: #f8f8f8;
    padding: 13px 10px 13px 59px;
    line-height: 100%;
    background-image: url(../images/contact/icon-call.svg);
    background-position: 22px 15px;
    font-weight: 600;
    background-repeat: no-repeat;
    background-size: 28px auto
}

body.rtl #menu li.call {
    padding-right: 20px;
    background-color: #f8f8f8
}

    body.rtl #menu li.call a {
        background-position: right 15px;
        padding: 13px 35px 13px 10px
    }

#menu li.call a span {
    font-size: .7rem;
    font-weight: 400
}

#menu li.lan {
    float: left;
    width: 100%;
    padding: 15px 25px
}

    #menu li.lan a,
    #menu li.lan span {
        float: left;
        width: auto;
        padding: 0;
        margin-right: 18px;
        text-transform: uppercase;
        font-size: .9rem
    }

        #menu li.lan a img,
        #menu li.lan span img,
        .mobilelangoptions li a img {
            float: left;
            margin-right: 8px;
            max-width: 20px !important
        }

        #menu li.lan a span {
            display: inline-block;
            line-height: 100%;
            vertical-align: middle;
            padding-top: 2px
        }

        #menu li.lan a b {
            font-family: Tajawal, sans-serif;
            float: left;
            margin-right: 5px;
            font-weight: 300
        }

        #menu li.lan a.en {
            width: 136px
        }

        #menu li.lan a.ar {
            width: 110px
        }

        #menu li.lan a.active {
            font-weight: 500
        }

    #menu li.lan.mm-selected a {
        background-color: transparent !important
    }

body.rtl #menu li.lan a,
body.rtl #menu li.lan span {
    float: right;
    margin-left: 18px;
    margin-right: 0;
    direction: rtl
}

    body.rtl #menu li.lan a img,
    body.rtl #menu li.lan span img,
    body.rtl .mobilelangoptions li a img {
        float: right;
        margin-right: 0;
        margin-left: 8px
    }

    body.rtl #menu li.lan a.active b {
        font-weight: 700
    }

.mm-page.mm-slideout {
    background-color: #fff
}

#head-out {
    height: 70px
}

#header {
    background-color: #fff;
    color: #000;
    position: fixed;
    width: 100%;
    z-index: 9999
}

    #header.sticky {
        -webkit-box-shadow: 0 3px 5px 0 #333;
        -moz-box-shadow: 0 3px 5px 0 #333;
        box-shadow: 0 0 8px 0 rgba(51, 51, 51, .3)
    }

    #header .container {
        padding-left: 39px;
        padding-right: 0
    }

    #header .logo {
        float: left;
        margin-top: 9px
    }

        #header .logo img {
            width: 209px
        }

#nav {
    float: right;
    margin-top: 0 !important
}

    #nav ul {
        display: inline-block
    }

    #nav li {
        display: inline-block;
        vertical-align: middle;
        margin: 0 17px;
        text-align: center;
        position: relative
    }

        #nav li:last-child {
            margin-right: 0
        }

        #nav li a {
            font-size: .75rem;
            color: #000;
            float: left;
            font-weight: 500;
            line-height: 100%;
            text-transform: uppercase;
            position: relative;
            z-index: 999
        }

            #nav li a.whatsnew {
                display: contents !important;
            }

        #nav li span.whatsnew-new {
            font-size: 10px;
            border: 1px solid #D34848;
            background-color: #FCDDCA;
            border-radius: 9px;
            color: #D34848;
            padding: 1px 3px;
            margin-left: 5px;
        }

        #nav li a:hover,
        #nav li.current-menu-item a {
            color: #555
        }

        #nav li.button a {
            background-color: #ffcb05;
            padding: 9px 12px;
            color: #000;
            border: 2px solid #ffcb05
        }

            #nav li.button a:hover {
                background-color: transparent
            }

        #nav li.has-child a {
            background: url(../images/nav-arrow.png) right center no-repeat;
            padding-right: 15px
        }

        #nav li.call a {
            font-size: 1.1rem;
            background-color: #f8f8f8;
            padding: 18px 18px 16px 45px;
            background-image: url(../images/contact/icon-call.svg);
            background-position: 12px center;
            background-repeat: no-repeat;
            background-size: 25px auto
        }

            #nav li.call a span {
                font-size: .52rem;
                vertical-align: top
            }

body.rtl #nav li span.whatsnew-new {
    margin-right: 5px !important;
}

body #lang-tog {
    float: right;
    cursor: pointer;
    position: relative;
    font-size: .7rem;
    margin-left: 0 !important
}

body.rtl #lang-tog {
    float: right;
    cursor: pointer;
    position: relative;
    font-size: .8rem;
    margin-left: 0 !important
}

#lang-tog li.ar a {
    font-size: .8rem
}

#lang-tog span {
    float: left;
    padding: 29px 18px 24px 13px;
    text-transform: uppercase;
    line-height: 110%;
    background-color: #efefef;
    line-height: 100%;
    color: #949494;
    text-align: center
}

    #lang-tog span b {
        font-weight: 400;
        float: left
    }

        #lang-tog span b:after {
            content: "";
            border: solid #949494;
            border-width: 0 1px 1px 0;
            float: right;
            margin: 4px 0 0 8px;
            padding: 2px;
            transform: rotate(45deg);
            -webkit-transform: rotate(45deg)
        }

#lang-tog.open span b:after {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    margin-top: 7px
}

#lang-tog .lang-options a img,
#lang-tog span img {
    display: inline-block;
    vertical-align: middle;
    max-width: 18px !important;
    margin-right: 7px
}

#lang-tog .lang-options {
    position: absolute;
    top: 100%;
    width: 100%;
    background-color: #efefef;
    right: 0;
    padding-bottom: 5px
}

    #lang-tog .lang-options a {
        color: #949494;
        float: left;
        width: 100%;
        padding: 5px 18px 7px 13px
    }

#lang-tog .ar {
    font-family: Tajawal, sans-serif
}

#lang-tog .en {
    font-family: Montserrat, sans-serif
}

body.rtl #lang-tog .en {
    font-family: Tajawal, sans-serif
}

#lang-tog .lang-option li {
    float: left;
    width: 100%
}

#lang-tog .lang-options a:hover {
    color: #000
}

body.rtl #lang-tog span {
    float: left;
    padding: 29px 13px 24px 18px
}

    #lang-tog .lang-options a img,
    body.rtl #lang-tog span img {
        margin-right: 6px;
        margin-left: 2px
    }

    body.rtl #lang-tog span b:after {
        float: left;
        margin: 4px 8px 0 0
    }

body.rtl #lang-tog.open span b:after {
    margin-top: 7px
}

a.tog {
    float: right;
    width: 28px;
    height: 28px;
    background-color: #fff;
    margin: 6px 20px 0 0;
    border-radius: 100%;
    display: none;
    -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .35);
    -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .35);
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, .35)
}

body.rtl #header .container {
    padding-left: 0;
    padding-right: 39px
}

body.rtl #header .logo {
    float: right
}

body.rtl #nav {
    float: left
}

body.rtl #lang-tog {
    float: left
}

body.rtl #nav li:last-child {
    margin-left: 0
}

body.rtl a.tog {
    margin-right: 0;
    margin-left: 20px;
    float: left
}

.overlay {
    height: 0%;
    width: 100%;
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    background-color: #fff;
    overflow: auto;
    transition: .5s
}

.overlay-content {
    position: relative;
    top: 5%;
    width: 100%;
    margin-top: 0
}

.overlay .closebtn {
    line-height: 100%;
    color: #000;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 999;
    font-size: 3rem;
    font-weight: 600
}

    .overlay .closebtn:hover {
        color: #333
    }

.overlay #contact-page {
    background-color: #fff !important
}

.overlay #tp-strip {
    background-color: transparent !important;
    padding: 20px !important
}

.overlay #contact-page #frm-add {
    padding: 30px 0
}

.overlay #contact-page form .hundred {
    margin-bottom: 8px
}

#banner {
    color: #fff;
    display: table;
    background-color: #252d3a;
    height: calc(100vh - 277px);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: cover
}

body.rtl #banner {
    color: #fff;
    display: table;
    background-color: #252d3a;
    height: calc(100vh - 277px);
    background-position: top left;
    background-repeat: no-repeat;
    background-size: cover
}

#banner .banner-in {
    display: table-cell;
    vertical-align: middle
}

    #banner .banner-in .text-container {
        float: left;
        font-size: 1.15rem;
        background-color: rgba(241, 241, 241, .86);
        padding: 30px 0 35px 0;
        max-width: 740px;
        color: #000
    }

#banner h1 {
    font-size: 2rem;
    margin-bottom: 15px;
    line-height: 120%;
    max-width: 500px
}

#banner p {
    margin-bottom: 0;
    line-height: 160%;
    font-weight: 300
}

#banner .button-group {
    margin-top: 25px
}

    #banner .button-group .btn {
        margin-left: 15px;
        font-size: .8rem;
        padding: 16px 20px
    }

        #banner .button-group .btn:first-child {
            margin-left: 0
        }

body.rtl #banner .banner-in .text-container {
    float: right
}

.sec-pad {
    padding: 70px 0
}

#hm-page .title {
    font-weight: 600;
    font-size: 1.4rem;
    margin-bottom: 20px
}

#hm-page .subtitle {
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 20px
}

#clients-strip {
    background-color: #f1f1f1;
    padding: 30px 0;
    text-align: center
}

    #clients-strip .title {
        margin-bottom: 30px;
        font-size: 1.2rem
    }

    #clients-strip .logos-out {
        text-align: center;
        direction: ltr
    }

        #clients-strip .logos-out span {
            display: inline-block;
            text-align: center;
            padding: 0 20px
        }

            #clients-strip .logos-out span img {
                display: inline-block;
                -webkit-filter: grayscale(100%);
                filter: grayscale(100%);
                opacity: .5;
                -webkit-transition: all .3s linear;
                -moz-transition: all .3s linear;
                -o-transition: all .3s linear;
                -ms-transition: all .3s linear;
                transition: all .3s linear
            }

                #clients-strip .logos-out span img:hover {
                    -webkit-filter: grayscale(0);
                    filter: grayscale(0);
                    opacity: 1
                }

#hm-page #features {
    text-align: center
}

#hm-page .intro {
    font-size: .9rem;
    margin: 0 auto;
    max-width: 800px;
    margin-bottom: 20px
}

    #hm-page .intro strong {
        font-weight: 600
    }

#hm-page #features #tab-out {
    text-align: left;
    margin-top: 50px
}

body.rtl #hm-page #features #tab-out {
    text-align: right
}

#hm-page #features #tab-out .tabs {
    float: left;
    width: 38%
}

    #hm-page #features #tab-out .tabs li {
        float: left;
        background-position: right top;
        background-size: 71px auto;
        background-repeat: no-repeat;
        width: 100%;
        padding: 20px 24px;
        border-bottom: 1px solid #ffcb05;
        cursor: pointer
    }

        #hm-page #features #tab-out .tabs li p {
            display: none;
            opacity: 0;
            visibility: hidden;
            height: 0;
            font-size: .85rem;
            line-height: 125%;
            margin: 13px 0 0 0
        }

        #hm-page #features #tab-out .tabs li strong {
            text-transform: uppercase;
            font-size: 1rem;
            font-weight: 600
        }

        #hm-page #features #tab-out .tabs li.current {
            background-color: #ffcb05
        }

            #hm-page #features #tab-out .tabs li.current p {
                display: block;
                opacity: 1;
                visibility: visible;
                height: auto
            }

#hm-page #features #tab-out .tab-content {
    float: right;
    display: none;
    width: 62%;
    text-align: center;
    padding-left: 20px
}

    #hm-page #features #tab-out .tab-content #video {
        width: 100%
    }

    #hm-page #features #tab-out .tab-content.current {
        display: block
    }

    #hm-page #features #tab-out .tab-content img {
        float: left;
        vertical-align: top
    }

#hm-page #features #tab-out #tab-8.tab-content img {
    box-shadow: none
}

body.rtl #hm-page #features #tab-out .tabs {
    float: right
}

body.rtl #hm-page #features #tab-out .tab-content {
    float: left;
    padding-left: 0;
    padding-right: 20px
}

.cl-action-strip {
    padding: 26px 50px;
    background-color: #ffcb05
}

    .cl-action-strip .left {
        font-size: 1.1rem;
        font-weight: 600;
        width: 65%;
        text-align: left;
        line-height: 1.4rem
    }

body.rtl .cl-action-strip .left {
    text-align: right;
    float: right
}

body.rtl .cl-action-strip .right {
    float: left
}

#secure-stable {
    background-color: #f1f1f1;
    padding-left: 50px;
    padding-right: 50px;
    text-align: center
}

    #secure-stable .three-col {
        margin: 60px 0 0 0;
        border-right: 1px dashed #bebebe;
        direction: ltr
    }

        #secure-stable .three-col .col {
            width: 33.33%;
            border-left: 1px dashed #bebebe;
            padding: 0 50px;
            font-size: .8rem
        }

            #secure-stable .three-col .col .img {
                height: 92px;
                display: inline-block;
                vertical-align: middle
            }

                #secure-stable .three-col .col .img img {
                    max-height: 92px !important;
                    width: auto !important
                }

            #secure-stable .three-col .col.slick-slide img {
                display: inline-block
            }

            #secure-stable .three-col .col h4 {
                font-size: 1.1rem;
                margin: 25px 0 3px 0;
                float: left;
                width: 100%;
                line-height: 1.3rem;
                height: 2.6rem;
                overflow: hidden
            }

    #secure-stable .cl-action-strip {
        margin-top: 60px
    }

#hm-page #what-is {
    text-align: center;
    background-color: #fff
}

    #hm-page #what-is .intro {
        font-size: .9rem
    }

        #hm-page #what-is .intro a {
            font-weight: 600
        }

    #hm-page #what-is .video-outer {
        padding: 0 5%
    }

    #hm-page #what-is .video-frame {
        margin-top: 20px;
        float: left;
        width: 100%;
        position: relative;
        padding-bottom: 56.25%
    }

        #hm-page #what-is .video-frame iframe {
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            z-index: 1
        }

        #hm-page #what-is .video-frame .img {
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            background: url(../images/video.jpg) center center no-repeat;
            background-size: cover;
            z-index: 2;
            cursor: pointer;
            -webkit-transition: all .3s linear;
            -moz-transition: all .3s linear;
            -o-transition: all .3s linear;
            -ms-transition: all .3s linear;
            transition: all .3s linear
        }

#support {
    background-image: url(../images/support-bg.jpg);
    text-align: center;
    color: #fff
}

    #support .in {
        background-color: rgba(0, 0, 0, .6)
    }

    #support .intro {
        color: #d4d4d4
    }

    #support .contact-detail {
        margin-top: 80px
    }

    #support .bound {
        max-width: 680px
    }

    #support .subtitle {
        margin-bottom: 35px
    }

    #support .contact-detail a {
        font-weight: 700;
        font-size: 1.2rem;
        color: #ffcb05;
        background-size: 36px auto;
        background-position: left top;
        background-repeat: no-repeat;
        background-size: 38px auto;
        padding: 8px 0 10px 44px;
        min-height: 38px
    }

        #support .contact-detail a.phone {
            background-image: url(../images/phone.png)
        }

        #support .contact-detail a.email {
            background-image: url(../images/email.png)
        }

#hm-page #spend-time {
    background-color: #f1f1f1;
    text-align: center
}

    #hm-page #spend-time .btn {
        margin-top: 50px;
        font-weight: 600
    }

#about-slide {
    margin-top: 40px
}

    #about-slide .slick-list {
        direction: ltr
    }

    #about-slide .box {
        float: left;
        width: 33.33%;
        padding: 0 40px;
        font-size: .85rem;
        color: #2a2a2a;
        line-height: 140%
    }

        #about-slide .box .boxin {
            margin: 0 auto;
            width: 100%;
            max-width: 300px
        }

body.rtl #about-slide .box .boxin {
    direction: rtl
}

#about-slide .box .img {
    width: 300px;
    height: 300px;
    border-radius: 100%;
    background-color: #f1f1f1;
    display: table
}

    #about-slide .box .img .in {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        padding: 10px
    }

#testi {
    background-color: #fff;
    text-align: center
}

#about-slide .box h4 {
    margin: 25px 0 10px 0;
    font-size: 1.2rem
}

#about-slide .slick-slide img {
    display: inline-block
}

#contact-page #testi.sec-pad {
    padding-top: 0
}

#testi .title {
    font-weight: 600;
    font-size: 1.3rem;
    margin-bottom: 40px
}

#testi .testimonials {
    padding: 0 30px;
    direction: ltr
}

#testi .box {
    float: left;
    width: 50%;
    padding: 52px 30px;
    position: relative
}

    #testi .box .boxin {
        position: relative;
        text-align: left;
        font-size: .95rem;
        font-weight: 300;
        background-color: #f1f1f1;
        border-radius: 10px;
        padding: 75px 45px 100px 45px;
        -webkit-transition: all .4s linear;
        -moz-transition: all .4s linear;
        -o-transition: all .4s linear;
        -ms-transition: all .4s linear;
        transition: all .4s linear
    }

body.rtl #testi .boxin {
    text-align: right
}

#testi .box:hover .boxin {
    -webkit-box-shadow: 0 0 6px 0 rgba(138, 138, 138, .22);
    -moz-box-shadow: 0 0 6px 0 rgba(138, 138, 138, .22);
    box-shadow: 0 0 6px 0 rgba(138, 138, 138, .22)
}

#testi .box .boxin p {
    margin: 0;
    line-height: 160%
}

#testi .box .boxin .name {
    margin-top: 30px;
    font-weight: 600
}

    #testi .box .boxin .name strong {
        display: block
    }

#testi .box .boxin:before {
    content: "\201C";
    color: #b4b4b4;
    font-size: 280px;
    position: absolute;
    line-height: 100%;
    left: 15px;
    top: -60px;
    font-family: Arial, Helvetica, sans-serif;
    z-index: 99
}

#testi .box .img {
    position: absolute;
    left: 40%;
    bottom: 0;
    padding-bottom: 8px
}

    #testi .box .img img {
        width: 100px !important;
        height: 100px !important;
        border-radius: 100%;
        -webkit-box-shadow: 0 0 9px 0 rgba(138, 138, 138, .92);
        -moz-box-shadow: 0 0 9px 0 rgba(138, 138, 138, .92);
        box-shadow: 0 0 9px 0 rgba(138, 138, 138, .92)
    }

.slick-next,
.slick-prev {
    width: 36px !important;
    height: 58px !important;
    top: 50% !important;
    background-position: left top !important;
    background-repeat: no-repeat
}

.slick-prev {
    background-image: url(../images/left.png) !important
}

.slick-next {
    background-image: url(../images/right.png) !important
}

#request-form {
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center
}

    #request-form .bound {
        max-width: 720px
    }

    #request-form .intro {
        margin-bottom: 40px;
        padding: 0 10px;
        font-size: 1.1rem;
        color: #595959;
        line-height: 150%
    }

    #request-form form .hundred {
        margin-bottom: 22px
    }

        #request-form form .hundred .col {
            float: left;
            width: 48%;
            position: relative
        }

            #request-form form .hundred .col.right {
                float: right
            }

    #request-form form input[type=date],
    #request-form form input[type=email],
    #request-form form input[type=number],
    #request-form form input[type=tel],
    #request-form form input[type=text],
    #request-form form select,
    #request-form form textarea {
        display: block;
        float: left;
        width: 100%;
        background: #f1f1f1;
        border: 1px dotted #ffcb05;
        padding: 6px 25px;
        height: 60px;
        font-size: .9rem;
        font-weight: 400;
        font-family: inherit;
        color: #000;
        box-shadow: none !important;
        border-radius: 4px
    }

        #request-form form input[type=date]:focus,
        #request-form form input[type=email]:focus,
        #request-form form input[type=number]:focus,
        #request-form form input[type=tel]:focus,
        #request-form form input[type=text]:focus,
        #request-form form select:focus,
        #request-form form textarea:focus {
            border: 2px solid #ffcb05;
            padding: 6px 24px
        }

form input::placeholder,
form textarea::placeholder {
    opacity: 1;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -o-transition: all .4s linear;
    -ms-transition: all .4s linear;
    transition: all .4s linear
}

form input:focus::placeholder,
form textarea:focus::placeholder {
    opacity: .3
}

#request-form form input[type=submit] {
    background-color: transparent;
    padding: 20px 40px;
    margin-top: 10px;
    font-weight: 700
}

    #request-form form input[type=submit]:hover {
        background-color: #ffcb05
    }

#footer {
    background-color: #f1f1f1;
    padding: 60px 0
}

    #bot-strip .container,
    #footer .container {
        padding: 0 40px
    }

    #footer .foot-logo {
        float: left;
        max-width: 59px !important
    }

    #footer .footer-in {
        display: block;
        margin-left: 80px
    }

        #footer .footer-in .col {
            float: left;
            width: 30%;
            padding-right: 30px;
            font-size: .72rem
        }

            #footer .footer-in .col .col-title {
                font-size: .9rem;
                text-transform: uppercase;
                margin-bottom: 15px
            }

            #footer .footer-in .col.last {
                width: 21%;
                float: right;
                padding-right: 0
            }

            #footer .footer-in .col.address {
                width: 42%
            }

            #footer .footer-in .col p {
                margin-bottom: 20px
            }

                #footer .footer-in .col p:last-child {
                    margin-bottom: 0
                }

            #footer .footer-in .col .menu li {
                padding-bottom: 10px;
                text-transform: uppercase;
                font-size: .7rem
            }

                #footer .footer-in .col .menu li:last-child {
                    padding-bottom: 0 !important
                }

    #footer a {
        color: #000
    }

        #footer a:hover {
            text-decoration: underline
        }

    #footer .btn {
        padding: 16px 22px;
        text-decoration: none !important;
        font-size: .8rem;
        max-width: 100% !important;
        margin-top: 15px
    }

body.rtl #footer .foot-logo {
    float: right
}

body.rtl #footer .footer-in {
    margin-left: 0;
    margin-right: 80px
}

    body.rtl #footer .footer-in .col {
        float: right
    }

#bot-strip {
    background-color: #ffcb05;
    padding: 15px 0;
    font-size: .7rem
}

    #bot-strip a {
        color: #000
    }

    #bot-strip .left {
        padding-top: 5px
    }

body.rtl #bot-strip .left {
    text-align: right
}

#bot-strip .left a {
    margin: 0 15px
}

body.rtl #bot-strip .left a {
    float: left
}

#bot-strip .left a:hover {
    text-decoration: underline
}

#bot-strip .social {
    float: right;
    margin-top: 4px
}

    #bot-strip .social a {
        margin: 0 4px;
        display: inline-block
    }

        #bot-strip .social a:hover img {
            opacity: .8
        }

body.rtl #bot-strip .left {
    float: right !important
}

body.rtl #bot-strip .right {
    float: left !important
}

#tp-strip {
    background-color: #f1f1f1;
    padding: 60px 0;
    text-align: center;
    font-size: 1rem
}

    #tp-strip .title {
        font-size: 1.5rem;
        margin-bottom: 10px
    }

    #tp-strip .intro {
        padding: 0 230px;
        margin-top: 5px;
        line-height: 140%
    }

#pricing-page #pricing-area .col {
    padding: 50px 0 0 0;
    background-color: #fff;
    text-align: center
}

    #pricing-page #pricing-area .col.left {
        border-top: 20px solid #f1f1f1;
        border-bottom: 20px solid #f1f1f1;
        padding-left: 0;
        padding-right: 0
    }

    #pricing-page #pricing-area .col.right {
        background-color: #434343;
        width: 43%;
        color: #fff;
        padding-bottom: 30px
    }

    #pricing-page #pricing-area .col .title {
        font-size: 1.3rem;
        margin-bottom: 35px
    }

    #pricing-page #pricing-area .col.left .title {
        margin-top: 20px
    }

    #pricing-page #pricing-area .col .tab-out {
        display: block;
        width: 290px;
        margin: 0 auto
    }

        #pricing-page #pricing-area .col .tab-out .tabs {
            margin-bottom: 30px;
            float: left;
            width: 100%;
            position: relative;
            border: 1px solid #959595;
            border-radius: 25px;
            padding: 4px 4px
        }

            #pricing-page #pricing-area .col .tab-out .tabs li {
                float: left;
                position: relative;
                width: 50%;
                text-align: center;
                line-height: 100%;
                font-size: .95rem;
                border-radius: 25px;
                font-weight: 600;
                cursor: pointer;
                overflow: hidden
            }

                #pricing-page #pricing-area .col .tab-out .tabs li:before {
                    transition: all .5s ease;
                    content: "";
                    background-color: #ffcb05;
                    width: 0;
                    height: 100%;
                    border-radius: 25px;
                    position: absolute;
                    left: 0;
                    top: 0;
                    z-index: 1
                }

                #pricing-page #pricing-area .col .tab-out .tabs li span {
                    transition: all .5s ease;
                    float: left;
                    width: 100%;
                    color: #c4c2c2;
                    padding: 12px 15px;
                    z-index: 2;
                    position: relative
                }

                #pricing-page #pricing-area .col .tab-out .tabs li:hover span {
                    color: #000
                }

body.rtl #pricing-page #plans .box div {
    float: none
}

#pricing-page #pricing-area .col .tab-out .tabs li.current {
    color: #000;
    background-color: #ffcb05
}

    #pricing-page #pricing-area .col .tab-out .tabs li.current span {
        color: #000
    }

    #pricing-page #pricing-area .col .tab-out .tabs li.current:before {
        display: none
    }

#pricing-page #pricing-area .col .tab-out .tabs .off {
    position: absolute;
    font-size: .75rem;
    font-weight: 600;
    background: url(../images/arrow.png) 0 0 no-repeat;
    background-size: 50px auto;
    padding: 23px 0 0 43px;
    right: -132px;
    top: -30px;
    line-height: 100%;
    height: 50px
}

#pricing-page #pricing-area .col .tab-content {
    float: right;
    opacity: 0;
    width: 100%;
    display: none;
    text-align: center;
    -webkit-transition: opacity .8s ease;
    -moz-transition: opacity .8s ease;
    -o-transition: opacity .8s ease;
    -ms-transition: opacity .8s ease;
    transition: opacity .8s ease
}

    #pricing-page #pricing-area .col .tab-content.current {
        display: block;
        opacity: 1
    }

#pricing-page #plans {
    margin-top: 30px
}

    #pricing-page #plans .box {
        float: left;
        width: 33.33%;
        color: #636363;
        font-size: .75rem;
        padding: 30px 30px 40px 30px;
        position: relative;
        -webkit-transition: all .4s linear;
        -moz-transition: all .4s linear;
        -o-transition: all .4s linear;
        -ms-transition: all .4s linear;
        transition: all .4s linear
    }

        #pricing-page #plans .box div {
            -webkit-transition: all .4s linear;
            -moz-transition: all .4s linear;
            -o-transition: all .4s linear;
            -ms-transition: all .4s linear;
            transition: all .4s linear
        }

        #pricing-page #plans .box .price-info {
            display: none
        }

        #pricing-page #plans .box.shadow {
            border: 4px solid #3d3d3d;
            -webkit-box-shadow: 0 0 5px 3px #d1d1d1;
            -moz-box-shadow: 0 0 5px 3px #d1d1d1;
            box-shadow: 0 0 5px 3px #d1d1d1
        }

        #pricing-page #plans .box .tag {
            background-color: #3d3d3d;
            color: #fff;
            text-transform: uppercase;
            font-size: .7rem;
            position: absolute;
            top: 0;
            left: 0;
            padding: 8px 3px;
            line-height: 100%;
            width: 77px;
            text-align: center
        }

        #pricing-page #plans .box div {
            float: left;
            width: 100%
        }

        #pricing-page #plans .box .cat {
            font-weight: 600;
            text-transform: uppercase
        }

            #pricing-page #plans .box .cat img {
                margin-bottom: 5px;
                max-width: 70px !important
            }

        #pricing-page #plans .box .use {
            float: none;
            width: auto;
            display: inline-block;
            background-color: #ebebeb;
            padding: 9px 25px;
            border-radius: 8px;
            line-height: 100%;
            margin-top: 40px
        }

        #pricing-page #plans .box:hover .use {
            color: #000
        }

        #pricing-page #plans .box .price {
            margin-top: 45px;
            color: #000;
            font-size: 1.6rem;
            font-weight: 600
        }

        #pricing-page #plans .box .per {
            color: #2a2a2a;
            font-size: .85rem;
            margin-top: 7px
        }

        #pricing-page #plans .box .tax {
            margin-top: 7px
        }

            #pricing-page #plans .box .tax span {
                display: inline-block;
                border: 1px solid #e2e2e2;
                border-radius: 12px;
                line-height: 100%;
                padding: 5px 10px;
                font-size: .75rem
            }

        #pricing-page #plans .box .des {
            font-size: .85rem;
            margin-top: 40px;
            line-height: 150%
        }

        #pricing-page #plans .box .btn {
            margin-top: 40px;
            font-size: .8rem;
            margin-bottom: 5px;
            cursor: pointer
        }

    #pricing-page #plans #price-nav {
        display: none
    }

#pricing-page .price-info .table {
    border: 1px solid #e1e1e1
}

    #pricing-page .price-info .table .box {
        display: table-cell;
        vertical-align: top;
        padding: 30px 25px;
        font-size: .75rem
    }

    #pricing-page .price-info .table.top .box {
        text-align: center;
        font-size: .8rem;
        font-weight: 600
    }

        #pricing-page .price-info .table.top .box.left {
            width: 66.66%;
            border-right: 1px solid #e1e1e1
        }

body.rtl #pricing-page .price-info .table.top .box.left {
    width: 66.66%;
    border-left: 1px solid #e1e1e1
}

#pricing-page .price-info .table.bottom {
    border-top: none
}

    #pricing-page .price-info .table.bottom .box {
        width: 33.33%;
        text-align: left;
        padding-top: 30px;
        padding-bottom: 30px
    }

        #pricing-page .price-info .table.bottom .box.shadow {
            border: 4px solid #3d3d3d;
            -webkit-box-shadow: 0 0 5px 3px #d1d1d1;
            -moz-box-shadow: 0 0 5px 3px #d1d1d1;
            box-shadow: 0 0 5px 3px #d1d1d1
        }

        #pricing-page .price-info .table.bottom .box .heading {
            font-weight: 600;
            line-height: 130%;
            float: left;
            width: 100%;
            margin-bottom: 25px;
            font-size: .8rem
        }

        #pricing-page .price-info .table.bottom .box li {
            float: left;
            width: 100%;
            line-height: 130%;
            padding-bottom: 20px;
            background: url(../images/icon-right.svg) 0 0 no-repeat;
            background-size: 16px auto;
            padding-left: 22px
        }

            #pricing-page .price-info .table.bottom .box li:last-child span {
                background: #fbdcca;
                border: none;
                padding: 0;
                font-size: 12px;
                font-weight: 600;
                padding: 0px 10px;
                border-radius: 50px;
            }

            #pricing-page .price-info .table.bottom .box li:last-child {
                padding-bottom: 0
            }

            #pricing-page .price-info .table.bottom .box li small {
                font-size: .65rem
            }

            #pricing-page .price-info .table.bottom .box li span {
                background: #fbdcca;
                border: none;
                padding: 0;
                font-size: 12px;
                font-weight: 600;
                padding: 0px 10px;
                border-radius: 50px;
            }

#pricing-page #pricing-area .enterprise .title {
    margin-bottom: 20px
}

#pricing-page #pricing-area .enterprise .content {
    color: #d5d5d5;
    text-align: left;
    background: url(../images/icon-enterprise.svg) center top no-repeat;
    padding: 80px 0 0 0;
    background-size: 55px auto
}

#pricing-page #pricing-area .enterprise .subtitle {
    color: #ffcb05;
    padding: 0 30px;
    margin-bottom: 20px;
    text-align: center;
    font-size: .85rem
}

#pricing-page #pricing-area .enterprise .content .con {
    float: left;
    width: 50%;
    padding: 0 35px;
    font-size: .7rem
}

    #pricing-page #pricing-area .enterprise .content .con.left {
        border-right: 1px solid #636363
    }

    #pricing-page #pricing-area .enterprise .content .con .row {
        line-height: 130%;
        margin: 13px 0
    }

        #pricing-page #pricing-area .enterprise .content .con .row .img {
            margin-bottom: 5px;
            float: left;
            width: 100%
        }

            #pricing-page #pricing-area .enterprise .content .con .row .img img {
                max-width: 35px !important
            }

        #pricing-page #pricing-area .enterprise .content .con .row h4 {
            margin-bottom: 7px;
            text-transform: uppercase;
            font-size: .75rem
        }

        #pricing-page #pricing-area .enterprise .content .con .row li {
            padding-bottom: 5px
        }

#pricing-page #pricing-area .enterprise .cnt-strip {
    background-color: #2a2a2a;
    margin-top: 20px;
    font-size: .8rem;
    padding: 10px 10px;
    text-align: center;
    color: #fff
}

    #pricing-page #pricing-area .enterprise .cnt-strip span {
        display: inline-block;
        vertical-align: middle;
        margin: 0 20px
    }

    #pricing-page #pricing-area .enterprise .cnt-strip .btn:hover {
        color: #fff
    }

#pricing-page #pricing-area .enterprise .bot {
    font-size: .75rem;
    padding: 20px 20px 0 20px;
    background-color: #383838
}

    #pricing-page #pricing-area .enterprise .bot .title {
        font-size: .9rem;
        color: #ffcb05;
        margin-bottom: 2px
    }

    #pricing-page #pricing-area .enterprise .bot .subtitle {
        font-size: .75rem;
        color: #fff;
        padding: 0
    }

    #pricing-page #pricing-area .enterprise .bot .logos-out {
        text-align: center;
        padding: 10px 0 30px 0
    }

        #pricing-page #pricing-area .enterprise .bot .logos-out span {
            display: inline-block;
            text-align: center;
            padding: 0 10px
        }

            #pricing-page #pricing-area .enterprise .bot .logos-out span img {
                display: inline-block
            }

    #pricing-page #pricing-area .enterprise .bot.numbers {
        background-color: #434343
    }

        #pricing-page #pricing-area .enterprise .bot.numbers .table {
            margin-top: 10px
        }

            #pricing-page #pricing-area .enterprise .bot.numbers .table span {
                border-left: 1px solid #2a2a29;
                display: table-cell;
                width: 25%;
                padding: 10px;
                text-transform: uppercase
            }

                #pricing-page #pricing-area .enterprise .bot.numbers .table span:first-child {
                    border: none
                }

                #pricing-page #pricing-area .enterprise .bot.numbers .table span strong {
                    font-size: 1.2rem;
                    font-family: Roboto, sans-serif;
                    float: left;
                    width: 100%;
                    letter-spacing: 2px;
                    margin-bottom: 14px
                }

    #pricing-page #pricing-area .enterprise .bot .btn {
        padding: 10px 18px;
        font-size: .85rem;
        margin-top: 6px
    }

        #pricing-page #pricing-area .enterprise .bot .btn:hover {
            color: #ffcb05
        }

#pricing-page #tp-strip.cant-decide .title {
    font-weight: 400;
    font-size: 1.6rem;
    margin-bottom: 20px
}

#pricing-page #tp-strip.cant-decide .btn {
    font-size: 1.3rem;
    padding: 14px 40px;
    text-transform: none
}

#pricing-page #faq {
    padding: 60px 0;
    background-color: #fff;
    text-align: center
}

    #pricing-page #faq .title {
        font-size: 1.4rem;
        margin-bottom: 25px
    }

    #pricing-page #faq .intro {
        font-size: 1rem;
        padding: 0 230px;
        line-height: 140%
    }

    #pricing-page #faq .content {
        text-align: left;
        margin-top: 60px;
        font-size: .75rem;
        display: table
    }

        #pricing-page #faq .content .con {
            display: table-cell;
            vertical-align: top;
            width: 45%;
            padding: 0
        }

            #pricing-page #faq .content .con.center {
                width: 10%
            }

            #pricing-page #faq .content .con .row {
                border-bottom: 1px solid #959595;
                margin-bottom: 30px
            }

                #pricing-page #faq .content .con .row:last-child {
                    margin-bottom: 0
                }

                #pricing-page #faq .content .con .row h4 {
                    margin-bottom: 10px
                }

body.rtl #pricing-page #pricing-area .enterprise .content,
body.rtl #pricing-page .price-info .table.bottom .box {
    text-align: right
}

body.rtl #pricing-page #pricing-area .enterprise .bot.numbers .table span {
    border-right: 1px solid #2a2a29;
    border-left: 0
}

    body.rtl #pricing-page #pricing-area .enterprise .bot.numbers .table span:first-child {
        border: none
    }

body.rtl #pricing-page .price-info .table.bottom .box li {
    background-position: right 0;
    padding-right: 22px;
    padding-left: 0
}

body.rtl #pricing-page #plans .box .tag {
    right: 0
}

body.rtl #pricing-page #faq .content {
    text-align: right
}

body.rtl #pricing-page #pricing-area .enterprise .bot .logos-out {
    direction: ltr
}

#contact-page #frm-add {
    padding: 60px 0
}

    #contact-page #frm-add .frm-area {
        background-color: #f1f1f1;
        float: left;
        width: 50%;
        padding: 50px 60px 40px 60px
    }

        #contact-page #frm-add .frm-area .title {
            font-weight: 600;
            margin-bottom: 30px;
            font-size: 1.2rem;
            text-align: center
        }

#contact-page form .hundred {
    margin-bottom: 20px
}

    #contact-page form .hundred.disc {
        font-size: .75rem;
        margin-top: 15px;
        line-height: 140%
    }

#contact-page form input[type=date],
#contact-page form input[type=email],
#contact-page form input[type=number],
#contact-page form input[type=tel],
#contact-page form input[type=text],
#contact-page form select,
#contact-page form textarea {
    display: block;
    float: left;
    width: 100%;
    background: #fff;
    border: 1px dotted #fff;
    padding: 6px 25px;
    height: 50px;
    font-size: .85rem;
    font-weight: 400;
    font-family: inherit;
    color: #000;
    box-shadow: none !important;
    border-radius: 0;
    text-transform: uppercase;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -o-transition: all .4s linear;
    -ms-transition: all .4s linear;
    transition: all .4s linear
}

#contact-page form select {
    color: #787878
}

    #contact-page form select:focus {
        color: #000
    }

    #contact-page form input[type=date]:focus,
    #contact-page form input[type=email]:focus,
    #contact-page form input[type=number]:focus,
    #contact-page form input[type=tel]:focus,
    #contact-page form input[type=text]:focus,
    #contact-page form select:focus,
    #contact-page form textarea:focus {
        border: 1px solid #9b9b9b
    }

#contact-page form textarea {
    padding-top: 14px;
    height: 140px
}

.overlay #contact-page form textarea {
    height: 90px
}

#contact-page form input[type=submit] {
    width: 100%;
    font-size: 1.1rem
}

#contact-page #frm-add .address-area {
    float: right;
    width: 50%;
    padding: 20px 60px
}

    #contact-page #frm-add .address-area .row {
        font-size: .85rem;
        margin-bottom: 40px;
        float: left;
        width: 100%;
        background-position: left top;
        background-repeat: no-repeat;
        background-size: 45px auto;
        padding: 10px 0 0 65px
    }

body.rtl #contact-page #frm-add .address-area .row {
    padding: 10px 65px 0 0;
    background-position: right top
}

#contact-page #frm-add .address-area .row h4 {
    font-size: 1.2rem;
    margin-bottom: 12px
}

#contact-page #frm-add .address-area .row p {
    margin: 0;
    line-height: 160%
}

#contact-page #frm-add .address-area .row.support {
    background-image: url(../images/contact/icon-support.svg)
}

#contact-page #frm-add .address-area .row.sales {
    background-image: url(../images/contact/icon-call.svg)
}

#contact-page #frm-add .address-area .row.request {
    background-image: url(../images/contact/icon-demo.svg);
    margin-bottom: 0
}

#contact-page #frm-add .address-area .row .phone {
    letter-spacing: 1px;
    float: left;
    width: 100%;
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 24px auto;
    font-size: 1rem;
    padding: 1px 0 5px 36px;
    min-height: 24px;
    margin-top: 10px
}

body.rtl #contact-page #frm-add .address-area .row .phone {
    padding: 1px 36px 5px 0;
    background-position: right top
}

#contact-page #frm-add .address-area .row .phone.india {
    background-image: url(../images/contact/india.svg)
}

#contact-page #frm-add .address-area .row .phone.uae {
    background-image: url(../images/contact/uae.svg)
}

#contact-page #frm-add .address-area .row .phone.ph {
    background-image: url(../images/contact/philippines.svg)
}

#contact-page #frm-add .address-area .row .phone.mail {
    background-image: url(../images/contact/icon-email.svg);
    margin-bottom: 0
}

#contact-page #frm-add .address-area .row .phone.knowledge {
    background-image: url(../images/contact/icon-knowledge.svg)
}

#contact-page #frm-add .address-area .row .phone.call {
    background-image: url(../images/contact/icon-call.svg)
}

#contact-page #locations {
    background-color: #f1f1f1;
    padding: 60px 0;
    text-align: center
}

    #contact-page #locations .title {
        font-size: 1.3rem;
        margin-bottom: 60px
    }

    #contact-page #locations .table .col {
        width: 50%;
        text-align: center;
        background-position: center 10px;
        background-repeat: no-repeat;
        background-size: 55px auto;
        padding: 90px 30px 20px 30px;
        font-size: .9rem
    }

        #contact-page #locations .table .col h5 {
            font-size: 1.2rem;
            margin-bottom: 20px
        }

        #contact-page #locations .table .col p {
            margin-bottom: 22px;
            line-height: 150%
        }

            #contact-page #locations .table .col p:last-child {
                margin-bottom: 0
            }

        #contact-page #locations .table .col.india {
            background-image: url(../images/india.png)
        }

        #contact-page #locations .table .col.uae {
            background-image: url(../images/uae.png);
            border-left: 1px dashed #a6a6a6
        }

.tab-out-center {
    display: block;
    width: 290px;
    margin: 0 auto;
    border: 1px solid #959595;
    border-radius: 25px;
    padding: 4px 4px;
    position: relative
}

.switch {
    position: relative;
    display: inline-block;
    width: 282px;
    height: 44px
}

.tab-out-center .duration {
    float: left;
    width: 50%;
    text-align: center;
    z-index: 3;
    position: relative;
    cursor: pointer;
    height: 44px;
    padding-top: 10px;
    font-weight: 500;
    color: #999
}

    .tab-out-center .duration.selected {
        color: #000
    }

.tab-out-center .off {
    position: absolute;
    font-size: .75rem;
    font-weight: 600;
    background: url(../images/arrow.png) 0 0 no-repeat;
    background-size: 50px auto;
    padding: 23px 0 0 43px;
    right: -125px;
    top: -22px;
    line-height: 100%;
    height: 50px
}

body.rtl .tab-out-center .off {
    right: -167px
}

.tab-out-center .switch input {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 4;
    cursor: pointer;
    opacity: 0;
    width: 100%;
    height: 44px
}

.tab-out-center .slider {
    z-index: 1;
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: transparent;
    -webkit-transition: .4s;
    transition: .4s
}

    .tab-out-center .slider:before {
        z-index: 2;
        position: absolute;
        content: "";
        height: 44px;
        width: 50%;
        left: 0;
        bottom: 0;
        background-color: #ffcb05;
        -webkit-transition: .4s;
        transition: .4s
    }

.tab-out-center input:checked + .slider {
    background-color: #fff
}

    .tab-out-center input:checked + .slider:before {
        -webkit-transform: translateX(139px);
        -ms-transform: translateX(139px);
        transform: translateX(139px)
    }

.tab-out-center .slider.round {
    border-radius: 25px
}

    .tab-out-center .slider.round:before {
        border-radius: 25px
    }

#features-page #features {
    margin-bottom: 50px
}

    #features-page #features .table {
        border-right: 1px solid #e1e1e1;
        table-layout: fixed
    }

        #features-page #features .table .row {
            display: table-footer-group
        }

        #features-page #features .table .col {
            padding: 10px 10px;
            text-align: center;
            border: 1px solid #e1e1e1;
            border-right: none;
            color: #636363;
            font-size: .85rem;
            vertical-align: middle;
            line-height: 130%
        }

        #features-page #features .table.head .col {
            padding: 20px 10px
        }

        #features-page #features .table .col.first {
            padding: 15px 25px;
            text-align: left;
            width: 35%;
            font-weight: 600
        }

        #features-page #features .table .col div {
            float: left;
            width: 100%
        }

        #features-page #features .table .col img {
            max-width: 24px !important
        }

        #features-page #features .table .col .label,
        #features-page #features .table .col.capital {
            text-transform: uppercase
        }

        #features-page #features .table .col .price {
            color: #000;
            font-size: 1.4rem;
            margin: 14px 0;
            font-weight: 600;
            -webkit-transition: all .3s linear;
            -moz-transition: all .3s linear;
            -o-transition: all .3s linear;
            -ms-transition: all .3s linear;
            transition: all .3s linear
        }

        #features-page #features .table .col .title {
            color: #000;
            font-weight: 600;
            font-size: .95rem
        }

        #features-page #features .table .col.highlight {
            background-color: #fffbed
        }

        #features-page #features .table.category .col {
            background-color: #eee;
            font-size: 1rem
        }

#features-page .cl-action-strip {
    padding: 70px 50px
}

#features-page #features #table-head {
    background-color: #fff;
    -webkit-transition: all .3s linear;
    -moz-transition: all .3s linear;
    -o-transition: all .3s linear;
    -ms-transition: all .3s linear;
    transition: all .3s linear
}

    #features-page #features #table-head.sticky {
        position: fixed;
        top: 77px;
        left: 60px;
        right: 60px
    }

#privacy-page #header {
    -webkit-box-shadow: 0 3px 5px 0 #333;
    -moz-box-shadow: 0 3px 5px 0 #333;
    box-shadow: 0 0 8px 0 rgba(51, 51, 51, .3)
}

#privacy-page #left-menu {
    position: fixed;
    left: 0;
    top: 77px;
    padding: 40px 40px;
    width: 22%;
    font-size: .9rem
}

    #privacy-page #left-menu h3 {
        font-size: 1.2rem;
        margin-bottom: 15px
    }

    #privacy-page #left-menu ul {
        margin: 0;
        padding: 0
    }

    #privacy-page #left-menu li {
        float: left;
        width: 100%;
        padding-bottom: 1px
    }

        #privacy-page #left-menu li a {
            float: left;
            width: 100%;
            padding: 12px 17px;
            color: #000;
            line-height: 100%
        }

            #privacy-page #left-menu li a:hover,
            #privacy-page #left-menu li.active a {
                background-color: #ffcb05
            }

#privacy-page .right-col {
    float: right;
    width: 78%;
    padding: 40px 0;
    font-size: .8rem
}

    #privacy-page .right-col h1.title {
        margin-bottom: 10px;
        font-size: 1.7rem
    }

    #privacy-page .right-col p {
        margin-bottom: 20px
    }

    #privacy-page .right-col h2 {
        margin-bottom: 10px;
        font-size: 1.4rem
    }

    #privacy-page .right-col .row {
        padding: 25px;
        background-color: #fff;
        margin: 20px 0;
        box-shadow: 0 2px 2px 0 rgba(11, 37, 71, .2), 0 0 1px 0 rgba(10, 37, 70, .2)
    }

    #privacy-page .right-col ul {
        margin-left: 20px
    }

    #privacy-page .right-col li {
        padding-bottom: 10px;
        list-style: disc
    }

    #privacy-page .right-col .row:hover {
        box-shadow: 0 8px 8px 0 rgba(11, 37, 71, .2), 0 0 1px 0 rgba(10, 37, 70, .2)
    }

    #privacy-page .right-col .row h3 {
        margin-bottom: 10px;
        font-size: 1.2rem
    }

    #privacy-page .right-col .row p {
        margin-bottom: 15px
    }

        #privacy-page .right-col .row p:last-child {
            margin-bottom: 0 !important
        }

    #privacy-page .right-col .row li {
        padding-bottom: 6px
    }

body#privacy-page.rtl #left-menu {
    left: inherit;
    right: 0
}

body#privacy-page.rtl .right-col {
    float: left
}

.slick-next::before,
.slick-prev::before {
    display: none
}

#contact-page.thanks-page #testi {
    margin-top: 40px
}

#contact-page.thanks-page #tp-strip {
    background-color: #ffcb05
}

#developers-page #tp-strip {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    color: #fff;
    padding: 50px 0
}

#tp-strip-whatnew {
    background-color: #f1f1f1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    color: #000;
    padding: 50px 0;
    text-align: center;
    font-size: 1rem
}

#developers-page #tp-strip .title {
    text-transform: uppercase;
    font-size: 2.6rem;
    text-shadow: 1px 1px 1px #000
}

#tp-strip-whatnew .title {
    font-weight: 400;
    font-size: 26px;
    text-shadow: 0px 2px #fff;
    padding: 3px 0;
}

#developers-page #tp-strip .subtitle {
    font-size: 1.3rem;
    margin-bottom: 4px
}

#tp-strip-whatnew .subtitle {
    font-weight: 400;
    font-size: 26px;
    text-shadow: 0px 2px #fff;
    padding: 3px 0;
}

#developers-page #top-sec {
    padding: 60px 0;
    font-size: .85rem
}

    #developers-page #top-sec .subtitle {
        text-align: center;
        margin-bottom: 50px;
        font-size: 1.5rem
    }

    #developers-page #top-sec .col {
        width: 47%;
        line-height: 150%
    }

        #developers-page #top-sec .col.left {
            float: left
        }

        #developers-page #top-sec .col.right {
            float: right
        }

        #developers-page #top-sec .col p {
            margin-bottom: 25px
        }

            #developers-page #top-sec .col p:last-child {
                margin-bottom: 0 !important
            }

#developers-page .notice {
    padding: 30px 0;
    font-size: .9rem;
    text-align: center;
    background-color: #fff5d5
}

    #developers-page .notice a {
        color: #000
    }

        #developers-page .notice a:hover {
            color: #555
        }

#developers-page #expect {
    background-color: #f1f1f1;
    padding: 40px 0 50px 0
}

    #developers-page #expect .subtitle {
        text-align: center;
        margin-bottom: 50px;
        font-size: 1.4rem
    }

    #developers-page #expect .col {
        float: left;
        width: 25%;
        padding-right: 20px;
        font-size: .85rem
    }

        #developers-page #expect .col span {
            float: left;
            line-height: 120%
        }

            #developers-page #expect .col span strong {
                float: left;
                margin-top: 8px;
                padding-right: 15px;
                font-size: 2.8rem;
                color: #bebebe;
                font-weight: 500;
                letter-spacing: -3px
            }

        #developers-page #expect .col.one {
            width: 30%
        }

        #developers-page #expect .col.two {
            width: 23%
        }

        #developers-page #expect .col.three {
            width: 27%
        }

        #developers-page #expect .col.four {
            width: 20%
        }

#developers-page #form-area {
    background-color: #fff;
    background-color: #f1f1f1
}

    #developers-page #form-area .box {
        float: left;
        width: 47%
    }

        #developers-page #form-area .box.left {
            width: 53%;
            border-top: 40px solid #f1f1f1;
            border-bottom: 40px solid #f1f1f1
        }

            #developers-page #form-area .box.left .pricing-area {
                border-left: 1px solid #f1f1f1;
                background-color: #fff
            }

            #developers-page #form-area .box.left .subtitle {
                margin: 35px 0 25px 0;
                text-align: center;
                font-size: 1.3rem
            }

                #developers-page #form-area .box.left .subtitle p {
                    font-size: .9rem;
                    margin: 0;
                    font-weight: 400
                }

            #developers-page #form-area .box.left .table {
                border-top: 1px solid #f1f1f1;
                display: table
            }

                #developers-page #form-area .box.left .table .col {
                    width: 33.33%;
                    vertical-align: top;
                    font-size: .8rem;
                    line-height: 120%;
                    display: table-cell;
                    border-left: 1px solid #f1f1f1;
                    padding: 60px 20px;
                    text-align: center
                }

                    #developers-page #form-area .box.left .table .col strong {
                        float: left;
                        font-weight: 600;
                        width: 100%;
                        font-size: 1.1rem;
                        margin-bottom: 10px
                    }

        #developers-page #form-area .box .info {
            background-color: #ffcb05;
            padding: 20px;
            text-align: center;
            font-size: .85rem
        }

        #developers-page #form-area .box.left .table .col:first-child {
            border: none
        }

        #developers-page #form-area .box.right {
            padding-right: 20px;
            background-color: #fff
        }

            #developers-page #form-area .box.right .subtitle {
                margin-bottom: 30px;
                text-align: center;
                font-size: 1.3rem
            }

    #developers-page #form-area form {
        background-color: #434343;
        color: #fff;
        padding: 35px 40px;
        float: left;
        width: 100%
    }

        #developers-page #form-area form .hundred {
            margin-bottom: 10px
        }

            #developers-page #form-area form .hundred .con {
                width: 48%
            }

            #developers-page #form-area form .hundred input,
            #developers-page #form-area form .hundred textarea {
                border: none;
                width: 100%;
                background-color: #2a2a2a;
                color: #fff;
                padding: 15px 20px;
                text-transform: uppercase;
                height: 52px;
                font-size: 1rem;
                text-transform: uppercase
            }

            #developers-page #form-area form .hundred textarea {
                font-family: inherit;
                height: 120px
            }

            #developers-page #form-area form .hundred.btn-area {
                margin: 0;
                text-align: center;
                margin-top: 5px
            }

            #developers-page #form-area form .hundred input[type=submit] {
                width: auto;
                border: 2px solid #ffcb05;
                background-color: #ffcb05;
                color: #000;
                padding: 14px 40px
            }

                #developers-page #form-area form .hundred input[type=submit]:hover {
                    background-color: transparent;
                    color: #fff
                }

#developers-page .cl-action-strip {
    text-align: center;
    padding: 40px 0
}

    #developers-page .cl-action-strip .left {
        display: inline-block;
        vertical-align: middle;
        font-size: 1.6rem;
        text-align: right;
        width: 49%;
        padding-right: 20px
    }

    #developers-page .cl-action-strip .right {
        text-align: left;
        display: inline-block;
        vertical-align: middle;
        width: 49%;
        padding-left: 20px
    }

    #developers-page .cl-action-strip .btn {
        padding: 20px 50px;
        text-transform: uppercase;
        font-size: 1.1rem
    }

#developers-page #faq {
    background-color: #f1f1f1
}

body.rtl #developers-page #expect .col {
    float: right
}

    body.rtl #developers-page #expect .col span {
        float: right
    }

        body.rtl #developers-page #expect .col span strong {
            padding-right: 0;
            padding-left: 15px
        }

body.rtl #developers-page #form-area .box.left .table .col {
    border-left: none;
    border-right: 1px solid #f1f1f1
}

body.rtl #developers-page .cl-action-strip .left {
    float: none;
    text-align: left;
    padding-right: 0;
    padding-left: 20px
}

body.rtl #developers-page .cl-action-strip .right {
    text-align: right;
    float: none
}

body.rtl #developers-page #top-sec .col.left {
    float: right
}

body.rtl #developers-page #top-sec .col.right {
    float: left
}

#whatsnew-page {
    margin: 40px 0;
    padding: 0 60px;
}

.filter-tab li {
    margin-right: 30px;
    font-size: 16px;
    cursor: pointer;
    display: inline-block;
}

.filter-tab {
    display: block;
    float: right;
    border-bottom: 1px solid #f2f2f2;
    width: 100%;
    text-align: right;
    margin-bottom: 40px;
    padding-bottom: 8px;
    background: #fff;
    position: relative;
    z-index: 3;
}

ul.filter-tab li a {
    color: #a1a1a1;
    font-size: 15px;
}

    ul.filter-tab li a.active {
        color: #ffcb05;
        border-bottom: 2px solid #ffcb05;
        padding-bottom: 10px;
        font-weight: 600;
    }

.left-section {
    float: left;
    width: 21%;
    margin: 0 0 30px 0;
}

    .left-section h3 {
        font-size: 18px;
        font-weight: 700;
    }

.accordion {
    background-color: #f1f1f1;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
}

.accodian {
    border: 1px solid #ececec;
    border-radius: 2px;
    margin: 15px 0 50px 0;
}

.active, .accordion:hover {
    background-color: #fff;
    border-bottom: 1px solid #ececec;
    color: #ffcb05;
    font-weight: 700;
}

.panel {
    background-color: white;
    display: none;
    overflow: hidden;
    padding: 5px 18px;
}

    .panel li a {
        color: #000;
        font-size: 13px;
        padding: 8px 0;
        float: left;
        width: 100%;
        font-weight: 500;
    }

.right-section {
    box-sizing: border-box;
    float: right;
    width: 79%;
    padding-left: 10%;
    text-align: left;
}

.event-category-year-wrap:before {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    border: 1px solid #617edc;
    border-radius: 100%;
    top: 15px;
    left: 15px;
    background: #617edc;
    z-index: 1;
}

.event-category-year-wrap > h2 {
    margin-left: -90px;
}

.event-category-wrap {
    position: relative;
}

.event-category-year-wrap:after {
    content: '';
    position: absolute;
    height: 100%;
    width: 1px;
    background: #f2f2f2;
    left: 20px;
    top: 20px;
}

.event-category-wrap > h3 {
    position: absolute;
    left: -69px;
    top: 15px;
    width: 52px;
}

    .event-category-wrap > h3:after {
        content: '';
        position: absolute;
        width: 8px;
        height: 8px;
        border: 1px solid #617edc;
        border-radius: 100%;
        top: 15px;
        right: -42px;
        background: #fff;
        z-index: 1;
    }

.event-category-year-wrap {
    position: relative;
    margin-bottom: 150px;
}

.event-category {
    padding: 0px 0px;
    margin-left: 60px;
    margin-bottom: 20px;
    transition: ease all 0.5s;
}

.content-box .btn {
    background: #fbdcca;
    border: none;
    padding: 0;
    font-size: 12px;
    font-weight: 600;
    padding: 10px 14px;
    border-radius: 50px;
    margin: 0 0 10px 0;
}

.content-box {
    width: 100%;
    border-bottom: 1px solid #f2f2f2;
    padding: 0 0 40px 0;
    margin: 0 0 15px 0;
}

    .content-box h2 {
        font-size: 22px;
        margin: 10px 0 20px 0;
    }

    .content-box p {
        font-size: 14px;
        margin: 0 0 20px 0;
    }

a.learn-more {
    font-size: 14px;
    font-weight: 500;
    margin: 10px 0 0 0;
}

.main-right {
    position: relative;
    top: 23px;
}

.accodian .accordion:after {
    content: ''; /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    color: #777;
    float: right;
    margin-left: 5px;
    background-image: url(../images/are-gray.png);
    width: 21px;
    height: 21px;
}

.accodian .active:after {
    content: "";
    background-image: url(../images/dwn-arw.png);
    width: 21px;
    height: 21px;
}

.rtl .left-section {
    float: right !important;
    width: 21%;
    margin: 0 0 30px 0;
}

.rtl .right-section {
    float: left;
    padding-left: 0;
    padding-right: 10%;
}

.rtl .event-category-year-wrap:before, .rtl .event-category-year-wrap .event-category-wrap:last-child .event-category:last-child:after {
    right: 15px;
}

.rtl .event-category-wrap > h3 {
    position: absolute;
    right: -106px;
    top: 45px;
    width: 52px;
}

.rtl .event-category-year-wrap:after {
    right: 20px;
}

.rtl .event-category-wrap > h3:after {
    right: 122px;
    top: 13px;
}

.rtl .main-right {
    position: relative;
    top: 45px;
}

.rtl .event-category-year-wrap > h2 {
    margin-right: -90px;
    direction: ltr;
    float: right;
}

.rtl .content-box {
    text-align: right;
    padding: 0 30px 40px 0;
}

.rtl ul.filter-tab {
    float: left !important;
    text-align: left;
    padding: 0 20px 10px 20px;
}

.rtl .event-category {
    padding: 0px 0px;
    margin-right: 60px;
    margin-bottom: 20px;
    transition: ease all 0.5s;
    margin-left: 0px;
}

.subscription-box {
    float: left;
    margin: 0px 0 0 -30px;
    background: #F1F1F1;
    padding: 40px 30px;
}

    .subscription-box h2 {
        font-weight: 500;
        float: left;
        width: 100%;
    }

    .subscription-box p {
        text-transform: uppercase;
        font-size: 14px;
        line-height: 24px;
        font-weight: 500;
        margin: 8px 0 30px 0;
        float: left;
    }

body.rtl .subscription-box p {
    float: right;
}

.subscription-box input {
    background: #fff;
    border: none;
    padding: 14px 10px;
    width: 48%;
    margin: 0 0 10px 0;
    float: left;
}

input.email-input {
    margin: 0 0 0 4%;
}

.new-sub {
    float: left;
    width: 100%;
    text-align: center;
}

    .new-sub input {
        width: 220px !important;
        margin: 0 auto;
        float: none !important;
    }

.hundred.capchaParentdiv {
    padding: 0 !important;
    width: 100% !important;
    margin: 0 auto !important;
}

span.new-subs {
    float: left;
    width: 100%;
    text-align: center;
}

.subscription-box input[type=submit] {
    float: left;
    width: 100%;
    background: #FFCB05;
    color: #000;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 600;
    text-align: center;
    padding: 15px 0;
}

.rtl .subscription-box {
    float: right;
    margin: 0px -30px 0 0;
    background: #F1F1F1;
    padding: 40px 30px;
}

#whatsnew-page .tabs.sticky {
    position: fixed;
    top: 0;
    z-index: 10;
    max-width: 100%;
    margin-top: 70px;
    background: #FFF;
    display: block;
    width: 100%;
    left: 0;
    padding-top: 10px;
    right: 0;
}

    #whatsnew-page .tabs.sticky .filter-tab {
        margin-bottom: 0;
    }

#whatsnew-page .tabs {
    transition: ease all 0.5s;
    -webkit-transition: ease all 0.5s;
}

#whatsnew-page .event-series.sticky {
    position: fixed;
    top: 0;
    z-index: 10;
    margin-top: 127px;
    display: block;
    padding-top: 10px;
    width: 19%;
}

html {
    scroll-behavior: smooth;
}

.mobile-left {
    display: none;
}

.rtl #whatsnew-page .subscription-box h2 {
    font-weight: 500;
    float: right;
    width: 100%;
    text-align: right;
}

@media only screen and (max-width:1300px) {
    #hm-page #features #tab-out .tabs li {
        padding: 17px 24px
    }

    .subscription-box {
        float: left;
        width: 350px;
        margin: 0px 0 0 -10px;
        background: #F1F1F1;
        padding: 30px 20px;
    }
}

@media only screen and (max-width:1200px) {
    #whatsnew-page .tabs.sticky {
        position: fixed;
        top: 0;
        z-index: 10;
        max-width: 100%;
        margin-top: 66px;
        background: #FFF;
        display: block;
        width: 100%;
        left: 0;
        padding-top: 10px;
        right: 0;
    }

    body.rtl .subscription-box .g-recaptcha {
        margin-right: -40px !important;
    }

    .subscription-box .g-recaptcha {
        transform: scale(0.6) !important;
        -webkit-transform: scale(0.6) !important;
    }

    .rtl .subscription-box {
        margin: 0px -10px 0 0;
        width: 230px;
    }

    #whatsnew-page .subscription-box {
        float: left;
        width: 100%;
        margin: 0px 0 0 0;
        background: #F1F1F1;
        padding: 30px 20px;
    }

    .container {
        padding: 0 40px
    }

    #head-out {
        height: 65px
    }

    #header .container {
        padding-left: 25px
    }

    #header .logo img {
        width: 200px
    }

    #lang-tog span {
        padding: 26px 18px 22px 13px
    }

    body.rtl #lang-tog span {
        padding: 26px 18px 22px 13px
    }

    #nav {
        margin-top: 15px
    }

    #tp-strip .intro {
        padding: 0 130px
    }

    #privacy-page #left-menu {
        width: 25%;
        padding: 40px 30px
    }

    #privacy-page .right-col {
        width: 75%
    }

    #nav li.call a {
        padding: 16px 18px 14px 45px
    }

    body.rtl #header .container {
        padding-right: 25px
    }
}

@media only screen and (max-width:1199px) {
    #whatsnew-page .left-section {
        float: left;
        width: 30%;
        margin: 0 2% 30px 0;
    }

    #whatsnew-page .event-series.sticky {
        width: 28%;
    }

    #whatsnew-page .right-section {
        box-sizing: border-box;
        float: right;
        width: 66%;
        padding-left: 10%;
        text-align: left;
    }

    .insta-follow {
        font-size: .9rem !important;
        padding: 15px 20px !important
    }

    body.rtl #contact-page.thanks-page #top-sec .right-col {
        padding-right: 30px
    }

    #pricing-page #pricing-area {
        display: block !important
    }

        #pricing-page #pricing-area .col {
            float: left;
            display: block;
            width: 100% !important
        }

            #pricing-page #pricing-area .col.left {
                border: none
            }

    #pricing-page #plans .box .use {
        margin-top: 35px
    }

    #pricing-page #plans .box .price {
        margin-top: 40px
    }

    #pricing-page #plans .box .des {
        margin-top: 35px
    }

    #pricing-page #plans .box .btn {
        margin-top: 35px
    }

    #contact-page #frm-add .frm-area {
        padding: 40px 40px 30px 40px
    }

    #nav li.call a {
        padding: 15px 18px 14px 45px
    }

    #nav li {
        margin: 0 11px
    }

    #about-slide .box .boxin {
        max-width: 250px
    }

    #about-slide .box .img {
        width: 250px;
        height: 250px
    }
}

@media only screen and (max-width:1023px) {
    .event-category-year-wrap > h2 {
        margin-left: -60px;
    }

    #whatsnew-page {
        padding: 0 20px;
    }

    .event-category-wrap > h3 {
        position: absolute;
        left: -40px;
        top: 15px;
        width: 52px;
        line-height: 33px;
    }

        .event-category-wrap > h3:after {
            right: -14px;
        }

    .rtl .event-category-year-wrap > h2 {
        margin-right: -50px;
        direction: ltr;
        float: right;
    }

    .rtl .event-category-wrap > h3:after {
        right: 85px;
        top: 13px;
    }

    .rtl .event-category-wrap > h3 {
        position: absolute;
        right: -50px;
        top: 45px;
        width: 52px;
    }

    html {
        font-size: 16px
    }

    #head-out {
        height: 61px
    }

    .container {
        padding: 0 30px
    }

    a.tog {
        display: block
    }

    #header .container {
        padding-left: 20px
    }

    #header {
        padding: 10px 0
    }

        #header .logo {
            margin: 0
        }

            #header .logo img {
                width: 180px
            }

    #lang-tog,
    #nav {
        display: none
    }

    #contact-page.thanks-page #top-sec .left-col {
        margin-bottom: 20px
    }

    #contact-page.thanks-page #top-sec .right-col {
        padding: 0 !important
    }

    #contact-page.thanks-page #top-sec .left-col,
    #contact-page.thanks-page #top-sec .right-col {
        width: 100% !important
    }

    .insta-follow {
        margin-bottom: 8px !important
    }

    #banner {
        height: auto !important
    }

        #banner .banner-in .text-container {
            width: 100%;
            max-width: 100%;
            padding: 60px 0
        }

    #clients-strip {
        padding: 20px 0
    }

        #clients-strip .logos-out span img {
            max-width: 80% !important
        }

    .sec-pad {
        padding: 40px 0
    }

    #hm-page .title {
        margin-bottom: 10px
    }

    #clients-strip .title {
        margin-bottom: 30px
    }

    #secure-stable .cl-action-strip {
        margin-top: 35px
    }

    .cl-action-strip {
        padding: 22px 30px
    }

    #hm-page #what-is .video-outer {
        padding: 0 1%
    }

    #hm-page #spend-time .btn {
        margin-top: 20px
    }

    .desktop {
        display: none !important
    }

    .mobile {
        display: block !important
    }

    #features-slide {
        margin-top: 10px
    }

        #features-slide .slick-list {
            padding-top: 44px;
            direction: ltr
        }

        #features-slide .fslide {
            font-size: .9rem;
            background-color: #ffcb05;
            border-radius: 15px;
            padding: 25px 20px;
            padding-top: 0
        }

    body.rtl #features-slide .fslide {
        direction: rtl
    }

    #features-slide .fslide .icon {
        width: 80px;
        height: 80px;
        border-radius: 100%;
        background-color: #fff;
        display: block;
        margin: 0 auto;
        margin-top: -40px;
        -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .65);
        -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .65);
        box-shadow: 0 0 5px 0 rgba(0, 0, 0, .65)
    }

        #features-slide .fslide .icon img {
            display: inline-block;
            width: 44px;
            max-width: 44px !important;
            margin-top: 17px
        }

    #features-slide .fslide h3 {
        font-size: 1.2rem;
        margin: 20px 0 10px 0;
        text-transform: uppercase
    }

    #features-slide .fslide .img {
        margin-top: 15px
    }

        #features-slide .fslide .img img {
            width: 100% !important
        }

        #features-slide .fslide .img #video {
            width: 100%
        }

    #about-slide .slick-dots,
    #features-slide .slick-dots {
        text-align: center;
        bottom: -40px !important
    }

        #about-slide .slick-dots li,
        #features-slide .slick-dots li {
            display: inline-block;
            width: auto !important;
            height: auto !important;
            text-align: center;
            margin: 0 5px;
            margin-top: 20px !important
        }

            #about-slide .slick-dots li button,
            #features-slide .slick-dots li button {
                font-size: 0 !important;
                line-height: 0;
                display: block;
                width: 14px !important;
                height: 14px !important;
                padding: 0;
                border-radius: 100%;
                border: 2px solid #e2e2e2;
                cursor: pointer;
                color: #fff !important;
                outline: 0;
                background: #fff;
                text-indent: -9999px
            }

            #about-slide .slick-dots li.slick-active button,
            #features-slide .slick-dots li.slick-active button {
                background-color: #fdb415;
                border-color: #fdb415;
                color: #fdb415 !important
            }

    .slick-next,
    .slick-prev {
        width: 28px !important;
        height: 45px !important;
        background-size: 100% auto !important
    }

    .slick-next {
        right: -5px !important
    }

    .slick-prev {
        left: -5px !important
    }

    #request-form .intro {
        font-size: .95rem
    }

    #footer {
        padding: 35px 0;
        text-align: center
    }

        #footer .footer-in .col,
        #footer .footer-in .col.address {
            width: 100% !important;
            font-size: .85rem;
            padding-right: 0 !important;
            margin-bottom: 35px
        }

            #footer .footer-in .col.last {
                margin-bottom: 0
            }

        #footer .foot-logo {
            width: 100%;
            max-width: 100% !important;
            margin-bottom: 10px
        }

            #footer .foot-logo img {
                max-width: 50px !important
            }

        #footer .footer-in {
            float: left;
            width: 100%;
            margin: 0
        }

            #footer .footer-in .col .col-title,
            #footer .footer-in .col p {
                margin-bottom: 10px
            }

            #footer .footer-in .col .menu li {
                padding-bottom: 6px;
                font-size: .8rem
            }

    #bot-strip {
        padding: 25px 0
    }

        #bot-strip,
        #bot-strip .left,
        #bot-strip .right {
            text-align: center;
            width: 100%;
            font-size: .8rem
        }

    body.rtl #bot-strip .left {
        text-align: center
    }

    #bot-strip .right {
        margin-bottom: 10px
    }

    #bot-strip .social {
        width: 100%
    }

    #bot-strip .left p {
        margin: 10px 0 0 0
    }

    #bot-strip .left a {
        margin: 0 8px
    }

    body.rtl #bot-strip .left a {
        float: none
    }

    #tp-strip {
        padding: 40px 0
    }

        #tp-strip .title {
            font-size: 1.3rem
        }

    #contact-page #frm-add {
        padding: 40px 0
    }

    #tp-strip .intro {
        padding: 0 50px
    }

    .overlay-content {
        top: 3%
    }

    #contact-page #frm-add .container {
        padding: 0 20px
    }

    #contact-page #frm-add .frm-area {
        padding: 20px;
        padding-bottom: 15px
    }

    #contact-page #frm-add .address-area {
        padding: 10px 30px 20px 30px
    }

    body.rtl #contact-page #frm-add .address-area .row {
        padding: 6px 48px 0 0
    }

    #contact-page #frm-add .address-area .row {
        background-size: 35px auto;
        padding: 6px 0 0 48px
    }

        #contact-page #frm-add .address-area .row .phone {
            font-size: .95rem
        }

    #pricing-page #pricing-area .col {
        padding-top: 40px
    }

        #pricing-page #pricing-area .col.left .title {
            margin-top: 0;
            font-size: 1.2rem
        }

    #pricing-page #plans .box .tag {
        font-size: .6rem;
        width: 60px
    }

    #pricing-page #plans .box .cat img {
        max-width: 60px !important
    }

    #pricing-page #plans {
        margin-top: 10px
    }

        #pricing-page #plans .box .price {
            font-size: 1.4rem
        }

        #pricing-page #plans .box.shadow,
        #pricing-page .price-info .table.bottom .box.shadow {
            border-width: 3px
        }

    #pricing-page #pricing-area .enterprise .content {
        background-size: 45px auto;
        padding: 70px 0 0 0
    }

    #pricing-page #pricing-area .enterprise .cnt-strip .btn {
        padding: 12px 22px
    }

    #pricing-page #faq {
        padding: 40px 0
    }

        #pricing-page #faq .intro {
            padding: 0 10px;
            font-size: .9rem
        }

        #pricing-page #faq .title {
            margin-bottom: 15px
        }

        #pricing-page #faq .content .con {
            width: 47%
        }

        #pricing-page #faq .content {
            margin-top: 50px
        }

        #pricing-page #faq .title {
            font-size: 1.2rem
        }

    .tab-out-center {
        width: 250px;
        padding: 3px 4px
    }

    .switch {
        width: 242px;
        height: 40px
    }

    .tab-out-center .duration {
        height: 40px;
        font-size: .9rem;
        padding-top: 9px
    }

    .tab-out-center .off {
        font-size: .8rem;
        background-size: 40px auto;
        padding: 23px 0 0 35px;
        right: -120px;
        top: -20px;
        height: 45px
    }

    body.rtl .tab-out-center .off {
        font-size: .8rem;
        background-size: 40px auto;
        padding: 23px 0 0 35px;
        right: -161px;
        top: -20px;
        height: 45px
    }

    .tab-out-center .switch input {
        height: 40px
    }

    .tab-out-center .slider:before {
        height: 40px
    }

    .tab-out-center input:checked + .slider:before {
        -webkit-transform: translateX(119px);
        -ms-transform: translateX(119px);
        transform: translateX(119px)
    }

    #privacy-page #left-menu {
        top: 62px;
        width: 100%;
        padding: 0 0 10px 0;
        background-color: #fff
    }

        #privacy-page #left-menu h3 {
            display: none
        }

        #privacy-page #left-menu li {
            float: left;
            width: 50%;
            text-align: center
        }

            #privacy-page #left-menu li a {
                padding: 15px 17px;
                background-color: #f2f2f2;
                font-weight: 500
            }

    #privacy-page .right-col {
        width: 100%;
        padding: 70px 0 30px 0;
        line-height: 150%
    }

        #privacy-page .right-col h1.title {
            font-size: 1.4rem
        }

        #privacy-page .right-col h2 {
            font-size: 1.1rem
        }

        #privacy-page .right-col p {
            margin-bottom: 15px
        }

        #privacy-page .right-col .row {
            padding: 15px;
            margin: 12px 0
        }

            #privacy-page .right-col .row h3 {
                font-size: 1rem
            }

    #developers-page #tp-strip {
        padding: 35px 0
    }

    #tp-strip-whatnew #tp-strip {
        padding: 35px 0
    }

    #developers-page #tp-strip .title {
        font-size: 2.2rem;
        margin: 0
    }

    #developers-page #tp-strip .subtitle {
        font-size: 1.2rem
    }

    #developers-page #top-sec {
        padding: 40px 0;
        text-align: center
    }

        #developers-page #top-sec .subtitle {
            margin-bottom: 20px
        }

        #developers-page #top-sec .col {
            width: 100%
        }

            #developers-page #top-sec .col p {
                margin-bottom: 20px
            }

                #developers-page #top-sec .col p:last-child {
                    margin-bottom: 20px !important
                }

            #developers-page #top-sec .col.right p:last-child {
                margin-bottom: 0 !important
            }

    #developers-page .notice {
        padding: 25px 0
    }

    #developers-page #expect .col {
        width: 100% !important;
        padding: 0 !important;
        text-align: center;
        margin-bottom: 35px
    }

        #developers-page #expect .col span {
            float: left;
            width: 100%
        }

            #developers-page #expect .col span br {
                display: none
            }

            #developers-page #expect .col span strong {
                font-size: 2.5rem;
                margin-bottom: 14px;
                padding-right: 0;
                width: 100%;
                text-align: center
            }

    #developers-page #expect .subtitle {
        margin-bottom: 35px
    }

    #developers-page #expect {
        padding: 35px 0 15px 0
    }

    #developers-page #form-area .box.left {
        width: 100%;
        border: none !important
    }

    #developers-page #form-area .box.right {
        padding: 0;
        width: 100%
    }

    #developers-page .cl-action-strip {
        padding: 20px 0
    }

        #developers-page .cl-action-strip .left {
            font-size: 1.3rem;
            padding-right: 10px
        }

        #developers-page .cl-action-strip .right {
            padding-left: 10px
        }

        #developers-page .cl-action-strip .btn {
            padding: 17px 35px;
            font-size: 1rem
        }

    #about-slide {
        margin-top: 30px;
        padding-bottom: 20px
    }
}

@media only screen and (max-width:991px) {
    #whatsnew-page .left-section {
        float: left;
        width: 30%;
        margin: 0 2% 30px 0;
    }

    #whatsnew-page .right-section {
        box-sizing: border-box;
        float: right;
        width: 68%;
        padding-left: 10%;
        text-align: left;
    }
}

@media only screen and (max-width:767px) {
    #whatsnew-page .mobile-left h3 {
        float: left;
    }

    body.rtl #whatsnew-page .mobile-left h3 {
        float: right;
    }

    #whatsnew-page .mobile-left p {
        float: right;
        font-size: 13px;
    }

    #whatsnew-page .sticky .mobile-left {
        display: block;
        float: left;
        width: 100%;
        display: inline-block;
        padding: 14px 20px;
        height: 50px;
        border-bottom: 1px solid #f2f2f2;
    }

    #whatsnew-page .tabs.sticky {
        position: fixed;
        top: 0;
        z-index: 9999999;
        max-width: 100%;
        margin-top: 0;
        background: #FFF;
        display: block;
        width: 100%;
        left: 0;
        padding-top: 10px;
        right: 0;
        padding: 0px 0;
    }

    .tabs.sticky .filter-tab {
        margin-bottom: 0;
        text-align: center;
        padding: 14px 0;
    }

    #whatsnew-page .filter-tab li {
        margin-right: 0;
        font-size: 16px;
        cursor: pointer;
        display: inline-block;
        padding: 0 12px;
    }

    #whatsnew-page .filter-tab {
        text-align: center;
        margin: 0 0 0 0;
    }

    #whatsnew-page {
        display: flex;
        flex-wrap: wrap;
        margin: 20px 0 0 0;
    }

    body.rtl #whatsnew-page .subscription-box .g-recaptcha {
        transform: initial !important;
        -webkit-transform: initial !important;
        margin-bottom: 6px !important;
        margin-right: 0px !important;
    }

    #whatsnew-page .subscription-box .g-recaptcha {
        transform: initial !important;
        -webkit-transform: initial !important;
        margin-bottom: 6px !important;
        margin-right: 0px !important;
    }

    #whatsnew-page .event-category-year-wrap .event-category-wrap:last-child .event-category:last-child:after {
        display: none;
    }

    #whatsnew-page .event-category-year-wrap {
        margin-bottom: 0px;
    }

    #whatsnew-page .tabs {
        width: 100%;
    }

    #whatsnew-page .left-section {
        display: none !important;
        order: 2;
        float: left;
        width: 100%;
        margin: 0 0 30px 0;
    }

    .rtl #whatsnew-page .subscription-box {
        margin: 0px 0 20px;
        width: 100%;
        padding: 30px 20px;
    }

    #whatsnew-page .left-section h3, #whatsnew-page .accodian {
        display: none;
    }

    #whatsnew-page .subscription-box {
        margin: 0 0 20px;
        width: 100%;
    }

    .rtl #whatsnew-page .right-section {
        padding: 0;
    }

    .rtl #whatsnew-page .event-category {
        margin-right: 0;
    }

    .rtl #whatsnew-page .content-box {
        padding-right: 0;
    }

    #whatsnew-page .event-category-year-wrap > h2, #whatsnew-page .left-section, .event-category-wrap > h3, #whatsnew-page .event-category-year-wrap:after,
    #whatsnew-page .event-category-year-wrap:before {
        display: none;
    }

    .rtl #whatsnew-page .left-section {
        float: right;
        width: 100%;
        margin: 0 0 30px 0;
    }

    #whatsnew-page .right-section {
        box-sizing: border-box;
        float: right;
        width: 100%;
        padding-left: 0%;
        text-align: left;
        order: 1;
    }

    #whatsnew-page .event-category-year-wrap > h2 {
        margin-left: -40px;
        font-size: 16px;
        line-height: 35px;
    }

    #whatsnew-page .event-category-wrap > h3 {
        position: absolute;
        left: -27px;
        top: 15px;
        width: 52px;
        font-size: 14px;
        line-height: 33px;
    }

        #whatsnew-page .event-category-wrap > h3:after {
            right: 0px;
        }

    #whatsnew-page .event-category {
        margin-left: 0px;
    }

    .insta-follow {
        margin-bottom: 5px !important;
        padding: 14px 13px !important
    }

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

    .mr-bot-50 {
        margin-bottom: 30px !important
    }

    .btn,
    button,
    input[type=submit] {
        font-size: .8rem;
        padding: 13px 18px
    }

    #head-out {
        height: 62px
    }

    #header {
        padding: 13px 0
    }

    #menu li.lan a {
        margin-right: 8px;
        font-size: .85rem
    }

        #menu li.lan a img {
            margin-right: 5px;
            max-width: 18px !important
        }

        #menu li.lan a.en {
            width: 126px
        }

        #menu li.lan a.ar {
            width: 100px;
            margin-right: 0
        }

    body.rtl #menu li.lan a {
        margin-left: 8px
    }

        body.rtl #menu li.lan a.ar {
            margin-left: 0
        }

        body.rtl #menu li.lan a img {
            margin-left: 5px
        }

    .container {
        padding: 0 24px
    }

    #header .container {
        padding-left: 15px
    }

    #header .logo img {
        width: 160px
    }

    #banner .banner-in .text-container {
        padding: 40px 0;
        font-size: 1.05rem
    }

    #banner h1 {
        font-size: 1.6rem
    }

    #clients-strip .logos-out span {
        padding: 0 15px
    }

        #clients-strip .logos-out span img {
            max-width: 90% !important
        }

    #clients-strip .title {
        margin-bottom: 20px;
        font-size: .85rem;
        line-height: 130%
    }

    .sec-pad {
        padding: 30px 0
    }

    #banner p {
        font-weight: 400
    }

    #banner .button-group .btn {
        margin-left: 5px;
        padding: 14px 18px;
        font-size: .75rem
    }

    #hm-page .title {
        font-size: 1rem;
        line-height: 140%;
        padding: 0 5px
    }

    #hm-page .intro {
        font-size: .8rem
    }

    #features-slide .fslide .icon {
        width: 60px;
        height: 60px;
        margin-top: -27px
    }

        #features-slide .fslide .icon img {
            width: 30px;
            max-width: 30px !important;
            margin-top: 15px
        }

    #features-slide .fslide h3 {
        font-size: 1rem;
        margin: 20px 0 10px 0;
        text-transform: uppercase
    }

    #features-slide .fslide .img {
        margin-top: 15px
    }

    #features-slide .slick-list {
        padding-top: 30px
    }

    #features-slide .fslide {
        font-size: .8rem;
        line-height: 140%;
        padding: 10px 10px;
        padding-top: 0
    }

        #features-slide .fslide p {
            padding: 0 5px
        }

        #features-slide .fslide .img {
            margin-top: 10px
        }

    #about-slide .slick-dots,
    #features-slide .slick-dots {
        text-align: center;
        bottom: -35px !important
    }

        #about-slide .slick-dots li,
        #features-slide .slick-dots li {
            margin: 0 3px
        }

        #about-slide .slick-dots li {
            margin: 0 5px
        }

            #about-slide .slick-dots li button,
            #features-slide .slick-dots li button {
                width: 10px !important;
                height: 10px !important
            }

    #secure-stable {
        padding-left: 24px;
        padding-right: 24px
    }

        #secure-stable .three-col {
            margin-top: 30px;
            border: none
        }

            #secure-stable .three-col .col {
                border: none;
                padding: 0 32px
            }

                #secure-stable .three-col .col .img img {
                    max-height: 70px !important
                }

                #secure-stable .three-col .col .img {
                    height: 70px
                }

    .slick-next,
    .slick-prev {
        width: 20px !important;
        height: 32px !important;
        top: 20% !important
    }

    .slick-next {
        right: -8px !important
    }

    .slick-prev {
        left: -8px !important
    }

    #secure-stable .three-col .col h4 {
        height: auto;
        overflow: visible;
        margin-bottom: 6px
    }

    #secure-stable .cl-action-strip {
        margin-top: 20px;
        text-align: center
    }

    .cl-action-strip .left,
    .cl-action-strip .right {
        width: 100%;
        text-align: center
    }

    .cl-action-strip .left {
        font-size: .9rem;
        line-height: 1.2rem;
        margin-bottom: 15px
    }

    #hm-page #what-is .container {
        padding: 0
    }

    #hm-page #what-is .intro,
    #hm-page #what-is .title {
        padding: 0 20px
    }

    #hm-page #what-is .intro {
        font-size: .85rem;
        margin: 0
    }

    #hm-page #what-is .video-outer {
        padding: 0 0
    }

    #hm-page #spend-time .btn {
        margin-top: 5px;
        font-weight: 500
    }

    #testi .testimonials .slick-next,
    #testi .testimonials .slick-prev {
        top: 50% !important
    }

    #testi .box {
        padding: 15px 0 40px 0
    }

        #testi .box .boxin:before {
            font-size: 180px;
            left: 10px;
            top: -35px;
            z-index: 999999;
            display: none
        }

        #testi .box .boxin {
            padding: 25px 25px 80px 25px;
            font-size: .9rem
        }

        #testi .box .img img {
            width: 80px !important;
            height: 80px !important
        }

        #testi .box .tst {
            height: auto !important
        }

    #request-form {
        background-position: left top;
        padding: 0 !important
    }

        #request-form .bound {
            padding: 30px 20px 20px 20px;
            float: left;
            width: 100%;
            background-color: rgba(256, 256, 256, .8)
        }

        #request-form .intro {
            margin-bottom: 25px
        }

        #request-form form .hundred .col {
            width: 100%
        }

            #request-form form .hundred,
            #request-form form .hundred .col.left {
                margin-bottom: 15px
            }

        #request-form form input[type=date],
        #request-form form input[type=email],
        #request-form form input[type=number],
        #request-form form input[type=tel],
        #request-form form input[type=text],
        #request-form form select,
        #request-form form textarea {
            padding: 6px 15px;
            height: 50px;
            font-size: .85rem
        }

            #request-form form input[type=date]:focus,
            #request-form form input[type=email]:focus,
            #request-form form input[type=number]:focus,
            #request-form form input[type=tel]:focus,
            #request-form form input[type=text]:focus,
            #request-form form select:focus,
            #request-form form textarea:focus {
                padding: 6px 15px
            }

        #request-form form input[type=submit] {
            padding: 16px 27px
        }

    #footer .btn {
        padding: 13px 17px
    }

    #tp-strip {
        padding: 20px 0
    }

    #tp-strip-whatnew {
        padding: 27px 0
    }

    #tp-strip .title {
        font-size: 1rem;
        padding: 0 5px;
        line-height: 140%
    }

    #tp-strip-whatnew .title, #tp-strip-whatnew .subtitle {
        font-weight: 400;
        font-size: 18px;
        text-shadow: 0px 2px #fff;
        padding: 3px 0;
    }

    #tp-strip .intro {
        padding: 0 0;
        font-size: .85rem
    }

    #contact-page #frm-add {
        padding: 30px 0
    }

    .overlay #tp-strip .title {
        font-size: 1.2rem
    }

    .overlay-content {
        top: 1%
    }

    .overlay .closebtn {
        font-size: 2.5rem;
        top: 4px;
        right: 17px
    }

    .overlay #contact-page #frm-add {
        padding: 0
    }

    #contact-page form input[type=date],
    #contact-page form input[type=email],
    #contact-page form input[type=number],
    #contact-page form input[type=tel],
    #contact-page form input[type=text],
    #contact-page form select,
    #contact-page form textarea {
        padding: 6px 15px;
        height: 45px
    }

    #testi .title {
        margin-bottom: 10px;
        font-size: 1rem
    }

    #contact-page #testi .title {
        margin-top: 10px
    }

    #contact-page #frm-add .address-area,
    #contact-page #frm-add .frm-area {
        width: 100%
    }

    #contact-page #frm-add .address-area {
        padding: 0;
        margin-top: 30px
    }

        #contact-page #frm-add .address-area .row {
            background-size: 30px auto;
            padding: 5px 0 0 44px;
            font-size: .8rem;
            margin-bottom: 25px
        }

    body.rtl #contact-page #frm-add .address-area .row {
        padding: 5px 44px 0 0
    }

    #contact-page #frm-add .address-area .row h4 {
        font-size: 1rem;
        margin-bottom: 5px
    }

    #contact-page #frm-add .address-area .row p {
        margin-bottom: 5px;
        line-height: 150%
    }

    #contact-page #frm-add .address-area .row .phone {
        font-size: .9rem;
        background-size: 20px auto;
        padding: 0 0 5px 27px
    }

    body.rtl #contact-page #frm-add .address-area .row .phone {
        padding: 0 27px 5px 0
    }

    .tab-out-center {
        width: 250px;
        padding: 3px 4px
    }

    .switch {
        width: 242px;
        height: 40px
    }

    .tab-out-center .duration {
        height: 40px;
        font-size: .9rem;
        padding-top: 9px
    }

    .tab-out-center .off {
        font-size: .8rem;
        background-size: 40px auto;
        padding: 23px 0 0 35px;
        right: -120px;
        top: -20px;
        height: 45px
    }

    .tab-out-center .switch input {
        height: 40px
    }

    .tab-out-center .slider:before {
        height: 40px
    }

    .tab-out-center input:checked + .slider:before {
        -webkit-transform: translateX(119px);
        -ms-transform: translateX(119px);
        transform: translateX(119px)
    }

    #pricing-page #pricing-area .col {
        padding-top: 30px
    }

        #pricing-page #pricing-area .col .tab-out-center.mr-top-50 {
            margin-top: 70px !important
        }

        #pricing-page #pricing-area .col .tab-out-center.mr-bot-50 {
            margin-bot: 10px !important
        }

    .tab-out-center .off {
        background-image: url(../images/arrow-right.png);
        background-position: right 5px;
        padding: 23px 30px 0 0;
        right: 58px;
        top: -53px;
        height: 45px
    }

    body.rtl .tab-out-center .off {
        background-image: url(../images/arrow-right.png);
        background-position: right 5px;
        padding: 23px 30px 0 0;
        right: 58px;
        top: -53px;
        height: 45px
    }

    #pricing-page #plans {
        margin-top: 0
    }

        #pricing-page #plans #price-nav {
            display: block;
            background-color: #000
        }

            #pricing-page #plans #price-nav li {
                float: left;
                width: 33.33%;
                padding: 11px 10px;
                border-left: 1px solid #555;
                font-size: .85rem;
                font-weight: 600;
                color: #fff;
                cursor: pointer;
                -webkit-transition: all .3s linear;
                -moz-transition: all .3s linear;
                -o-transition: all .3s linear;
                -ms-transition: all .3s linear;
                transition: all .3s linear
            }

                #pricing-page #plans #price-nav li:first-child {
                    border: none !important
                }

                #pricing-page #plans #price-nav li.current {
                    background-color: #ffcb05;
                    color: #000
                }

        #pricing-page #plans .box.tab-box {
            width: 100% !important;
            display: none
        }

            #pricing-page #plans .box.tab-box.current {
                display: block
            }

        #pricing-page #plans .box.tab-box {
            border-top: 1px solid #3d3d3d;
            padding: 25px;
            font-size: .85rem
        }

            #pricing-page #plans .box.tab-box.shadow {
                box-shadow: none;
                padding-top: 55px;
                border-top: 0 !important
            }

            #pricing-page #plans .box.tab-box .tag {
                width: 100%;
                text-align: center;
                padding: 12px 10px !important;
                font-size: .8rem;
                background-color: rgba(255, 203, 5, .6);
                color: #000
            }

            #pricing-page #plans .box.tab-box .use {
                margin-top: 15px
            }

            #pricing-page #plans .box .btn,
            #pricing-page #plans .box.tab-box .des {
                margin-top: 25px
            }

            #pricing-page #plans .box.tab-box .btn {
                padding: 13px 26px
            }

    #pricing-page .price-info {
        display: none
    }

    #pricing-page #plans .box .price-info {
        margin-left: -25px;
        margin-right: -25px;
        float: none !important;
        width: auto !important;
        display: block
    }

    #pricing-page .price-info .table.top {
        margin-top: 20px;
        border-bottom: 0
    }

    #pricing-page .price-info .table.bottom {
        border-bottom: 0
    }

    #pricing-page #plans .price-info .box {
        padding: 20px 20px 10px 20px;
        line-height: 130%
    }

        #pricing-page #plans .price-info .box.shadow {
            border: none;
            box-shadow: none
        }

    #pricing-page #pricing-area .col .title {
        font-size: 1.2rem
    }

    #pricing-page #pricing-area .enterprise .content .con {
        padding: 0 15px;
        font-size: .67rem
    }

        #pricing-page #pricing-area .enterprise .content .con .row h4 {
            font-size: .7rem
        }

    .enterprise .content .con .row .img img {
        max-width: 32px !important
    }

    #pricing-page #pricing-area .enterprise .content {
        background-size: 35px auto;
        padding: 45px 0 0 0
    }

    #pricing-page #pricing-area .enterprise .subtitle {
        font-size: .8rem;
        line-height: 130%
    }

    #pricing-page .price-info .table.bottom .box li {
        padding-bottom: 15px
    }

    #pricing-page .price-info .table.bottom .box .heading {
        margin-bottom: 15px;
        font-size: .75rem
    }

    #pricing-page #pricing-area .enterprise .cnt-strip span {
        margin: 0 10px
    }

    #pricing-page #pricing-area .enterprise .cnt-strip .btn {
        padding: 11px 19px;
        font-size: .75rem
    }

    #pricing-page #pricing-area .enterprise .bot {
        padding: 20px 30px 0 30px
    }

        #pricing-page #pricing-area .enterprise .bot.numbers {
            padding: 20px 2px 0 2px
        }

            #pricing-page #pricing-area .enterprise .bot.numbers .table span {
                padding: 7px;
                font-size: .67rem
            }

                #pricing-page #pricing-area .enterprise .bot.numbers .table span strong {
                    font-size: 1rem;
                    letter-spacing: .9px;
                    margin-bottom: 5px
                }

    #pricing-page #faq {
        padding: 30px 0 25px 0
    }

        #pricing-page #faq .title {
            font-size: 1.1rem
        }

        #pricing-page #faq .intro {
            padding: 0 0;
            font-size: .82rem;
            line-height: 140%
        }

        #pricing-page #faq .content {
            margin-top: 30px
        }

            #pricing-page #faq .content .con {
                width: 100%;
                float: left;
                display: block
            }

                #pricing-page #faq .content .con .row {
                    margin-bottom: 18px !important;
                    line-height: 160%
                }

                #pricing-page #faq .content .con.right .row:last-child {
                    margin-bottom: 0 !important;
                    border: none !important
                }

                #pricing-page #faq .content .con .row h4 {
                    margin-bottom: 5px
                }

    #contact-page #frm-add .frm-area .title {
        font-size: 1.1rem;
        margin-bottom: 15px;
        margin-top: 10px
    }

    #contact-page form .hundred {
        margin-bottom: 10px
    }

    #contact-page.thanks-page #testi {
        margin-top: 25px
    }

    #developers-page #top-sec .col p {
        margin-bottom: 15px
    }

        #developers-page #top-sec .col p:last-child {
            margin-bottom: 15px !important
        }

    #developers-page #top-sec .col.right p:last-child {
        margin-bottom: 0 !important
    }

    #developers-page #tp-strip {
        padding: 27px 0
    }

    #tp-strip-whatnew #tp-strip {
        padding: 27px 0
    }

    #developers-page #tp-strip .title {
        font-size: 2rem;
        margin: 0
    }

    #developers-page #tp-strip .subtitle {
        font-size: 1.1rem
    }

    #developers-page #top-sec {
        padding: 35px 0
    }

        #developers-page #top-sec .subtitle {
            font-size: 1.3rem
        }

    #developers-page .notice {
        font-size: .85rem;
        padding-left: 20px;
        padding-right: 20px
    }

    #developers-page #expect .subtitle {
        font-size: 1.3rem
    }

    #developers-page #form-area .box.left .table .col {
        padding: 40px 15px
    }

    #developers-page #form-area form {
        padding: 30px 20px
    }

    #developers-page #form-area .box.right .subtitle {
        font-size: 1.25rem;
        margin-bottom: 20px
    }

    #developers-page #form-area form .hundred .con {
        width: 100%
    }

        #developers-page #form-area form .hundred .con.fleft {
            margin-bottom: 10px
        }

    #developers-page #form-area form .hundred input,
    #developers-page #form-area form .hundred textarea {
        font-size: .95rem;
        padding: 10px 15px
    }

        #developers-page #form-area form .hundred input[type=submit] {
            border: 1px solid #ffcb05;
            padding: 11px 40px
        }

    #developers-page #form-area .box.left .subtitle {
        margin: 35px 0 20px 0
    }

    #developers-page .cl-action-strip {
        padding: 25px 0
    }

        #developers-page .cl-action-strip .left,
        body.rtl #developers-page .cl-action-strip .left {
            width: 100%;
            font-size: 1.1rem;
            float: left;
            padding: 0;
            margin-bottom: 15px;
            text-align: center
        }

        #developers-page .cl-action-strip .right,
        body.rtl #developers-page .cl-action-strip .right {
            width: 100%;
            float: left;
            padding: 0;
            text-align: center
        }

        #developers-page .cl-action-strip .btn {
            padding: 14px 28px;
            font-size: .9rem
        }

    #about-slide {
        margin: 30px 0;
        padding-bottom: 0
    }

    .float {
        right: 15px !important;
        bottom: 15px !important;
        width: 52px !important;
        height: 52px !important;
        font-size: 26px !important
    }

    .my-float {
        margin-top: 14px !important
    }

    #about-slide .box {
        font-size: .82rem
    }

        #about-slide .box h4 {
            font-size: 1.1rem;
            margin: 17px 0 8px 0
        }

    body.rtl #header .container {
        padding-right: 15px
    }
}

@media only screen and (max-width:362px) {
    #banner .button-group .btn {
        margin-left: 2px;
        padding: 12px 13px
    }

    #banner .banner-in .text-container {
        padding: 30px 0
    }

    .container {
        padding: 0 20px
    }

    #menu li.lan {
        padding: 15px 17px
    }

        #menu li.lan a {
            margin-right: 8px;
            font-size: .8rem
        }

            #menu li.lan a img {
                margin-right: 3px;
                max-width: 16px !important
            }

            #menu li.lan a.en {
                width: 110px
            }

            #menu li.lan a.ar {
                width: 95px
            }

            #menu li.lan a b {
                margin-right: 3px
            }

    body.rtl #menu li.lan a img {
        margin-left: 3px
    }
}

.lazyloading {
    min-height: 50px !important;
    opacity: 1;
    background: url(../images/loading.svg) no-repeat center
}

.lazyload {
    opacity: 0
}

img.lazyload:not([src]) {
    visibility: hidden
}

#contact-page.thanks-page #top-sec {
    padding: 40px 0
}

    #contact-page.thanks-page #top-sec .left-col {
        float: left;
        width: 62%
    }

    #contact-page.thanks-page #top-sec .right-col {
        float: right;
        width: 38%;
        padding-left: 40px
    }

.insta-follow {
    background-color: #000;
    color: #fff;
    text-align: center;
    line-height: 120%;
    font-size: 1rem;
    padding: 22px 20px;
    margin-bottom: 18px
}

    .insta-follow span {
        background: url(../images/insta-white.svg) left center no-repeat;
        min-height: 20px;
        display: inline-block;
        background-size: 20px auto;
        padding: 0 0 0 28px
    }

.instagram_gallery a {
    float: left;
    width: 33.33%;
    padding: 2px
}

body.rtl #contact-page.thanks-page #top-sec .left-col {
    float: right
}

body.rtl #contact-page.thanks-page #top-sec .right-col {
    float: left;
    padding-left: 0;
    padding-right: 40px
}

.errorpage {
    padding: 20px
}

.call,
.phone {
    direction: ltr
}

.inlinecallanchortag {
    direction: ltr;
    display: inline
}

.callinlinebtn {
    direction: ltr;
    display: inline-block;
    padding-left: 5px
}

.contentinliine {
    display: inline-block
}

body.rtl .event-category-year-wrap .event-category-wrap:last-child .event-category:last-child:after {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    border: 1px solid #5d7ce2;
    border-radius: 100%;
    bottom: 15px;
    /* left: -45px; */
    background: #5d7ce2;
    z-index: 1;
}

.event-category-year-wrap .event-category-wrap:last-child .event-category:last-child:after {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    border: 1px solid #5d7ce2;
    border-radius: 100%;
    bottom: 0px;
    left: 15px;
    background: #5d7ce2;
    z-index: 1;
}

.nofRecordMessage {
    color: red;
    text-align: left;
}

body.rtl .nofRecordMessage {
    text-align: right;
}

.subscription-box .g-recaptcha {
    transform: scale(0.7);
    -webkit-transform: scale(0.7);
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    max-width: 180px;
}

body.rtl .subscription-box .g-recaptcha {
    transform: scale(0.7);
    -webkit-transform: scale(0.7);
    transform-origin: initial;
    -webkit-transform-origin: initial;
    max-width: 180px;
    margin-right: -30px;
}

body.rtl .capchaParentdiv {
    float: right;
}

#subscriptionForm .message {
    width: 100%;
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
    display: none;
    float: left;
}

#subscriptionForm .alert-danger {
    color: #721c24 !important;
    background-color: #f8d7da !important;
    border-color: #f5c6cb !important;
}

.event-series {
    position: relative;
    box-sizing: border-box;
    text-align: left;
    max-height: 680px;
    overflow-y: hidden;
    overflow-x: hidden;
}

    .event-series.disabled:before {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        background: rgba(255, 255, 255, 0.8);
        z-index: 999;
    }

body.rtl .event-series.disabled:before {
    right: 0px;
}

#whatsnew-page .panel a.active {
    border: none;
    font-weight: bold;
}

body.rtl .event-series.disabled:before {
    right: 0px;
}

body.rtl #nav li.call a {
    background-position: right 15px !important;
    padding: 16px 32px 18px 10px;
}

    body.rtl #nav li.call a span {
        float: right;
    }

#pricing-page #plans .box.big {
    width: 66.66%;
}

#pricing-page #plans .box.small {
    width: 33.33%;
}

body.rtl #pricing-page #plans .box.big {
    float: right;
}

#pricing-page .price-info .table.bottom .box.shadow.shadow-left-none {
    border-left: 0px;
}

#pricing-page .price-info .table.bottom .box.shadow.shadow-right-none {
    border-right: 0px;
}

body.rtl #pricing-page .price-info .table.bottom .box.shadow.shadow-left-none {
    border-right: 0px;
    border-left: 4px solid #3d3d3d;
}

body.rtl #pricing-page .price-info .table.bottom .box.shadow.shadow-right-none {
    border-left: 0px;
    border-right: 4px solid #3d3d3d;
}