@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,600,700&display=swap');

* {
    padding:0;
    margin:0;
    box-sizing:border-box;
}
body {
    font-family: 'Raleway', sans-serif;
}
a {
    text-decoration:none;
}
a:hover {
    text-decoration:none;
}
ul {
    list-style:none;
}




.header {
    min-height:1060px;
    position:relative;
}

.header-div {
    min-height:1060px;
    
    background-image:url('../images/header-layer.png');
    background-repeat:no-repeat;
    position:relative;
    overflow:visible;
    
}
.blue {
    height:870px;
    background-color:#3b67f2;
    position:absolute;
    width:100%;
    left:0;
    right:0;
    top:0;
    bottom:0;
    z-index:-1;
}


.arr-img {
    position:absolute;
    bottom:0;
    right:335px;
    z-index:-1;
}

.nav-top {
    padding:25px 40px;

}
.link-w {
    font-size:16px;
    font-weight:300;
    color:#fff!important;
    padding:0 30px!important;
}

.header-content {
    width:100%;
    text-align:center;
    margin:0 auto;
    margin-top:200px;
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.header-content h1 {
    font-size:54px;
    font-weight:700;
    color:#fff;
    margin:0;
}
.header-content h2 {
    font-size:41px;
    font-weight:400;
    color:#fff;
    margin-bottom:30px;
}
.header-content p {
    font-size:16px;
    font-weight:400;
    color:#fff;
    
}

.div-btn {
    height:255px;
    width:440px;
    display:flex;
    justify-content: center;
    align-items: center;
    margin:0;
}
.h-btn {
    font-size:35px;
    font-weight:400;
    color:#000;
    background-color:#fff;
    padding:20px 70px;
    border-radius:50px;
}
.h-btn:hover {
    color:#000;
}

.link-wrap {
    position:absolute;
    right:100px;
    top:50px;
    display:flex;
    align-items: center;
    height:40px;
}
.link-wrap a {
    color:#fff;
    font-size:13px;
    padding:0 25px;
    text-decoration:none;
}
.link-wrap p {
    color:#fff;
    font-size:14px;
    padding:0 25px;
    text-decoration:none;
    margin-top: 13px;
}
.divider {
    width:2px;
    height:13px;
    background-color:#fff;
}
.select {
    background-color: transparent;
    border:none;
    font-weight:500;
    color:#fff;
    font-size: 13px
}
.select option {
  color: black;
}
.orangecolor {margin: 0 15px;}

/*  end of header  */

.products {
    min-height:750px;
    background-color:#fff;
    background-image:url('../images/layer-2.png');
    background-position: right bottom;
    background-repeat: no-repeat;
    display:flex;
    flex-direction: column;
    align-items: center;
    
}

.prod-text {
    width:100%;
    max-width:1040px;
    text-align:left;
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top:20px;
}
.prod-text h3 {
    font-size:32px;
    font-weight:700;
    color:#000;
    margin-bottom:25px;
}

.prod-text h1 {
    font-size:62px;
    font-weight:400;
    color:#206fff;
    margin:0;
}
.gray-line {
    width:100%;
    max-width:390px;
    height:4px;
    background-color:#c7c7c7;
    margin:35px 0;
}
.prod-text p {
    font-size:17px;
    font-weight:400;
    line-height:31px;
    color:#777777;
}


.payments {
   width:100%;
   max-width:1120px;
   text-align:center;
   margin-top:50px;
}

.payments h2 {
    font-size:42px;
    font-weight:700;
    color:#000;
    margin-bottom:25px;
}
.payments p {
    font-size:16px;
    font-weight:400;
    color:#545454;
    line-height:27px;
   text-align: left;
}


.cards {
    min-height:1530px;
    overflow: hidden;
    transform:translateY(-20px);
}

.card-div2 {
    height:552px;
    width:100%;
    max-width:380px;
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align:center;
    position:relative;
    z-index:5;
}
.card-div2:hover {
    height:590px;
    position:absolute;
    top:-20px;
    z-index:20;
    justify-content: center;
}
.card-div2:hover::after{
    content:'';
    height:250px;
    width:620px;
    background-image:url('../images/shadow-card.png');
    background-repeat: no-repeat;
    position:absolute;
    bottom:-110px;
    z-index:-1;
    
}

.card-div {
    height:552px;
    width:100%;
    max-width:320px;
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align:center;
    position:relative;
    z-index:5;
}
.card-div:hover {
    height:590px;
    position:absolute;
    top:-20px;
    z-index:20;
    justify-content: center;
}
.card-div:hover::after{
    content:'';
    height:250px;
    width:620px;
    background-image:url('../images/shadow-card.png');
    background-repeat: no-repeat;
    position:absolute;
    bottom:-110px;
    z-index:-1;
    
}

.md-2 {
    width:20%;
}

.card-div:hover img {
    display:inline-block;
}
.card-div2:hover img {
    display:inline-block;
}

.card-div:hover .c-button{
    display:inline-block;
}
.card-div2:hover .c-button{
    display:inline-block;
}

.card-div h2 {
    font-size:36px;
    font-weight:400;
    color:#fff;
    z-index:10;
    margin-bottom:45px;
}
.card-div2 h2 {
    font-size:36px;
    font-weight:400;
    color:#fff;
    z-index:10;
    margin-bottom:45px;
}

.card-div p {
    font-size:19px;
    font-weight:400;
    color:#fff;
    line-height:36px;
    z-index:10;
    max-width:195px;
    margin:0;
}
.card-div2 p {
    font-size:19px;
    font-weight:400;
    color:#fff;
    line-height:36px;
    z-index:10;
    max-width:195px;
    margin:0;
}
.card-div img {
    z-index: 10;
    margin-top:30px;
    display:none;
}
.card-div2 img {
    z-index: 10;
    margin-top:30px;
    display:none;
}

.card-div .c-button {
    z-index:10;
    margin-top:70px;
    margin-bottom:40px;
    display:none;
}
.c-button {
    font-size:16px;
    font-weight:400;
    color:#989898;
    padding:15px 55px;
    background: linear-gradient(180deg, rgba(253,253,253,1) 0%, rgba(215,215,215,1) 100%);
    border-radius:50px;
    -webkit-box-shadow: 0px 14px 26px -5px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 14px 26px -5px rgba(0,0,0,0.75);
    box-shadow: 0px 14px 26px -5px rgba(0,0,0,0.75);
    
}
.c-button:hover {
    color:#989898;
}
 


.c-row {
    margin:0;
    padding:0;
    padding-top:20px;
    min-height:100%;
    position:relative;
    display:flex;
}
.col-md-2 {
    padding:0;
    margin:0;
}

.c-1 {
    background-image:url('../images/card-img1.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-1::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#a0d158;
    position:absolute;
    opacity:0.8;
}


.c-2 {
    background-image:url('../images/card-img2.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-2::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#9a76d1;
    position:absolute;
    opacity:0.8;
}

.c-3 {
    background-image:url('../images/card-img3.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-3::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#6688f5;
    position:absolute;
    opacity:0.8;
}


.c-4 {
    background-image:url('../images/card-img4.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-4::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#ff8079;
    position:absolute;
    opacity:0.8;
}

.c-5 {
    background-image:url('../images/card-img5.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-5::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#d1af42;
    position:absolute;
    opacity:0.8;
}


.c-6 {
    background-image:url('../images/card-img6.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-6::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#33b2b9;
    position:absolute;
    opacity:0.8;
}

.pay-sol {
    width:100%;
    max-width:1120px;
    margin:0 auto;
    margin-top:85px;
    text-align:center;
    margin-bottom:75px;
}
.pay-sol h2 {
    font-size:42px;
    font-weight:700;
    color:#000;
    margin-bottom:30px;
}
.pay-sol p {
    font-size:16px;
    font-weight:400;
    color:#545454;
   line-height:27px;
   text-align: left;
}


.c-7 {
    background-image:url('../images/card-img1.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-7::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#7847c0;
    position:absolute;
    opacity:0.8;
}


.c-8 {
    background-image:url('../images/card-img3.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-8::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#f59766;
    position:absolute;
    opacity:0.8;
}

.c-9 {
    background-image:url('../images/card-img3.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-9::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#4248d1;
    position:absolute;
    opacity:0.8;
}


.c-10 {
    background-image:url('../images/card-img4.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-10::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#656565;
    position:absolute;
    opacity:0.8;
}

.c-11 {
    background-image:url('../images/card-img2.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-11::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#61b1bc;
    position:absolute;
    opacity:0.8;
}


.c-12 {
    background-image:url('../images/card-img4.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    position:relative;
}
.c-12::before{
    content:'';
    width:100%;
    height:100%;
    background-color:#f581a5;
    position:absolute;
    opacity:0.8;
}

/* end of cards*/

.tools {
    min-height:2350px;
    background-color:#fff;
}

.tools-title {
    width:290px;
    text-align:center;
    margin:0 auto;
    margin-bottom:80px;
}
.tools-title h2 {
    font-size:42px;
    font-weight:700;
    color:#000;
    margin-bottom:30px;
}

.tool-1 {
    min-height:365px;
    background-color:#3b67f2;
    display:flex;
    justify-content: center;
    align-items: center;
    margin-bottom:35px;
}

.tool-1 h1 {
    font-size:78px;
    font-weight:400;
    color:#fff;
    text-align:right;
}
.tool-1 p {
    font-size:21px;
    font-weight:400;
    color:#fff;
    max-width:1050px;
    line-height:36px;
}

.div-img {
    margin:0 85px;
}


.tool-2 {
    min-height:570px;
    background-color:#d68500;
    display:flex;
    justify-content: center;
    align-items: center;
    margin-bottom:35px;
}
.tool-2 h1 {
    font-size:78px;
    font-weight:400;
    color:#fff;
    text-align:right;
}
.tool-2 p {
    font-size:21px;
    font-weight:400;
    color:#fff;
    max-width:1050px;
    line-height:36px;
    margin-bottom:30px;
}


.tool-3 {
    min-height:422px;
    background-color:#983bf2;
    margin-bottom:35px;
    display:flex;
    justify-content: center;
    align-items: center;
}

.tool-3 h1 {
    font-size:78px;
    font-weight:400;
    color:#fff;
    text-align:right;
}

.tool-3 p {
    font-size:21px;
    font-weight:400;
    color:#fff;
    max-width:1050px;
    line-height:36px;
    margin-bottom:30px;
}
.tool-3 p span {
    font-weight:700;
}

.tool-4 {
    min-height:760px;
    background-color:#232323;
    display:flex;
    justify-content: center;
    align-items:center;
    
}
.tool-4 h1 {
    font-size:78px;
    font-weight:400;
    color:#fff;
    text-align:right;
}
.tool-4 p {
    font-size:21px;
    font-weight:400;
    color:#fff;
    max-width:1050px;
    line-height:30px;
    
}
.tool-4 p span {
    font-weight:700;
}

/* end of tools  */

.platform {
    min-height:1500px;
    background-color:#F3F3F3;
    display:flex;
    flex-direction: column;
    align-items: center;
}

.platform-text {
    width:100%;
    max-width:980px;
    text-align:center;
    margin-bottom:60px;
    margin-top:125px;
}
.logo-div {
    margin-bottom:60px;
}

.platform-text h3 {
    font-size:24px;
    font-weight:300;
    line-height:42px;
    color:#555555;
}
.platform-text h3 span {
   font-weight:600;
}

.platform-cards {
    width:100%;
    max-width:1605px;
    height:405px;
    display:flex;
    align-items: center;
    margin-bottom:60px;
}

.p-row {
    padding:0;
    margin:0;
    
    width:100%;
    border:1px solid #b3b3b3;
}
.co {
    padding:0;
}
.p-card {
    width:100%;
    max-width:400px;
    height:320px;
    text-align:center;
    background-color:#dddddd;
    display:flex;
    flex-direction:column;
    justify-content: center;
    align-items: center;
    position:relative;
    
}
.p-card::before {
    content:'';
    width:100%;
    height:5px;
    background-color:#fff;
    position:absolute;
    top:0;
} 
.last {
    background-color:#d4d4d4;
}

.p-card h2 {
    font-size:34px;
    font-weight:300;
    color:#000;
}
.p-card h1 {
    font-size:42px;
    font-weight:700;
    color:#000;
    margin-bottom:35px;
}
.p-btn {
    font-size:20px;
    font-weight:400;
    color:#000;
    /*padding:15px 55px;
    border-radius:50px;
    border:1px solid #c4c4c4;
    background: linear-gradient(180deg, rgba(253,253,253,1) 0%, rgba(215,215,215,1) 100%);
    -webkit-box-shadow: 0px 20px 12px -5px #dbdbdb;
    -moz-box-shadow: 0px 20px 12px -5px #dbdbdb;
    box-shadow: 0px 20px 12px -5px #dbdbdb;*/
    display:none;
}

.p-card:hover {
    height:405px;
    position:absolute;
    top:-45px;
    background-color:#fff;
    border:10px solid #0066ff;
    -webkit-box-shadow: 0px 30px 12px -5px #c2c2c2;
    -moz-box-shadow: 0px 30px 12px -5px #c2c2c2;
    box-shadow: 0px 30px 12px -5px #c2c2c2;
}
.p-card:hover .p-btn {
    display:inline-block;
}
.p-card:hover h1 {
    color:#0066ff;
}

.omni-text {
    width:100%;
    max-width:835px;
    text-align:center;
    margin-bottom:85px;
}

.omni-text h1 {
   font-size:56px;
   font-weight:400;
   color:#000;

} 
.omni-text h1 span {
    font-weight:600;
    color:#3d8bff;
}

.solutions {
    width:100%;
    max-width:1250px;
    background-color:#fff;
    min-height:390px;
    border:1px solid #c6c6c6;
    margin-bottom:90px;
}
.sol-row {
    height:100%;
}
.sol-col {
    padding:0;
    
}
.div-1 {
    display:flex;
    justify-content: center;
    align-items: center;
    min-height:195px;
}

.sol-text {
    width:100%;
    max-width:450px;
    padding-left:25px;
    margin-bottom:-20px;
}
.sol-text h3 {
    font-size:21px;
    font-weight:700;
    color:#202020;
}
.sol-text p {
    font-size:18px;
    font-weight:400;
    line-height:37px;
    color:#202020;
}

.extra {
    margin-bottom:85px;
}

.extra h1 {
    font-size:32px;
    font-weight:600;
    color:#000;
}

.support-items {
    width:100%;
    max-width:1250px;
    min-height:440px;
    background-color:#fff;
    border:1px solid #c6c6c6;
}
.sup-row {
    min-height:440px;
}
.sup-cont {
    display:flex;
    justify-content: center;
    align-items: center;
}
.sup-col {
    padding:0;
    display:flex;
    justify-content: center;
    align-items: center;
}

.sup-ul {
    margin-top:25px;
    margin-left:25px;
}
.sup-ul li {
    font-size:18px;
    font-weight:300;
    color:#000;
    padding:11px 0;
}

/* end of platform  */

.developers {
    min-height:740px;
    background-color:#0066ff;
    background-image:url('../images/dev-img.png');
    background-repeat:no-repeat;
    background-position:right;
    display:flex;
    align-items: center;
}

.dev-text {
    width:100%;
    max-width:810px;
    margin-left:180px;
}
.dev-text h2 {
    font-size:42px;
    font-weight:700;
    color:#fff;
    margin-bottom:15px;
}
.dev-text h1 {
    font-size:61px;
    font-weight:400;
    color:#fff;
    margin-bottom:40px;
}
.dev-text p {
    font-size:21px;
    font-weight:400;
    color:#fff;
    line-height:37px;
    margin-bottom:40px;
}

.dev-btn {
    font-size:16px;
    font-weight:400;
    color:#0066ff;
    padding:15px 55px;
    background-color:#ebebeb;
    border-radius:50px;
    -webkit-box-shadow: 0px 20px 12px -5px #0057da;
    -moz-box-shadow: 0px 20px 12px -5px #0057da;
    box-shadow: 0px 20px 12px -5px #0057da;
}

/* end of develoers */

.footer {
    min-height:215px;
    background-color:#fff;
    display:flex;
    align-items:flex-end;
    justify-content: space-between;
    padding: 0 50px 15px 50px;
    
}
.explore-1 h2 {
    font-size:25px;
    font-weight:700;
    color:#000;
    display:inline-block;
    
}
.mg {
    margin-left:10px;
}
.ex-links {
    display:flex;
}
.ex-links a h2 {
    font-size:16px!important;
    font-weight:400;
    color:#000;
    padding-right: 15px;
    transition: all 0.5s ease;
}
.ex-links a h2:hover {
    color: #007bff;
    text-decoration: underline;
}

.copy {
    font-size:16px;
    font-weight:400;
    color:#777777;
}

.links-2 a {
    font-size:16px;
    font-weight:400;
    color:#000;
    padding:0 20px;
    transition: all 0.5s ease;
}
.links-2 a:hover {
    color: #007bff;
    text-decoration: underline;
}