/*---------------

COLOR : #74c209;

--------------*/


.swal2-container {
  z-index: 10000 !important;
}

*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

*:focus {
	outline: 0 !important;
}

::placeholder{
	color: #da4bfd;
}


@font-face {
	font-family: circular-medium;
	src: url(../fonts/CircularStd-Medium.otf);
}
/*
@font-face {
	font-family: epilogue-medium;
	src: url(../fonts/Epilogue-Medium.ttf);
}


@font-face {
	font-family: epilogue-regular;
	src: url(../fonts/Epilogue-Regular.ttf);
}

@font-face {
	font-family: cera-pro-medium;
	src: url(../fonts/cera_pro_medium.otf);
}


*/

html, 
body {
	font-family: 'circular-medium', serif;
	scroll-behavior: smooth;
	margin: 0!important;
	padding: 0!important;
  width: 100%;
	font-smoothing:antialiased;
	background: #490FB4;
}

body{
	overflow-x: hidden;
}

a{
	text-decoration: none !important;
	cursor: pointer;
}


a:hover{
	color: #da4bfd !important;
}


.navbar{
	padding: 1vw 12vw 1vw 12vw;
	background: transparent !important;
	z-index: 9999;
}


.navbar .nav-logo{
	width: 8vw;
}


.navbar ul li{
	margin-right: 1.5vw;
}

.navbar ul li a{
	color: #FFFFFF !important;
	font-size: 14px;
	text-transform: uppercase;
}


.dropdown-menu{
	background: #490FB4;
}

.dropdown-menu a:hover{
	color: #000000 !important;
}

#signin-btn{
	color: #fff;
    background: #da4bfd;
    border: 1px solid #da4bfd;
    border-color: #da4bfd;
    font-size: 14px;
    min-width: 7vw;
}



#Banner{
	padding: 10vw 12vw 8vw 12vw;
	position: relative;
	  overflow: hidden;
    background: url(../images/banner-bg.svg) no-repeat center / cover;
    background-attachment: fixed;
    margin-top: -7vw;
}

#Banner h1{
	color: #FFFFFF;
	font-weight: bolder;
	font-size: 3vw;
	max-width: 14ch;
	margin-top: 4vw;
}

#Banner p{
	color: #FFFFFF;
	font-size: 14px;
	margin-top: 1vw;
	max-width: 50ch;
}


#Banner img{
	width: 100%;
	animation-name: floating;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

#Banner button{
	  color: #fff;
    background: #da4bfd;
    border: 1px solid #da4bfd;
    border-color: #da4bfd;
    text-transform: uppercase;
    letter-spacing: 1px;
    min-width: 7vw;
    border-radius: 5px;
    position: relative;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    padding: 0.8vw 1.5vw;
    margin-top: 1vw;
    font-size: 16px;
}



@keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 30px); }
    100%   { transform: translate(0, -0px); }   
}



#Works{
	padding: 6vw 12vw 6vw 12vw;
	position: relative;
	background: #470fac;
}


#Works h3{
  color: #da4bfd;
  font-size: 0.9vw;
  font-weight: 300;
}

#Works h2{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 2.2vw;
}

#Works p{
	font-size: 14px;
	color: #dadada;
	margin-top: 1vw;
}

#Works .second-row{
	margin-top: 3vw;
}





.work-box {
    position: relative;
    width: 70%;
    margin: 0 auto;
}

.work-box-bg {
    background: url(../images/work-petern.png);
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    animation: ripple 5s infinite;
    transition: all 400ms ease;
}


.rotation-img {
    -webkit-animation: rotation 15s infinite linear;
    height: auto;
    width: 100%;
    max-width: 100%;
    position: relative;
}


@keyframes ripple{0%{transform: scale(0.8);}50%{transform: scale(1.2);}100%{transform: scale(0.8);}}
@-webkit-keyframes rotation {from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(359deg);}}




#Works h4{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 1.8vw;
	margin-top: 3vw;
}


#Works ul{
	margin-top: 1vw;
	list-style-type: none;
}

#Works ul li{
	color: #dadada;
	font-size: 14px;
	margin-bottom: 1vw;
	padding-left: 2vw;
	position: relative;
}

#Works ul li img{
	position: absolute;
	left: 0%;
	width: 0.8vw;
}




#Features{
	padding: 6vw 12vw 6vw 12vw;
	position: relative;
	background: #490FB4;
	overflow: hidden;
  background: url(../images/wave.png);
  background-position: center center;
   background-repeat: no-repeat;
  background-attachment: fixed;
}

#Features h3{
  color: #da4bfd;
  font-size: 0.9vw;
  font-weight: 300;
}

#Features h2{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 2.2vw;
}

#Features p{
	font-size: 14px;
	color: #dadada;
	margin-top: 1vw;
}


#Features .col-sm-4{
	margin-top: 3vw;
	margin-bottom: 1vw;
}

#Features .col-sm-4 img{
	margin-bottom: 1.5vw;
}


#Features h4{
	font-weight: bold;
	font-size: 1.4vw;
	color: #FFFFFF;
}



#Team{
	padding: 6vw 12vw 6vw 12vw;
	position: relative;
	background: #490FB4;
	overflow: hidden;
  background: url(../images/wave.png);
  background-position: center center;
   background-repeat: no-repeat;
  background-attachment: fixed;
}


#Team h3{
  color: #da4bfd;
  font-size: 0.9vw;
  font-weight: 300;
}

#Team h2{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 2.2vw;
}

#Team p{
	font-size: 14px;
	color: #dadada;
	margin-top: 1vw;
}

#Team h4{
	color: #FFFFFF;
	font-size: 1.2vw;
}

#Team .col-sm-6{
	margin-top: 4vw;
	margin-bottom: 3vw;
}

#Team .team-member{
	width: 6.5vw;
	height: 6.5vw;
	object-fit: cover;
	border-radius: 50%;
	border: 4px solid #DA4BFD;
}

#Team .social-ico{
	width: 1.2vw;
	margin-right: 1vw;
}





#Blog{
	padding: 6vw 12vw 6vw 12vw;
	position: relative;
	background: #490FB4;
	overflow: hidden;
}


#Blog h3{
  color: #da4bfd;
  font-size: 0.9vw;
  font-weight: 300;
}

#Blog h2{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 2.2vw;
}

#Blog p{
	font-size: 14px;
	color: #dadada;
	margin-top: 1vw;
}


#blog_slider{
	margin-top: 3vw;
}

#blog_slider .item img{
	width: 100%;
	height: 12vw;
	border-radius: 10px;
	object-fit: cover;
}


#blog_slider .item h4{
	color: #FFFFFF;
	font-size: 1vw;
	margin-top: 1vw;
}


#blog_slider .item a{
	font-size: 0.9vw;
	color: #da4bfd;
}


.owl-theme .owl-dots .owl-dot span{
	width: 15px !important;
	margin-top: 3vw !important;
}


.owl-theme .owl-dots .owl-dot.active span{
    background: #da4bfd !important;
}




#App{
	padding: 6vw 12vw 6vw 12vw;
	position: relative;
	background-color: #470FAC;
	background: url(../images/apps-bg.svg) no-repeat;
  background-attachment: fixed;
  overflow: hidden;
}


#App h3{
  color: #da4bfd;
  font-size: 0.9vw;
  font-weight: 300;
}

#App h2{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 2.2vw;
}

#App p{
	font-size: 14px;
	color: #dadada;
	margin-top: 1vw;
}



#App ul{
	margin-top: 2vw;
	list-style-type: none;
}

#App ul li{
	color: #dadada;
	font-size: 14px;
	margin-bottom: 1vw;
	padding-left: 2vw;
	position: relative;
}

#App ul li img{
	position: absolute;
	left: 0%;
	width: 0.8vw;
}


#App button{
	  color: #fff;
    background: #da4bfd;
    border: 1px solid #da4bfd;
    border-color: #da4bfd;
    text-transform: uppercase;
    letter-spacing: 1px;
    min-width: 7vw;
    border-radius: 5px;
    position: relative;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    padding: 0.8vw 1.5vw;
    margin-top: 1vw;
    font-size: 16px;
}


#App .app-img{
	position: absolute;
	width: 80%;
	left: 0%;
	bottom: -26%;
}



footer{
	padding: 6vw 12vw 6vw 12vw;
	position: relative;
	background: #470fac !important;
	overflow: hidden;
  background: url(../images/wave.png);
  background-position: center center;
  background-repeat: no-repeat;

}


footer .footer-logo{
		width: 6vw;
		margin-bottom: 1vw;
}


footer ul{
	list-style-type: none;
	margin-top: 1vw;
}

footer ul li{
	margin-bottom: 0.8vw;
}

footer ul li a{
	color: #FFFFFF;
	font-size: 14px;
}


footer hr{
	border-top: 1px solid #FFFFFF;
	margin-top: 2vw;
}


footer p{
	color: #FFFFFF;
	font-size: 16px;
	margin-top: 1vw;
}


footer p a{
	color: #da4bfd;
	font-size: 16px;
}


footer .links{
	padding-top: 1vw;
}


footer .links a{
	margin: 0 auto;
	font-size: 14px;
	color: #FFFFFF;
	margin-right: 1vw;
	float: right;
}

footer .search{
	width: 100%;
	position: relative;
}

footer .search input{
	    border-radius: 5px;
	    width: 100%;
	    background: #5d19db;
	    border: none;
	    color: #FFFFFF;
	    padding: 0.8vw 1vw;
	    font-size: 16px;
}



footer .search button{
	  color: #fff;
    background: #da4bfd;
    border: 1px solid #da4bfd;
    border-color: #da4bfd;
    text-transform: uppercase;
    letter-spacing: 1px;
    min-width: 7vw;
    border-radius: 0px 5px 5px 0px;
    position: absolute;
    top: 0%;
    right: 0%;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    padding: 0.8vw 1.5vw;
    font-size: 16px;
}

footer .social-ico{
	width: 1.2vw;
	margin-right: 1vw;
}





#FAQ{
	padding: 6vw 12vw 6vw 12vw;
	position: relative;
	background: #490FB4;
	overflow: hidden;
}


#FAQ h3{
  color: #da4bfd;
  font-size: 0.9vw;
  font-weight: 300;
}

#FAQ h2{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 2.2vw;
}

#FAQ p{
	font-size: 14px;
	color: #dadada;
	margin-top: 1vw;
}


#FAQ .nav{
	margin-top: 3vw;
}


#FAQ .nav .nav-item{
	margin: 0 auto;
	background: transparent;
	border-radius: 0px !important;
}

#FAQ .nav-pills .nav-link{
	color: #FFFFFF;
	opacity: 0.6;
	font-size: 16px;
}


#FAQ .nav-pills .nav-link.active{
	color: #FFFFFF;
	opacity: 1;
background: transparent !important;
border-bottom: 3px solid #da4bfd;
border-radius: 0px !important;
}


#FAQ h4{
	font-size: 1.4vw;
	color: #FFFFFF;
}

#FAQ #pills-tabContent{
	margin-top: 2.5vw;
}

#FAQ #pills-tabContent .col-sm-6{
	margin-bottom: 2vw;
} 




#Timeline{
	padding: 6vw 12vw 8vw 12vw;
	position: relative;
	background: #490FB4;
	background: #470fac !important;
}


#Timeline h3{
  color: #da4bfd;
  font-size: 0.9vw;
  font-weight: 300;
}

#Timeline h2{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 2.2vw;
}

#Timeline p{
	font-size: 14px;
	color: #dadada;
	margin-top: 1vw;
}



#jtimeline-demo{
	margin-top: 2vw;
}

.jtimeline ul.jtimeline-events > li.jtimeline-event > .jtimeline-event-label {
    background-color: transparent !important;
    color: #FFFFFF;
    font-size: 14px;
}




#Token{
	padding: 6vw 12vw 6vw 12vw;
	position: relative;
	background-color: #470FAC;
	background: url(../images/apps-bg.svg) no-repeat;
  background-attachment: fixed;
  overflow: hidden;
}


#Token h3{
  color: #da4bfd;
  font-size: 0.9vw;
  font-weight: 300;
}

#Token h2{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 2.2vw;
}

#Token p{
	font-size: 14px;
	color: #dadada;
	margin-top: 1vw;
}




#Token ul{
	list-style-type: none;
	margin-top: 2vw;
}

#Token ul li{
	font-size: 14px;
	margin-bottom: 0.8vw;
	color: #FFFFFF;
	padding-left: 1.5vw;
	position: relative;
}

#Token ul li div{
	width: 1vw;
	height: 1vw;
	border-radius: 50%;
	position: absolute;
	left: 0%;
}


.bg-color-1{
	background: #F85D77 !important;
}

.bg-color-2{
	background: #5AD6F8 !important;
}

.bg-color-3{
	background: #F8C04E !important;
}

.bg-color-4{
	background: #AC56F7 !important;
}

.bg-color-5{
	background: #61F89F !important;
}







#Contact{
	padding: 6vw 12vw 4vw 12vw;
	position: relative;
	background-color: #470FAC;
	background: url(../images/apps-bg.svg) no-repeat;
  background-attachment: fixed;
  overflow: hidden;
}


#Contact .contact-img{
    width:100%;
    vertical-align:middle;
    margin-top:3vw;
}


#Contact h3{
  color: #da4bfd;
  font-size: 0.9vw;
  font-weight: 300;
}

#Contact h2{
	font-weight: bolder;
	color: #FFFFFF;
	font-size: 2.2vw;
}

#Contact p{
	font-size: 14px;
	color: #dadada;
	margin-top: 1vw;
}

#Contact .second-row{
	margin-top: 3vw;
}

#Contact label{
    font-size: 14px;
    color:#FFFFFF;
}


#Contact input,textarea,select{
     border-radius: 5px;
	 width: 100%;
	 background: #5d19db;
	 border: none;
	 color: #FFFFFF;
	 padding: 0.8vw 1vw;
	 font-size: 16px;
	 margin-bottom:1.5vw;
}


#Contact button{
	color: #fff;
    background: #da4bfd;
    border: 1px solid #da4bfd;
    border-color: #da4bfd;
    text-transform: uppercase;
    letter-spacing: 1px;
    min-width: 5vw;
    border-radius: 5px;
    position: relative;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    padding: 0.8vw 1.5vw;
    font-size: 16px;
}




