@import url(https://fonts.googleapis.com/css?family=Nunito:200,300,400,700,800,900);
@import url(https://fonts.googleapis.com/css?family=Merriweather:300,400,700,900);

* {
    font-family: 'Nunito', sans-serif
}

body {
    font-family: 'Nunito', sans-serif;
    font-size: 14px
}

.wrapper {
    overflow-x: hidden
}

@media screen and (max-width:768px) {
    .wrapper {
        overflow-x: hidden
    }
}
}

h1,
h2,
h3,
h4,
h5 {
    font-family: 'Merriweather', serif
}

.no_padding {
    padding: 0 !Important
}

.no_right_padding {
    padding-right: 0 !Important
}

.no_left_padding {
    padding-left: 0 !Important
}

.no_leftright_padding {
    padding-right: 0 !Important;
    padding-left: 0 !Important
}

.no_bottom_padding {
    padding-bottom: 0 !Important
}

.no_top_padding {
    padding-top: 0 !Important
}

.no_margin {
    margin: 0 !Important
}

.no_right_margin {
    margin-right: 0 !Important
}

.no_left_margin {
    margin-left: 0 !Important
}

.no_bottom_margin {
    margin-bottom: 0 !Important
}

.no_top_margin {
    margin-top: 0 !Important
}

.btn-ltblu {
    color: #fff;
    background-color: #013758;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    border-radius: 0;
    border: 2px solid #013758
}

.btn-ltblu:hover,
.btn-ltblu:focus,
.btn-ltblu:active,
.btn-ltblu.active,
.open .dropdown-toggle.btn-ltblue {
    color: #fff;
    background-color: #013758;
    border-color: #013758
}

.btn-ltblue {
    color: #fff;
    background-color: #013758;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    border-radius: 0;
    border: 2px solid #013758
}

.btn-ltblue:hover,
.btn-ltblue:focus,
.btn-ltblue:active,
.btn-ltblue.active,
.open .dropdown-toggle.btn-ltblue {
    color: #024f7d;
    background-color: transparent;
    border-color: #024f7d
}

.btn-ltblue:active,
.btn-ltblue.active,
.open .dropdown-toggle.btn-ltblue {
    background-image: none
}

.btn-ltblue.disabled,
.btn-ltblue[disabled],
fieldset[disabled] .btn-ltblue,
.btn-ltblue.disabled:hover,
.btn-ltblue[disabled]:hover,
fieldset[disabled] .btn-ltblue:hover,
.btn-ltblue.disabled:focus,
.btn-ltblue[disabled]:focus,
fieldset[disabled] .btn-ltblue:focus,
.btn-ltblue.disabled:active,
.btn-ltblue[disabled]:active,
fieldset[disabled] .btn-ltblue:active,
.btn-ltblue.disabled.active,
.btn-ltblue[disabled].active,
fieldset[disabled] .btn-ltblue.active {
    background-color: #625C6B;
    border-color: #1C00A8
}

.btn-ltblue .badge {
    color: #625C6B;
    background-color: #fff
}

.btn-ltwhite {
    color: #013758;
    background-color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    border-radius: 0;
    border: 2px solid #fff
}

.btn-ltwhite:hover,
.btn-ltwhite:focus,
.btn-ltwhite:active,
.btn-ltwhite.active,
.open .dropdown-toggle.btn-ltwhite {
    color: #fff;
    background-color: transparent;
    border-color: #fff
}

.btn-ltgreen {
    color: #fff;
    background-color: #8bc34a;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    border-radius: 0;
    border: 2px solid #8bc34a
}

.btn-ltgreen:hover,
.btn-ltgreen:focus,
.btn-ltgreen:active,
.btn-ltgreen.active,
.open .dropdown-toggle.btn-ltgreen {
    color: #8bc34a;
    background-color: transparent;
    border-color: #8bc34a
}

.btn-line {
    color: #337ab7;
    background-color: transparent;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    border-radius: 0;
    border: 2px solid #337ab7;
    min-width: 120px;
    margin: 0 15px
}

.btn-line:hover,
.btn-line:focus,
.btn-line:active,
.btn-line.active,
.open .dropdown-toggle.btn-line {
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7
}

.btn-line:active,
.btn-line.active,
.open .dropdown-toggle.btn-line {
    background-image: none
}

.btn_120px {
    min-width: 120px;
    margin: 0 15px
}

@media (max-width:768px) {
    .btn_120px {
        min-width: 120px;
        margin: 2px 15px
    }
}

.fixed_bar {
    border-top: 1px solid#f3f3f3
}

.ltit_navbar {
    position: relative;
    padding-top: 25px;
    padding-right: 0;
    padding-left: 0
}

@media screen and (max-width:768px) {
    .ltit_navbar {
        position: relative;
        padding-top: 0;
        padding-right: 0;
        padding-left: 0
    }
}

#cssmenu {
    float: right
}

#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    line-height: 1;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    z-index: 1
}

#cssmenu:after,
#cssmenu > ul:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0
}

#cssmenu #menu-button {
    display: none
}

#cssmenu {
    width: auto;
    font-family: 'Open Sans', sans-serif;
    line-height: 1;
    background: transparent
}

#menu-line {
    position: absolute;
    top: 0;
    left: 0
}

#cssmenu > ul > li {
    float: left
}

#cssmenu.align-center > ul {
    font-size: 0;
    text-align: center
}

#cssmenu.align-center > ul > li {
    display: inline-block;
    float: none
}

#cssmenu.align-center ul ul {
    text-align: left
}

#cssmenu.align-right > ul > li {
    float: right
}

#cssmenu.align-right ul ul {
    text-align: right
}

#cssmenu > ul > li > a {
    padding: 20px;
    font-size: 15px;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
    color: #000;
    -webkit-transition: color .2s ease;
    -moz-transition: color .2s ease;
    -ms-transition: color .2s ease;
    -o-transition: color .2s ease;
    transition: color .2s ease
}

#cssmenu > ul > li:hover > a,
#cssmenu > ul > li.active > a {
    color: #009ae1
}

#cssmenu > ul > li.has-sub > a {
    padding-right: 25px
}

#cssmenu > ul > li.has-sub > a::after {
    position: absolute;
    top: 21px;
    right: 10px;
    width: 4px;
    height: 4px;
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
    content: "";
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: border-color 0.2s ease;
    -moz-transition: border-color 0.2s ease;
    -ms-transition: border-color 0.2s ease;
    -o-transition: border-color 0.2s ease;
    transition: border-color 0.2s ease
}

#cssmenu > ul > li.has-sub:hover > a::after {
    border-color: #009ae1
}

#cssmenu ul ul {
    position: absolute;
    left: -9999px
}

#cssmenu li:hover > ul {
    left: auto
}

#cssmenu.align-right li:hover > ul {
    right: 0
}

#cssmenu ul ul ul {
    margin-left: 100%;
    top: 0
}

#cssmenu.align-right ul ul ul {
    margin-left: 0;
    margin-right: 100%
}

@media screen and (min-width:968px) and (max-width:1199px){
#cssmenu ul ul ul {
    margin-left: -100%!Important;
    top: 0;
}

#cssmenu.align-right ul ul ul {
    position: absolute;
    right: -90px;
}

}
@media screen and (min-width:1200px) and (max-width:1366px){
#cssmenu ul ul ul {
    margin-left: -100%!Important;
    top: 0;
}

#cssmenu.align-right ul ul ul {
    position: absolute;
    right: -90px;
}

}

#cssmenu ul ul li {
    height: 0;
    -webkit-transition: height .2s ease;
    -moz-transition: height .2s ease;
    -ms-transition: height .2s ease;
    -o-transition: height .2s ease;
    transition: height .2s ease
}

#cssmenu ul li:hover > ul > li {
    height: 50px
}

#cssmenu ul ul li a {
    padding: 10px 20px;
    width: 270px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 900;
    background: #333;
    text-decoration: none;
    color: #ddd;
    -webkit-transition: color .2s ease;
    -moz-transition: color .2s ease;
    -ms-transition: color .2s ease;
    -o-transition: color .2s ease;
    transition: color .2s ease;
    bottom: -14px;
    height: 50px;
    line-height: 2;
    border-right: 15px solid#333;
    border-left: 15px solid#333
}

#cssmenu ul ul li:hover > a,
#cssmenu ul ul li a:hover {
    background-color: #42c0e5;
    color: #fff;
    border-right: 15px solid#333;
    border-left: 15px solid#333
}

#cssmenu.align-right ul ul li.has-sub > a::after {
    right: auto;
    left: 10px;
    border-bottom: 0;
    border-right: 0;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd
}

#cssmenu ul ul li.has-sub:hover > a::after {
    border-color: #fff
}

@media all and (max-width:768px),
only screen and (-webkit-min-device-pixel-ratio:2) and (max-width:1024px),
only screen and (min--moz-device-pixel-ratio:2) and (max-width:1024px),
only screen and (-o-min-device-pixel-ratio:2/1) and (max-width:1024px),
only screen and (min-device-pixel-ratio:2) and (max-width:1024px),
only screen and (min-resolution:192dpi) and (max-width:1024px),
only screen and (min-resolution:2dppx) and (max-width:1024px) {
    #cssmenu {
        width: 100%
    }

    #cssmenu ul {
        width: 100%;
        display: none
    }

    #cssmenu.align-center > ul,
    #cssmenu.align-right ul ul {
        text-align: left
    }

    #cssmenu ul li,
    #cssmenu ul ul li,
    #cssmenu ul li:hover > ul > li {
        width: 100%;
        height: auto;
        border-top: 1px solid rgba(120, 120, 120, .15)
    }

    #cssmenu ul li a,
    #cssmenu ul ul li a {
        width: 100%
    }

    #cssmenu > ul > li,
    #cssmenu.align-center > ul > li,
    #cssmenu.align-right > ul > li {
        float: none;
        display: block
    }

    #cssmenu ul ul li a {
        padding: 0 20px 20px 30px;
        font-size: 16px;
        color: #000;
        background: none
    }

    #cssmenu ul ul li:hover > a,
    #cssmenu ul ul li a:hover {
        color: #000
    }

    #cssmenu ul ul ul li a {
        padding-left: 40px
    }

    #cssmenu ul ul,
    #cssmenu ul ul ul {
        position: relative;
        left: 0;
        right: auto;
        width: 100%;
        margin: 0
    }

    #cssmenu > ul > li.has-sub > a::after,
    #cssmenu ul ul li.has-sub > a::after {
        display: none
    }

    #menu-line {
        display: none
    }

    #cssmenu #menu-button {
        display: block;
        padding: 10px 20px;
        color: #000;
        cursor: pointer;
        font-size: 16px;
        line-height: 1;
        text-transform: uppercase;
        font-weight: 700
    }

    #cssmenu #menu-button::after {
        position: absolute;
        top: 20px;
        right: 20px;
        display: block;
        width: 15px;
        height: 2px
    }

    #cssmenu #menu-button::before {
        content: '\f0c9';
        font-family: FontAwesome;
        position: absolute;
        top: 7px;
        right: 20px;
        display: block;
        width: 15px;
        height: 3px;
        font-size: 20px
    }

    #cssmenu .submenu-button {
        position: absolute;
        z-index: 10;
        right: 0;
        top: 0;
        display: block;
        border-left: 1px solid rgba(120, 120, 120, .15);
        height: 52px;
        width: 52px;
        cursor: pointer
    }

    #cssmenu .submenu-button::after {
        content: '';
        position: absolute;
        top: 21px;
        left: 26px;
        display: block;
        width: 1px;
        height: 11px;
        background: #000;
        z-index: 99
    }

    #cssmenu .submenu-button::before {
        content: '';
        position: absolute;
        left: 21px;
        top: 26px;
        display: block;
        width: 11px;
        height: 1px;
        background: #000;
        z-index: 99
    }

    #cssmenu .submenu-button.submenu-opened:after {
        display: block
    }

    #cssmenu ul ul li a {
        bottom: 0;
        height: 47px;
        line-height: 3
    }
}

@media (min-width:992px) and (max-width:1199px) {
    #cssmenu > ul > li > a {
        padding: 10px;
        font-size: 15px;
        font-weight: 900;
        text-decoration: none;
        text-transform: uppercase;
        color: #000;
        -webkit-transition: color .2s ease;
        -moz-transition: color .2s ease;
        -ms-transition: color .2s ease;
        -o-transition: color .2s ease;
        transition: color .2s ease
    }
}

@media (min-width:769px) and (max-width:991px) {
  /*13-06-2019*/
    #cssmenu {
   width: 100%;
    }
    
    #cssmenu > ul > li {
    float: left;
    width: 20%;    
    }
/*13-06-2019*/
    #cssmenu > ul > li > a {
        padding: 15px;
        font-size: 15px;
        font-weight: 900;
        text-decoration: none;
        text-transform: uppercase;
        color: #000;
        -webkit-transition: color .2s ease;
        -moz-transition: color .2s ease;
        -ms-transition: color .2s ease;
        -o-transition: color .2s ease;
        transition: color .2s ease
    }

    .ltit_logo img {
        width: 30%;
        margin: 0 35% !Important
    }
}

@media screen and (min-width:993px) and (max-width:1199px) {
    #cssmenu > ul > li.has-sub > a::after {
        position: absolute;
        top: 14px
    }
}

#sticky.stick {
    position: fixed;
    top: 0;
    z-index: 10000;
    border-radius: 0
}

.header2-area .stick {
    background-color: #fff;
    box-shadow: 0 0 5px #a9a9a9;
    position: sticky;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 0;
    z-index: 1039;
    -webkit-transition: all 1s ease-out;
    -moz-transition: all 1s ease-out;
    -ms-transition: all 1s ease-out;
    -o-transition: all 1s ease-out;
    transition: all 1s ease-out
}

.top-bar {
    line-height: 20px;
    margin-top: 5px
}

.topbar-left,
.topbar-right {
    padding: 0
}

.topbar-left {
    margin-top: 5px
}

.topbar-left > ul {
    padding: 0
}

ul.topbar_left_ul > li {
    display: inline-block;
    margin: 5px 5px;
    color: #999;
    vertical-align: middle;
    font-size: 16px;
    font-family: 'Nunito', sans-serif;
    letter-spacing: 0
}

ul.topbar_left_ul > li i {
    display: inline-block;
    font-size: 15px;
    color: #83B739;
    margin: 0 5px
}

@media screen and (max-width:567px) {
    ul.topbar_left_ul > li {
        width: 100%;
        display: inline-block;
        text-align: center;
        margin: 5px 0
    }
}

ul.topbar_left_ul {
    font-size: 14px
}

@media (min-width:768px) and (max-width:992px) {
    .topbar-left {
        text-align: center
    }
}

.topbar-right {
    text-align: right
}

.navbar {
    margin-bottom: 0
}

.topbar-right .navbar {
    font-size: 20px
}

.topbar-right > .navbar > .dropdown-menu {
    margin-top: 4px 0 0
}

.login-btn {
    display: inline-block;
    padding: 4px 12px;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #4cae4c;
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c
}

.login-btn:hover,
.login-btn:active,
.login-btn:focus {
    color: #fff;
    background-color: #5cb85c !Important;
    border-color: #4cae4c !Important
}

.dropdown-menu {
    padding: 0;
    border-radius: 0
}

.dropdown-menu > li > a:focus,
.dropdown-menu > li > a:hover {
    color: #fff;
    text-decoration: none;
    background-color: #5cb85c
}

.dropdown-menu > li > a {
    display: block;
    padding: 10px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap
}

.navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none
}

@media (max-width:767px) {
    .collapse {
        display: block !Important
    }

    .topbar-right .navbar {
        left: -38%
    }
}

@media (min-width:768px) and (max-width:992px) {
    .topbar-right .navbar {
        left: -41%
    }
}

@media screen and (max-width:567px) {
    .ltit_logo img {
        width: 50%;
        margin-left: 25% !Important;
        margin-right: 25%
    }
}

@media screen and (min-width:568px) and (max-width:768px) {
    .ltit_logo {
        margin: 0 auto !Important;
        border-bottom: 1px solid #f3f3f3
    }

    .ltit_logo img {
        width: 30%;
        margin-left: 35% !Important;
        margin-right: 35%
    }
}

.carousel-control.left span,
.carousel-control.right span {
    background-color: #000;
    border: 2px solid #fff;
    width: 40px;
    height: 40px;
    padding: 2px
}

.slide1 {
    width: 100%;
    min-height: 550px;
    background-image: url(../img/Banner1.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    opacity: 1
}

.slide2 {
    width: 100%;
    min-height: 550px;
    background-image: url(../img/Banner2.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    opacity: 1
}

.slide1 > .carousel-caption > h1 {
    position: relative;
    font-size: 38px;
    text-align: left;
    font-weight: 700;
    top: -75px;
    line-height: 1.5;
    animation-delay: 1s
}

.slide1 > .carousel-caption > a {
    right: 480px;
    position: relative;
    z-index: 1;
    top: -50px;
    font-weight: 600;
    font-size: 14px;
    padding: 15px 30px;
    animation-delay: 2s
}

.slide2 > .carousel-caption > h1 {
    position: relative;
    font-size: 38px;
    text-align: left;
    font-weight: 700;
    top: -75px;
    line-height: 1.5;
    animation-delay: 1s
}

.slide2 > .carousel-caption > a {
    right: 480px;
    position: relative;
    z-index: 1;
    top: -50px;
    padding: 15px 30px;
    font-weight: 600;
    font-size: 14px;
    animation-delay: 2s
}

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

    .carousel-control.left span,
    .carousel-control.right span {
        background-color: #000;
        border: 2px solid #fff;
        width: 40px;
        height: 40px;
        padding: 6px
    }

    .slide1,
    .slide 2 {
        width: 100%;
        height: 250px
    }

    .slide1 > .carousel-caption > h1,
    .slide2 > .carousel-caption > h1 {
        font-size: 24px;
        text-align: left;
        font-weight: 700;
        top: -130px;
        line-height: 1.5;
        animation-delay: 1s;
        padding: 0 5%
    }

    .slide1 > .carousel-caption > a,
    .slide2 > .carousel-caption > a {
        right: 15%;
        top: -110px
    }

    .carousel-control.left {
        left: -15px;
        right: auto
    }

    .carousel-control.right {
        right: -15px;
        left: auto
    }
}

@media (min-width:568px) and (max-width:786px) {

    .carousel-control.left span,
    .carousel-control.right span {
        background-color: #000;
        border: 2px solid #fff;
        width: 40px;
        height: 40px;
        padding: 6px
    }

    .slide1,
    .slide 2 {
        width: 100%;
        height: 250px
    }

    .slide1 > .carousel-caption > h1,
    .slide2 > .carousel-caption > h1 {
        font-size: 32px;
        text-align: left;
        font-weight: 700;
        top: -130px;
        line-height: 1.5;
        animation-delay: 1s;
        padding: 0 5%
    }

    .slide1 > .carousel-caption > a,
    .slide2 > .carousel-caption > a {
        right: 23%;
        top: -110px
    }
}

@media (min-width:787px) and (max-width:1199px) {

    .carousel-control.left span,
    .carousel-control.right span {
        background-color: #000;
        border: 2px solid #fff;
        width: 40px;
        height: 40px;
        padding: 2px
    }

    .slide1,
    .slide 2 {
        width: 100%;
        height: 250px
    }

    .slide1 > .carousel-caption > h1,
    .slide2 > .carousel-caption > h1 {
        font-size: 36px;
        text-align: left;
        font-weight: 700;
        top: -130px;
        line-height: 1.5;
        animation-delay: 1s;
        padding: 0
    }

    .slide1 > .carousel-caption > a,
    .slide2 > .carousel-caption > a {
        right: 35%;
        top: -110px
    }
}

@media (min-width:1200px) and (max-width:1366px) {
.slide1 {
    width: 100%;
    min-height: 400px;
    background-image: url(../img/Banner1.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    opacity: 1
}

.slide2 {
    width: 100%;
    min-height: 400px;
    background-image: url(../img/Banner2.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    opacity: 1
}
    .slide1 > .carousel-caption > a,
    .slide2 > .carousel-caption > a {
        right: 38%;
        top: 20px
    }
    .slide1 > .carousel-caption > h1 {
    top: 0;
    }    
    .slide2 > .carousel-caption > h1 {
    top: 0;
    } 
    .slide1 > .carousel-caption > h1{
    font-size: 34px;    
    }
    .carousel-caption{
    top: 50px;
    }
}

@media (min-width:1367px) and (max-width:1600px) {
    .carousel-caption{
    top: 175px;
    }
    .slide1 > .carousel-caption > a,
    .slide2 > .carousel-caption > a {
        right: 38%;
        top: -60px
    }
}

@media (min-width:1600px) and (max-width:1900px) {

    .slide1 > .carousel-caption > a,
    .slide2 > .carousel-caption > a {
        right: 41%;
        top: -60px
    }
}

@media (min-width:1920px) {
    .carousel-caption{
    top: 35%;
    }
    .slide1 > .carousel-caption > a,
    .slide2 > .carousel-caption > a {
        right: 480px;
        top: -60px
    }
}

@media (min-width:2560px) and (max-width:3840px) {
    .carousel-caption{
    top: 35%;
    }
    .slide1 > .carousel-caption > a,
    .slide2 > .carousel-caption > a {
        right: 680px;
        top: -60px
    }
}
.pbrbtn{
border-radius: 50px;
}
.logictree_pricingdetails {
padding-top: 20px;
padding-bottom: 20px;
background-color: #fff
}
.uspdhub_pricingdetails, .smartconnect_pricingdetails{
width: calc(50% - 30px);
font-size: 16px;
margin: 15px 15px;
padding: 15px 15px 15px 15px;
border-radius: 15px;
}

@media screen and (max-width:992px){
.uspdhub_pricingdetails, .smartconnect_pricingdetails{
width: 90%;
font-size: 16px;
margin: 15px 5%;
padding: 15px 15px 15px 15px;
border-radius: 15px;
}
}

.uspdhub_pricingdetails img{
width: 20%;
margin: 0 40%;
}
.smartconnect_pricingdetails img{
width: 20%;
margin: 0 40%;
}
.bg-blue{
background: #d9edf7;
}
.bg-green{
background: #dff0d8;
}
/*
.border-rightfade{
border-width: 1.5px;
border-style: solid;
border-image: linear-gradient(to top, #e2e2e2, #c2c2c2, #e2e2e2);
border-image-slice: 1;
border-bottom: none;
border-top: none;
border-left: none;
}
*/
.about_logictree {
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #fff
}

.about_title h3 {
    margin-bottom: 30px
}

.about_title h3:after {
    content: "";
    position: absolute;
    bottom: -7px;
    left: 0;
    width: 70px;
    height: 2px;
    background: #8bc34a;
    left: 50%;
    margin-left: -35px
}

.about_content p {
    margin-top: 15px;
    font-size: 18px;
    line-height: 1.8
}

@media screen and (max-width:575px) {
    .about_content p {
        font-size: 14px;
        padding: 15px 15px;
        line-height: 1.8
    }
}

.branded_mobile_app_features {
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #F3F3F3
}

.app_features_scroll_carousal {
    margin-top: 50px
}

.app_features_title h3:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 92px;
    height: 2px;
    background: #8bc34a;
    left: 3%;
    margin-left: -20px
}

.app_feature_box {
    height: 230px;
    width: 22%;
    background-color: #fff;
    margin: 1.5%;
    padding: 1.5%;
    text-align: center
}

@media screen and (max-width:768px) {
    .app_feature_box {
        height: 230px;
        width: 100%;
        background-color: #fff;
        margin: 1.5%;
        padding: 1.5%;
        text-align: center
    }
}

.app_feature_box i {
    font-size: 25px
}

.app_feature_box_inner {
    padding: 15px;
    border: 1px solid#b2b4b480;
    margin-top: 15px;
    height: 135px
}

.app_feature_box_inner h6 {
    font-size: 18px;
    font-weight: 600
}

.app_feature_box_inner p {
    color: #939696
}

@media screen and (max-width:575px) {
    .branded_mobile_app_features {
        padding: 0 15px !Important
    }

    .app_feature_box {
        width: 100%;
        height: 230px;
        margin: 15px 0;
        padding: 15px
    }

    .app_feature_box_inner p {
        font-size: 16px
    }
}

@media (min-width:769) and (max-width:991px) {
    .app_feature_box {
        height: 250px;
        width: 100%;
        background-color: #fff;
        margin: 1.5%;
        padding: 1.5%;
        text-align: center
    }

    .app_feature_box_inner {
        padding: 15px;
        border: 1px solid#b2b4b480;
        margin-top: 15px;
        height: 155px
    }
}

.our_products {
    padding-top: 50px;
    background-color: #fff
}

.our_products_title {
    margin-bottom: 50px;
    text-align: center
}

.our_products_title h3 {
    text-align: center;
    letter-spacing: 2px;
    font-weight: 600
}

.our_products_title h3:after {
    content: "";
    position: absolute;
    bottom: -7px;
    width: 70px;
    height: 2px;
    background: #8bc34a;
    left: 50%;
    margin-left: -35px
}

.our_products_box {
    padding-top: 25px;
    padding-bottom: 25px
}

.bottom_line:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: #b2b4b480
}

.our_products_box img {
    width: 70%;
    height: auto;
    vertical-align: middle;
    margin: 15px 15%
}

@media screen and (max-width:768px) {
    .our_products_box img {
        width: 30%;
        height: auto;
        vertical-align: middle;
        margin: 15px 30%
    }
}

@media (min-width:769px) and (max-width:991px) {
    .our_products_box img {
        width: 30%;
        height: auto;
        vertical-align: middle;
        margin: 15px 35%
    }
}

.law_enforcement h5 {
    font-size: 24px;
    color: #013758
}

.law_enforcement h5:after {
    content: "";
    position: absolute;
    bottom: -5px;
    width: 92px;
    height: 2px;
    background: #013758;
    left: 3%;
    margin-left: -25px
}

.product_description {
    margin-top: 15px;
    text-align: justify
}

.product_description p {
    line-height: 1.8;
    font-size: 16px
}

.organization_platform h5 {
    font-size: 24px;
    color: #6AD4FE
}

.organization_platform h5:after {
    content: "";
    position: absolute;
    bottom: -7px;
    width: 92px;
    height: 2px;
    background: #6AD4FE;
    left: 3%;
    margin-left: -25px
}

.school_platform h5 {
    font-size: 24px;
    color: #EE5A21
}

.school_platform h5:after {
    content: "";
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 92px;
    height: 2px;
    background: #EE5A21;
    left: 3%;
    margin-left: -25px
}

.myyouthhub h5 {
    font-size: 24px;
    color: #92c23b
}

.myyouthhub h5:after {
    content: "";
    position: absolute;
    bottom: -7px;
    width: 92px;
    height: 2px;
    background: #92c23b;
    left: 3%;
    margin-left: -25px
}

.our_product_bottomcaption {
    border-top: 2px solid#8bc34a
}

.our_product_bottomcaption h3 {
    font-weight: 100;
    font-family: 'Nunito', sans-serif;
    text-align: center;
    font-size: 36px;
    font-style: italic
}

.apps_published {
    background-color: #3DBAD6;
    float: left;
    padding: 15px
}

.total_downloads {
    background-color: #0F90CF;
    float: left;
    padding: 15px
}

.push_notifications {
    background-color: #3166B3;
    float: left;
    padding: 15px
}

.apps_published h4,
.total_downloads h4,
.push_notifications h4 {
    text-align: center;
    color: #fff;
    font-family: 'Nunito', sans-serif;
    font-style: italic;
    margin-bottom: 35px
}

.apps_published,
.total_downloads,
.push_notifications {
    min-height: 250px
}

.count {
    font-size: 36px;
    font-style: italic;
    color: #fff;
    text-align: center;
    padding-top: 15px;
    padding-bottom: 15px
}

@media screen and (max-width:575px) {
    .our_products_box img {
        width: 40%;
        height: auto;
        vertical-align: middle;
        margin: 5% 30%
    }

    .law_enforcement h5,
    .organization_platform h5,
    .school_platform h5 {
        font-size: 22px
    }

    .product_description p {
        line-height: 1.5;
        font-size: 14px
    }

    .our_product_bottomcaption h3 {
        font-weight: 300;
        font-size: 28px;
        margin-bottom: 30px;
        padding: 0 15px
    }
}

.what_ourcustomer_says {
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #F3F3F3
}

.what_ourcustomer_says_title {
    margin-bottom: 50px;
    text-align: center
}

.what_ourcustomer_says_title h3 {
    text-align: center;
    letter-spacing: 2px;
    font-weight: 600
}

.what_ourcustomer_says_title h3:after {
    content: "";
    position: absolute;
    bottom: -7px;
    width: 70px;
    height: 2px;
    background: #8bc34a;
    left: 50%;
    margin-left: -35px
}

.says_carousel_caption {
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #fff
}

.customer_carousal a p {
    color: #8bc34a;
    font-size: 16px;
    font-weight: 700;
    text-decoration: underline;
    margin-right: 1.5%
}

.customer_carousal a p:hover {
    color: #87f30b
}

.customer_say_box {
    width: 30%;
    border: 1px solid#fafafa;
    background-color: #fff;
    padding: 15px 15px;
    margin-right: 1.6666%;
    margin-left: 1.6666%;
    float: left
}

.customer_img {
    width: 30%;
    height: auto;
    float: left;
    margin-right: 15px
}

.customer_img img {
    vertical-align: middle
}

.feedback {
    width: 70%;
    height: auto;
    margin-left: 30%
}

.feedback h4 {
    text-align: center
}

.feedback p {
    text-align: center
}

.customer_name h4 {
    text-align: center
}

.customer_name p {
    text-align: center;
    color: #8bc34a
}

.customer_feedback {
    border-bottom: 2px solid #d9dada
}

#customer_says > .carousel-indicators {
    position: absolute;
    bottom: -50px
}

#customer_says > .carousel-indicators .active {
    width: 12px;
    height: 12px;
    margin: 0;
    background-color: #013758
}

#customer_says > .carousel-indicators li {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 1px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #0009;
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid #013758;
    border-radius: 10px
}

@media screen and (max-width:575px) {
    .customer_carousal {
        margin: 15px
    }

    .customer_say_box {
        width: 100%;
        margin: 15px 0
    }
}

@media (min-width:769px) and (max-width:991px) {

    .what_ourcustomer_says > .container,
    .our_products_box > .container,
    .latest_branded_apps > .container,
    .footer-wrap > .container {
        width: 100%;
        padding: 15px !Important
    }

    .footer-bottom > .container {
        width: 100%
    }

    .customer_say_box {
        width: 30%;
        border: 1px solid#fafafa;
        background-color: #fff;
        padding: 15px 15px;
        margin-right: 1.6666%;
        margin-left: 1.6666%;
        float: left;
        height: 280px
    }

    .branded_mobile_app_features > .container {
        width: 100%;
        padding: 15px !Important
    }

    .app_feature_box {
        height: 280px;
        width: 22%;
        background-color: #fff;
        margin: 1.5%;
        padding: 1.5%;
        text-align: center
    }

    .app_feature_box_inner {
        padding: 15px;
        border: 1px solid#b2b4b480;
        margin-top: 15px;
        height: 190px
    }

    .social_icon {
        position: relative;
        top: -7px;
        left: -44%;
        margin-top: 15px
    }
}

.latest_branded_apps {
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #013758
}

.latest_branded_apps_title {
    margin-bottom: 50px;
    text-align: center
}

.latest_branded_apps_title h3 {
    text-align: left;
    letter-spacing: 2px;
    font-weight: 600;
    color: #fff;
    float: left
}

.latest_branded_apps_title h3:after {
    content: "";
    position: absolute;
    bottom: -8px;
    width: 70px;
    height: 2px;
    background: #8bc34a;
    left: 3%;
    margin-left: -10px
}

.latest_branded_apps_title > a > p {
    color: #8bc34a;
    font-size: 16px;
    font-weight: 700;
    text-decoration: underline;
    margin-right: 1.5%;
    float: right;
    margin-top: 22px;
    line-height: 1.5
}

.latest_branded_apps_title > a > p:hover {
    color: #87f30b
}

.latest_app_box {
    height: 270px;
    width: 22%;
    background-color: #fff;
    margin: 1.5%;
    padding: 1.5%;
    text-align: center
}

.app_dept {
    border: 1px solid#d9dada;
    padding: 15px
}

.latest_apps h4 {
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 0;
    font-weight: 700
}

.latest_apps p {
    font-family: 'Merriweather', serif;
    text-align: center;
    font-size: 16px
}

@media screen and (max-width:575px) {
    .latest_branded_apps {
        width: 100%;
        padding: 15px
    }

    .latest_branded_apps_title h3:after {
        left: 0;
        margin-left: 0
    }

    .latest_app_box {
        width: 100%;
        padding: 25px;
        margin-bottom: 15px
    }

    .latest_app_box {
        margin: 0;
        margin-bottom: 15px
    }
}

.footer-wrap {
    padding-top: 50px;
    background-color: #222
}

.about_ltit_title h4,
.useful_links_title h4,
.latest_news_title h4,
.contact_us_title h4 {
    text-align: left;
    color: #fff
}

.about_ltit,
.useful_links {
    width: 22%;
    margin: 1.5%;
    text-align: center
}

.contact_us {
    width: 44%;
    margin: 1.5%;
    text-align: center
}

.about_ltit_title h4:after,
.useful_links_title h4:after,
.latest_news_title h4:after,
.contact_us_title h4:after {
    content: "";
    position: absolute;
    bottom: 0;
    width: 70px;
    height: 2px;
    background: #8bc34a;
    left: 0
}

.about_ltit_body,
.latest_news_body {
    padding: 30px 15px 0;
    color: #999;
    text-align: left;
    font-size: 16px
}

.useful_links_body,
.contact_us_body {
    padding: 20px 0;
    color: #999;
    text-align: left;
    font-size: 16px
}

.about_ltit_body > a > p {
    margin: 15px 0;
    text-transform: uppercase;
    color: #8bc34a;
    font-weight: 700
}

.useful_links_body > ul {
    padding: 0;
    margin: 0
}

.useful_links_body > ul > li,
ul.footer_nav li {
    list-style-type: none;
    text-align: left;
    text-decoration: none;
    text-transform: uppercase;
    color: #999;
    padding: 2px 0
}

.useful_links_body > ul > li > a,
ul.footer_nav li a {
    padding: 15px 0;
    color: #999;
    font-weight: 700
}

.useful_links_body > ul > li > a:hover,
ul.footer_nav li a:hover {
    color: #8bc34a
}

.useful_links_body > ul > li::before,
ul.footer_nav li::before {
    content: '\f101';
    font-family: FontAwesome;
    font-size: 20px;
    color: #999;
    transition: .5s ease-in-out;
    margin-right: 4px
}

.news_img {
    width: 30%;
    float: left
}

.news_img img {
    width: 80%;
    margin-left: 0
}

.news-content {
    width: 70%;
    float: left;
    margin-left: 35%
}

.news_box {
    border-bottom: 1px solid#999
}

.date i {
    font-weight: 700;
    color: #8bc34a
}

.date {
    font-weight: 700;
    font-size: 14px
}

.contact_us_body {
    font-weight: 700;
    font-size: 18px;
    line-height: 1.5
}

.contact_us_body i {
    font-weight: 700;
    color: #8bc34a;
    font-size: 24px;
    line-height: 1.5
}

.footer-bottom {
    padding: 25px 0;
    height: 75px;
    background-color: #1D1D1D;
    line-height: 1.5;
    color: #999;
    font-weight: 700;
    font-size: 16px
}

.footer_bottom_content {
    background-color: #1D1D1D
}

.copyright_mark {
    font-weight: 700;
    color: #8bc34a
}

.social_icon,
.fb_content_left {
    background-color: #1D1D1D
}
.terms  {
text-align: center;
color: #fff;    
}
.terms a:hover{
color: #337ab7;}
.terms i {
margin-right: 5px;
color: #F89A14;
font-weight:normal;
}

.social_icon {
    position: relative;
    top: -7px
}

@media screen and (max-width:768px) {
    .social_icon {
        position: relative;
        top: -7px;
        background: #333
    }

    .footer_bottom_content {
        background-color: #303030
    }
}

.social_icon ul {
    padding: 0
}

.social_icon ul li {
    border-radius: 50%;
    background-color: #999;
    width: 38px;
    height: 38px;
    text-align: center;
    line-height: 42px;
    margin-right: 15px;
    text-decoration: none;
    display: inline-block;
    float: right
}

.social_icon ul li a {
    color: #eee
}

.social_icon ul a {
    color: #fff
}

.social_icon ul li:hover,
.social_icon ul li a:hover {
    background-color: #8bc34a;
    color: #fff;
    cursor: pointer
}

@media screen and (max-width:768px) {
    .social_icon ul li {
        border-radius: 50%;
        background-color: #999;
        width: 38px;
        height: 38px;
        text-align: center;
        line-height: 42px;
        margin-right: 0;
        text-decoration: none;
        display: inline-block;
        float: right
    }

    .footer-content {
        padding: 15px !Important
    }

    .about_ltit,
    .useful_links,
    .latest_news,
    .contact_us {
        width: 100%;
        height: auto;
        margin: 0
    }

    .useful_links_body {
        padding: 15px 0;
        font-size: 14px
    }

    .fb_content_left {
        width: 100%
    }

    .footer-bottom p {
        font-size: 12px;
        text-align: center !Important
    }

    .contact_us_body {
        font-weight: 700;
        font-size: 16px;
        line-height: 1.5
    }

    .about_ltit_body,
    .latest_news_body {
        padding: 15px 0 0;
        color: #999;
        text-align: left;
        font-size: 16px
    }

    .social_icon ul {
        width: 25%;
        margin: 15px 30%
    }
}

#return-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: rgb(0, 108, 181);
    width: 50px;
    height: 50px;
    display: block;
    text-decoration: none;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    display: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

#return-to-top i {
    color: #fff;
    margin: 0;
    position: relative;
    left: 12px;
    top: 10px;
    font-size: 26px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

#return-to-top:hover {
    background: #8bc34a
}

#return-to-top:hover i {
    color: #013758
}

.breadcrubs {
    margin-top: 35px;
    background-color: transparent;
    border-bottom: 1px solid#999
}

.breadcrubs ol.breadcrumb {
    background-color: transparent !Important;
    border: 0 solid rgba(245, 245, 245, 1);
    border-radius: 4px;
    display: block;
    margin-top: 15px;
    margin-bottom: 15px;
    font-weight: 600;
    text-transform: uppercase
}

.breadcrumb li {
    font-size: 16px
}

.breadcrumb a {
    color: #999
}

.breadcrumb a:hover {
    color: rgba(42, 100, 150, 1)
}

.breadcrumb > .active {
    color: #337ab7
}

.breadcrumb > li + li:before {
    color: #337ab7;
    content: "\f0de";
    font-family: 'FontAwesome';
    transform: rotate(90deg);
    display: inline-block;
    margin-right: 5px
}

.anniversarystickey {
    width: 250px;
    height: 46px;
    padding: 0 28px;
    position: fixed;
    right: 30%;
    top: 0;
    z-index: 1000;
    background: linear-gradient(64deg, #b3f3e3, #ea8899, #e188ea, #8893ea, #c9ea88, #eabd88);
    background-size: 1200% 1200%;
    -webkit-animation: anivversarybg 30s ease infinite;
    -moz-animation: anivversarybg 30s ease infinite;
    animation: anivversarybg 30s ease infinite
}

@-webkit-keyframes anivversarybg {
    0% {
        background-position: 0% 75%
    }

    50% {
        background-position: 100% 26%
    }

    100% {
        background-position: 0% 75%
    }
}

@-moz-keyframes anivversarybg {
    0% {
        background-position: 0% 75%
    }

    50% {
        background-position: 100% 26%
    }

    100% {
        background-position: 0% 75%
    }
}

@keyframes anivversarybg {
    0% {
        background-position: 0% 75%
    }

    50% {
        background-position: 100% 26%
    }

    100% {
        background-position: 0% 75%
    }
}

.anniversarystickey h5 {
    font-size: 16px;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #fff
}

.anniversarystickey p {
    text-align: center;
    color: #005381;
    font-size: 14px;
    text-transform: uppercase;
    margin: -8px 0;
    font-weight: 700
}

@media screen and (min-width:1200px) and (max-width:1366px) {
    .anniversarystickey {
        width: 250px;
        height: 46px;
        padding: 0 28px;
        position: fixed;
        right: 20%;
        top: 0;
        z-index: 1000;
        background: linear-gradient(64deg, #b3f3e3, #ea8899, #e188ea, #8893ea, #c9ea88, #eabd88);
        background-size: 1200% 1200%;
        -webkit-animation: anivversarybg 30s ease infinite;
        -moz-animation: anivversarybg 30s ease infinite;
        animation: anivversarybg 30s ease infinite
    }
}

@media screen and (min-width:1367px) and (max-width:1600px) {
    .anniversarystickey {
        width: 250px;
        height: 46px;
        padding: 0 28px;
        position: fixed;
        right: 22%;
        top: 0;
        z-index: 1000;
        background: linear-gradient(64deg, #b3f3e3, #ea8899, #e188ea, #8893ea, #c9ea88, #eabd88);
        background-size: 1200% 1200%;
        -webkit-animation: anivversarybg 30s ease infinite;
        -moz-animation: anivversarybg 30s ease infinite;
        animation: anivversarybg 30s ease infinite
    }
}

@media screen and (min-width:2560px) {
    .anniversarystickey {
        width: 250px;
        height: 46px;
        padding: 0 28px;
        position: fixed;
        right: 34%;
        top: 0;
        z-index: 1000;
        background: linear-gradient(64deg, #b3f3e3, #ea8899, #e188ea, #8893ea, #c9ea88, #eabd88);
        background-size: 1200% 1200%;
        -webkit-animation: anivversarybg 30s ease infinite;
        -moz-animation: anivversarybg 30s ease infinite;
        animation: anivversarybg 30s ease infinite
    }
}

@media screen and (min-width:3440px) {
    .anniversarystickey {
        width: 250px;
        height: 46px;
        padding: 0 28px;
        position: fixed;
        right: 38%
    }
}