.ambassadorsMainSection{
  background-color: #008CD1;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 11px;
  padding: 73px 210px 73px 210px;
}

.ambassadorTitleContainer{
  font-family: 'Inter';
  font-size: 48px;
  font-weight: 800;
  line-height: 48px;
  color: #FFFFFF;
  text-transform: uppercase;
}

.ambassadorDescContainer{
  font-family: 'Inter';
  font-size: 14px;
  font-weight: 300;
  line-height: 19.32px;
  color: #FFFFFF;
  width: 710px;
}

.ambassadorCtaContainer{
  display: flex;
  gap: 21px;
  margin-top: 20px;
}

.applynowBtnStyle, .trackBtnStyle{
  outline: none;
  border: none;
  font-family: 'Inter';
  font-size: 14px;
  line-height: 16.94px;
  font-weight: 500;
}

.applynowBtnStyle{
  background-color: #121C5E;
  width: 123px;
  height: 38px;
  border-radius: 16px;
  color: white;
}

.trackBtnStyle{
  background-color: #FFFFFF;
  width: 180px;
  height: 38px;
  border-radius: 16px;
  color: #000000;
}

/* animation slider */
.image-card {
    transition: transform 0.5s ease, width 0.5s ease, height 0.5s ease, left 0.5s ease;
    position: absolute; /* Required for positioning adjustments */
  }
  
  /* Zoom-in styles for each image */
  #image1.zoom-in {
    transform: scale(1.0); /* Smaller scale for the first image */
    z-index: 10;
  }
  
  #image2.zoom-in {
    transform: scale(1.2);
    z-index: 10;
    left: 20px;
    height: 455px;
  }
  
  #image3.zoom-in {
    transform: scale(1.2); /* Larger scale for the third image */
    width: 280px;
    height: 455px; /* Increase height as needed */
    left: 20px; /* Adjust position as needed */
    z-index: 10;
  }
  
  /* Zoom-out styles for each image */
  #image1.zoom-out {
    transform: scale(1); /* Normal size */
    z-index: 1;
    left: 55px;
  }
  
  #image2.zoom-out {
    transform: scale(1); /* Normal size */
    z-index: 1;
    transition: transform 0.5s ease, left 0.5s ease; /* Add transition for position change */
  }
  
  #image3.zoom-out {
    transform: scale(1);
    right: 3px;
    z-index: 1;
  }
  
  /* Additional class to move the second image */
  .move-second-image {
    left: 175px; /* Move second image to the left */
  }
  
  /* Default styles for pagination dots */
.dot {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #D9D9D9;
    cursor: pointer;
    transition: background-color 0.3s ease;
  }

  
  /* Hover effect for pagination dots */
  /* .dot:hover {
    background: #8A8A8A;
  } */
  
  /* Active dot style */
  .pagination-active {
    background: #8A8A8A;

  }
  .katon-network-a{
    text-decoration: none;
  }
  
  

.donec-vitae-sapien,
.katon-network3 {
  margin: 0;
  align-self: stretch;
  position: relative;
}
.katon-network3 {
  font-size: 48px;
  line-height: 96%;
  font-weight: 800;
  font-family: inherit;
}
.donec-vitae-sapien {
  font-size: var(--font-size-base);
  line-height: 105.02%;
  font-weight: 300;
  display: inline-block;
  flex-shrink: 0;
  width: 707px;
}
.title15 {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0px 85px;
  gap: var(--gap-mini);
}
.image-child8 {
  width: 284.2px;
  position: relative;
  border-radius: var(--br-7xl-4);
  height: 498px;
  object-fit: cover;
}
.image21 {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: var(--gap-mini);
}
.main-content20,
.sec-12 {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.main-content20 {
  width: 882px;
  justify-content: flex-start;
  /* gap: var(--gap-42xl); */
  gap: 42px;
}
.sec-12 {
  align-self: stretch;
  background-color: var(--color-white);
  height: 958px;
  justify-content: center;
  padding: var(--padding-189xl) var(--padding-180xl) var(--padding-56xl);
  box-sizing: border-box;
  text-align: center;
  font-size: var(--font-size-21xl);
  color: var(--color-black);
  font-family: var(--font-inter);
}
.teaching {
  margin: 0;
}
.join-the-katon-container {
  margin: 0;
  position: relative;
  font-size: 48px;
  line-height: 100%;
  font-weight: 800;
  font-family: inherit;
}
.join-a-community1 {
  margin: 0;
  align-self: stretch;
  position: relative;
  font-size: var(--font-size-sm);
  line-height: 138%;
  font-weight: 300;
  display: inline-block;
  /* height: 57px; */
  flex-shrink: 0;
  width: 416px;
}
.content39 {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--gap-mini);
}
.cta47 {
  cursor: pointer;
  border: 0;
  /* padding: var(--padding-6xs) var(--padding-7xl); */
  padding: 10px 15px;
  background-color: var(--color-midnightblue);
  border-radius: var(--br-base);
  height: 38px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width:184px;
}
.cta47-book-a-recording{
  cursor: pointer;
  border: 0;
  /* padding: var(--padding-6xs) var(--padding-7xl); */
  padding: 10px 15px;
  background-color: var(--color-midnightblue);
  border-radius: var(--br-base);
  /* height: 38px; */
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  /* width:184px; */
}
.cta47-book-a-session{
  cursor: pointer;
  border: 0;
  /* padding: var(--padding-6xs) var(--padding-7xl); */
  padding: 10px 15px;
  background-color: var(--color-midnightblue);
  border-radius: var(--br-base);
  height: 38px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width:154px;
}
.view-portfolios {
  position: relative;
  text-decoration: underline;
  line-height: 138%;
  font-weight: 500;
  padding-top: 10px;
  font-size: 14px;
  font-family: "Inter";
}
.link4 {
  text-decoration: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  color: inherit;
}
.cta46,
.left-container2 {
  display: flex;
  justify-content: flex-start;
}
.left-container2-podcast{
  display: flex;
  justify-content: flex-start;
}
.cta46 {
  flex-direction: row;
  align-items: center;
  gap: var(--gap-xl);
  font-size: var(--font-size-sm);
}
.left-container2 {
  width: 100%;
  flex-direction: column;
  /* align-items: center; */
  gap:15px;
  /* gap: var(--gap-10xl); */
}
.left-container2-podcast{
  width: 100%;
  flex-direction: column;
  /* align-items: center; */
  gap:45px;
}
.image-child11 {
  width: 353px;
  position: relative;
  border-radius: var(--br-17xl-9);
  height: 512.9px;
  object-fit: cover;
}
.image22 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
.main-content21,
.sec-23 {
  display: flex;
  align-items: center;
  justify-content: center;
}
.main-content21 {
  flex-direction: row;
  gap: 81px;
}
.sec-23 {
  align-self: stretch;
  background-color: var(--color-white);
  height: 720px;
  flex-direction: column;
  padding: var(--padding-81xl) 210px 107px;
  box-sizing: border-box;
  text-align: left;
  font-size: var(--font-size-21xl);
  color: var(--color-black);
  font-family: var(--font-inter);
}
.studio-capabilities {
  margin: 0;
  align-self: stretch;
  position: relative;
  font-size: inherit;
  line-height: 110%;
  font-weight: 800;
  font-family: inherit;
  font-family: Inter;
    font-size: 48px;
    font-weight: 800;
    line-height: 52.8px;
}
.vivamus-semper-pellentesque-fi {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  padding-left: var(--padding-2xl);
}
.semper-pellentesque-finibus-container {
  position: relative;
  line-height: 105.02%;
  font-weight: 300;
}
.top13 {
  align-self: stretch;
  flex-direction: row;
  gap: 10px;
  font-family: Inter;
font-size: 16px;
font-weight: 500;
line-height: 16.8px;
text-align: center;
}
.vivamus-semper-pellentesque-fi li{
  font-family: Inter;
font-size: 16px;
font-weight: 500;
line-height: 16.8px;
text-align: center;
}
.bot9,
.content41,
.sub,
.top13 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  align-items: flex-start;
}
.bot9 {
  flex-direction: column;
  gap: 10px;

}
.content41,
.sub {
  align-self: stretch;
  flex-direction: column;
}
.sub {
  gap: 65px;
  font-family: Inter;
font-size: 16px;
font-weight: 500;
line-height: 16.8px;
text-align: center;

  display: flex;
    flex-direction: row;
    /* padding-left: 35px; */
}
.content41 {
  gap: var(--gap-8xs);
}
.book-a-recording {
  position: relative;
  font-size: var(--font-size-sm);
  font-weight: 500;
  font-family: var(--font-inter);
  color: var(--color-white);
  text-align: left;
}
.content40 {
  width: 760px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 43px;
}
.img-item {
  width: 433px;
  position: relative;
  height: 245px;
  object-fit: cover;
}
.img1 {
  width: 433px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.img-inner {
  width: 432.1px;
  position: relative;
  height: 245px;
  object-fit: cover;
}
.img2 {
  width: 432.1px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.img-child1 {
  width: 433px;
  position: relative;
  height: 245px;
  object-fit: cover;
}
.img3,
.img4,
.web-image {
  width: 433px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.img4,
.web-image {
  width: 432.1px;
}
.web-image {
  width: 878px;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--gap-xs);
  min-width: 878px;
  max-width: 878px;
}
.mbl-image-child {
  width: 433px;
  position: relative;
  height: 245px;
  object-fit: cover;
}
.mbl-image-child1,
.mbl-image-inner,
.mbl-image-item {
  width: 432.1px;
  position: relative;
  height: 245px;
  object-fit: cover;
}
.mbl-image-child1,
.mbl-image-inner {
  width: 433px;
}
.mbl-image-child1 {
  width: 432.1px;
}
.main-container16,
.mbl-image,
.sec-33 {
  flex-direction: column;
  align-items: center;
}
.mbl-image {
  width: 428px;
  display: none;
  justify-content: flex-start;
  gap: var(--gap-xs);
  min-width: 428px;
  max-width: 428px;
}
.main-container16,
.sec-33 {
  display: flex;
}
.main-container16 {
  width: 878px;
  justify-content: flex-start;
  gap: var(--gap-37xl);
}
.sec-33 {
  align-self: stretch;
  height: 900px;
  background-color: var(--color-white);
  justify-content: center;
  padding: 0 201px;
  box-sizing: border-box;
  text-align: center;
  font-size: var(--font-size-21xl);
  color: var(--color-black);
  font-family: var(--font-inter);
}
.business-production,
.ut-porttitor-felis {
  margin: 0;
  align-self: stretch;
  position: relative;
}
.business-production {
  font-size: 48px;
  line-height: 100%;
  font-weight: 800;
  font-family: inherit;
}
.ut-porttitor-felis {
  font-size: var(--font-size-base);
  line-height: 105.02%;
  font-weight: 300;
  display: inline-block;
  /* height: 134px; */
  flex-shrink: 0;
}
.promoting-conversation-description{
  gap: 30px;
  display: flex;
  flex-direction: column;

}
.content42 {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 15px;
}
.cta49,
.cta51,
.left1 {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.cta51 {
  cursor: pointer;
  border: 0;
  padding: var(--padding-6xs) var(--padding-7xl);
  background-color: var(--color-steelblue);
  border-radius: var(--br-base);
  height: 38px;
  justify-content: center;
  box-sizing: border-box;
}
.cta49,
.left1 {
  justify-content: flex-start;
  gap: var(--gap-base);
}
.left1 {
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  /* gap: var(--gap-10xl); */
}
.play-icon1 {
  width: 28.6px;
  height: 29.7px;
  object-fit: cover;
}
.card31,
.card9 {
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
}
.card9 {
  width: 219.2px;
  border-radius: var(--br-17xl);
  height: 331.2px;
  justify-content: center;
  padding: var(--padding-131xl) var(--padding-43xl);
  background-image: url(../../assets/katon-network/card3@3x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
}
.card31 {
  position: absolute;
  top: 0;
  left: 0;
  width: 463px;
  height: 513px;
  justify-content: flex-end;
  padding: var(--padding-3xs) 0;
}
.solidmediaplay-icon {
  width: 15.1px;
  position: relative;
  height: 15.1px;
  left: 12px;
}
.play {
  width: 38.5px;
  border-radius: 19.23px;
  background-color: var(--color-white);
  height: 38.5px;
  justify-content: flex-start;
  padding: var(--padding-xs);
}
.card10,
.card21,
.play {
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
}
.card10 {
  width: 295.2px;
  border-radius: var(--br-17xl);
  height: 428.9px;
  justify-content: center;
  padding: 195px var(--padding-90xl);
  background-image: url(../../assets/katon-network/card4@3x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
}
.card21 {
  position: absolute;
  top: 0;
  left: 0;
  width: 410px;
  height: 513px;
  justify-content: flex-end;
  padding: var(--padding-3xs) 0;
}
.play-icon2 {
  width: 46px;
  border-radius: 23px;
  height: 46px;
  object-fit: cover;
}
.card113 {
  position: absolute;
  top: 1px;
  left: 0;
  border-radius: var(--br-17xl);
  width: 353px;
  height: 512px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 233px 153px;
  box-sizing: border-box;
  background-image: url(../../assets/katon-network/card11@3x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
}
.video-cards {
  align-self: stretch;
  height: 513px;
  position: relative;
}
.pagination-child,
.pagination-item {
  width: 9px;
  position: relative;
  border-radius: 50%;
  background-color: var(--color-gray-100);
  height: 9px;
}
.pagination-item {
  background-color:#d9d9d9;
}
.pagination {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-7xs);
}
.container49,
.right1 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.container49 {
  align-self: stretch;
  justify-content: flex-start;
  padding: 0 253px 0 126px;
}
.right1 {
  width: 485px;
  justify-content: center;
  gap: var(--gap-xl);
}
.play-icon3 {
  width: 21px;
  height: 21.8px;
  object-fit: cover;
}
.card20,
.card32 {
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
}
.card20 {
  width: 161px;
  border-radius: 26.44px;
  height: 243.2px;
  justify-content: center;
  padding: 110.2px 45.5px;
  background-image: url(../../assets/katon-network/card5@2x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
}
.card32 {
  position: absolute;
  top: 0;
  left: 0;
  width: 340px;
  height: 376.7px;
  justify-content: flex-end;
  padding: var(--padding-5xs-3) 0;
}
.play-icon4 {
  width: 28.2px;
  border-radius: 14.12px;
  height: 28.2px;
  object-fit: cover;
}
.card22,
.card23 {
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
}
.card23 {
  width: 216.8px;
  border-radius: 26.44px;
  height: 315px;
  justify-content: center;
  padding: 143.2px var(--padding-61xl);
  background-image: url(../../assets/katon-network/card6@3x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
}
.card22 {
  position: absolute;
  top: 0;
  left: 0;
  width: 301.1px;
  height: 376.7px;
  justify-content: flex-end;
  padding: var(--padding-5xs-3) 0;
}
.play-icon5 {
  width: 33.8px;
  border-radius: 16.89px;
  height: 33.8px;
  object-fit: cover;
}
.card114 {
  position: absolute;
  top: 0.8px;
  left: 0;
  border-radius: 26.44px;
  width: 259.2px;
  height: 376px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 171.1px 112.4px;
  box-sizing: border-box;
  background-image: url(../../assets/katon-network/card12@3x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
}
.video-cards1 {
  align-self: stretch;
  height: 376.7px;
  position: relative;
}
.pagination-child3,
.pagination-child4 {
  width: 6.6px;
  position: relative;
  border-radius: 50%;
  background-color: var(--color-gray-100);
  height: 6.6px;
}
.pagination-child4 {
  background-color: var(--color-gainsboro);
}
.pagination1 {
  align-self: stretch;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 4.4px;
}
.container50,
.mbl-right {
  flex-direction: column;
  align-items: flex-start;
}
.container50 {
  align-self: stretch;
  display: flex;
  justify-content: flex-start;
  padding: 0 185.8px 0 92.5px;
}
.mbl-right {
  width: 340px;
  display: none;
  justify-content: center;
  gap: var(--gap-mini-7);
}
.main-container17,
.sec-43 {
  display: flex;
  align-items: center;
}
.main-container17 {
  width: 980px;
  flex-direction: row;
  justify-content: flex-start;
  gap: 92px;
}
.sec-43 {
  align-self: stretch;
  background-color: var(--color-white);
  height: 720px;
  flex-direction: column;
  justify-content: center;
  padding: var(--padding-81xl) var(--padding-81xl) 78px 210px;
  box-sizing: border-box;
  text-align: left;
  font-size: var(--font-size-21xl);
  color: var(--color-black);
  font-family: var(--font-inter);
}
.ut-porttitor-felis1 {
  margin: 0;
  align-self: stretch;
  position: relative;
  font-size: var(--font-size-base);
  line-height: 105.02%;
  font-weight: 300;
}
.cta52,
.main-content22 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
.main-content22 {
  width: 850px;
  justify-content: center;
  gap:81px;
}
.promoting-conversation-than-container {
  margin: 0;
  align-self: stretch;
  position: relative;
  font-size: 48px;
  line-height: 100%;
  font-weight: 700;
  font-family: inherit;
}
.ut-porttitor-felis2 {
  margin: 0;
  align-self: stretch;
  position: relative;
  font-family: Inter;
    font-size: 14px;
    font-weight: 200;
    line-height: 20.58px;
    text-align: center;
    width: 828px;
}
.title16 {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-mini);
}
.videos-child {
  width: 47px;
  position: relative;
  border-radius: 50%;
  height: 47px;
  object-fit: cover;
}
.syndicated-videos9 {
  flex: 1;
  position: relative;
  line-height: 105%;
    font-size: 16px;
}
.videos2 {
  width: 161px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-3xs);
}
.content-creation {
  width: 71.9px;
  position: relative;
  line-height: 105.02%;
  display: inline-block;
  flex-shrink: 0;
  font-size: 16px;
}
.content44 {
  width: 128px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-3xs);
}
.podcast-session {
  flex: 1;
  position: relative;
  line-height: 105.02%;
  font-size: 16px;
}
.podcast1 {
  /* flex: 1; */
  flex-direction: row;
  gap: var(--gap-3xs);
  width: 128px;
}
.container51,
.container52,
.podcast1 {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.container52 {
    
  width: 607px;
  flex-direction: row;
  gap: 40px;
  text-align: left;
  font-size: var(--font-size-base);
  justify-content: center;
  align-items: center;
}
.container51 {
  align-self: stretch;
  flex-direction: column;
  gap: var(--gap-51xl);
}
.book-a-recording1 {
  position: relative;
  font-size: var(--font-size-sm);
  font-weight: 500;
  font-family: var(--font-inter);
  color: var(--color-midnightblue);
  text-align: left;
}
.cta54 {
  cursor: pointer;
  border: 0;
  padding: var(--padding-6xs) var(--padding-7xl);
  background-color: var(--color-white);
  width: auto;
  border-radius: var(--br-base);
  height: 38px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.main-content23 {
  width: 846px;
  align-items: center;
  justify-content: flex-start;
  gap: 84px;
}
.katon-network2,
.main-content23,
.sec-62 {
  display: flex;
  flex-direction: column;
}
.sec-62 {
  align-self: stretch;
  background-color: var(--color-midnightblue);
  align-items: center;
  justify-content: center;
  padding: 86px 217px 87px;
  text-align: center;
  font-size: var(--font-size-21xl);
  color: var(--color-white);
  font-family: var(--font-inter);
}
.katon-network2 {
  width: 100%;
  position: relative;
  align-items: flex-start;
  justify-content: flex-start;
}
@media screen and (max-width: 1200px) {
  .ambassadorsMainSection{
    padding-left: 150px;
    padding-right: 150px;
  }
  .promoting-conversation-than-container {
    font-size: var(--font-size-21xl);
  }
  .main-content23,
  .sec-62 {
    align-self: stretch;
    width: auto;
  }
  .sec-62 {
    align-self: unset;
    width: 100%;
    padding: 86px 105px 87px;
  }
  .main-container17{
    width: 100%;
    /* gap: 70px; */
    padding: var(--padding-81xl) var(--padding-81xl) 78px 65px;
  }
  .book-a-recording {
    font-size: 12px;
  }
  .sec-43{
    padding: 100px 65px 78px;
  }
}
@media screen and (max-width: 1024px) {
  .ambassadorsMainSection{
    padding-left: 75px;
    padding-right: 75px;
  }
}
@media screen and (max-width: 960px) {
  .ambassadorsMainSection{
    padding-left: 65px;
    padding-right: 65px;
  }
  .ambassadorTitleContainer{
    font-size: 42px;
    line-height: 42px;
  }

  .image-child8 {
    width: 35%;
    height: 90%;
  }
  .title15{
    width: 100%;
    padding:0px;
  }
  .main-container16{
    width: 100%;
  }
  .main-content21{
    flex-direction: column;
    gap: 50px;
  }
  .image21 {
    align-self: stretch;
    width: auto;
  }
  .main-content20 {
    gap: var(--gap-29xl);
  }
  .sec-12,
  .sec-23 {
    align-self: stretch;
    width: auto;
    padding-left: var(--padding-31xl);
    padding-right: var(--padding-31xl);
    box-sizing: border-box;
  }
  .sec-23{
    padding-bottom: 165px;
    padding-top: 100px;
    height: 100%;
  }
  .content40,
  .img-item {
    width: auto;
    align-self: unset;
  }
  .img-item {
    align-self: stretch;
    flex: 1;
  }
  .img1 {
    width: 37%;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
  }
  .img-inner {
    align-self: stretch;
    width: auto;
    flex: 1;
  }
  .img2 {
    width: 37%;
  }
  .img-child1 {
    align-self: stretch;
    width: auto;
    flex: 1;
  }
  .img3,
  .img4 {
    width: 37%;
  }
  .img4 {
    height: auto;
  }
  .web-image {
    width: 100%;
    gap: var(--gap-base);
    align-items: flex-start;
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
    min-width: 0px;
  }
  .mbl-image-child,
  .mbl-image-child1,
  .mbl-image-inner,
  .mbl-image-item {
    width: 45%;
  }
  .mbl-image {
    width: 100%;
    align-items: flex-start;
    justify-content: center;
  }
  .sec-33 {
    align-self: stretch;
    width: auto;
    padding-left: var(--padding-31xl);
    padding-right: var(--padding-31xl);
    box-sizing: border-box;
    height: 100%;
    padding-bottom: 152px;
  }
  .sec-12{
    height: 100%;
    padding-top: 120px;
  }
  .left-container2{
    width: 100%;
    display: contents;
  }
  .ut-porttitor-felis {
    line-height: 20px;
  }
  .content42 {
    height: auto;
    gap: var(--gap-5xs);
  }
  .left1 {
    height: auto;
    gap: 82px;
    align-items: flex-start;
    justify-content: center;
  }
  .main-container17 {
    align-self: stretch;
    width: auto;
    gap: var(--gap-45xl);
    flex-direction:column ;
  }
  .main-content22{
    width: 100%;
    flex-direction: column;
  }
  .main-content20{
    width: 100%;
  }
  .sec-43 {
    padding-left: var(--padding-31xl);
    padding-right: var(--padding-31xl);
    box-sizing: border-box;
  }
  .main-content23,
  .sec-43,
  .sec-62,
  .ut-porttitor-felis2 {
    align-self: stretch;
    width: auto;
  }
  .sec-62 {
    padding-left: var(--padding-31xl);
    padding-right: var(--padding-31xl);
    box-sizing: border-box;
  }
}
@media screen and (max-width: 820px) {
  .ambassadorsMainSection{
    padding-left: 50px;
    padding-right: 50px;
  }
}
@media screen and (max-width: 790px) {
  .ambassadorTitleContainer{
    font-size: 38px;
    line-height: 38px;
  }
  .ambassadorDescContainer{
    max-width: 560px;
  }
}

@media screen and (max-width: 670px) {
  .ambassadorsMainSection .ambassadorTitleContainer{
    font-size: 30px;
    line-height: 30px;
    text-align: center;
  }
  .ambassadorsMainSection .ambassadorDescContainer {
    width: 100%;
    max-width: 100%;
    font-size: 14px;
    line-height: 19.32px;
    text-align: center;
  }
  .ambassadorsMainSection{
    padding: 60px 20px;
    gap: 18px;
  }
  .ambassadorCtaContainer{
    margin-top: 6px;
  }
  .ambassadorsMainSection .ambassadorCtaContainer{
    width: 100%;
    gap: 10px;
  }
  .ambassadorCtaContainer a{
    width: 50%;
  }
  .ambassadorCtaContainer a button{
    width: 100%;
  }
}
@media screen and (max-width: 635px) {
  .ambassadorDescContainer{
    width: 100%;
  }
}
@media screen and (max-width: 431px) {
  .katon-network3 {
    font-size: var(--font-size-13xl);
  }
  .donec-vitae-sapien {
    height: auto;
    width: 100%;
  }
  .title15 {
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
  }
  .image-child8 {
    width: 100%;
    /* height: 400px; */
  }
  .image21 {
    flex: 1;
    flex-direction: column;
  }
  .main-content20,
  .sec-12 {
    align-self: stretch;
    width: auto;
  }
  .sec-12 {
    height: auto;
    padding-left: var(--padding-5xl);
    /* padding-top: var(--padding-121xl); */
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
    padding-top: 150px;
  }
  .join-the-katon-container {
    font-size: var(--font-size-13xl);
    align-self: stretch;
    width: auto;
  }
  .join-a-community1 {
    line-height: 20px;
  }
  .content39 {
    gap: var(--gap-xs);
  }
  .left-container2 {
    align-self: stretch;
    width: auto;
  }
  .image-child11 {
    flex: 1;
    align-self: stretch;
    height: auto;
  }
  .image22 {
    width: 100%;
  }
  .main-content21,
  .sec-23 {
    align-self: stretch;
    width: auto;
  }
  .main-content21 {
    flex-direction: column;
    gap: var(--gap-25xl);
  }
  .sec-23 {
    height: auto;
    padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
  }
  .studio-capabilities {
    font-size: var(--font-size-13xl);
  }
  .bot9,
  .top13 {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }
  .top13 {
    gap: var(--gap-base);
  }
  .bot9 {
    align-self: stretch;
    width: auto;
  }
  .sub {
    gap: var(--gap-xl);
  }
  .content41 {
    gap: var(--gap-xs);
  }
  .content40 {
    align-self: stretch;
    width: auto;
  }
  .img-item {
    width: 80%;
  }
  .img1 {
    width: auto;
    align-self: unset;
  }
  .img-inner {
    width: 60%;
  }
  .img2 {
    width: auto;
    align-self: unset;
  }
  .img-child1 {
    width: 60%;
  }
  .img3,
  .img4 {
    width: auto;
    align-self: unset;
  }
  .web-image {
    display: none;
    width: 100%;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-left: 0;
    box-sizing: border-box;
  }
  .mbl-image-child,
  .mbl-image-item {
    align-self: stretch;
    width: auto;
    flex: 1;
  }
  .mbl-image-child1,
  .mbl-image-inner {
    align-self: stretch;
    width: auto;
  }
  .mbl-image {
    display: flex;
    width: 100%;
    flex: 1;
    flex-direction: column;
    gap: var(--gap-xs);
    align-items: center;
    justify-content: center;
    padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
    min-width: 400px;
  }
  .main-container16,
  .sec-33 {
    align-self: stretch;
    width: auto;
    box-sizing: border-box;
  }
  .main-container16 {
    flex: 1;
    gap: var(--gap-13xl);
    padding-left: 0;
  }
  .sec-33 {
    height: auto;
    padding: var(--padding-61xl) var(--padding-5xl);
  }
  .business-production {
    font-size: var(--font-size-13xl);
  }
  .content42 {
    flex: 1;
  }
  .left1 {
    flex: unset;
    gap: var(--gap-33xl);
    align-self: stretch;
  }
  .right1 {
    display: block;
    width: 100%;
  }
  .card113{
    position: absolute;
    top: 0.8px;
    left: 0;
    border-radius: 26.44px;
    width: auto;
    height: 376px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 171.1px 112.4px;
    box-sizing: border-box;
    /* background-image: url(../../assets/katon-network/card12@3x.png); */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
  }
  .card9{
    width: 161px;
    border-radius: 26.44px;
    height: 243.2px;
    justify-content: center;
    padding: 110.2px 45.5px;
    /* background-image: url(../../assets/katon-network/card5@2x.png); */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
  }
  .card10{
    width: 216.8px;
    border-radius: 26.44px;
    height: 315px;
    justify-content: center;
    padding: 143.2px var(--padding-61xl);
    /* background-image: url(../../assets/katon-network/card6@3x.png); */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
  }
  .card31{
    position: absolute;
    top: 0;
    left: 0;
    width: 340px;
    height: 376.7px;
    justify-content: flex-end;
    padding: var(--padding-5xs-3) 0;
  }
  .card21{
    position: absolute;
    top: 0;
    left: 0;
    width: 301.1px;
    height: 376.7px;
    justify-content: flex-end;
    padding: var(--padding-5xs-3) 0;
  }
  .video-cards{
    align-self: stretch;
    height: 376.7px;
    position: relative;
  }
  .right1{
    display: flex;
    width: 390px;
    flex-direction: column;
    gap: var(--gap-mini-7);
    align-items: flex-end;
    justify-content: center;
    /* padding-left: var(--padding-23xl); */
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
    padding-left: 55px;
  }
  .container49{
    padding-top: 30px;
    padding-right: 35px;
    /* padding: 0px;
    height: 50px; */
  }
  .pagination{
    justify-content: center;
    padding: 10px;
  }
  .play-icon3,
  .play-icon4 {
    width: 44px;
    height: 44px;
    border-radius: var(--br-13xl);
  }
  .card23 {
    border-radius: var(--br-base);
  }
  .play-icon5 {
    width: 44px;
    height: 44px;
    border-radius: var(--br-13xl);
  }
  .card114 {
    width: auto;
    align-self: unset;
  }
  .container50 {
    padding-left: 94px;
    padding-right: 0;
    box-sizing: border-box;
  }
  .mbl-right {
    display: flex;
    width: 390px;
    flex-direction: column;
    gap: var(--gap-mini-7);
    align-items: flex-end;
    justify-content: center;
    padding-left: var(--padding-23xl);
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
  }
  .main-container17,
  .sec-43 {
    align-self: stretch;
    width: auto;
  }
  .main-container17 {
    flex-direction: column;
    gap: var(--gap-29xl);
    align-items: flex-end;
    justify-content: flex-start;
    padding: 0px;
    padding-left: 20px;
  }
  .sec-43 {
    height: auto;
    align-items: center;
    justify-content: center;
    padding: 0px;
    /* padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl); */
    box-sizing: border-box;
  }
  .ut-porttitor-felis1 {
    line-height: 20px;
  }
  .main-content22 {
    align-self: stretch;
    width: auto;
    flex-direction: column;
    gap: var(--gap-25xl);
  }
  .promoting-conversation-than-container {
    font-size: var(--font-size-13xl);
    line-height: 38px;
  }
  .ut-porttitor-felis2 {
    line-height: 20px;
  }
  .syndicated-videos9 {
    flex: 1;
  }
  .videos2 {
    align-self: stretch;
    width: auto;
  }
  .content-creation {
    flex: 1;
  }
  .content44,
  .podcast1 {
    align-self: stretch;
    width: auto;
  }
  .podcast1 {
    flex: unset;
  }
  .container52 {
    width: auto;
    align-self: unset;
    flex-direction: column;
    gap: var(--gap-5xl);
    align-items: center;
    justify-content: flex-start;
  }
  .container51 {
    gap: var(--gap-29xl);
  }
  .main-content23,
  .sec-62 {
    align-self: stretch;
    width: auto;
  }
  .sec-62 {
    padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
  }
}
@media screen and (max-width: 540px) {
  .katon-network3 {
    font-size: var(--font-size-13xl);
  }
  .donec-vitae-sapien {
    height: auto;
    width: 100%;
  }
  .title15 {
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
  }
  .image-child8 {
    width: 100%;
    /* height: 400px; */
  }
  .image21 {
    flex: 1;
    flex-direction: column;
  }
  .main-content20,
  .sec-12 {
    align-self: stretch;
    width: auto;
  }
  .sec-12 {
    height: auto;
    padding-left: var(--padding-5xl);
    /* padding-top: var(--padding-121xl); */
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
    padding-top: 150px;
  }
  .join-the-katon-container {
    font-size: var(--font-size-13xl);
    align-self: stretch;
    width: auto;
  }
  .join-a-community1 {
    line-height: 20px;
    width: 100%;
  }
  .content39 {
    gap: var(--gap-xs);
  }
  .left-container2 {
    align-self: stretch;
    width: auto;
  }
  .image-child11 {
    flex: 1;
    align-self: stretch;
    height: auto;
  }
  .image22 {
    width: 100%;
  }
  .main-content21,
  .sec-23 {
    align-self: stretch;
    width: auto;
  }
  .main-content21 {
    flex-direction: column;
    gap: var(--gap-25xl);
  }
  .sec-23 {
    height: auto;
    padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
  }
  .studio-capabilities {
    font-size: var(--font-size-13xl);
  }
  .bot9,
  .top13 {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }
  .top13 {
    gap: var(--gap-base);
  }
  .bot9 {
    align-self: stretch;
    width: auto;
  }
  .sub {
    gap: var(--gap-xl);
  }
  .content41 {
    gap: var(--gap-xs);
  }
  .content40 {
    align-self: stretch;
    width: auto;
  }
  .img-item {
    width: 80%;
  }
  .img1 {
    width: auto;
    align-self: unset;
  }
  .img-inner {
    width: 60%;
  }
  .img2 {
    width: auto;
    align-self: unset;
  }
  .img-child1 {
    width: 60%;
  }
  .img3,
  .img4 {
    width: auto;
    align-self: unset;
  }
  .web-image {
    display: none;
    width: 100%;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-left: 0;
    box-sizing: border-box;
  }
  .mbl-image-child,
  .mbl-image-item {
    align-self: stretch;
    width: auto;
    flex: 1;
  }
  .mbl-image-child1,
  .mbl-image-inner {
    align-self: stretch;
    width: auto;
  }
  .mbl-image {
    display: flex;
    width: 100%;
    flex: 1;
    flex-direction: column;
    gap: var(--gap-xs);
    align-items: center;
    justify-content: center;
    padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
    min-width: 400px;
  }
  .main-container16,
  .sec-33 {
    align-self: stretch;
    width: auto;
    box-sizing: border-box;
  }
  .main-container16 {
    flex: 1;
    gap: var(--gap-13xl);
    padding-left: 0;
  }
  .sec-33 {
    height: auto;
    padding: var(--padding-61xl) var(--padding-5xl);
  }
  .business-production {
    font-size: var(--font-size-13xl);
  }
  .content42 {
    flex: 1;
  }
  .left1 {
    flex: unset;
    gap: var(--gap-33xl);
    align-self: stretch;
  }
  .right1 {
    display: block;
    width: 100%;
  }
  .card113{
    position: absolute;
    top: 0.8px;
    left: 0;
    border-radius: 26.44px;
    width: auto;
    height: 376px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 171.1px 112.4px;
    box-sizing: border-box;
    /* background-image: url(../../assets/katon-network/card12@3x.png); */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
  }
  .card9{
    width: 161px;
    border-radius: 26.44px;
    height: 243.2px;
    justify-content: center;
    padding: 110.2px 45.5px;
    /* background-image: url(../../assets/katon-network/card5@2x.png); */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
  }
  .card10{
    width: 216.8px;
    border-radius: 26.44px;
    height: 315px;
    justify-content: center;
    padding: 143.2px var(--padding-61xl);
    /* background-image: url(../../assets/katon-network/card6@3x.png); */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
  }
  .card31{
    position: absolute;
    top: 0;
    left: 0;
    width: 340px;
    height: 376.7px;
    justify-content: flex-end;
    padding: var(--padding-5xs-3) 0;
  }
  .card21{
    position: absolute;
    top: 0;
    left: 0;
    width: 301.1px;
    height: 376.7px;
    justify-content: flex-end;
    padding: var(--padding-5xs-3) 0;
  }
  .video-cards{
    align-self: stretch;
    height: 376.7px;
    position: relative;
  }
  .right1{
    display: flex;
    width: 390px;
    flex-direction: column;
    gap: var(--gap-mini-7);
    align-items: flex-end;
    justify-content: center;
    /* padding-left: var(--padding-23xl); */
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
    padding-left: 55px;
  }
  .container49{
    padding-top: 30px;
    padding-right: 35px;
    /* padding: 0px;
    height: 50px; */
  }
  .pagination{
    justify-content: center;
    padding: 10px;
  }
  .play-icon3,
  .play-icon4 {
    width: 44px;
    height: 44px;
    border-radius: var(--br-13xl);
  }
  .card23 {
    border-radius: var(--br-base);
  }
  .play-icon5 {
    width: 44px;
    height: 44px;
    border-radius: var(--br-13xl);
  }
  .card114 {
    width: auto;
    align-self: unset;
  }
  .container50 {
    padding-left: 94px;
    padding-right: 0;
    box-sizing: border-box;
  }
  .mbl-right {
    display: flex;
    width: 390px;
    flex-direction: column;
    gap: var(--gap-mini-7);
    align-items: flex-end;
    justify-content: center;
    padding-left: var(--padding-23xl);
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
  }
  .main-container17,
  .sec-43 {
    align-self: stretch;
    width: auto;
  }
  .main-container17 {
    flex-direction: column;
    gap: var(--gap-29xl);
    align-items: flex-end;
    justify-content: flex-start;
    padding: 0px;
    padding-left: 20px !important;
  }
  .sec-43 {
    height: auto;
    align-items: center;
    justify-content: center;
    padding: 0px;
    /* padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl); */
    box-sizing: border-box;
  }
  .ut-porttitor-felis1 {
    line-height: 20px;
  }
  .main-content22 {
    align-self: stretch;
    width: auto;
    flex-direction: column;
    gap: var(--gap-25xl);
  }
  .promoting-conversation-than-container {
    font-size: var(--font-size-13xl);
    line-height: 38px;
  }
  .ut-porttitor-felis2 {
    line-height: 20px;
  }
  .syndicated-videos9 {
    flex: 1;
  }
  .videos2 {
    align-self: stretch;
    width: auto;
  }
  .content-creation {
    flex: 1;
  }
  .content44,
  .podcast1 {
    align-self: stretch;
    width: auto;
  }
  .podcast1 {
    flex: unset;
  }
  .container52 {
    width: auto;
    align-self: unset;
    flex-direction: column;
    gap: var(--gap-5xl);
    align-items: center;
    justify-content: flex-start;
  }
  .container51 {
    gap: var(--gap-29xl);
  }
  .main-content23,
  .sec-62 {
    align-self: stretch;
    width: auto;
  }
  .sec-62 {
    padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
  }
}
@media screen and (max-width: 420px) {
  .ambassadorTitleContainer{
    font-size: 32px;
    line-height: 32px;
  }
  .cta46{
    flex-direction: column;
  }
  .katon-network3 {
    font-size: var(--font-size-13xl);
  }
  .main-content20,
  .sec-12 {
    width: auto;
    box-sizing: border-box;
  }
  .main-content20 {
    align-self: stretch;
    gap: var(--gap-29xl);
    padding-left: 0;
    padding-right: 0;
  }
  .sec-12 {
    align-self: unset;
    height: auto;
    padding-left: var(--padding-5xl);
    /* padding-top: var(--padding-121xl); */
    padding-right: var(--padding-5xl);
    padding-top: 130px;
  }
  .join-the-katon-container {
    font-size: var(--font-size-13xl);
  }
  .join-a-community1 {
    line-height: 20px;
  }
  .left-container2 {
    gap: var(--gap-13xl);
  }
  .image-child11 {
    flex: 1;
    align-self: stretch;
    height: auto;
    width: 80%;
  }
  .image22 {
    width: 100%;
  }
  .main-content21 {
    align-self: stretch;
    width: auto;
  }
  .studio-capabilities {
    font-size: var(--font-size-13xl);
  }
  .mbl-image-child,
  .mbl-image-inner,
  .mbl-image-item {
    align-self: stretch;
    width: auto;
    flex: 1;
  }
  .mbl-image-inner,
  .mbl-image-item {
    display: flex;
  }
  .mbl-image-child1 {
    display: none;
    align-self: stretch;
    width: auto;
    flex: 1;
  }
  .mbl-image {
    display: flex;
    min-width: 0px;
    /* max-width: 100px; */
  }
  .main-container16 {
    height: auto;
    gap: var(--gap-5xl);
  }
  .sec-33,
  .sec-43 {
    box-sizing: border-box;
  }
  .sec-33 {
    height: auto;
    padding-top: var(--padding-61xl);
    padding-bottom: var(--padding-61xl);
  }
  .sec-43 {
    padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl);
  }
  .ut-porttitor-felis1 {
    line-height: 20px;
  }
  .promoting-conversation-than-container {
    font-size: var(--font-size-13xl);
    line-height: 38px;
  }
  .sec-62 {
    width: auto;
    align-self: unset;
    padding-left: var(--padding-5xl);
    padding-right: var(--padding-5xl);
    box-sizing: border-box;
  }
}
@media screen and (max-width: 376px) {
  .ambassadorCtaContainer{
    justify-content: center;
    align-items: center;
  }
  .main-content20 {
    align-self: stretch;
    width: auto;
    gap: var(--gap-29xl);
    padding-top: 125px;
  }
  .book-a-recording{
    font-size: 12px;
  }
  .sec-12 {
    height: auto;
    padding-left: var(--padding-base);
    padding-top: var(--padding-121xl);
    padding-right: var(--padding-base);
    box-sizing: border-box;
  }
  .join-the-katon-container,
  .sec-12 {
    align-self: stretch;
    width: auto;
  }
  .content39 {
    gap: var(--gap-xs);
  }
  .left-container2 {
    align-self: stretch;
    width: auto;
    gap: var(--gap-13xl);
  }
  .image-child11 {
    width: 100%;
  }
  .image22,
  .sec-23 {
    align-self: stretch;
    width: auto;
  }
  .image22 {
    flex: 1;
  }
  .sec-23 {
    padding-left: var(--padding-base);
    padding-right: var(--padding-base);
    box-sizing: border-box;
  }
  .studio-capabilities {
    font-size: var(--font-size-13xl);
  }
  .content41 {
    gap: var(--gap-xs);
  }
  .content40 {
    align-self: stretch;
    width: auto;
    gap: var(--gap-23xl);
  }
  .web-image {
    display: none;
  }
  .mbl-image-child,
  .mbl-image-child1,
  .mbl-image-inner,
  .mbl-image-item {
    align-self: stretch;
    width: auto;
    flex: 1;
  }
  .mbl-image-child1 {
    display: flex;
  }
  .mbl-image {
    display: flex;
    min-width: 360px;
  }
  .sec-33 {
    align-self: stretch;
    width: auto;
    padding-left: var(--padding-base);
    padding-right: var(--padding-base);
    box-sizing: border-box;
  }
  .business-production {
    font-size: var(--font-size-13xl);
  }
  .ut-porttitor-felis {
    line-height: 20px;
  }
  .left1 {
    /* gap: var(--gap-39xl); */
    gap: 15px;
  }
  .right1 {
    display: block;
    padding: 0px;
    width: 100%;
  }
  .card113 {
    position: absolute;
    top: 0.8px;
    left: 0;
    border-radius: 26.44px;
    width: 20%;
    height: 50%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 171.1px 112.4px;
    box-sizing: border-box;
    /* background-image: url(../../assets/katon-network/card12@3x.png); */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
  }
  .card21 {
    position: absolute;
    top: -14px;
    bottom: 10%;
    /* right: 35px; */
    left: -32px;
    width: 301.1px;
    height: 376.7px;
    justify-content: flex-end;
    padding: var(--padding-5xs-3) 0;
}
.card31 {
  position: absolute;
  top: 0;
  left: 0;
  width: 335px !important;
  /* width: 340px; */
  height: 376.7px;
  justify-content: flex-end;
  padding: var(--padding-5xs-3) 0;
}
  .card22,
  .card32 {
    justify-content: flex-end;
  }
  .card32 {
    width: 280px;
    height: 250px;
    gap: var(--gap-5xs-3);
    align-items: center;
  }
  .card22 {
    width: 260px;
    height: 280px;
    align-items: flex-start;
  }
  .card114,
  .play-icon5 {
    justify-content: center;
  }
  .play-icon5 {
    width: 44px;
    height: 44px;
    align-items: center;
    border-radius: var(--br-13xl);
  }
  .card114 {
    width: 240px;
    gap: var(--gap-5xs-3);
    align-items: flex-end;
  }
  .card114,
  .video-cards1 {
    height: 360px;
  }
  .container50 {
    gap: var(--gap-5xs-3);
    padding-left: var(--padding-65xl);
    padding-right: var(--padding-41xl);
    box-sizing: border-box;
  }
  .mbl-right {
    display: flex;
    width: 275px;
    flex-direction: column;
    gap: var(--gap-mini-7);
    align-items: flex-end;
    justify-content: flex-end;
    padding-left: 0;
    padding-right: var(--padding-13xl);
    box-sizing: border-box;
  }
  .main-container17 {
    align-self: stretch;
    width: auto;
    align-items: center;
    justify-content: center;
    padding: 0px !important;
  }
  .move-second-image{
    left: 150px !important;
  }
  .container49{
    align-items: center;
    justify-content: center;
  }
  .sec-43 {
    padding-left: var(--padding-base);
    padding-right: var(--padding-base);
    box-sizing: border-box;
  }
  .main-content22,
  .sec-43 {
    align-self: stretch;
    width: auto;
  }
  .promoting-conversation-than-container {
    font-size: var(--font-size-13xl);
  }
  .container51,
  .main-content23 {
    gap: var(--gap-29xl);
  }
  .sec-62 {
    align-self: stretch;
    width: auto;
    padding-left: var(--padding-base);
    padding-right: var(--padding-base);
    box-sizing: border-box;
  }
  #image2.zoom-in{
    left: 65px;
  }
}
@media screen and (max-width: 350px) {
  .join-the-katon-container {
    font-size: var(--font-size-13xl);
    align-self: stretch;
    width: auto;
  }
  .left-container2 {
    flex: 1;
  }
  .image-child11 {
    width: 100%;
  }
  .image22,
  .sec-23 {
    align-self: stretch;
    height: auto;
  }
  .image22 {
    flex: 1;
  }
  .sec-23 {
    width: auto;
  }
  .studio-capabilities {
    font-size: var(--font-size-13xl);
  }
  .bot9,
  .top13 {
    flex-direction: column;
  }
  .bot9 {
    align-self: stretch;
    width: auto;
  }
  .content41 {
    gap: var(--gap-xs);
  }
  .web-image {
    display: none;
  }
  .mbl-image-child,
  .mbl-image-child1,
  .mbl-image-inner,
  .mbl-image-item {
    align-self: stretch;
    width: 100%;
    flex: 1;
  }
  .mbl-image {
    display: flex;
    min-width: 0px;
  }
  .sec-33 {
    align-self: stretch;
    width: auto;
    height: auto;
    padding-left: var(--padding-base);
    padding-right: var(--padding-base);
    box-sizing: border-box;
  }
  .business-production {
    font-size: var(--font-size-13xl);
  }
  .card20 {
    align-self: stretch;
    height: auto;
    align-items: flex-start;
  }
  .card20,
  .card22,
  .card32 {
    justify-content: flex-end;
  }
  .card32 {
    width: 280px;
    height: auto;
    gap: var(--gap-5xs-3);
    align-items: flex-end;
  }
  .card22 {
    width: 260px;
    height: 250px;
    align-items: flex-start;
  }
  .card114 {
    width: 220px;
    height: 300px;
  }
  .video-cards1 {
    align-self: stretch;
    width: auto;
    flex: 1;
  }
  .container50 {
    gap: var(--gap-5xs-3);
    padding-left: var(--padding-65xl);
    box-sizing: border-box;
  }
  .mbl-right {
    display: flex;
    width: 280px;
    height: 370px;
    gap: var(--gap-mini-7);
    align-items: center;
    justify-content: flex-end;
    padding-left: 0;
    box-sizing: border-box;
  }
  .main-content22 {
    align-self: stretch;
    width: auto;
  }
  .container51 {
    gap: var(--gap-29xl);
  }
  .sec-62 {
    align-self: stretch;
    width: auto;
    padding-left: var(--padding-base);
    padding-right: var(--padding-base);
    box-sizing: border-box;
  }
  .card31 {
    width: 300px !important;
}
#image2.zoom-in {
  height: 330px;
  width: 200px !important;
}
#image1.zoom-out{
  left: 30px;
}
.move-second-image{
  left: 115px !important;
}
}