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

html {
    width: 100%;
}

body {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    padding: 0;
    margin: 0;
    height: 100%;
    overflow-x: hidden;
    transition: all .2s;
}

h1,h2,h3,h4,h5,h6,ul,p {
    padding: 0;
    margin: 0;
}

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

a {
    text-decoration: none;
}

a:hover, a:focus {
    text-decoration: none;
    outline: none;
}

a img {
    border: none;
}

p a {
    color: #2daee4;
    text-decoration: underline;
}

p a:hover {
    color: #1a8ebf;
    text-decoration: underline;
}

strong {
    font-weight: 700;
}

.align-right {
    text-align: right;
}

button:focus {
    outline: none;
}

::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    opacity: 1;
}

::-moz-placeholder {
    /* Firefox 19+ */
    opacity: 1;
}

:-ms-input-placeholder {
    /* IE 10+ */
    opacity: 1;
}

:-moz-placeholder {
    /* Firefox 18- */
    opacity: 1;
}

.hide {
    display: none;
}

button {
    cursor: pointer;
    border: 0;
}

select {
    -webkit-appearance: none;
    border-radius: 0;
}

.row.no-gutters {
    margin-right: 0;
    margin-left: 0;
}

.row.no-gutters > [class^="col-"], .row.no-gutters > [class*=" col-"] {
    padding-right: 0;
    padding-left: 0;
}

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

.containerFull {
    width: 100%;
    padding: 0 70px;
}

.container {
    width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}

h1, h2, h3, h4, h5 {
    color: #335875;
    margin: 0 0 30px 0;
}

h1 {
    font-size: 48px;
}

h2 {
    font-size: 40px;
}

h3 {
    font-size: 30px;
}

h4 {
    font-size: 20px;
}

h5 {
    font-size: 17px;
}

p {
    font-size: 16px;
    line-height: 30px;
    color: #778fa3;
}
.parent-btn-box a,
.btn {
    display: inline-block;
    padding: 20px 30px;
    background: #eee;
    font-size: 18px;
    color: #333;
    border-radius: 100px;
}

header {
    margin: 40px 0;
}

header .containerFull {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
	max-width: 100%;
	width: 165px;
}
.logo img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	height: auto;
	width: auto;
}

.nav li {
    display: inline-block;
}

.home .nav .inner-menu-item,
body:not(.home) .nav .home-menu-item {
    visibility: hidden;
    display: none;
}

.nav li:not(.parent-btn-box) a {
    font-size: 18px;
    font-weight: 500;
    color: #1C4566;
    opacity: 0.6;
    margin: 0 15px;
}

.nav li:not(.parent-btn-box) a:hover {
    opacity: 1;
}
#mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-parent-btn-box {
    margin-right: 0;
}
#mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-parent-btn-box > a.mega-menu-link {
    display: inline-block;
    padding: 15px 30px;
    font-size: 18px;
    line-height: 32px;
    background: #eaf2f8;
    color: #72AAD3;
    text-align: center;
    border-radius: 100px;
    margin: 0 0 0 20px;
}
.nav .parent-btn-box a,
.nav a.btn,
.mobile-btn a.btn:hover {
    background: #eaf2f8;
    color: #72AAD3;
    opacity: 1;
}
.nav .parent-btn-box a:hover,
.nav a.btn:hover,
.mobile-btn a.btn,
#mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-parent-btn-box > a.mega-menu-link:hover {
    background: #69b3e8;
    color: #fff;
}


@media all and (min-width: 992px) {
    .mobile-btn {
        display: none;
    }
}
@media all and (max-width: 991px) {
    .mobile-btn a.btn { 
        display: block; 
        font-size:16px; 
        padding: 15px 20px; 
        margin:0 10px;
        text-align: center;
    }
    .nav .parent-btn-box,
    header #mega-menu-wrap-main-menu #mega-menu-main-menu .mega-parent-btn-box {
        display: none;
    }
    #mega-menu-wrap-main-menu .mega-menu-toggle.mega-menu-open + #mega-menu-main-menu {
        display: block;
        position: absolute;
        z-index: 99;
        right: 0;
        min-width: 250px;
        max-width: 90%;
    }
    #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-megamenu > ul.mega-sub-menu {
        max-height: 328px;
        height: auto;
        overflow-y: auto;
    }
}
@media all and (max-width: 991px) and (min-height: 700px) {
    #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-megamenu > ul.mega-sub-menu {
        max-height: 410px;
    }
}
@media all and (max-width: 360px) {
    .mobile-btn a.btn { 
        font-size:14px; 
        padding:10px 15px; 
        margin:0 8px;
    }
}

.toggleMenu {
    display: none;
}

.hero {
    padding: 40px 0;
}

.hero .containerFull {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.heroText {
    width: 50%;
    padding: 0 0 0 10%;
}

.heroText h1 {
    width: 100%;
    font-size: 48px;
    color: #325775;
    margin: 0 0 30px 0;
}

.heroText p {
    width: 85%;
    font-size: 20px;
    line-height: 33px;
    color: #778fa3;
    margin: 0 0 30px 0;
}

.heroText a {
    background: #EB8B2D;
    color: #fff;
}

.heroText a:hover {
    background: #fdf3ea;
    color: #EB8B2D;
}

.heroImg {
    width: 50%;
}

.homeAbout .inner {
    display: flex;
    justify-content: space-between;
    background: #7B8ACF;
    padding: 120px 160px;
}

.homeAbout h2 {
    width: 33%;
    font-size: 40px;
    color: #fff;
}

.homeAbout p {
    width: 33%;
    padding: 0 8% 0 0;
    font-size: 18px;
    line-height: 30px;
    color: #fff;
    opacity: 0.8;
}

.howItWorks {
    padding: 200px 0;
}

.howItWorks .containerFull {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.howItWorksImg {
    width: 50%;
}

.howItWorksText {
    width: 50%;
    padding: 0 0 0 5%;
}

.howItWorksText span {
    width: 100%;
    margin: 0 0 30px 0;
}

.howItWorksText h2 {
    width: 100%;
    margin: 0 0 50px 0;
}

.howItWorksText ul {
    width: 100%;
}

.howItWorksText ul li {
    width: 100%;
    position: relative;
    padding: 0 0 0 50px;
    margin: 0 0 25px 0;
}

.howItWorksText ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 7px;
    width: 10px;
    height: 10px;
    background: #EB8B2D;
    border-radius: 50px;
}

.howItWorksText ul li h4 {
    width: 100%;
    margin: 0 0 10px 0;
}

.howItWorksText ul li p {
    width: 55%;
    line-height: 24px;
    margin: 0 0 10px 0;
}

.useCases {
    padding: 40px 0;
}

.useCases .container {
    display: flex;
    flex-wrap: wrap;
}

.useCases h2 {
    width: 100%;
    margin: 0 0 80px 0;
}

.useCases ul {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin: 0 0 80px 0;
}

.useCases ul li {
    width: 33%;
    padding: 0 3% 0 0;
    margin: 0 0 40px 0;
}

.useCases ul li img {
    margin: 0 0 20px 0;
}

.useCases ul li p {
    font-size: 18px;
    font-weight: 500;
    margin: 0 0 20px 0;
}

.useCases ul li a {
    font-size: 16px;
    font-weight: 500;
    color: #EB8B2D;
    text-decoration: underline;
}

.useCases ul li a:hover {
    text-decoration: none;
}

.viewMore {
    width: 100%;
}

.viewMore a {
    background: #fdf3ea;
    color: #EB8B2D;
}

.viewMore a:hover {
    background: #EB8B2D;
    color: #fff;
}

.crmCircle {
    padding: 50px 0;
}

.crmCircle .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.crmCircleImg {
    width: 50%;
}

.crmCircleText {
    width: 50%;
}

.crmCircleText h2 {
    width: 100%;
    font-size: 48px;
}

.crmCircleText p {
    width: 70%;
    font-size: 20px;
}

.powerfulAnalytics {
    display: flex;
    padding: 0;
    background: url(../img/bg-analytics.png) left top no-repeat;
    background-size: auto 100%;
    height: 1168px;
}

.powerfulAnalytics .containerFull {
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.powerfulAnalyticsImg {
    width: 45%;
}

.powerfulAnalyticsText {
    width: 50%;
}

.powerfulAnalyticsText h2 {
    width: 100%;
    font-size: 48px;
}

.powerfulAnalyticsText p {
    width: 60%;
    font-size: 20px;
}

.virtualAssistant {
    padding: 0;
}

.virtualAssistant .containerFull {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.virtualAssistantText {
    width: 50%;
    padding: 0 0 0 15%;
}

.virtualAssistantText h2 {
    width: 80%;
    font-size: 48px;
}

.virtualAssistantText p {
    width: 80%;
    font-size: 20px;
}

.virtualAssistantImg {
    width: 50%;
    margin: 100px 0 0 0;
}

.efficientMessaging {
    padding: 0;
}

.efficientMessaging .containerFull {
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.efficientMessagingImg {
    width: 50%;
    margin: 100px 0 0 0;
}

.efficientMessagingText {
    width: 50%;
    padding: 0 10% 0 0;
}

.efficientMessagingText h2 {
    width: 80%;
    font-size: 48px;
}

.efficientMessagingText p {
    width: 80%;
    font-size: 20px;
}

.contactCenter {
    display: flex;
    padding: 0;
    background: url(../img/bg-contact-center.png) right top no-repeat;
    background-size: auto 100%;
    height: 800px;
}
.home .contactCenter {
    margin-bottom: -25px;
}

.contactCenter .containerFull {
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.contactCenterText {
    width: 57%;
    padding: 0 0 0 15%;
}

.contactCenterText h2 {
    width: 70%;
    font-size: 48px;
}

.contactCenterText p {
    width: 70%;
    font-size: 20px;
}

.contactCenterImg {
    width: 43%;
}

.testimonials {
    padding: 50px 0 100px 0;
}

.testimonials .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.testiBlock {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.testiBlock p {
    width: 80%;
    font-size: 23px;
    font-weight: 500;
    color: #335875;
    margin: 0 0 50px 0;
}

.testiUser {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.testiAvatar {
    width: 60px;
    margin: 0 20px 0 0;
}

.testiName h5 {
    font-size: 16px;
    font-weight: 500;
    color: #335875;
    margin: 0 0 5px 0;
}

.testiName span {
    font-size: 14px;
    font-weight: 400;
    color: #778FA3;
}

.owl-theme .owl-nav.disabled + .owl-dots {
    margin: 80px 0 0 0;
    text-align: left;
}

.owl-theme .owl-dots .owl-dot {
    margin: 0 20px 0 0;
}

.owl-theme .owl-dots .owl-dot span {
    background: #EB8B2D;
    opacity: 0.1;
}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #EB8B2D;
    opacity: 1;
}

.footerTop {
    background: #F9F9FB;
}

.pressArea {
    padding: 150px 0;
}

.pressArea .container {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.pressArea h2 {
    width: 40%;
    margin: 0;
}

.pressInfo {
    width: 60%;
    display: flex;
    justify-content: center;
}

.pressInfo img {
    width: 200px;
}

.pressInfo a {
    width: 50%;
    font-size: 23px;
    color: #335875;
    text-decoration: underline;
    margin: 0 0 0 50px;
}

.footerDemo {
    background: url(../img/bg-footer-demo.png) center top no-repeat;
    background-size: cover;
}

.footerDemo .container {
    height: 530px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.footerDemo h2 {
    font-size: 64px;
    font-weight: 700;
    color: #fff;
    text-align: center;
}

.footerDemo h3 {
    font-size: 42px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    padding: 0 10%;
    margin: 0 0 50px 0;
}

.footerDemo a {
    background: #FFCD5E;
    font-size: 22px;
    color: #fff;
    padding: 25px 50px;
}

.footerDemo a:hover {
    background: #f7bd3c;
}

footer {
    padding: 40px 0;
    background: #F9F9FB;
}

footer .containerFull {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.copyrightInfo,
.footerMenu,
.socialLinks {
    width: 33.33%;
}

.copyrightInfo p,
.footerMenu p {
	line-height: 1.4;
}

.footerMenu {
    text-align: center;
}

.socialLinks {
    text-align: right;
}

.socialLinks a {
    font-size: 17px;
    color: #335875;
    padding: 0 0 0 30px;
}

.caseStudies {
    background-image: url(../img/bg-caseStudiesRect-1.png), url(../img/bg-caseStudiesRect-2.png), url(../img/bg-caseStudiesRect-3.png);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: right top, left 50%, center bottom;
    background-size: 50% 50%, 50% 50%, 50% 50%;
}

.caseStudy {
    padding: 50px 0;
}

.caseStudy .container {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.caseStudyText {
    width: 50%;
    padding: 0;
}

.caseStudyText h2 {
    width: 90%;
    font-size: 48px;
}

.caseStudyText p {
    width: 90%;
    font-size: 20px;
}

.caseStudyImg {
    width: 50%;
    text-align: center;
}

.caseStudyImg img {
    margin: 100px 0 0 0;
}

.fixed {
    position: fixed;
    z-index: 9;
    top: 0;
    width: 100%;
    background: #fff;
    margin: 0;
    padding: 20px 0;
    box-shadow: 0 2px 2px rgba(0,0,0,0.1);
}
.admin-bar .fixed {
    top: 32px;
}
@media screen and (max-width: 782px) {
    .admin-bar .fixed {
        top: 46px;
    }
}

@media screen and (max-width: 600px) {
    .admin-bar .fixed {
        top: 0;
    }
}

#myBtn {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Fixed/sticky position */
    bottom: 20px;
    /* Place the button at the bottom of the page */
    right: 20px;
    /* Place the button 30px from the right */
    z-index: 99;
    /* Make sure it does not overlap */
    border: none;
    /* Remove borders */
    outline: none;
    /* Remove outline */
    background-color: #325775;
    /* Set a background color */
    color: white;
    /* Text color */
    cursor: pointer;
    /* Add a mouse pointer on hover */
    padding: 10px 15px;
    /* Some padding */
    border-radius: 3px;
    /* Rounded corners */
    font-size: 18px;
    /* Increase font size */
}
@media screen and (max-width: 767px) {
    #myBtn {
    	bottom: 60px;
    }
}

#myBtn:hover {
    background-color: #555;
    /* Add a dark-grey background on hover */
}
.section-404 {
 padding: 50px 0;
}
.wrap-404 {
    text-align: center;
    padding: 0;
    color: #335875;
    font-size: 72px;
    line-height: 1.25;
}
.wrap-404 .error-404 {
    display: block;
    margin-bottom: -35px;
    font-size: 200px;
    font-weight: 700;
    line-height: 1;
}
@media all and (max-width: 768px) {
    .wrap-404 {
        font-size: 58px;
    }
    .wrap-404 .error-404 {
        margin-bottom: -30px;
        font-size: 160px;
    }
}

.section-content {
    padding: 50px 0;
}
.home .section-content {
    padding-bottom: 100px;
}
.page-title {
    font-size: 40px;
    line-height: 1.2;
    text-align: center;
    margin-bottom: 40px;
}
@media all and (max-width: 767px) {
    .page-title {
        font-size: 32px;
    }
}
.content-narrow .content,
.content-narrow .page-title {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.content * {
    color: #335875;
    line-height: 1.4;
    font-family: 'Roboto', Arial, sans-serif;
}
.content > * {
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 1.4;
}
.content > :last-child {
    margin-bottom: 0;
}
.content h1, .content h2, 
.content h3, .content h4, 
.content h5, .content h6 {
    font-weight: 700;
}
.content h1, .content h1 * {
    font-size: 36px;
}
.content h2, .content h2 * {
    font-size: 32px;
}
.content h3, .content h3 * {
    font-size: 28px;
}
.content h4, .content h4 * {
    font-size: 24px;
}
.content h5, .content h5 * {
    font-size: 20px;
}
.content h6, .content h6 * {
    font-size: 16px;
}
.content ul,
.content ol {
    padding-left: 30px;
}
.content ul {
    list-style-type: disc;
}
.content ol {
    list-style-type: decimal;
}
.content li:not(:last-child) {
    margin-bottom: 10px;
}
.content a {
    color: #4444ff;
    text-decoration: none;
}
.content a:hover,
.content a:focus {
    text-decoration: underline;
}
.content img {
    max-width: 100%;
    height: auto;
    margin: 0;
}
.content p:empty {
    height: 1px;
}

@media all and (max-width: 991px) {
    .content * {
        font-size: 14px;
    }
    .content ul,
    .content ol {
        padding-left: 20px;
    }
    .content h1, .content h1 * {
        font-size: 32px;
    }
    .content h2, .content h2 * {
        font-size: 28px;
    }
    .content h3, .content h3 * {
        font-size: 24px;
    }
    .content h4, .content h4 * {
        font-size: 20px;
    }
    .content h5, .content h5 * {
        font-size: 16px;
    }
    .content h6, .content h6 * {
        font-size: 14px;
    }
}


#seed-csp4-content {
    max-width: 700px;
}
.home .heroText,
.home .crmCircleText,
.home .virtualAssistantText,
.home .contactCenterText {
    padding-right: 20px;
}
.home .efficientMessagingText {
    padding-left: 30px;
}
@media all and (max-width: 767px) {
    .home .heroText,
    .home .crmCircleText,
    .home .virtualAssistantText,
    .home .contactCenterText {
        padding-right: 0;
    }
    .home .contactCenterText {
        padding: 40px 20px;
    }
    .home .contactCenter {
        height: auto;
        margin-bottom: auto;
    }
}


.wpcf7-form * {
    color: #002744;
}
.contact-form {
    margin-bottom: 40px;
}
.form-block {
    display: table;
    width: 100%;
    margin: 0;
    padding: 0;
    border: none;
    margin-bottom: 30px;
}
.form-block > * {
    display: table-cell;
    vertical-align: top;
}
.form-block .legend {
    width: 33.33%;
    padding-right: 10px;
}
.legend-number {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    width: 60px;
    height: 50px;
    text-align: center;
    font-weight: 700;
    font-size: 20px;
    line-height: 50px;
    color: #ffffff;
    padding-right: 10px;
}
.legend-number:before {
    content: '';
    position: absolute;
    z-index: -1;
    left: 0;
    top: 50%;
    margin-top: -25px;
    display: block;
    width: 50px;
    height: 50px;
    background-color: #72AAD3;
    border-radius: 100px;
}
.legend-title {
    display: table-cell;
    vertical-align: middle;
    color: #778fa3;
    font-size: 22px;
}
.form-block > .field-list {
    width: 66.66%;
}
.field-list,
.contact-form .field-list {
    list-style-type: none;
    padding: 0;
    margin: 0 -10px;
}
.field-list > * {
    display: block;
    width: 100%;
    padding: 0 10px;
}
.field-list > *,
.content .field-list > li {
    margin-bottom: 20px;
}
.field-list > .half {
    float: left;
    width: 50%;
}
.field-list .label {
    display: block;
    font-size: 17px;
    line-height: 1.25;
    margin-bottom: 5px;
}
.req {
    color: #f00;
}
.form-btn {
    padding-left: 33.33%;
}
.submit-btn {
    display: inline-block;
    min-width: 180px;
    padding: 15px 20px;
    font-size: 18px;
    line-height: 1.2;
    border-radius: 100px;
    border: none;
    background-color: #EB8B2D;
    color: #fff;
    text-transform: uppercase;
    cursor: pointer;
    text-align: center;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
.submit-btn:hover {
    background-color: #dcdcdc;
    color: #EB8B2D;
}
.input-style {
    display: block;
    width: 100%;
    height: 42px;
    margin: 0;
    padding: 11px 15px;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 400;
    border: 1px solid #b2bec6;
    background-color: #fff;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
textarea.input-style {
    min-height: 120px;
    resize: vertical;
    line-height: 1.4
}
.input-style.wpcf7-not-valid {
    border-color: #f00;
}
.select-triangle .wpcf7-form-control-wrap {
    display: block;
    position: relative;
}
.select-triangle .wpcf7-form-control-wrap:after {
    content: '';
    position: absolute;
    z-index: 1;
    display: inline-block;
    right: 15px;
    top: 50%;
    margin-top: -4px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 10px solid #b2bec6;
    pointer-events: none;
}
div.wpcf7-response-output {
    text-align: center;
    font-size: 18px;
    padding: 10px 20px;
}
.wpcf7-response-output.wpcf7-mail-sent-ok {
    display: none !important;
}
@media all and (max-width: 767px) {
    .form-block {
        display: block;
        margin-bottom: 40px;
    }
    .form-block .legend,
    .form-block > .field-list {
        display: block;
        width: auto;
        padding-right: 0;
    }
    .form-block .legend {
        margin-bottom: 20px
    }
    .form-btn {
        padding-left: 0;
    }
}
