@charset "utf-8";

/* CSS Document */


@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@400;500;600&display=swap');
ul,
p,
figure {
    padding: 0;
    margin: 0
}   

a:-webkit-any-link {
    color: inherit;
    cursor: pointer;
}

@font-face {
  font-family: 'Lyon-Regular';
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/Lyon-Regular.ttf");
}

body {
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    color: #2b2b2b;
   overflow-x: hidden;
}

li {
    list-style: none;
}

a {
    transition: all 0.5s ease;
}
section{float:left;width:100%;}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
}

.top{
    float:left;
    width:100%;
    margin-top:30px;
}

.logo{
    float:left;
    width:150px;
}

.logo img{
    float:left;
    width:100%;
}

.menu{
    float:right;
}

.menu ul{
    float:left;
}
.menu ul li{
    float:left;
}
.menu ul li a{
    
    text-align: left;
font: normal normal 600 16px/35px Inter;
letter-spacing: 0px;
color: #212227;
opacity: 1;
margin-right:40px;

}
.banner{
  float:left;
    width:100%;  
    margin:60px 0;
}

.banner h1 {
	text-align: left;
	display: block;
	width: auto;
	margin: auto;
color: #505050;
	font: normal normal normal 56px/67px Lyon-Regular;
}

/*.scroller {*/
/*	height: 60px;*/
/*	overflow: hidden;*/
/*}	*/
/*	span.scroller-item {*/
/*		display: block;*/
/*		animation: scroller 8s infinite;*/
/*		animation-timing-function: cubic-bezier(.85,.01,.19,.99);*/
/*		line-height: 1;*/
		
	
/*}*/

/*@keyframes scroller {*/
/*	0% { transform: translateY(0) }*/
/*	50% { transform: translateY(-56px) }*/
/*	100% { transform: translateY(-112px) }*/

/*}*/



.spinny-words{
    display: block;
    min-width: 500px;
    text-align: left;
    position:relative;
}
.spinny-words span{
    position: absolute;
    /*font-weight: bold;*/
    /*top:-43px;*/
    opacity: 0;    
    animation: rotateWord 9s linear infinite 0s;
    /*font: normal normal normal 56px/67px Lyon-Regular;*/
}

.spinny-words span:nth-child(2) { 
    animation-delay: 3s; 
}
.spinny-words span:nth-child(3) { 
    animation-delay: 6s; 
}
/*.spinny-words span:nth-child(4) { */
/*    animation-delay: 9s; */
/*}*/
/*.spinny-words span:nth-child(5) { */
/*    animation-delay: 12s; */
/*}*/
/*.spinny-words span:nth-child(6) { */
/*    animation-delay: 15s; */
/*}*/
@keyframes rotateWord {
  0%   { opacity: 0; }
  2%   { opacity: 0; transform: translateY(-30px); }
  5%   { opacity: 1; transform: translateY(0px);}
  17%  { opacity: 1; transform: translateY(0px); }
  20%  { opacity: 0; transform: translateY(30px); }
  80%  { opacity: 0; }
  100% { opacity: 0; }
}

.what-we-do{
    float:left;
    width:100%;
    margin-bottom: 90px;
}

.al-head{
    float:left;
    width:100%;
    text-align:center;
}

.al-head h2{
    text-align: center;
font: normal normal 600 15px/35px Poppins;
letter-spacing: 0.53px;
color: #888888;
text-transform: uppercase;
opacity: 1;
margin-bottom: 50px;
}

.what-in{
    float:left;
    width:100%;
    display:flex;
    text-align: center;
    justify-content: space-around;
}
.what{
    width: 198px;
height: 157px;
/* UI Properties */
background: #FFFFFF 0% 0% no-repeat padding-box;
border: 1px solid #EFEFEF;
border-radius: 15px;
opacity: 1;
display:flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 30px;
}
.what:hover{
    /*background:  0% 0% no-repeat padding-box;*/
    
    box-shadow: inset 0 -157px 0 0 #212227;
    transition: all 0.5s ease;
}


.what-img img{
    width:16%;
    margin-bottom:5px;
}
.what-name h2{
    text-align: center;
font: normal normal normal 16px/20px Inter;
letter-spacing: 0px;
color: #505050;
}
.what:hover .what-name h2{
    color:white;
}
.how-we-do{
    float:left;
    width:100%;
}

.how-in {
    float:left;
    width:100%;
    display:flex;
    margin-bottom: 70px;
}
.simple{
   font: normal normal normal 28px/34px Lyon-Regular;
    letter-spacing: 0px;
    color: #212227;
    float: left;
    width: 100%;
    text-align: center;
    margin-bottom: 50px;
}

.block2{
 background: #212227 0% 0% no-repeat padding-box;
  display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding:30px;
}
.block2 svg{
    height:377px;
}

.how-right{
    float:left;
    display: flex;
    background: #f8f9fa 0% 0% no-repeat padding-box;
width: 100%;
justify-content: center;
align-items: center;
}
.words{
    position:relative;
    margin-top: 22px;
    margin-right: 70px;
}
.words h2{
    text-align: center;
font: normal normal normal 18px/25px Poppins;
letter-spacing: 0.72px;
color: #212227;
}
.lines-in{
    position: absolute;
    display: flex;
    align-items: center;
    margin-left: -100px;
}
.lines{
    border: 1px solid #888888;
    height: 110px;
    width:50px;
    border-left:0;
}
.hor-line{
   
     border-top: 1px solid #888888;
    width: 180px;
}
.grad-box{
    position:relative;
}
.business-box-in{
    float:left;
    position:relative;
   text-align: center;
font: normal normal 600 18px/25px Poppins;
letter-spacing: 0.72px;
color: #FFFFFF;
opacity: 1;
}
.business-box-in{
    display:flex;
}
.business-box{
   width: 165px;
height: 165px;
background: #B11179 0% 0% no-repeat padding-box;
border-radius: 20px;
opacity: 0.84; 
display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 35px;
}
.loader {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    background: rgba(0,0,0,0.75) url('../images/loading.gif') no-repeat center center;
    z-index: 10000;
  }
.client-box{
    width: 165px;
height: 165px;
background: #2331D8 0% 0% no-repeat padding-box;
border-radius: 20px;
opacity: 0.84;
display: flex;
    justify-content: center;
    align-items: center;
}

.allora{
    position:absolute;
    width: 108px;
height: 125px;
background: transparent linear-gradient(221deg, #EF2BAB 0%, #2331D8 100%) 0% 0% no-repeat padding-box;
border-radius: 20px;
opacity: 0.95;
left:0;
right:0;
margin: auto;
    top: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    color:white;
}

.testi{
    float:left;
    width:100%;
    margin-bottom: 80px
}

.testi-caro{
    float:left;
    width:100%;
}

.testi-in h2{
    text-align: center;
font: normal normal normal 22px/35px Lyon-Regular;
letter-spacing: 0.77px;
color: #212227;
}

.testi-in p{
    text-align: center;
font: normal normal normal 18px/35px Inter;
letter-spacing: 0.63px;
color: #888888;
}

.bottom{
    background: #212227 0% 0% no-repeat padding-box;
float:left;
width:100%;
padding:70px 0;
text-align:center;
display:flex;
justify-content:center;
flex-direction:column;
    align-items: center;
}

.bottom h2{
    text-align: center;
font: normal normal normal 33px/38px Lyon-Regular;
letter-spacing: 0.8px;
color: #FFFFFF;
width:50%;
}

.bottom .btn{
    text-align: center;
font: normal normal 500 15px/35px Poppins;
letter-spacing: 0.53px;
color: #fff;
text-transform: capitalize;
opacity: 1;
background-color:transparent;
padding:10px 31px;
display:inline-block;
margin:40px 0;
border:2px solid #fff;
}
.bottom .btn:hover{
  box-shadow: inset 0 -55px 0 0 #fff;
    transition: all 0.5s ease;   
    color:#212227;
}
.bottom .logo{
    text-align:center;
}
.bottom .logo img{
     -webkit-filter: invert(100%); /* Safari/Chrome */
    filter: invert(100%);
}



.about{
    float:left;
    width:100%;
    margin:60px 0;
}

.abt-in{
    float:left;
    width:100%;
    display:flex;
}
.abt-in img{
    width:100%;
    margin-left:30px;
}
.abt-in p{
    text-align: left;
font: normal normal normal 26px/45px Lyon-Regular;
letter-spacing: 0px;
color: #212227;
}


.core{
    float:left;
    width:100%;
    margin: 0px 0 60px 0;
}

.core-in{
    float:left;
    width:100%;
    display:flex;
    justify-content:center;
}

.what-core{
  margin: 0 50px;  
}
.what-core-img img{
    /* width:20%; */
    width: 42px;
    height: 35px;
}
.what-core-name{
    text-align: left;
font: normal normal 500 22px/45px Inter;
letter-spacing: 0px;
color: #000000;
margin-top:50px;
margin-bottom:35px;
}

.what-core-ul{
    text-align: left;
font: normal normal normal 19px/40px Inter;
letter-spacing: 0px;
color: #383838;
opacity: 1;
}

.contact-form{
    float:left;
    width:100%;
    padding:30px;
    border-right: 1px solid #E6E6E6;
    /* margin: 60px 0;     */
}

.contact-form-in{
    float:left;
    width:100%;
    display:flex;
    background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 6px #0000000D;
border: 1px solid #E6E6E6;
align-items: center;
}

.form-in{
    display:flex;
    justify-content:space-between;
     margin-bottom:40px;
}

.form-text label{display:block;text-align: left;
font: normal normal normal 15px/35px Poppins;
letter-spacing: 0.53px;
color: #A2A2A2;
text-transform: capitalize;
opacity: 1;
margin:0;  
padding:0;
}
.form-text input.frm-st{
    border:0;
    border-bottom: 0.5px solid #C9C9C9;
    text-align: left;
font: normal normal normal 15px/35px Poppins;
letter-spacing: 0.53px;
color: #212227;
opacity: 1;
 width:100%;

}
.form-text{
    width:100%;
   
    text-align: center;
     
}
.form-text-mar{
   margin-right:150px; 
}
.form-text .btn{
    background: #FFFFFF 0% 0% no-repeat padding-box;
border: 1px solid #707070;
text-align: center;
font: normal normal normal 15px/35px Poppins;
letter-spacing: 0.53px;
color: #212227;
text-transform: capitalize;
padding:5px 30px;
}
.form-text .btn:hover{
   box-shadow: inset 0 -55px 0 0 #707070;
    transition: all 0.5s ease;   
    color:#fff; 
}


.add{
    padding:0 70px;
   text-align: center;
font: normal normal normal 15px/30px Poppins;
letter-spacing: 0.53px;
color: #212227;
}
.add a{
    color: #0076FF;
}