@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');

body{
	margin:0px ;
 	padding:0px;
	background-color:#fff !important;
	font-family: 'Poppins', sans-serif !important;
}

div,h1,h2,h3,h4,h5,h6,p,img,a,ul,li{
  margin:0px ;
  padding:0px;
}
::after,
::before {
 -webkit-box-sizing:border-box;
 box-sizing:border-box
}

/*
font-family: 'Nunito Sans', sans-serif;
*/
/*needed*/
a{
  text-decoration:none !important;
  -webkit-transition:300ms;
  -moz-transition:300ms;
  -ms-transition:300ms;
  -o-transition:300ms;
  transition:300ms;
}
a:hover{
  text-decoration:none !important;
}
ul{
  list-style-type:none;
}
.clear{
  clear:both;
}
/*needed*/


/****** banner ********/

.banner{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    background: url(../images/banner-bg.png) center center no-repeat;
    background-size: cover;
    width: 100%;
    height: 1006px;
    position: relative;
}
.banner-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    position: absolute;
    bottom: 160px;
    left: 0;
    width: 100%;
} 
.banner-row h1{
    margin: 0px auto 0px auto;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: bold;
    font-size: 87px;
    color: #fff;
    text-align: center;
    width: max-content;
    position: relative;
}
.banner-row h1::before {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    content: '';
    position: absolute;
    top: 45px;
    left: -160px;
    background: url(../images/rect.png) center center no-repeat;
    width: 114px;
    height: 12px;
}
.banner-row h1::after {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    content: '';
    position: absolute;
    top: 45px;
    right: -160px;
    background: url(../images/rect.png) center center no-repeat;
    width: 114px;
    height: 12px;
}


/****** menu *******/

.menu{
    margin: 0px 0px 0px 0px;
    padding: 30px 0px 0px 0px;
    background: transparent;
    overflow: hidden;
    width: 100%;
}
.menu-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
} 
a.logo{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: block;
    float: left;
}
.menu-row ul{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    float: right;
} 
.menu-row ul li{
    margin: 0px 12px 0px 0px;
    padding: 25px 0px 0px 0px;
    float: left;
} 
.menu-row ul li a{
    margin: 0px 0px 0px 0px;
    padding: 0px 25px 0px 25px;
    font-weight: 600;
    font-size: 19px;
    color: #fff;
    text-align: center;
    display: block;
    line-height: 48px;
    border-radius: 5px;
    background: #007ab7;
} 
.menu-row ul li a:hover{
    background: #0d3272;
    color: #fff;
} 
.menu-row ul li.last{
    margin: 0px 0px 0px 0px;
} 
.menu-row ul li.last a{
    background: #0d3272;
}
.menu-row ul li.last a:hover{
    background: #007ab7;
    color: #fff;
}



/** aim ****/

.aim{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    background: transparent;
    width: 100%;
    overflow: hidden;
    position: relative;
} 
.lt-aim{
    background: url(../images/lt-aim.png) center center no-repeat;
    background-size: cover;
    width: 50%;
    height: 613px;
    position: absolute;
    top: 0;
    left: 0;
}
.rt-aim{
    background: url(../images/aim-rt.png) center center no-repeat;
    background-size: cover;
    width: 50%;
    height: 613px;
    position: absolute;
    top: 0;
    right: 0;
}
.aim-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    position: relative;
    z-index: 9;
}       
.aim-left{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 425px;
    float: left;
}
.aim-text{
    margin: 0px 0px 0px 0px;
    padding: 160px 0px 170px 0px;
}
.aim-text h2 {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 52px 100px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: bold;
    font-size: 50px;
    color: #fff;
    text-align: center;
    width: max-content;
    position: relative;
}
.aim-text h2::before{
    margin: 0px 0px 0px 0px;
    content: '';
    position: absolute;
    top: -14px;
    left: 0;
    background: url(../images/c5-logo.png) center top no-repeat;
    width: 68px;
    height: 83px;
}

.aim-text p {
    margin: 0px auto 0px auto;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 21px;
    color: #fff;
    line-height: 44px;
} 
.aim-right{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 425px;
    float: right;
}


/***** opportunity ******/

.opportunity{
    margin: 0px 0px 0px 0px;
    padding: 100px 0px 136px 0px;
    background: #fff url(../images/rect-bg.png) left bottom no-repeat;
    width: 100%;
    overflow: hidden;
}
.opportunity-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    overflow: hidden;
} 
.opportunity-row h2{
    margin: 0px 0px 0px 0px;
    padding: 0px 80px 120px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 900;
    font-size: 63px;
    color: #000;
    float: left;
    border-right: 2px solid #0d3272;
} 
.opportunity-row p{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 21px;
    color: #000;
    float: right;
    line-height: 41px;
    width: 650px;
} 


.opport-flex{
    margin: 0px 0px 0px 0px;
    padding: 155px 0px 0px 0px;
}
.opport-left{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    float: left;
    position: relative;
}
img.lt-oprt{
    margin: 0px 0px 0px 0px;
    position: relative;
}
.opport-left::before{
    content: '';
    position: absolute;
    top: -35px;
    left: -40px;
    background: #0d3272;
    width: 290px;
    height: 114%;
}

.opport-right{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 545px;
    float: right;
}
.opport-text{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
.opport-text h3{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 900;
    font-size: 40px;
    color: #007ab7;
    line-height: 51px;
}
.opport-text p{
    margin: 50px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 21px;
    color: #000;
    line-height: 41px;
}
.para{
    margin: 120px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    overflow: hidden;
}
.para p{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 21px;
    color: #000;
    line-height: 41px;
    text-align: center;
} 
.para p.last{
    margin: 10px 0px 0px 0px;
} 


/****** why ****/

.why{
    margin: 0px 0px 0px 0px;
    padding: 112px 0px 0px 0px;
    background: url(../images/why-bg.png) center center no-repeat;
    background-size: cover;
    width: 100%;
    height: 1036px;
    overflow: hidden;
}
.why h2{
    margin: 0px auto 0px auto;
    padding: 0px 0px 0px 115px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 900;
    font-size: 60px;
    color: #fff;
    text-align: center;
    width: max-content;
    position: relative;
}
.why h2::before{
    margin: 0px 0px 0px 0px;
    content: '';
    position: absolute;
    top: -14px;
    left: 0;
    background: url(../images/c5-logo.png) center top no-repeat;
    width: 68px;
    height: 83px;
}
.why-row{
    margin: 0px 0px 0px 0px;
    padding: 110px 0px 0px 0px;
} 
.why-left{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    float: left;
    width: 505px;
}
.why-text{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
} 
.why-text h3{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: bold;
    font-size: 43px;
    color: #fff;
} 
.why-text ul{
    margin: 54px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
} 
.why-text ul li{
    margin: 0px 0px 15px 0px;
    padding: 0px 0px 0px 43px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 19px;
    line-height: 32px;
    color: #fff;
    line-height: 32px;
    background: url(../images/tick.png) left 6px no-repeat;
} 
.why-text ul li.last{
    margin: 0px 0px 0px 0px;
} 

.why-right{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    float: right;
    width: 505px;
    position: relative;
}
.why-right::before {
    content: '';
    position: absolute;
    bottom: -30px;
    right: -30px;
    background: rgba(255,255,255,.20);
    width: 450px;
    height: 520px;
}
img.why-rt{
    margin: 0px 0px 0px 0px;
    position: relative;
}


/******* how *******/

.how{
    margin: 0px 0px 0px 0px;
    padding: 160px 0px 180px 0px;
    background: #fff url(../images/rect-bg.png) left bottom no-repeat;
    overflow: hidden;
    width: 100%;
}
.how-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}  
.how-left{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 524px;
    float: left;
    position: relative;
}  
.how-left::before{
    content: '';
    position: absolute;
    bottom: -30px;
    left: -30px;
    background: rgba(0,122,183,.20);
    width: 450px;
    height: 520px;
}
img.hw-lt{
    margin: 0px 0px 0px 0px;
    position: relative;
}

.how-right{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 490px;
    float: right;
} 
.how-text{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
} 
.how-text h3{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: bold;
    font-size: 43px;
    color: #000;
} 
.how-text ul{
    margin: 54px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
} 
.how-text ul li{
    margin: 0px 0px 15px 0px;
    padding: 0px 0px 0px 43px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 19px;
    line-height: 32px;
    color: #000;
    line-height: 32px;
    background: url(../images/tick.png) left 5px no-repeat;
} 
.how-text ul li.last{
    margin: 0px 0px 0px 0px;
} 



/****** about ******/

.about{
    margin: 0px 0px 0px 0px;
    padding: 105px 0px 150px 0px;
    background: #fafcff url(../images/about-bg.png) left top no-repeat;
    overflow: hidden;
    width: 100%;
}
.about h2{
    margin: 0px auto 0px auto;
    padding: 0px 0px 0px 115px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 900;
    font-size: 60px;
    color: #000;
    text-align: center;
    width: max-content;
    position: relative;
}
.about h2::before{
    margin: 0px 0px 0px 0px;
    content: '';
    position: absolute;
    top: -14px;
    left: 0;
    background: url(../images/ab-c5.png) center top no-repeat;
    width: 74px;
    height: 87px;
}
.about-row{
    margin: 50px auto 0px auto;
    padding: 0px 0px 0px 0px;
    width: 1064px;
    overflow: hidden;
} 
.about-row p{
    margin: 0px 0px 15px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 21px;
    color: #000;
    line-height: 40px;
    text-align: center;
} 
.about-row p.last{
    margin: 0px 0px 0px 0px;
}  


.principle{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
.principle h3{
    margin: 105px 0px 105px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: bold;
    font-size: 45px;
    color: #000;
    text-align: center;
} 
.principle-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: flex;
    column-count: 2;
    border-bottom: 1px solid #eaebec;
} 
.principle1{
    margin: 0px 0px 0px 0px;
    padding: 40px 40px 40px 40px;
    width: 100%;
    height: 410px;
    background: transparent;
    border-right: 1px solid #eaebec;
    color: #000;
}
.principle11{
    border-right: 0px solid #eaebec;
}
.principle1:hover{
    background: linear-gradient(220deg, #0087ca 30%,#144591 80%);
    box-shadow: 0px 20px 40px 0px rgba(0,0,0,.25);
    color: #fff;
    border-color: transparent;
}
.principle-text{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    overflow: hidden;
}
.principle-text h4 {
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 10px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: bold;
    font-size: 30px;
    position: relative;
    display: flex;
}
.principle-text h4 img.icn1{
    margin: -7px 28px 0px 0px;
    display: block;
    -webkit-transition:300ms;
  -moz-transition:300ms;
  -ms-transition:300ms;
  -o-transition:300ms;
  transition:300ms;
}
.principle-text h4 img.icn11{
    display: none;
    -webkit-transition:300ms;
  -moz-transition:300ms;
  -ms-transition:300ms;
  -o-transition:300ms;
  transition:300ms;
}
.principle1:hover img.icn1{
    display: none;
}
.principle1:hover img.icn11{
    display: block;
}



.principle-text p{
    margin: 15px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 19px;
    line-height: 35px;
} 
.principle111{
    visibility: hidden;
}
.principle-row4{
    border-color: transparent;
}


/**** contact *****/


.contact {
    margin: 100px auto 0px auto;
    padding: 55px 55px 85px 55px;
    width: 887px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, .15);
}
.contact-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
} 
.contact-row h3{
    margin: 0px 0px 55px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 900;
    font-size: 47px;
    text-align: center;
} 
.contact-flex{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
.cont-flex{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: flex;
    column-count: 2;
    column-gap: 15px;
}
input.input {
    margin: 0px 0px 15px 0px;
    padding: 0px 15px 0px 15px;
    width: 100%;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 17px;
    color: #5e5e5e;
    line-height: 50px;
    border: 1px solid #d8d8d8;
    border-radius: 10px;
}
textarea.name{
    margin: 0px 0px 15px 0px;
    padding: 10px 15px 10px 15px;
    width: 100%;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 17px;
    color: #828282;
    height: 102px;
    border: 1px solid #d8d8d8;
    border-radius: 10px;
}
input.btnSend{
    margin: 22px auto 0px auto;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: bold;
    font-size: 20px;
    color: #fff;
    background: linear-gradient(#0280c4,#134792);
    line-height: 52px;
    border: none;
    border-radius: 5px;
    width: 188px;
    display: block;
}
input.btnSend:hover{
    color: #fff;
    background: linear-gradient(#134792,#0280c4);
}



/***** footer ******/

.footer{
    margin: 0px 0px 0px 0px;
    padding: 48px 0px 0px 0px;
    background: linear-gradient(90deg, #15418d,#0087ca);
    overflow: hidden;
    width: 100%;
}
a.ft-logo{
    margin: 0px auto 0px auto;
    padding: 0px 0px 0px 0px;
    display: block;
    width: 372px;
}
.footer-row{
    margin: 45px 0px 0px 0px;
    padding: 30px 0px 30px 0px;
    border-top: 1px solid rgba(255,255,255,.45);
    overflow: hidden;
} 
.footer-row p{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 19px;
    color: #fff;
    float: left;
} 
.footer-row ul{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    float: right;
} 
.footer-row ul li{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    float: left;
    font-weight: 600;
    font-size: 19px;
    color: #fff;
}
.footer-row ul li a{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: 'Nunito Sans', sans-serif !important;
    font-weight: 600;
    font-size: 19px;
    color: #fff;
    display: block;
}
.footer-row ul li a:hover{
    color: rgb(204, 207, 255);
}
.footer-row ul li.divi{
    margin: 0px 20px 0px 20px;
}



a#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 5px;
  z-index: 99;
  font-size: 58px;
  border: none;
  outline: none;
  color: white;
  cursor: pointer;
  padding: 0px;
  border-radius: 50%;
  background: transparent;
  color: #7ad648;
}

a#myBtn:hover {
  color: #5daf30;
}