/* css reset */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
  
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

/* remember to define visible focus styles! 
:focus {
	outline: ?????;
} */

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}
del {
  text-decoration: line-through;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* button effect reset for mac IOS version */
input[type="button"] {
  appearance: none;
  -o-appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
}

input[type="submit"] {
  appearance: none;
  -o-appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
}

button {
  appearance: none;
  -o-appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
}

a {
  text-decoration: none;
  cursor: pointer;

  transition: all ease 0.3s;
  -moz-transition: all ease 0.3s;
  -ms-transition: all ease 0.3s;
  -o-transition: all ease 0.3s;
  -webkit-transition: all ease 0.3s;
}

a:hover {
  transition: all ease 0.3s;
  -moz-transition: all ease 0.3s;
  -ms-transition: all ease 0.3s;
  -o-transition: all ease 0.3s;
  -webkit-transition: all ease 0.3s;
}

.sub {
  cursor: pointer;
  transition: all ease 0.3s;
  -moz-transition: all ease 0.3s;
  -ms-transition: all ease 0.3s;
  -o-transition: all ease 0.3s;
  -webkit-transition: all ease 0.3s;
  font-family: "helveticaneue-light";
}

.sub:hover {
  transition: all ease 0.3s;
  -moz-transition: all ease 0.3s;
  -ms-transition: all ease 0.3s;
  -o-transition: all ease 0.3s;
  -webkit-transition: all ease 0.3s;
}

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

.clear {
  display: block;
  clear: both;
  width: 100%;
}

select {
  appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

p {
  line-height: 1.5;
}

body {
  overflow-x: hidden;
  font-family: 'Karla', sans-serif;
  font-size: 16px;
  font-weight:400;
  margin: 0;
  padding:0;
  position:relative;
}


:root{
  --mainpurple: #662062;
  --maindeepblue: #1f2341;
  --mainlightblue: #272c4f;
  --maingreybg:#eceff2;
}





/* css reset */



/*start*/

.main-container{
  width:100%;
  padding-right:80px;
  background:var(--maingreybg);
  min-height:100vh;
}

.navigation-bar{
  position:fixed;
  top:0;
  right:0;
  width:80px;
  background:var(--mainpurple);
  height:100vh;
  border-left:1px solid #ffffff;
  color:#ffffff;
  text-transform:uppercase;
  display:flex;
  flex-wrap:wrap;
  flex-direction: column;
  align-items:center;
  padding:30px 0px;
  justify-content: space-between;
  z-index:99;
}

.navigation-bar .menu-trigger{
  display:flex;
  flex-wrap:wrap;
  flex-direction: column;
  align-items:center;
  cursor:pointer;
}

.navigation-bar .menu-trigger span{
  width:30px;
  height:30px;
  border:1px solid #ffffff;
  border-radius:100%;
  display:flex;
  justify-content: center;
  align-items: center;
  margin-bottom:10px;
  transition:all ease 0.3s; 
}

.navigation-bar .menu-trigger span:hover{
  transform:scale(1.2);
  transition:all ease 0.3s; 
}

.navigation-bar .menu-trigger span i{
  transition:all ease 0.3s; 
}


.navigation-bar .menu-trigger p{
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.navigation-bar a.pricing{
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  color:#ffffff;
}

.navigation-bar .menu-trigger span.animation i{
  transform:rotateZ(180deg);
  transition:all ease 0.3s;
}

.navigation-content{
  position:fixed;
  top:0;
  left:0;
  width:calc(100% - 80px);
  height:100%;
  opacity:0;
  visibility:hidden;
  z-index:-1;
  transition:all ease 0.5s;
}

.navigation-content .left-content{
  width:60%;
  background:var(--maindeepblue);
  position:absolute;
  left:0;
  top:-100%;
  height:100%;
  transition:all ease 0.5s;
}

.navigation-content .right-content{
  width:40%;
  background:var(--mainlightblue);
  position:absolute;
  right:0;
  top:100%;
  height:100%;
  transition:all ease 0.5s;
}

.navigation-content.show{
  opacity:1;
  visibility: visible;
  z-index:999;
}

.navigation-content.show .left-content,
.navigation-content.show .right-content{
  top:0;
  transition:all ease 0.5s;
}

.navigation-content.show .left-content{
  display:flex;
  align-items:center;
  justify-content: center;
  padding:80px 80px;
  
}

.navigation-content .left-content .links{
  opacity:0;
  position:relative;
  transform:translateY(100%);
}

.navigation-content.show .left-content .links{
  opacity:1;
  transition:all ease 0.5s;
  transition-delay: 0.3s;
  transform:translateY(0);
}

.navigation-content.show .left-content .links a{
  color:#ffffff;
  font-size:35px;
  font-weight:800;
  display:inline-block;
  position:relative;
  margin:15px 0px;
}


.navigation-content.show .left-content .links a:hover{
  transform:translateX(20px);
}

.navigation-content.show .left-content .links a:before{
  position:absolute;
  bottom:-5px;
  left:0;
  width:0;
  height:20px;
  background:var(--mainpurple);
  transition:all ease 0.3s;
  content:"";
  z-index:-1;
}

.navigation-content.show .left-content .links a:hover:before{
  width:100%;
  transition:all ease 0.3s;

}

.navigation-content.show .left-content .links .sub-links a{
  font-size:20px;
  margin-right:20px;
}

.navigation-content.show .left-content .links .sub-links a:before{
  height:10px;
  bottom:0;
}

.navigation-content.show .left-content .links .sub-links a:hover{
  transform:translateX(10px);
}

.navigation-content .right-content{
  display:flex;
  align-items:center;
  padding:80px 80px;
  
}

.navigation-content .right-content .getintouch{
  opacity:0;
  position:relative;
  transform:translateY(-100%);
}

.navigation-content.show .right-content .getintouch{
  opacity:1;
  transition:all ease 0.5s;
  transition-delay: 0.3s;
  transform:translateY(0);
}

.navigation-content.show .right-content b{
  color:#b7b7b7;
  display:block;
  padding-bottom:20px;
  font-size:20px;
  font-weight:600;
}

.navigation-content.show .right-content p{
  color:#ffffff;
  font-size:20px;
  font-weight:600;
  padding-bottom:10px;
  line-height:1.3;
}

.navigation-content.show .right-content .social-media{
  display:flex;
  gap:20px;
  padding-top:20px;
}

.navigation-content.show .right-content .social-media i{
  color:#ffffff;
  font-size:24px;
}

.main-container #section1{
  height:100vh;
}

.row{
  overflow:hidden;
  border-bottom:1px solid #b7b7b7;
  background-image:url(../images/texture-bg.jpg);
  background-size:contain;
  padding:0px 50px;
  position:relative;
}

.row-title{
  display:block;
}

.row-title p{
  display:inline-block;
  border-bottom:5px solid var(--mainpurple);
  color:var(--maindeepblue);
  font-weight:800;
  font-size:40px;
  position:relative;
  margin-bottom:30px;
  line-height:1.3;
}

.row .desc{
  line-height:1.5;
}

.row .desc b{
  font-weight:700;
}

.main-container #section1 .logo{
  position:absolute;
  left:50px;
  top:20px;
  z-index:10;
}

#section1{
  display:flex;
  justify-content: flex-end;
}

#section1 .section1_a{
  display:flex;
  justify-content: center;
  align-items:center;
  height:100%;
  width:100%;
  position:relative;
}

#section1 .section1_a .whoarewe{
  width:35%;
  line-height:1.5;
}

#section1 .section1_a .imagegroup{
  width:65%;
  display:flex;
  justify-content: flex-end;
  position:relative;
}

#section1 .imagegroup img{
  display:block;
  width:auto;
  max-width:100%;
  object-fit:contain;
  
}

#section1 .section1_a .imagegroup .hologram{
  max-width:580px;
  right:50px;
  position:relative;
}

#section1 .section1_a .imagegroup .coin{
  position:absolute;
  right:20px;
  bottom:-70px;
  width:300px;
}

#section1 img.net{
  position:absolute;
  display:block;
  width:auto;
  max-width:23%;
  object-fit:contain;
}

#section1 img.net1{
  left:0px;
  bottom:0px;
}

#section1 img.net2{
  top:0px;
  left:20%;
}

#section1 img.net3{
  right:-20px;
  bottom:-30px;
}

#section1 .circle{
  position:absolute;
  border-radius:100%;
  width:250px;
  height:250px;
}

#section1 .circle_blue{
  background:var(--maindeepblue);
  top:-130px;
  left:50%;
  transform:translateX(-50%);
}

#section1 .circle_purple{
  background:var(--mainpurple);
  bottom:-120px;
  left:-60px;
}

#section1 .section1_b{
  display:flex;
  justify-content: center;
  align-items:center;
  height:100%;
  width:100%;
  position:relative;
}

#section1 .section1_b .whoarewe{
  width:35%;
  line-height:1.5;
}

#section1 .section1_b .imagegroup{
  width:65%;
  display:flex;
  justify-content: flex-end;
  position:relative;
}

#section1 .section1_b .imagegroup img.futureoffice{
  max-width:100%;
  padding-right:100px;
}

.section_1_slider .swiper-pagination-vertical.swiper-pagination-bullets, 
.section_1_slider .swiper-vertical>.swiper-pagination-bullets{
  right:initial;
  left:0;
}

.section_1_slider .swiper-pagination-bullet{
  opacity: 1;
  background:none;
  border:1px solid var(--mainpurple);
  width:10px;
  height:10px;
}

.section_1_slider .swiper-pagination-bullet-active{
  background:var(--mainpurple);
}

.row#section2{
  height:100vh;
}

#section2 .section2_content{
  display:flex;
  align-items:center;
  padding:50px 0px;
  height:100%;
  width:100%;
  justify-content: space-between;
}

#section2 .section2_content .text{
  width:60%;
  padding-right:50px;
}

#section2 .desc b{
  color:var(--mainpurple);
}

#section2 .imagegroup{
  display:flex;
  justify-content: center;
  width:40%;
  position:relative;
  padding-right:20px;
}

#section2 .imagegroup img.float{
  position:absolute;
}

#section2 .imagegroup img{
  z-index:2;
  display:block;
  object-fit:contain;
}

#section2 .imagegroup img.apps{
  left:-20px;
  top:-9px;
  z-index:3;
}

#section2 .imagegroup img.bg{
  left:-25px;
  bottom:0px;
  z-index:1;
}

#section2 .imagegroup img.plus1{
  top:20px;
  left:0;
}

#section2 .imagegroup img.plus2{
  bottom:-10px;
  right:0;
}

#section2 .corner{
  position:absolute;
  top:-100px;
  right:-230px;
  display:block;
  width:auto;
  max-width:100%;
}


#section3{
  display:flex;
  height:100vh;
  padding:0;
}

#section3 .section3_left{
  width:30%;
  border-right:1px solid #b7b7b7;
  position:relative;
  z-index:2;
}

#section3 .section3_left .image{
  position:absolute;
  bottom:0;
  right:-130px;
  display:block;
  width:auto;
  max-width:100%;
}

#section3 .section3_left .float{
  position:absolute;
}

#section3 .section3_left .float.plus1{
  bottom:30%;
  right:170px;
}


#section3 .section3_left .float.plus2{
  bottom:150px;
  right:-200px;
}

#section3 .section3_right{
  width:70%;
  padding-right:50px;
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  padding-left:300px;
}

#section3 .section3_right .section3_content .imagegroup{
  display:flex;
  padding-top:30px;
  justify-content: space-around;
  gap:20px;
}

#section3 .section3_right .section3_content .imagegroup img{
  display:block;
  width:auto;
  max-width:100%;
  object-fit:contain;
}

#section3 .corner{
  position:absolute;
  bottom:-50%;
  left:-180px;
  display: block;
  width: auto;
  max-width: 100%;
  z-index:1;
}

#section3 .box-bg{
  position:absolute;
  left:0;
  top:0;
  width:50%;
  height:30%;
  border-right:1px solid #b7b7b7;
  border-bottom:1px solid #b7b7b7;
  background:url(../images/section3-bubble-bg.png);
  background-size:cover;
  background-repeat: no-repeat;
  z-index:2;
}

#section4{
  padding:80px 50px;
  display:flex;
  justify-content:flex-end;
  width:100%;
  padding-bottom:500px;
}

#section4 .corner{
  position:absolute;
  right:-10%;
  bottom:-300px;
  z-index:1;
  
}

#section4 .floating-line-right{
  position:absolute;
  right:50px;
  top:0;
  height:100%;
  width:1px;
  border-right:2px solid #ffffff;
  -webkit-box-shadow: 3px 1px 2px 0px rgba(0,0,0,0.1);
  -moz-box-shadow: 3px 1px 2px 0px rgba(0,0,0,0.1);
  box-shadow: 3px 1px 2px 0px rgba(0,0,0,0.1);
}

#section4 .section4_content{
  width:100%;
  max-width:800px;
  padding-right:50px;
  
  position:relative;
  z-index:1;
}

#section4 .section4_content .floatingline{
  position:absolute;
  left:15px;
  top:50px;
  height:100%;
  width:1px;
  border-right:2px solid #ffffff;
  -webkit-box-shadow: 3px 1px 2px 0px rgba(0,0,0,0.1);
  -moz-box-shadow: 3px 1px 2px 0px rgba(0,0,0,0.1);
  box-shadow: 3px 1px 2px 0px rgba(0,0,0,0.1);
 
}

#section4 img.float{
  position:absolute;
}

#section4 img.plus1{
  bottom:350px;
  left:200px;
}

#section4 img.plus2{
  right:70px;
  bottom:50px;
}

#section4 img.plus3{
  right:30%;
  top:20px;
}

#section4 .section4_content .section4_products{
  display:flex;
  width:100%;
  justify-content: space-evenly;
  padding:15px 20px;
  border:2px solid #ffffff;
  -webkit-box-shadow: 1px 3px 2px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 1px 3px 2px 0px rgba(0,0,0,0.1);
box-shadow: 1px 3px 2px 0px rgba(0,0,0,0.1);
}

#section4 .section4_content .section4_products a{
  color:var(--maindeepblue);
  font-weight:800;
  position:relative;
  font-size:18px;
}

#section4 .section4_content .section4_products a:before{
  position:absolute;
  content:"";
  bottom:-18px;
  left:0;
  width:0;
  background:var(--mainpurple);
  height:5px;
  transition:all ease 0.3s;
}

#section4 .section4_content .section4_products a.active:before,
#section4 .section4_content .section4_products a:hover:before{
  width:100%;
  transition:all ease 0.3s;
}

#section4 .section4_content .section4_products_list{
  padding-left:100px;
}

#section4 .section4_content .section4_products_list .section4_products_list_wrapper{
  padding-top:30px;
  min-height:550px;
}

#section4 .section4_content .section4_products_list .section4_products_list_wrapper ul{
  display:flex;
  justify-content: space-between;
  flex-wrap:wrap;
  width:100%;
}

#section4 .section4_content .section4_products_list .section4_products_list_wrapper ul li{
  width:47%;
  margin:20px 0px;
  display:flex;
  align-items:center;
}

#section4 .section4_content .section4_products_list .section4_products_list_wrapper ul li .icon img{
  display:block;
  width:auto;
  max-width:100%;
  object-fit:contain;
}

#section4 .section4_content .section4_products_list .section4_products_list_wrapper ul li p{
  padding-left:20px;
  width:calc(100% - 76px);
}

#section5{
  width:100%;
  padding:0 0 ;
}

#section5 .section5-title{
  display:flex;
}

#section5 .section5-title .left{
  width:50%;
  padding-left:50px;
  padding-right:10px;
  padding-top:100px;

  color: var(--maindeepblue);
  font-weight: 800;
  font-size: 40px;
  position: relative;
  padding-bottom:50px;
  line-height: 1.3;
  text-transform:capitalize;
}

#section5 .section5-title .left .float{
  position:absolute;
  right:50px;
  top:50px;
}

#section5 .section5-title .right{
  width:50%;
  background:url(../images/section5-line-bg.jpg);
  background-size:cover;
  position:relative;
}

#section5 .section5-title .right:before{
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 1px;
  border-left: 2px solid #ffffff;
  -webkit-box-shadow: 1px 1px 1px 0px rgb(0 0 0 / 10%);
  -moz-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.1);
  box-shadow: 1px 1px 1px 0px rgb(0 0 0 / 10%);
  content:"";
}

.section5-content{
  padding:60px 50px;
  display:flex;
  position:relative;
}

.section5-content .s5-count{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:2px;
  background:#ffffff;
  -webkit-box-shadow: 1px 2px 1px 0px rgb(0 0 0 / 10%);
  -moz-box-shadow: 1px 2px 1px 0px rgba(0,0,0,0.1);
  box-shadow: 1px 2px 1px 0px rgb(0 0 0 / 10%);
}

.section5-content .s5-count span{
  position:absolute;

  top:-15px;

  width:30px;
  height:30px;
  background:var(--mainpurple);
  border-radius:100%;
  display:flex;
  align-items:center;
  justify-content: center;
  color:#ffff;
}

.section5-content#s5-1 .s5-count span{
  left:50px;
}

.section5-content#s5-2 .s5-count span{
  left:100px;
}

.section5-content#s5-3 .s5-count span{
  left:150px;
}

.section5-content#s5-4 .s5-count span{
  left:200px;
}

.section5-content#s5-5 .s5-count span{
  left:250px;
}

.section5-content#s5-6 .s5-count span{
  left:300px;
}

.section5-content#s5-7 .s5-count span{
  left:350px;
}

.section5-content .left{
  width: 350px;
  color: var(--maindeepblue);
  font-weight: 600;
  font-size: 30px;
  text-transform: capitalize;
}

.section5-content .right{
  width:calc(100% - 350px);
  padding-left:20px;
  color: var(--maindeepblue);
  font-size:20px;
  line-height:1.3;
}

#section6{
  padding:0 0;
}

#section6 .corner{
  position:absolute;
  left:-350px;
  top:-220px;
}

#section6 .section6-pricing{
  position:relative;
  padding-bottom:30px;
}

#section6 .whiteline-bg{
  position:absolute;
  right:0;
  top:0;
  width:100px;
  height:300px;
  background:url(../images/section6-line-bg.jpg);
}

#section6 .whiteline-bg:before {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 1px;
  border-left: 2px solid #ffffff;
  -webkit-box-shadow: 1px 1px 1px 0px rgb(0 0 0 / 10%);
  -moz-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.1);
  box-shadow: 1px 1px 1px 0px rgb(0 0 0 / 10%);
  content: "";
}

#section6 .whiteline-bg:after{
  content:"";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 300px;
  height: 2px;
  background: #ffffff;
  -webkit-box-shadow: 1px 2px 1px 0px rgb(0 0 0 / 10%);
  -moz-box-shadow: 1px 2px 1px 0px rgba(0,0,0,0.1);
  box-shadow: 1px 2px 1px 0px rgb(0 0 0 / 10%);
}

#section6 .section6-pricing .row-title{
  position:absolute;
  left:50px;
  top:50px;
  z-index:10;
}

.section6-slider-cover{
  position:relative;
  max-width:750px;
  margin:0 auto;
}

#section6 .section6-pricing .section6-slider{
  padding-top:200px;
  padding-bottom:65px;
  
}

#section6 .section6-pricing .section6-slider .product-cover{
  width:250px;
  height:360px;
  border-radius:50px;
  position:relative;
}

#section6 .section6-pricing .section6-slider .product-cover img.bg{
  position:absolute;
  left:0;
  top:-147px;
  width:100%;
  display:block;
  object-fit:contain;
}

#section6 .section6-pricing .section6-slider .product-cover img.product_img{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:105px;
  display:block;
  object-fit:contain;
  width:auto;
  max-width:90%;
  max-height:100px;
}

#section6 .section6-pricing .section6-slider .product-cover .product-info{
  position:absolute;
  top:220px;
  left:0;
  width:100%;
  padding:0px 20px;
  margin:0 auto;
  text-align:center;
  color:var(--maindeepblue);
}

#section6 .section6-pricing .section6-slider .product-cover .product-info .product-package b{
  font-weight:800;
  display:block;
  font-size:16px;
  
}

#section6 .section6-pricing .section6-slider .product-cover .product-info .product-package p{
  font-size:14px;
  line-height:1.3;
  padding-bottom:5px;
}

#section6 .section6-pricing .section6-slider .product-cover .product-info .product-fees{
  display:inline-block;
  padding:5px 10px;
  background:#000000;
  color:#ffffff;
  margin:0 auto;
  font-size:15px;
}

#section6 .section6-pricing .section6-slider .product-cover .product-info .product-monthlyfee{
  font-size:35px;
  padding-top:5px;
}

#section6 .section6-pricing .section6-slider .product-cover .product-info .product-monthlyfee b{
  font-size:14px;
  display:inline-block;
  vertical-align:super;
}

#section6 .section6-pricing .section6-slider .product-cover .product-info .product-monthlyfee span{
  font-size:14px;
  display:inline-block;
  vertical-align:baseline;
}

#section6 .section6-pricing .section6-slider .swiper-slide-prev,
#section6 .section6-pricing .section6-slider .swiper-slide-next,
#section6 .section6-pricing .section6-slider .swiper-slide-duplicate-prev,
#section6 .section6-pricing .section6-slider .swiper-slide-duplicate-next{
  transform:scale(1);
  transition:all ease 0.3s;
  filter: grayscale(1) blur(1px); 
  z-index:1;
}

#section6 .section6-pricing .section6-slider .swiper-slide-active{
  transform:scale(1.3);
  transition:all ease 0.3s;
  z-index:2;
}

#section6 .section6-pricing .section6-slider-cover .section6-slider-next{
  position:absolute;
  right:-50px;
  top:50%;
  transform:translateY(-50%) rotate(-30deg);
  z-index:3;
  cursor:pointer;
}

#section6 .section6-pricing .section6-slider-cover .section6-slider-prev{
  position:absolute;
  left:-50px;
  top:50%;
  transform:translateY(-50%) rotate(30deg);
  z-index:3;
  cursor:pointer;
}

#section6 .section6-pricing .section6-slider-cover .triangle,
#section6 .section6-pricing .section6-slider-cover .triangle:before,
#section6 .section6-pricing .section6-slider-cover .triangle:after {
	width:  20px;
	height: 20px;
	position: relative;
	background: var(--maindeepblue);
	border-top-right-radius: 30%;
	margin: 30% auto 0;
  transition:all ease 0.3s;
}

#section6 .section6-pricing .section6-slider-cover .section6-slider-button:hover .triangle,
#section6 .section6-pricing .section6-slider-cover .section6-slider-button:hover .triangle:before,
#section6 .section6-pricing .section6-slider-cover .section6-slider-button:hover .triangle:after{
	background: purple;
  transition:all ease 0.3s;
}

#section6 .section6-pricing .section6-slider-cover .triangle:before,
#section6 .section6-pricing .section6-slider-cover .triangle:after {
	content: '';
	position: absolute;
	margin: 0;
}

#section6 .section6-pricing .section6-slider-cover .triangle {
	transform: rotate(-60deg) skewX(-30deg) scale(1,.866);
}
#section6 .section6-pricing .section6-slider-cover .triangle:before {
	transform: rotate(-135deg) skewX(-45deg) scale(1.414,.707) translate(0,-50%);
}
#section6 .section6-pricing .section6-slider-cover .triangle:after {
	transform: rotate(135deg) skewY(-45deg) scale(.707,1.414) translate(50%);
}


#section6 .section6-pricing-content{
  position:relative;
  padding:0px 0px;
}

#section6 .section6-pricing-content:before{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 2px;
  background: #ffffff;
  -webkit-box-shadow: 1px 2px 1px 0px rgb(0 0 0 / 10%);
  -moz-box-shadow: 1px 2px 1px 0px rgba(0,0,0,0.1);
  box-shadow: 1px 2px 1px 0px rgb(0 0 0 / 10%);
  content:"";
}

#section6 .section6-pricing-content .pricing-comparison{
  display:flex;
}

#section6 .section6-pricing-content .pricing-comparison .package-price,
#section6 .section6-pricing-content .pricing-comparison .package-features{
  width:50%;
}

#section6 .section6-pricing-content .pricing-comparison .package-price{
  text-align:right;
  padding:50px 50px;
  position:relative;
}

#section6 .section6-pricing-content .pricing-comparison .package-price:after{
  position:absolute;
  content:"";
  top:0;
  right:-1px;
  height:100%;
  width:3px;
  background:#ffffff;
  -webkit-box-shadow: 1px 1px 1px 0px rgb(0 0 0 / 10%);
  -moz-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.1);
  box-shadow: 1px 1px 1px 0px rgb(0 0 0 / 10%);
  content: "";
}

#section6 .section6-pricing-content .pricing-comparison .package-price .packagelevel{
  font-weight:800;
  display:block;
  font-size:30px;
  color:var(--maindeepblue);
  padding-bottom:5px;
}

#section6 .section6-pricing-content .pricing-comparison .package-price .packagetype{
  color:#898989;
  display:inline-block;
  font-size:28px;
  padding-bottom:5px;
  border-bottom:3px solid #000000;
}

#section6 .section6-pricing-content .pricing-comparison .package-price .packageprice{
  padding:50px 0px;
  color:purple;
}


#section6 .section6-pricing-content .pricing-comparison .package-price .packageprice .monthly{
  font-size:50px;
  font-weight:700;
  display:block;
}

#section6 .section6-pricing-content .pricing-comparison .package-price .packageprice .monthly b{
  font-size:23px;
  display:inline-block;
  vertical-align:super;
  font-weight:400;
}

#section6 .section6-pricing-content .pricing-comparison .package-price .packageprice .monthly span{
  font-size:24px;
  display:inline-block;
  font-weight:400;
  vertical-align:baseline;
}

#section6 .section6-pricing-content .pricing-comparison .package-price .packageprice p{
  display: inline-block;
  padding: 5px 10px;
  background: var(--mainpurple);
  color: #ffffff;
  margin: 0 auto;
  font-size: 15px;
  padding-top:5px;
}

#section6 .section6-pricing-content .pricing-comparison .package-price a{
  display:inline-block;
  padding:20px 50px;
  border-radius:30px;
  background:var(--maindeepblue);
  color:#ffffff;
  font-size:20px;
  text-transform: capitalize;
}

#section6 .section6-pricing-content .pricing-comparison .package-price a:hover{
  background:var(--mainpurple);
}

#section6 .section6-pricing-content .pricing-comparison .package-features{
  padding:50px 50px;
}

#section6 .section6-pricing-content .pricing-comparison .package-features .package_setup_fees{
  display:inline-block;
  padding-bottom:5px;
  border-bottom:3px solid var(--mainpurple);
}

#section6 .section6-pricing-content .pricing-comparison .package-features .package_setup_fees p{
  color: var(--maindeepblue);
  font-weight:700;
  text-transform:capitalize;
  font-size:20px;
  line-height:1.3;
}

#section6 .section6-pricing-content .pricing-comparison .package-features ul.features-list{
  padding:30px 0px;
}

#section6 .section6-pricing-content .pricing-comparison .package-features ul.features-list li{
  padding:10px 0px 10px 45px;;
  position:relative;
  font-size:20px;
}

#section6 .section6-pricing-content .pricing-comparison .package-features ul.features-list li:before{
  content:"";
  position:absolute;
  left:0;
  top:8px;
  width:27px;
  height:19px;
  background:url(../images/list-tick.png);
  background-repeat: no-repeat;
  background-size:contain;
}

#section7{
  padding:50px 50px;
}

#section7 .section7-contactus{
  position:relative;
  z-index:1;
}

#section7 .section7-contactus .office-info{
  display:flex;
  padding-top:30px;
  flex-wrap:wrap;
}

#section7 .section7-contactus .office-info a{
  color:var(--mainpurple);
  text-decoration: underline;
  font-size:20px;
  margin-right:40px;
  margin-top:5px;
  margin-bottom:5px;
}

#section7 .section7-contactus .contactus-form{
  padding:70px 0px;
  display:flex;
  flex-wrap:wrap;
  justify-content: space-between;
}

#section7 .section7-contactus .contactus-form .input-cover{
  width:32%;
  margin-bottom:30px;
}

#section7 .section7-contactus .contactus-form .input-cover.full{
  width:100%;
}

#section7 .section7-contactus .contactus-form .input-cover .input-field{
  border:none;
  border-bottom:1px solid #000000;
  padding-bottom:10px;
  background:none;
  width:100%;
  font-size:20px;
}

#section7 .section7-contactus .contactus-form .input-cover .submit{
  display:inline-block;
  width:200px;
  text-align:center;
  color:#ffffff;
  padding:13px 10px;
  border-radius:30px;
  background:var(--maindeepblue);
  margin-top:30px;
  cursor:pointer;
  transition:all ease 0.3s;
  border:none;
  font-size:20px;
}

#section7 .section7-contactus .contactus-form .input-cover .submit:hover{
  background:var(--mainpurple);
  transition:all ease 0.3s;
}

#section7 .section7-contactus .socialmedia-link{
  font-size:20px;
}

#section7 .section7-contactus .socialmedia-link p{
  color:var(--maindeepblue);
  font-weight:600;
  padding-bottom:5px;
}

#section7 .section7-contactus .socialmedia-link .links{
  display:flex;
}

#section7 .section7-contactus .socialmedia-link .links a{
  color:var(--maindeepblue);
  margin-right:10px;
}

#section7 .section7-contactus .socialmedia-link .links a:hover{
  transform:scale(1.1);
  color:var(--mainpurple);
}

#section7 .corner{
  position:absolute;
  right:0;
  bottom:-90px;
  object-fit:contain;
  display:block;
  z-index:0;
  max-width:500px;
}

#footer{
  display:flex;
  justify-content: space-between;
  align-items:center;
  background:#000000;
  padding:40px 50px;
  gap:20px;
  border-bottom:none;
}

#footer .policy{
  display:flex;
  align-items:center;
}

#footer .policy a{
  color:#ffffff;
  position:relative;
}

#footer .policy a:before{
  position:absolute;
  content:"";
  width:0;
  bottom:0;
  left:0;
  height:1px;
  background:#ffffff;
  transition:all ease 0.3s;
}

#footer .policy a:hover:before{
  width:100%;
  transition:all ease 0.3s;
}

#footer .policy b{
  display:inline-block;
  padding:0px 10px;
  color:#ffffff;
}

#footer .logo img{
  display:block;
  object-fit:contain;
  width:auto;
  max-width:100%;
}

#footer .copyright{
  color:#ffffff;
}





#section_aboutus{
  position:relative;
  min-height:700px;
}

.main-container #section_aboutus .logo {
  position: absolute;
  left: 50px;
  top: 20px;
  z-index: 10;
}

#section_aboutus .net{
  position:absolute;
  max-width:300px;
}

#section_aboutus .net1{
  right:-82px;
  top:20%;
}

#section_aboutus .net2{
  left:-80px;
  top:30%;
  width:200px;
}


#section_aboutus .row-cover{
  padding:80px 100px;
}

#section_aboutus .row-cover .title{
  font-size:40px;
  font-weight:800;
  line-height:1.3;
  padding-top:50px;
}

#section_aboutus .row-cover .desc{
  position:relative;
  padding:50px 0px 0px 0px;
  margin:0 auto;
  max-width:900px;
}

#section_aboutus .row-cover .desc img{
  display:block;
  object-fit:contain;
  width:auto;
  max-width:100%;
}

#section_aboutus .row-cover .desc p{
  position:absolute;
  max-width:400px;
  bottom:50px;
  left:0;
}

#section_aboutus .row-cover .quote{
  border:2px solid #ffffff;
  padding:50px 50px;
  text-align:center;
  font-weight:600;
  max-width:900px;
  margin:0 auto;
  line-height:1.5;
}

#ourteam{
  padding:80px 50px;
}

#ourteam .team-profile{
  display:flex;
  flex-wrap:wrap;
}

#ourteam .team-profile .personal-profile{
  width:33.33%;
}

#ourteam .team-profile .personal-profile .personal-image{
  background:#d8dfe5;
  display:flex;
  align-items:center;
  justify-content: center;
  height:268px;
  overflow:hidden;
}

#ourteam .team-profile .personal-profile .personal-image img{
  display:block;
  width:auto;
  max-width:100%;
  object-fit:contain;
}

#ourteam .team-profile .personal-profile .personal-info{
  text-align:center;
  padding:30px 10px;
}

#ourteam .team-profile .personal-profile .personal-info p{
  font-weight:800;
  line-height:1.3;
}

#ourteam .team-profile .personal-profile .personal-info span{
  display:block;
  color:#a1a1a1;
  margin:0 auto;
  line-height:1.3;
}

.mobile-trigger{
  display:none;
}

.popup-wrapper{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,.5);
  z-index:10;
}

.popup-wrapper .popup-content{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border-radius:5px;
  background:#ffffff;
  width:95%;
  max-height:90vh;
  max-width:500px;
  padding:30px 30px;
}

.popup-wrapper .popup-content .title{
  color:var(--maindeepblue);
  font-size:30px;
  font-weight:700;
  padding-bottom:5px;
  border-bottom:4px solid var(--mainpurple);
  margin-bottom:20px;
}

.popup-wrapper .popup-content p{
  font-size:16px;
  color:000000;
  line-height:1.3;
  padding-bottom:20px;
}

.popup-wrapper .popup-content a{
  cursor:pointer;
  color:#ffffff;
  background:var(--maindeepblue);
  padding:10px 30px;
  display:inline-block;
  border-radius:5px;
}

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



  #section1 .section1_a .imagegroup .hologram{
    max-width:100%;
    right:initial;
    left:0;
  }
  
  #section1 .section1_a .whoarewe{
    width:500px;
  }

  #section3 .section3_right{
    padding-left:0;
    padding-top:50px;
    padding-bottom:50px;
  }

  #section3 .section3_left .image{
    max-width:200px;
    right:initial;
    left:0;
  }
}

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

  #section_aboutus .row-cover .desc p{
    bottom:10px;
  }

  #section6 .section6-pricing .section6-slider-cover .section6-slider-next{
    right:0px;
  }

  #section6 .section6-pricing .section6-slider-cover .section6-slider-prev{
    left:0px;
  }

  #section3{
    height:auto;
    min-height:100vh;
  }

  #section4 .corner{
    width:auto;
    max-width:100%;
    bottom:-200px;
    right:0;
  }

  #section4{
    padding-bottom:300px;
  }

  #section4 .section4_content .floatingline{
    display:none;
  }

  #section4 .corner{
    bottom:-100px;
  }

  .section5-content .left{
    width:250px;
  }

  .section5-content .right{
    width:calc(100% - 250px);
  }
}

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

  #ourteam .team-profile .personal-profile{
    width:50%;
  }

  .navigation-content.show .left-content,
  .navigation-content.show .left-content, .navigation-content.show .right-content{
    padding:80px 40px;
  }

  #section_aboutus .row-cover{
    padding:80px 0px;
  }
}

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

  #section_aboutus .net{
    display:none;
  }

  #section_aboutus .row-cover .desc p{
    position:relative;
    max-width:100%;
  }

  #section6 .section6-pricing-content .pricing-comparison{
    flex-wrap:wrap;
  }

  #section6 .section6-pricing-content .pricing-comparison .package-price,
  #section6 .section6-pricing-content .pricing-comparison .package-features{
    width:100%;
    text-align:left;
    padding-top:20px;
    padding-bottom:20px;
  }

  #section6 .section6-pricing-content .pricing-comparison .package-price{
    padding-top:40px;
  }

  #section6 .section6-pricing-content .pricing-comparison .package-price .packageprice{
    padding:30px 0px;
  }

  

  #section6 .section6-pricing .section6-slider .product-cover{
    margin:0 auto;
  }

  #section6 .section6-pricing .section6-slider-cover .section6-slider-next{
    right:40px;
  }

  #section6 .section6-pricing .section6-slider-cover .section6-slider-prev{
    left:40px;
  }

  .navigation-content.show .left-content, 
  .navigation-content.show .right-content{
    padding:30px 20px;
    justify-content: flex-start;
  }
  
  .navigation-content.show .left-content{
    width:100%;
    height:70%;
    top:0;
 
  }

  .navigation-content.show .left-content .links a{
    margin:10px 0px;
    font-size:30px;
  }

  .navigation-content.show .right-content{
    width:100%;
    top:initial;
    height:30%;
    bottom:0;

  }

  .navigation-content .left-content,
  .navigation-content .right-content{
    width:100%;
  }

  
  .navigation-content.show .right-content b{
    padding-bottom:10px;
  }

  .navigation-content.show .right-content p{
    padding-bottom:0px;
  }


  #footer{
    flex-wrap:wrap;
    justify-content: center;
  }

  #footer > div{
    width:100%;
    justify-content: center;
    text-align:center;
  }

  #footer .logo img{
    margin:0 auto;
  }


  .section5-content{
    flex-wrap:wrap;
  }

  .section5-content .left,
  .section5-content .right{
    width:100%;
    padding-left:0;
  }

  .section5-content .left{
    padding-bottom:10px;
  }

  #section4 .section4_content .section4_products_list{
    padding-left:0;
  }

  #section3 .section3_left{
    display:none;
  }

  #section3 .section3_right{
    width:100%;
    padding-left:50px;
  }


  #section1 .section1_a{
    flex-wrap:wrap;
  }

  #section1 .section1_a .imagegroup,
  #section1 .section1_b .imagegroup{
    display:none;
  }

  #section1 .section1_a .whoarewe,
  #section1 .section1_b .whoarewe{
    width:100%;
    padding-right:20px;
  }

  #section2 .section2_content{
    flex-wrap:wrap;
  }

  #section2 .section2_content .text,
  #section2 .section2_content .imagegroup{
    width:100%;
  }

  #section2 .section2_content .text{
    padding-right:0;
    padding-bottom:50px;
  }

  .row#section2{
    height:auto;
  }


  #section2 .imagegroup{
    transform:scale(0.8);
  }

  .section_1_slider .swiper-pagination-vertical.swiper-pagination-bullets, .section_1_slider .swiper-vertical>.swiper-pagination-bullets{
    right:0;
    left:initial;
  }

  #section4 img.float{
    display:none;
  }

  #section5 .section5-title .right{
    display:none;
  }

  #section5 .section5-title .left{
    width:100%
  }

  #section5{
    background-size:contain;
  }

  #section7 .section7-contactus .contactus-form .input-cover{
    width:100%;
  }


  #section7 .corner{
    max-width:300px;
    bottom:-50px;
  }
}

@media only screen and (max-width: 650px){
  #ourteam .team-profile .personal-profile{
    width:100%;
  }
}


@media only screen and (max-width: 600px){
  #section4 .section4_content .section4_products_list .section4_products_list_wrapper ul li{
    width:100%;
  }
}


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

  #ourteam{
    padding:40px 20px;
  }

  .main-container #section_aboutus .logo{
    left:20px;
  }

  #section6 .section6-pricing-content .pricing-comparison .package-price, #section6 .section6-pricing-content .pricing-comparison .package-features{
    padding:20px 20px;
  }

  #section6 .section6-pricing-content .pricing-comparison .package-price{
    padding-top:40px;
  }

  .navigation-content{
    width:100%;
  }


  #section7{
    padding:50px 20px;
  }

  #section7 .corner{
    position:relative;
    bottom:initial;
    max-width:100%;
  }

  #section5 .section5-title .left{
    padding-left:20px;
    padding-top:50px;
  }

  .section5-content{
    padding:60px 20px;
  }

  #section4 .corner{
    display:none;
  }

  #section4{
    padding:80px 20px;
  }

  #section3 .section3_right{
    padding:0px 20px;
  }

  .mobile-trigger{
    display:block;
    font-size:26px;
  }

  .navigation-bar{
    width:50px;
    height:50px;
    top:0;
    right:0;
    padding:0 0;
    border-left:0;
    justify-content: center;
    cursor:pointer;
    z-index:9999;
  }

  .navigation-bar a.pricing,
  .navigation-bar .menu-trigger{
    display:none;
  }

  .main-container #section1 .logo{
    left:20px;
    margin:10px 0px;
  }

  #section1 .circle{
    width:150px;
    height:150px;
  }

  #section1 .circle_purple{
    bottom:-75px;
    left:-75px;
  }

  #section1 .circle_blue{
    display:none;
  }

  #section1 img.net{
    width:auto;
    max-width:200px;
    display:none;
  }

  .row{
    padding:0px 20px;
  }

  .go.desc .line{
    display:inline-block !important;
    width:auto !important;
  }

  #section2 .imagegroup img.plus1,
  #section2 .imagegroup img.plus2{
    display:none;
  }

  #section2 .imagegroup img.bg{
    left:-30px;
    max-width:350px;
  }

  #section2 .imagegroup img.apps{
    left:-30px;
    max-width:350px;
  }

  .main-container{
    padding-right:0;
  }
}

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

  #section_aboutus .row-cover .quote{
    padding:30px 30px;
  }


  #section6 .section6-pricing .section6-slider .swiper-slide-active{
    transform:scale(1);
  }

 
}

@media only screen and (max-width: 414px){
  .navigation-content.show .left-content .links a{
    font-size:23px;
  }

  .navigation-content.show .left-content .links .sub-links{
    padding-top:10px;
  }

  .navigation-content.show .left-content .links .sub-links a{
    font-size:18px;
  }
}

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

  .navigation-content.show .left-content .links a{
    font-size:20px;
  }

  .navigation-content.show .right-content b,
  .navigation-content.show .right-content p{
    font-size:16px;
  }
}

@media (max-width:900px) and (max-height: 450px) and (orientation: landscape){
  .navigation-content.show .left-content .links a{
    font-size:20px;
    margin:8px 0px;
  }

  #section1 .circle{
    width:150px;
    height:150px;
  }

  #section1 .circle_purple{
    bottom:-75px;
    left:-75px;
  }

  #section1 .circle_blue{
    top:-75px;
    right:-75px;
    left:initial;
  }

  #section1 .section1_b .whoarewe{
    width:500px;
  }

  .navigation-content.show .right-content p,
  .navigation-content.show .right-content b{
    font-size:18px;
  }

  .navigation-content .left-content{
    width:60%;
    left:0;
    top:-100%;
    height:100%;
  }

  .navigation-content.show .left-content{
    width:50%;
    height:100%;
  }
  
  
  .navigation-content .right-content{
    width:40%;
    right:0;
    top:100%;
    height:100%;
  }

  .navigation-content.show .right-content{
    width:50%;
    height:100%;
  }

  .row#section2{
    height:auto;
  }
}

@media (max-width:768px) and (max-height: 450px) and (orientation: landscape){
  #section1 .section1_a .whoarewe .desc, 
  #section1 .section1_b .whoarewe .desc{
    font-size:13px;
  }

  .whoarewe .row-title p{
    font-size:20px;
    margin-bottom:15px;
  }
}

@media (max-width:350px) and (max-height: 480px){
  #section1 .section1_a .whoarewe .desc, 
  #section1 .section1_b .whoarewe .desc{
    font-size:13px;
  }

  .whoarewe .row-title p{
    font-size:20px;
    margin-bottom:15px;
  }
}

@media (max-width:480px) and (max-height: 350px) and (orientation: landscape){
  .navigation-content.show .left-content .links a{
    font-size:18px;
    margin:5px 0px;
  }
}