@charset "utf-8";
/* CSS Document */

:root { 
  --white: rgb(255,255,255);
  --yellow : rgb(244, 190, 24); /* Axelera AI Yellow */
  --blue: rgb(62, 83, 229); /* Neon Purple */
  --nightblue: rgb(18,29,61); /* Night Blue */
  --warm-grey: rgb(223, 220, 221); 
  --shell-green: rgb(158, 191, 174);
  --slate-petrol: rgb(0, 144, 168);
  --sea-blue: rgb(0, 91, 99);
  --black: rgb(0,0,0);
}

.white { color: var(--white);}
.yellow { color: var(--yellow); }
.blue { color: var(--blue); }
.sidepanel { color: var(--white); font-size: 24px; }
.size15 { font-size: 1.5em; }

/* start anchor offset */
.anchorOffset {
  top:-90px;
  position:relative;
  width:100%; 
}
html { scroll-behavior: smooth; }
[data-anchor] { width: 100%; position:relative; top: -90px; }
@media screen and (max-width: 766px) {
[data-anchor] { width: 100%; position:relative; top: -110px; }
}

/* end anchor offset */


/* content links */
.axe23-content-box-15pl a,
.axe23-content-box-15pr a,  
.axe24-caption span p a,
.axe23-usp div span a,
.axe23-usp div span p a,
.axe23-content-box-15pr p > a,
.axe23-content-box-15pr div p strong  a,
.axe23-content-box-15pr ul li > a,
.axe23-content-box-15pl p > a,
.axe23-content-box-15pl div p strong a,
.axe23-content-box-15pl ul li > a { 
    color: var(--yellow);
    text-decoration: none;
    transition: linear 0.3s;
}
.axe23-content-box-15pr a:hover,
.axe23-content-box-15pl a:hover,
.axe24-caption span p a:hover,
.axe23-usp div span a:hover,
.axe23-usp div span p a:hover,
.axe23-content-box-15pr p > a:hover,
.axe23-content-box-15pr ul li > a:hover,
.axe23-content-box-15pl p > a:hover,
.axe23-content-box-15pl ul li > a:hover{
    color: var(--slate-petrol);
}
/* end content links */

/* quote */


span.axe23-quote::before {
		font-family: 'Times New Roman',Times,serif;
        content: "\201C";
		font-weight: 900;
		color: var(--yellow);
		position: absolute;
        top: 30px;
        left: 45%;
        font-size: 4em;
		display:inline-block;
}

/* button transitions */
.axe23-c2a {
   gap: 20px;
}
.axe23-career-button,
.ax23-career-learn-more,
.axe23-related-article-button,
.axe23-c2a-button {
    color: rgb(0,0,0)!important;
    transition: linear 0.3s;
    white-space: nowrap;
 }
.axe23-career-button:hover,
.ax23-career-learn-more:hover,
.axe23-related-article-button:hover,
.axe23-c2a-button:hover {
    color: var(--white)!important;
    background-color: var(--blue);
}


.axe24-c2a-button-animated {
   color: rgb(18, 29, 61);
}
.axe23-c2a-button-animated {
	color: rgb(244, 190, 24);
}

.axe24-c2a-button-animated, 
.axe23-c2a-button-animated {
	position: relative;
	display: inline-block;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-color: transparent;
    background-image: none;
    white-space: nowrap;
    transition: all .2s ease-in-out;
    border: 0 solid transparent;
    padding-top: 10px;
	padding-right: 18px;
	padding-bottom: 10px;
	padding-left: 20px;
    border-radius: 25px;
	margin:0px;
	font-weight: 600;
}
.axe24-c2a-button-animated span p, 
.axe23-c2a-button-animated span p { margin: 0; padding: 0; }

.axe24-c2a-button-animated::before,
.axe23-c2a-button-animated::before {
	content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 25px;
    padding: 2px;
    background: linear-gradient(90deg, #F4BE18 7%, #5AA67A 19%, #3E53E5 38.5%, #005c64 60%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    transition: all .5s ease-in-out;
    z-index: 0;
    background-size: 250% auto;
    background-position: 99%;
}
.axe24-c2a-button-animated:hover::before,
.axe23-c2a-button-animated:hover::before {
	background-position: 0;
}

.axe23-c2a-button {
    padding-top: 11px;
	padding-right: 18px;
	padding-bottom: 13px;
	padding-left: 18px;
    border-radius: 25px;
	background: linear-gradient(90deg, #F4BE18 50%, #5AA67A 65%, #3E53E5 80%, #3E53E5 90%);
    background-size: 250% auto;
    background-position: 0;
	min-height: 50px;
}
.axe23-c2a-button:hover {
	background-position: 85%;
}

/* end button transitions */

/* start banner markup */
.axe23-banner-link .axe23-banner-button-container { 
    transition: linear 0.3s;
    white-space: nowrap;
}
.axe23-banner-link:hover .axe23-banner-button-container { 
	background-color: var(--blue);
}
.axe23-banner-link:hover .axe23-banner-button {
    color: var(--white);
}
/* end banner markup */


/* start usp icons */
	.axe23-usp div { display: flex; }
    .axe23-usp div ul { padding-left: 30px; display: flex; list-style-type: none; }
    .axe23-usp div ul li { min-width: 30%; max-width: 33%; padding-left: 10px; padding-right: 50px; box-sizing: content-box;position: relative; flex-grow:1;}

@media screen and (max-width: 766px) {
	.axe23-usp { padding-top: 20px; }
	.axe23-usp div ul { padding-left: 30px; flex-direction: column; }
	.axe23-usp div ul li {	min-width: 100%; max-width: 33%; padding-left: 20px; padding-right: 50px; box-sizing: content-box; position: relative; flex-grow: 1;padding-bottom: 20px;}
}

	.axe23-usp div .star::before {
		font-family: "Font Awesome 5 Free";
		content: "\f005";
		font-weight: 900;
		color: var(--yellow);
		position: absolute;
        top: 2px;
        left: -26px;
        font-size: 1.5em;
		display:inline-block;
	}
	.axe23-usp div .chart::before {
		font-family: "Font Awesome 5 Free";
		content: "\f201";
		font-weight: 900;
		color: var(--yellow);
		position: absolute;
        top: 2px;
        left: -26px;        
        font-size: 1.5em;
		display:inline-block;
	}
	.axe23-usp div .currency::before {
		font-family: "Font Awesome 5 Free";
		content: "\f153";
		font-weight: 900;
		color: var(--yellow);
		position: absolute;
        top: 2px;
        left: -26px;
        font-size: 1.5em;
		display:inline-block;
	}
	.axe23-usp div .bolt::before {
		font-family: "Font Awesome 5 Free";
		content: "\f0e7";
		font-weight: 900;
		color: var(--yellow);
		position: absolute;
        top: 2px;
        left: -26px;
        font-size: 1.5em;
		display:inline-block;
	}
    .axe23-usp div .location::before {
       font-family: "Font Awesome 5 Free";
       content: "\f124";
      font-weight: 900;
      color: var(--yellow);
      position: absolute;
      top: 2px;
      left: -26px;
      font-size: 1.5em;
      display:inline-block;
   }
   .axe23-usp div .calendar::before {
      font-family: "Font Awesome 5 Free";
      content: "\f073";
      font-weight: 900;
      color: var(--yellow);
      position: absolute;
      top: 2px;
      left: -26px;
      font-size: 1.5em;
      display:inline-block;
   }
  .axe23-usp div .hotel::before {
     font-family: "Font Awesome 5 Free";
     content: "\f594";
     font-weight: 900;
     color: var(--yellow);
     position: absolute;
     top: 2px;
     left: -26px;
     font-size: 1.5em;
     display:inline-block;
   } 
   
   .axe23-usp div .flag::before {
       font-family: "Font Awesome 5 Free";
       content: "\f024";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }
   
   .axe23-usp div .eye::before {
       font-family: "Font Awesome 5 Free";
       content: "\f06e";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }

   .axe23-usp div .camera::before {
       font-family: "Font Awesome 5 Free";
       content: "\f030";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }

   .axe23-usp div .microchip::before {
       font-family: "Font Awesome 5 Free";
       content: "\f2db";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }  
  
  .axe23-usp div .memory::before {
       font-family: "Font Awesome 5 Free";
       content: "\f538";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }

  .axe23-usp div .storage::before {
       font-family: "Font Awesome 5 Free";
       content: "\f0a0";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }
 
  .axe23-usp div .ruler::before {
       font-family: "Font Awesome 5 Free";
       content: "\f545";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   } 
   
  .axe23-usp div .ubuntu::before {
       font-family: "Font Awesome 5 Free";
       content: "\f7df";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }
   
   .axe23-usp div .book::before {
       font-family: "Font Awesome 5 Free";
       content: "\f518";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }
   
    .axe23-usp div .factory::before {
       font-family: "Font Awesome 5 Free";
       content: "\f275";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }  
   
    .axe23-usp div .bullseye::before {
       font-family: "Font Awesome 5 Free";
       content: "\f140";
       font-weight: 900;
       color: var(--yellow);
       position: absolute;
       top: 2px;
       left: -26px;
       font-size: 1.5em;
       display:inline-block;
   }          
/* end usp icons */

/* start carousel */
/* .axe23-carousel-parent { gap: 22px; } */
.axe23-carousel-btn-left,
.axe23-carousel-btn-right {
  cursor: pointer;
}

.axe23-carousel-link > span { display:none; }

.axe23-carousel-text::after {
  content: '';
  background: rgb(2,0,36);
  background: -moz-linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(19,29,61,1) 0%, rgba(19,29,61,0) 100%);
  background: -webkit-linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(19,29,61,1) 0%, rgba(19,29,61,0) 100%);
  background: linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(19,29,61,1) 0%, rgba(19,29,61,0) 100%);
  width:100%;
  height: 80px;
  position: absolute;
  bottom: 0;
  left: 0;
  }

 .axe23-related-article-content::after {
  content: '';
  background: rgb(2,0,36);
  background: -moz-linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(19,29,61,1) 0%, rgba(19,29,61,0) 100%);
  background: -webkit-linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(19,29,61,1) 0%, rgba(19,29,61,0) 100%);
  background: linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(19,29,61,1) 0%, rgba(19,29,61,0) 100%);
  width:100%;
  height: 80px;
  position: absolute;
  bottom: 90px;
  left: 0;
 } 
/* end carousel */


/* start youtube video frame */
.iframe-container{  position: relative;  width: 100%;  padding-bottom: 56.25%;   height: 0; }
.iframe-container iframe{ position: absolute; top:0;  left: 0; width: 100%;  height: 100%;}

.iframe-container.paused::after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0;
    bottom: 0px;
    right: 0;
    cursor: pointer;
    background-color: rgb(3, 61, 117);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    background-image: url(https://cdn.opptylab.com/hf/assets/axelera-vimeo-pause-image-pause-black.svg), url(https://cdn.opptylab.com/hf/assets/axelera-vimeo-pause-image-1.svg);
}


@media screen and (min-width: 766px) {
/*.iframe-container { position: relative; width: 100%; height: 0; padding-bottom: 61%; }*/
.iframe-container > iframe { position: absolute; width: 100%; height: 100%; left: 0; top: 0; }
}
/* end youtube video frame */

/* start vimeo frame */
.vimeo-container {
    position: relative;
    padding: 56.25% 0 0 0;
}

.vimeo-container.paused::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    cursor: pointer;
    opacity: 0.9;
    background-image: url(https://cdn.opptylab.com/hf/assets/axelera-vimeo-pause-image-pause-black.svg), url(https://cdn.opptylab.com/hf/assets/axelera-vimeo-pause-image-1.svg);
    background-repeat: no-repeat, repeat;
    background-position: center, center;
    background-size: 100% auto, 100% auto;
    border-radius: 10px;		
	overflow: hidden;
	transition: all .2s linear;	
}
.vimeo-container.paused:hover::after {
   background-image: url(https://cdn.opptylab.com/hf/assets/axelera-vimeo-pause-image-pause-yellow.svg), url(https://cdn.opptylab.com/hf/assets/axelera-vimeo-pause-image-1.svg);
}

.vimeo-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 10px;
    overflow: hidden;
}
/* end vimeo frame */

/* start our team */
.axe23-team-category > span::after {
  content: '';
  width: 120px;
  height: 4px;
  background-color: #F4BE18;
  position: absolute;
  margin-left: -60px;
  left: 50%;
  top:40px;
  }
.axe23-profile-panel-image img { width: 100%; }
/* end our team */

/* header gradients */
.axe24-bg-industry-img-right::after, 
.axe24-bg-retail-img-right::after { 
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    opacity: 1;
    background: rgb(0,0,0);
background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
}
.axe24-bg-retail-img-left::after { 
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    opacity: 1;
background: rgb(0,0,0);
background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
/*
    background: rgb(0,0,0);
    background: -moz-linear-gradient(90deg, rgba(0,0,0,0) 50%, rgba(0,0,0,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(0,0,0,0) 50%, rgba(0,0,0,1) 100%);
    background: linear-gradient(90deg, rgba(0,0,0,0) 50%, rgba(0,0,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
*/    
}


@media screen and (max-width: 1024px) {
.axe24-bg-industry-img-right::after,
.axe24-bg-retail-img-right::after { height: 0; }
}

/* end header gradients */

/* Blog panel tag icon */
.axe24-blog-panel-tag:before {
    font-family: "Font Awesome 5 Free";
    content: "\f02b";
    font-weight: 900;
    color: rgb(223, 220, 222);
    position: relative;
    top: 2px;
    left: 0;
    font-size: 1em;
    display: inline-block;
    margin-right: 10px;
    opacity: 0.4;
}
/* End blog panel tag icon */

/* authors */
.axe23-authors {display: flex; gap: 10px; }
.axe23-author { display: flex; align-items: center; max-width: 35%; padding-top: 10px; }
.axe23-author-image { width: 75px; margin-right: 20px; }
.axe23-author p { color: rgb(255,255,255); }
.axe23-author-linkedin { width: 20px; margin: 0 0 4px 4px; }

@media screen and (max-width: 766px) {
.axe23-authors { flex-direction: column; }
.axe23-author { max-width: 100%; }
}
/* end authors */


/* grid assist */
.axe23-row,
.axe23-row-reverse {
	gap:  20px 5%;
}
@media screen and (max-width: 1800px) {  
	.axe23-header,
    .axe24-full-width-for-banner,
    .axe23-content-1700-wp { padding: 0 3%; }
    
}

/* end grid assist */