@font-face {
  font-family: 'Carltine';
  src: url('../fonts/Carltine-Black.woff2') format('woff2'),
      url('../fonts/Carltine-Black.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}


.mainbnr{height: 82vh;}

.main-title .head /*h1*/ {
  font-family: 'General Sans';
  font-size: 65px;
  font-weight: 700;
  margin-bottom: 0;
  line-height: 1;
}

.main-title h2 {
  font-family: 'General Sans';
  margin-top: -7px;
  font-size: 43px;
  margin-bottom: 0;
}
.balloon{
  display: inline-flex;
  animation:balloons1 1.5s ease-in-out;
  width: 237px;
  position: relative;
}
#mob .balloon{
  display: inline-flex;
  animation:balloons1 1.5s ease-in-out;
  width: 261px;
  position: relative;
}
.title {
  color: #ffffffd1;
  margin-top: 15px !important;
  position: absolute;
  font-size: 38px;
  text-align: center;
  padding: 0px 0px !important;
  text-transform: inherit;
  opacity: 0.9;
  transform: rotate(270deg) translate(10%, -433%);
  left: -7px;
  width: max-content !important;
  top: 50%;
}


.banner{
  background-image: linear-gradient(168deg, #4d1437, #011222 32%, #011222 66%, #410705);
  height: 82vh;
  top: 0px;
  position: relative;
  overflow: hidden;
  width: 100%;
}
.all{
  height: 100%;
  top: 0px;
  position: relative;
  width: auto;
  display: flex;
  overflow: hidden;
  margin: 0 auto;
  justify-content: center;
}
.balloon a{
  height: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  cursor: pointer;
  align-items: end;
}
.balloon img, .balloon svg{
  display:inline-block;
  height: 100%;
  /* background:hsl(215,50%,65%);
  border-radius:80%; */
  width: 100%;
  position:relative;
  margin: 20px 0 0 0;
  transition:transform 0.5s ease;
  z-index:10;
  animation: balloons 10s ease-in-out infinite;
  transform-origin:bottom center;
  bottom: 0;
  cursor: pointer;
}

@keyframes balloons {
  0%,100%{transform: rotate(2deg);}
  50%{transform: rotate(-2deg);}
}
@keyframes balloons1 {
  0%{ transform:translateY(500px) ; }
  50%{ transform:translateY(0px) ; }
100%{ transform:translateY(0px) ; }
}

#mob .balloon:nth-child(1){
  width: 216px !important;
}
#mob .balloon:nth-child(1) svg{width: 177px !important;height: 425px;left: 122px;}
/* .balloon:before {
  content:"â–²";
  font-size:20px;
  color:hsl(215,30%,50%);
  display:block;
  text-align:center;
  width:100%;
  position:absolute;
  bottom:-12px;
  z-index:-100;
}

.balloon:after {
 display:inline-block; top:153px;
  position:absolute;
  height:250px;
  width:1px;
  margin:0 auto;
  content:"";
  background:rgba(0,0,0,0.2); 
} */
#desk .balloon:nth-child(1){
  width: 311px;
  height: 100%;
  left: 109px;
}
#desk .balloon:nth-child(2){
  animation-duration: 2.5s;
  animation:balloons1 2.5s ease-in-out;
  width: 216px;
}
#desk .balloon:nth-child(2):before { color:hsl(245,40%,65%);
  }

#desk .balloon:nth-child(3){animation-duration:3s;animation:balloons1 3.5s ease-in-out;width: 198px;left: 6px;}
#desk .balloon:nth-child(3) svg{
  margin-top: 40px;
  left: -5px;
  top: 113px;
}
#mob .balloon:nth-child(3) svg{
  top: 20px;
  z-index: 99;
}
#desk .balloon:nth-child(3):before { color:hsl(139,30%,50%);  }

#desk .balloon:nth-child(4){
  animation-duration:4.5s;
  animation:balloons1 2.5s ease-in-out;
  width: 300px;
}
#desk .balloon:nth-child(4) svg{left: -77px;top: 22px;}

#desk .balloon:nth-child(5) svg{left: -56%;width: 220px;top: 83px;}
#desk .balloon:nth-child(4):before { color:hsl(59,30%,52%);  }

#desk .balloon:nth-child(5){animation-duration:5s;
  animation:balloons1 2.5s ease-in-out;
}

#desk .balloon:nth-child(5):before { color:hsl(23,44%,46%);  }
#desk .balloon:nth-child(2) svg{
  width: 100%;
  left: 38px;
  top: 72px;
}

#desk .fil0, #desk .fil1, #desk .fil4 {fill:white;}
#mob .balloon svg{
  fill:white
}
.fil3{fill:url(#Cph3U4tL7_G169qGX5ORha);}
#desk svg.orange .fil1, #desk svg.orange .fil3, #desk svg.orange .fil4, #desk svg.orange .fil0{
  fill:#EF7F1A;
}
#mob .balloon svg.orange{
  fill:#EF7F1A;
}
.orange1{
  color:#EF7F1A;
}
.blue{
  color:#EF7F1A;
}
.abc.orange .fil1{
  fill:#EF7F1A;
}
.enterprise{
  display: none;
  animation: slide-in 4.5s forwards;
    -webkit-animation: slide-in 4.5s forwards;
}
#desk .balloon .fil3.orange .fil4 {fill:orange}
.enterprise.display{
  display: block;
color: white;
animation: slide-out 4.5s forwards;
-webkit-animation: slide-out 4.5s forwards;
}
@keyframes slide-in {
  100% { transform: translateX(0%); }
}

@-webkit-keyframes slide-in {
  100% { -webkit-transform: translateX(0%); }
}
  
@keyframes slide-out {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-10%); }
}

@-webkit-keyframes slide-out {
  0% { -webkit-transform: translateX(0%); }
  100% { -webkit-transform: translateX(-10%); }
}
.ent{
  display: flex;
  height: 81vh;
  justify-content: center;
  align-items: center;
  text-align: justify;
  padding: 0px 27px 0 0px;
  transform: translateX(0%);
  -webkit-transform: translateX(0%);
}
.ent p{
    color: white;
}
@media screen and (max-width: 767px) and (orientation: portrait){
  .main-title .head /*h1*/{
    font-family: 'General Sans';
    font-size: 76px;
    font-weight: 700;
    margin-bottom: 0;
    line-height: 1;
  }
  .main-title h2{
    font-family: 'General Sans';
    margin-top: -7px;
    font-size: 27px;
    margin-bottom: 0;
  }
  .all {
    height: 51vh;
    top: 7px;
    position: relative;
    width: auto;
    display: flex;
    overflow: hidden;
}
.mainbnr{height: auto;}
.balloon img, .balloon svg{
  width: 100% !important;
}
.balloon:nth-child(2) svg {
  width: 106px !important;
  left: 50px;
  top: 53px;
}
.balloon:nth-child(3) svg {
  margin-top: 40px;
  left: -5px;
  width: 106px !important;
  height: 282px;
}
.balloon:nth-child(4) svg {
  left: -81px;
  width: 166px !important;
  height: 411px;
}
.balloon:nth-child(5) svg {
  top: 58px;
  left: -165%;
  width: 93px !important;
  height: 353px;
}
.ent{
  display: none !important;
  height: auto;
  padding: 25px 15px;
  transform: unset;
}
.enterprise, .enterprise.display{
  -webkit-animation: unset;
}
.banner {
  height: auto;
  overflow: hidden;
  top: 0;
}
@keyframes balloons1 {
  0%{ transform:translateY(200px) ; }
  50%{ transform:translateY(0px) ; }
100%{ transform:translateY(0px) ; }
}
.title{
  color:white;
  margin-top: 15px !important;
  position: relative;
  font-size: 24px;
  text-align: left;
  padding: 0px 31px !important;
  text-transform: uppercase;
  opacity: 0.8;
  transform: unset;
}
@keyframes balloons {
  0%,100%{transform: rotate(1deg);}
  50%{transform: rotate(-1deg);}
}
}
@media screen and (min-width:320px) and (max-width:799px) and (orientation:landscape)  {
  .all{
    display: flex;
    
  }
  .banner {
    height: 121vh;
  }
  .mainbnr {
    height: 121vh;
}
  .balloon:nth-child(2) svg {
    left: -12px;
  }
  .balloon:nth-child(3) svg {
    left: 6px;
    top: 39px;
  }
  .balloon:nth-child(4) svg {
    left: -15px;
    margin-top: 53px;
  }
  .balloon:nth-child(5) svg {
    left: -17%;
  }
  .balloon img, .balloon svg{
    width: 100% !important;
  }
  .ent{
    display: flex  !important;
  }
  .enterprise, .enterprise.display{
    -webkit-animation: unset;
  }
  .balloon {
    width: 129px !important;
  }
  }
@media screen and (min-width:800px) and (max-width:1025px) and (orientation:landscape)  {
.all{
  display: flex;
  
}
.balloon:nth-child(2) svg {
  left: -20px;
}
.balloon:nth-child(3) svg {
  left: 6px;
  top: 39px;
}
.balloon:nth-child(4) svg {
  left: -15px;
  margin-top: 53px;
}
.balloon:nth-child(5) svg {
  left: -17%;
}
.balloon img, .balloon svg{
  width: 100% !important;
}
.ent{
  display: flex !important;
}
.enterprise, .enterprise.display{
  -webkit-animation: unset;
}
#mob .balloon:nth-child(1) {
  width: 277px !important;
}
#mob .balloon:nth-child(1) svg {
 height: 527px;
  left: 6px;
}
#mob .balloon:nth-child(1) svg {
  width: 312px !important;
  height: 621px;
  left: 57px;
}
.mainbnr, .banner {
  height: 151vh;
}
.main-title{
    color: white;
    margin-top: 2px !important;
    position: relative;
    font-size: 38px;
    text-align: center;
    padding: 0px 0px !important;
    text-transform: inherit;
    opacity: 0.9;
    transform: unset;
    left: 39px;
    width: max-content !important;
    top: 50%;
}
#mob .balloon:nth-child(2) svg {
  left: 4px;
  height: 600px;
  width: 150px !important;
}
#mob .balloon:nth-child(3) svg {
  left: -19%;
  top: 39px;
  width: 168px !important;
}
#mob .balloon:nth-child(4) svg {
  left: -40%;
  margin-top: 18px;
  width: 207px !important;
}
.balloon:nth-child(5) svg {
  left: -81%;
  width: 158px !important;
}

}
h1.enterpriseheading{font-size: 2rem;}
.head1{font-size: calc(1.375rem + 1.5vw);    margin-top: 0;
    margin-bottom: 0.5rem;
    font-weight: 500;
    line-height: 1.2;}
.head2{font-family: 'General Sans';
        margin-top: -7px;
        font-size: 27px;
        margin-bottom: 0;}
.two-part-title h3.Secondheading {
    font-size: 32px;
    font-family: 'General Sans';
    font-weight: 600;
}
.two-part-title h3.Secondheading .highlighterbg1 {
    color: #1153FF;
}
.two-part-title h4 {
    font-size: 32px;
    font-family: 'General Sans';
    font-weight: 600;
}
.two-part-title h4 .highlighterbg1 {
    color: #1153FF;
}
.seosection {
    padding: 10px 0 !important;
    background: #f7f7f7;
	position:relative;
}
.seosection h4 {
    font-size: 1.10rem;
    color: #111;
}
.more {
    display: none;
}
.read{padding: 5px 0px;
    background-color: transparent;
    border: none;
    outline: none;

    cursor: pointer;
    color: #0c41ef;}
@media screen and (min-width:1024px) and (max-width:1920px) and (-webkit-min-device-pixel-ratio : 1.5){
  .balloon {
    display: inline-flex;
    animation: balloons1 1.5s ease-in-out;
    width: 194px;
    position: relative;
  }
  .balloon:nth-child(5) svg {
    left: -65%;
    width: 188px;
}

.balloon:nth-child(2) {
  animation-duration: 2.5s;
  animation: balloons1 2.5s ease-in-out;
  width: 190px;
}
.balloon:nth-child(3) {
  width: 150px;
  left: -35px;
}
.balloon:nth-child(3) svg {
  margin-top: 40px;
  left: -47px;
}

}
@media screen  and (min-width:320px) and (max-width:1025px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio : 1.5) and (-webkit-max-device-pixel-ratio : 1.5){
  .balloon {
    display: inline-flex;
    animation: balloons1 1.5s ease-in-out;
    width: 163px !important;
    position: relative;
  }
  .balloon:nth-child(5) svg {
    left: -19%;
    width: 188px;
}

.balloon:nth-child(2) {
  animation-duration: 2.5s;
  animation: balloons1 2.5s ease-in-out;
  width: 144px !important;
}
.balloon:nth-child(3) {
  width: 150px;
  left: -35px;
}
.balloon:nth-child(3) svg {
  margin-top: 40px;
  left: 9px;
}

}
@media screen  and (min-width:320px) and (max-width:1025px){
  .ent{display: none;height: auto;}
  .enterprise, .enterprise.display{
    -webkit-animation: unset;
  }
}
@media screen  and (min-width:320px) and (max-width:1025px) and (-webkit-min-device-pixel-ratio: 1.5)  and (-webkit-max-device-pixel-ratio: 1.5) {
  .balloon {
      display: inline-flex;
      animation: balloons1 1.5s ease-in-out;
      width: 172px;
      position: relative;
  }
}
@media screen  and (min-width:1023px) and (max-width:1025px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 1.25) {
  .balloon {
     width: 205px !important;
   
}
.balloon:nth-child(5) svg {
  left: -19%;
  width: 188px;
}
.mainbnr {
  height: 66vh;
}
.banner {
  height: 66vh;
}
.balloon:nth-child(2) {animation-duration: 2.5s;animation: balloons1 2.5s ease-in-out;width: 183px !important;}
.balloon:nth-child(3) {
width: 150px;
left: -35px;
}
.balloon:nth-child(3) svg {
margin-top: 40px;
left: 9px;
}
}
@media screen  and (min-width:320px) and (max-width:767px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio : 1.5) and (-webkit-max-device-pixel-ratio : 1.5){
  .balloon {
    display: inline-flex;
    animation: balloons1 1.5s ease-in-out;
    width: 163px !important;
    position: relative;
  }
  .balloon:nth-child(5) svg {
    left: -19%;
    width: 188px;
}

.balloon:nth-child(2) {
  animation-duration: 2.5s;
  animation: balloons1 2.5s ease-in-out;
  width: 144px !important;
}
.balloon:nth-child(3) {
  width: 150px;
  left: -35px;
}
.balloon:nth-child(3) svg {
  left: 25px;
}

}
.link {
  border: 1px solid orange;
  border-radius: 5px;
  padding: 6px 10px;
  /*-webkit-transition: 2s; transition: 2s;*/
  font-weight: 600;
  color: #fff;
  letter-spacing: 1px;
  background-color: orange;
  text-transform: uppercase;
}

.link:hover {
  text-decoration: none;
  border-radius: 0;
  background-color: transparent;
  color: orange;
}
 .letstalkbtn {
  border: 1px solid orange;
  background-color: transparent;
  border-radius: 5px;
  padding: 6px 10px;
  /*-webkit-transition: 2s; transition: 2s;*/
  font-weight: 600;
  color: #f9f9f9;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.enta{
  display: block;
color: white;
animation: slide-out 4.5s forwards;
-webkit-animation: slide-out 4.5s forwards;
}
 .letstalkbtn:hover {
  text-decoration: none;
  border-radius: 0;
  background-color: orange;
  color: #fff;
}
.balloon:hover .fil3, .balloon:hover .fil1, .balloon:hover .fil4{
  fill:orange
}

@media screen and (min-width:876px) and (max-width:1026px) and (orientation:portrait) {

.banner, .mainbnr {
 height: 32vh;
}
.all {
  height: 100%;
}
.main-title .head /*h1*/ {
  font-family: 'General Sans';
  font-size: 40px !important;
}
.ent {
  display: flex;
  height: 100%;
}
#desk .balloon:nth-child(5) svg {
  left: -56%;
  width: 141px !important;
}
#desk .balloon:nth-child(4) svg {
  left: -47px;
  top: 22px;
}
.enterprise  h2{
  font-size: 19px;
}
.enterprise p {
 
  font-size: 13px;
}
.link, .letstalkbtn{
  padding: 6px;
}
#desk .balloon:nth-child(3) svg {
  left: 4px;
  top: 73px;
}


}

@media screen and (min-width:320px) and (max-width:376px) and (orientation:portrait) {
  #mob .balloon:nth-child(1) svg {
    width: 131px !important;
    height: 358px;
    left: 94px;
}
.balloon:nth-child(2) svg {
  width: 100px !important;
  left: 46px;
  top: 53px;
}
.balloon:nth-child(3) svg {
  margin-top: 40px;
  left: 5px;
  width: 84px !important;
  height: 230px;
}

.balloon:nth-child(4) svg {
  left: -57px;
  width: 144px !important;
  height: 325px;
}
.balloon:nth-child(5) svg {
  top: 58px;
  left: -128%;
  width: 85px !important;
  height: 355px;
}
}
/* ----------125%------------------------------------------------ */
@media only screen and (min-width:1020px) and (max-width:2048px) and (-webkit-min-device-pixel-ratio: 1.25) {

  .main-title .head {
    font-family: 'General Sans';
    font-size: 49px;
  }
}