
/**** GENERAL ****/
a:hover, a:focus{
	color:#e8432e
}
::-webkit-input-placeholder { /* WebKit browsers */
    color:    #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #999;
    opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #999;
    opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #999;
}
/**** PRELOADING ****/
.mask-color, .social-share ul.social li:hover a, #showRightPush:hover, .slicknav_btn:hover, .slicknav_nav a:hover, .slicknav_nav .slicknav_item:hover {
	background-color:#e8432e;
}

.prev:hover, .next:hover, .close-port:hover i, .read-more:hover, .read-more i, .view-all-blog:hover, .view-all-blog:hover span i, a.et-like-post.active span i, .btn.get-in-touch:hover, .et-post-data-left.single-blog a.home-icon:hover i, .form-submit input[type="submit"]:hover, .social-footer li a:hover i, .contact-form-wrapper input[type="submit"]:hover, #test_content .item .name-client, h1.title-blog a:hover, .btn.btn-oe:hover{
	color:#e8432e;
}
.close-port:hover, .view-all-blog:hover span, .btn.get-in-touch:hover, .image-blog-wrapper, .et-post-data-left.single-blog a.home-icon:hover, .form-submit input[type="submit"]:hover, .contact-form-wrapper input[type="submit"]:hover, .btn.btn-oe:hover, .popup-video:hover .icon-play-video{
	border-color:#e8432e;
}
.line-wrapper .line-circle, .pie-content h2, .percent-chart, .et-post-month, .et-post-date, .title-blog, .counter .timer, .btn.get-in-touch, .title-single, .post-tags a, .oe-comments-title, .copyright, .contact-form-wrapper input[type="submit"], .text-slider, a#scroll_to, .quote-charater, #test_content .item .name-client, .slicknav_menu  .slicknav_menutxt, .slicknav_nav a, .form-submit input[type="submit"], .btn.btn-oe, .blog-filer ul li a{
	font-weight:700;
}
.color-white *{
	color:#ffffff !important;
}
.color-white .popup-video:hover, .color-white .popup-video:hover .icon-play-video i{
	color:#e8432e !important;
}

.publication_list {
	max-width: 800px;
}
.publication_year {
  padding-top: 15px;
  padding-bottom: 10px;
  text-align: center;
  width: 100%;
  font-weight: bold;
}
.fluid-image {
  max-width: 100%;
  height: auto;
}
.hl_pub_links { margin: 0 0.2em 0 0; padding: 0px 0.2em; background-color:#E5E4E2; }
.pub_conf { margin: 0 0.2em 0 0; padding: 0px 0.2em; color:#FFFFFF; background-color:#EE7274; }
.pub_journal { margin: 0 0.2em 0 0;  padding: 0px 0.2em; color:#FFFFFF; background-color:#32A5A4; }

.people_container {
  position: relative;
  max-width: 1000px;
  padding-bottom: 20px;
}

.people_pi_left {
  float:left;
  width: 200px
}
.people_pi_right {
  float:left;
  width: calc(100% - 250px);
  max-width:700px;
  min-width:300px;
  padding-left: 20px
}
.video-wrap {
  width: 100%;
  max-width: 480px;
  margin:0 auto;
}
.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}
.people_row {
  clear:both;
  padding-top:30px;
}
.research_wrapper {
    clear:both;
	max-width: 1000px;
	margin: auto;

}
.research_wrapper_left {
	float:left;
    clear:both;
	max-width: 1000px;
	margin: auto;
	padding-left:10px;
}
.research_title {
  clear:both;
  padding-top:20px;
  padding-bottom:30px;
}
.research_left_b {
  float:left;
  width: calc(100% - 320px);
  max-width: 600px;
  min-width:300px;

}
.research_left_a {
  float:left;
  width: 300px;
}
.research_wrapper_right {
	float:left;
	background-color:#fafafa;
    clear:both;
	max-width: 1000px;
	margin: auto;
	padding-left:10px;
}
.research_right_b {
  float:left;
  width: 300px;
}
.research_right_a {
  float:left;
  width: calc(100% - 320px);
  max-width: 600px;
  min-width:300px;
}

/* front page banner */

#custom-canvas-wrapper {
    width: 100%;
    padding: 40px 0;
    background: white;
    display: flex;
    justify-content: center;
    align-items: center;
}

.canvas-container {
  position: relative;
  width: min(100vw, 1280px); /* 100% of the viewport width but no more than 1920px */
  min-width: 400px; /* Minimum width of 600px */
  aspect-ratio: 16 / 9; /* Maintain a 16:9 aspect ratio */
  background: white;
  border-radius: 8px;
  overflow: hidden;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Arial", sans-serif;
}

.canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: white;
}

.character {
  position: absolute;
  transform-origin: center center;
  z-index: 10;
}

.character img {
  width: 100%;
  height: auto;
}

.shadow {
  position: absolute;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 50%;
  transform-origin: center center;
  z-index: 9;
}

.background-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 50%;
  height: auto;
  transform: translate(-60%, -50%);
}

.reveal-overlay {
  position: absolute;
  left: 0;
  top: 30%;
  width: 100%;
  height: 50%;
  background: white;
  transform: translateY(-50%);
  z-index: 1;
}

/* Text that drops */
.drop-text {
  position: absolute;
  top: -50px; /* Start off-screen */
  left: 50%;
  transform: translateX(-50%);
  font-size: clamp(16px, 2vw + 0.5rem, 32px); /* Slower scaling with clamp */
  color: #00205B;
  opacity: 0; /* Initially invisible */
  z-index: 15;
  transition: top 1s ease, opacity 1s ease;
}

/* "Join us" text that rises */
.rise-text {
  position: absolute;
  bottom: -50px; /* Start off-screen */
  left: 50%;
  transform: translateX(-50%);
  color: #00205B; /* Same blue color as the button */
  font-size: clamp(14px, 1.5vw + 0.2rem, 28px); /* Slower scaling with clamp */
  opacity: 0; /* Initially invisible */
  z-index: 15;
  transition: bottom 1s ease, opacity 1s ease;
}

/* Pill-shaped button that rises */
.rise-text-button {
  position: absolute;
  bottom: -50px; /* Start off-screen */
  left: 50%;
  transform: translateX(-50%);
  background-color: #00205B; /* Pantone 655 */
  color: white;
  font-size: clamp(14px, 1.5vw + 0.2rem, 28px); /* Slower scaling with clamp */
  padding: 0.5em 1em; /* Padding relative to the text size */
  border: none;
  border-radius: 2em; /* Border radius relative to the text size */
  opacity: 0; /* Initially invisible */
  z-index: 15;
  transition: bottom 1s ease, opacity 1s ease;
  cursor: default; /* No pointer cursor, since its non-clickable */
}
/* Add hover effect */
.rise-text-button:hover {
    background-color: #003080; /* Slightly lighter blue for hover state */
}

/* Optional: Add active state */
.rise-text-button:active {
    background-color: #001840; /* Slightly darker blue for click state */
}
button {
  margin-top: 20px;
  padding: 10px 20px;
  background: #007bff;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

button:hover {
  background: #0056b3;
}


/* teampage */
.team-title {
    text-align: center;
}

.team {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.profile-pic {
    max-width: 250px;
    max-height: 250px;
    width: auto;
    height: auto;
    object-fit: contain;
}
.member-pi {
    text-align: center;
    width: 100%;
    margin-bottom: 20px;
}
.member {
    width: calc(33.333% - 20px);
    margin: 10px;
    text-align: center;
    box-sizing: border-box;
}

.footer_link {
  color: #FFF;
}
.footer_link:hover {
  color: inherit;
}


#test{
margin: 0 auto;
}
