
section.architects_sec-hero{display:flex;align-items: center;justify-content: center;position: relative;margin-top: 90px;padding: 60px 60px 60px 60px;}
section.architects_sec-hero .container-fluid{position:relative;z-index:9;}
section.architects_sec-hero .h_heading{text-align:left;display: inline-block;}
section.architects_sec-hero .h_heading h1{}
section.architects_sec-hero .h_para{display: inline-block;max-width:300px;text-align:left;}
section.architects_sec-hero .h_para p{}

section.architects_sec-hero ul.your_legacy {margin: 0px;padding: 0px;list-style-type: none;position: relative;}
section.architects_sec-hero ul.your_legacy li{gap: 70px;padding: 20px 10px;position: relative;display: flex;flex-direction: row;}
section.architects_sec-hero ul.your_legacy li .yl_numbers{line-height: 1;font-size: var(--rfs-36);font-weight: 700;}
section.architects_sec-hero ul.your_legacy li .yl_text{}
section.architects_sec-hero ul.your_legacy li .yl_text h4{}
section.architects_sec-hero ul.your_legacy li .yl_text p{font-size: 16px;margin-bottom: 0px;}

section.architects_sec-hero ul.your_legacy li .h_line{width: 100%;height: 2px;background: linear-gradient(270deg, var(--color-05) 95%, transparent);position: absolute;bottom: 0px;left: 0px;}
section.architects_sec-hero ul.your_legacy .v_line{width:2px;height:100%;background: var(--color-05);position: absolute;bottom: 0px;left: 90px;}

section.architects_sec-hero .gradient-your-legacy{width: 90vh;height: 90vh;background:url("gradient-your-legacy.png") no-repeat center center;background-size: cover;position:absolute;top:10%;left:10%;transform: translate(-10%, -10%) scale(1) rotate(0deg);filter: blur(0px);animation: animateGradient 10s ease-in-out infinite alternate;}

@keyframes animateGradient {
  0% {
    transform: translate(-10%, -10%) scale(1) rotate(0deg);
    filter: blur(0px);
  }
  50% {
    transform: translate(-10%, -10%) scale(1.4) rotate(180deg);
    filter: blur(4px);
  }
  100% {
    transform: translate(-10%, -10%) scale(1) rotate(360deg);
    filter: blur(0px);
  }
}



section.architects_sec-01{}
section.architects_sec-01 h2{}
section.architects_sec-01 ul.team-list{margin: 0px;padding: 0px;list-style-type: none;gap: 25px;display: flex;flex-direction: row;flex-wrap: wrap;}
section.architects_sec-01 ul.team-list > li{width: 48%;}
section.architects_sec-01 ul.team-list li .t_members{gap: 30px;padding: 30px 20px;background: var(--color-01);border-radius: 10px;border: 1px solid #a4a4a4;position: relative;display:flex;align-items: center;overflow: hidden;transition:all 500ms ease-in-out;}
section.architects_sec-01 ul.team-list li .t_members.btn-teams{}
section.architects_sec-01 ul.team-list li .t_members .tm-photo{width: 25%;overflow: hidden;border-radius: 7px;box-shadow: 0px 0px 0px 0px #ebf0f8;position: relative;z-index: 9;transition: all 500ms ease-in-out;}
section.architects_sec-01 ul.team-list li .t_members .tm-photo img{max-width: 100%;}
section.architects_sec-01 ul.team-list li .t_members .tm-detail{position: relative;z-index: 9;}
section.architects_sec-01 ul.team-list li .t_members .tm-detail h4{font-size: 21px;letter-spacing: 0px;}
section.architects_sec-01 ul.team-list li .t_members .tm-detail p{font-size: 14px;margin-bottom: 0px;}

section.architects_sec-01 ul{margin: 20px 0px 0px 0px;padding: 0px;list-style-type: none;gap: 15px;display: flex;justify-content: flex-start;}
section.architects_sec-01 ul li{}
section.architects_sec-01 ul li .btn-popup,
section.architects_sec-01 ul li .btn-linkedin{display: flex;position:relative;overflow:hidden;border-radius: 100px;}

section.architects_sec-01 ul li .btn-popup:before,
section.architects_sec-01 ul li .btn-linkedin:before{content:"";width: 100%;height: 100%;background: var(--color-02);border-radius:100px;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) scale(0.01);z-index: 5;transition:all 500ms ease-in-out;}
section.architects_sec-01 ul li span{width:40px;height:40px;display:inline-block;position:relative;border-radius:100px;overflow:hidden;z-index: 10;}

section.architects_sec-01 ul li .btn-popup{}
section.architects_sec-01 ul li .btn-popup:before{}
section.architects_sec-01 ul li .btn-popup:after{content:"";width:100%;height:100%;background: var(--color-11);position: absolute;top: 50%;left: 50%;transform:translate(-50%,-50%) scale(2);z-index: 1;}
section.architects_sec-01 ul li .btn-popup span{border: 1px solid var(--color-11);}
section.architects_sec-01 ul li .btn-popup span:before,
section.architects_sec-01 ul li .btn-popup span:after{content:"";width:14px;height: 2px;background: var(--color-01);position: absolute;top: 50%;left: 50%;}

section.architects_sec-01 ul li .btn-popup span:before{transform: translate(-50%,-50%);}
section.architects_sec-01 ul li .btn-popup span:after{transform: translate(-50%,-50%) rotate(90deg);}

section.architects_sec-01 ul li .btn-linkedin{}
section.architects_sec-01 ul li .btn-linkedin span{border:1px solid var(--color-11);}
section.architects_sec-01 ul li .btn-linkedin span:before{content:"";width:100%;height:100%;background:url("../templates/img/icon-linkedin-pink.webp") no-repeat center center;background-size: 22px;position:absolute;top:0;left:0;}

section.architects_sec-01 ul li .btn-linkedin:before{}

section.architects_sec-01 ul li .btn-popup:hover span{border-color:var(--color-02);}
section.architects_sec-01 ul li .btn-popup:hover:before{transform: translate(-50%,-50%) scale(2);transition:all 500ms ease-in-out;}
section.architects_sec-01 ul li .btn-linkedin:hover span{border-color:var(--color-11);}
section.architects_sec-01 ul li .btn-linkedin:hover span{border-color:var(--color-02);}
section.architects_sec-01 ul li .btn-linkedin:hover:before{transform: translate(-50%,-50%) scale(2);transition:all 500ms ease-in-out;}

section.architects_sec-01 .team-members:hover{transition:all 500ms ease-in-out;}
section.architects_sec-01 .team-members:hover .tm-photo img{transform:scale(1.07);transition:all 500ms ease-in-out;}


section.architects_sec-01 ul.team-list li:hover{transition:all 500ms ease-in-out;}
section.architects_sec-01 ul.team-list li:hover .t_members{box-shadow: 0px 0px 20px rgba(0,0,0,0.2);transition:all 500ms ease-in-out;}
 

section.architects_sec-01 ul.team-list li:hover .t_members.btn-teams:after{left: 44%;transform: scale(30);transition:all 500ms ease-in-out;}
section.architects_sec-01 ul.team-list li:hover .t_members.btn-teams .tm-photo{transition: all 500ms ease-in-out;}
section.architects_sec-01 ul.team-list li:hover .t_members.btn-teams .tm-detail h4,
section.architects_sec-01 ul.team-list li:hover .t_members.btn-teams .tm-detail p{transition:all 500ms ease-in-out;}





.team-popup .tp-close{cursor: pointer;color: var(--color-01);text-align: center;padding: 15px;margin: 15px 0px;border-radius: 4px;overflow: hidden;position: relative;transition:all 500ms ease-in-out;}
.team-popup .tp-close span{position:relative;z-index:9;transition:all 500ms ease-in-out;}
.team-popup .tp-close:before{content:"";background: linear-gradient(259deg, #EBEBEB 0.97%, #ED1750 43.28%, #23539F 100%);width: 100%;height: 100%;position: absolute;top: 0;left: 0;transition:all 500ms ease-in-out;}

.team-popup .tp-close:hover{transition:all 500ms ease-in-out;}
.team-popup .tp-close:hover:before{width: 1000%;transition:all 500ms ease-in-out;}


.team-popup{width: 500px;padding: 30px;position: fixed;bottom: 5vh;right: -500px;z-index: 9999;transition: all 300ms ease-in-out;}
.team-popup .tp-details{padding: 60px 40px 40px 40px;background: var(--color-01);position: relative;min-height: 62vh;border-radius: 4px;overflow: hidden;display: flex;flex-direction: column;justify-content: space-between;}
.team-popup .tp-details:before{content:"";position: absolute;top: 0;left: 0;width: 100%;height: 110px;background: var(--color-02);/* background: linear-gradient(259deg, #EBEBEB 0.97%, #ED1750 43.28%, #23539F 100%); */}
.team-popup .tp-details .tpd-in{position: relative;z-index: 9;}
.team-popup .tp-details .tpd-in .tpd-photo{max-width: 100px;border-radius: 100px;}
.team-popup .tp-details .tpd-in .tpd-photo img{border-radius: 100px;}
.team-popup .tp-details .tpd-in .tpd-name{padding: 15px 0px;border-bottom: 1px solid #cccccc;}
.team-popup .tp-details .tpd-in .tpd-name h4{font-size: 21px;letter-spacing: 0px;}
.team-popup .tp-details .tpd-in .tpd-name p{font-size: 16px;margin-bottom: 0px;}
.team-popup .tp-details .tpd-in .tpd-social{padding: 15px 0px;}
.team-popup .tp-details .tpd-in .tpd-social a{}
.team-popup .tp-details .tpd-in .tpd-social a img{width: 30px;}
.team-popup .tp-details .tpd-para{position: relative;z-index: 9;max-height: 27vh;overflow-x: auto;padding-right: 20px;}
.team-popup .tp-details .tpd-para p{color: var(--color-12);font-size: 16px;font-weight: 500;}
.team-popup .tp-details .tpd-para p.bio{color: var(--color-05);margin-bottom: 10px;}

/* width */
.tpd-para::-webkit-scrollbar {width: 8px;}

/* Track */
.tpd-para::-webkit-scrollbar-track {box-shadow: inset 0 0 5px grey; border-radius: 10px;}


/* Handle */
.tpd-para::-webkit-scrollbar-thumb {background:var(--color-11); border-radius: 10px;}

/* Handle on hover */
.tpd-para::-webkit-scrollbar-thumb:hover {background:var(--color-11);}

.team-popup.current{right: 60px;transition: all 300ms ease-in-out;}

#bg-team-popup {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: #000000;opacity: 0;z-index: -1;transition:all 500ms ease-in-out;}
#bg-team-popup.current{opacity: .8;z-index:9999;transition:all 500ms ease-in-out;}



/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 120px) 
and (max-device-width : 900px) {
	
	section.architects_sec-hero{padding:60px 10px 60px 10px}
	section.architects_sec-hero .gradient-your-legacy{width:100vw;height:100vw;top:-30%;}
	section.architects_sec-hero .h_heading{display:block;}
	section.architects_sec-hero ul.your_legacy{margin-top:40px;}
	section.architects_sec-hero ul.your_legacy li{gap:40px;}
	section.architects_sec-hero ul.your_legacy .v_line{left: 50px;}
	

	.team-group.tg-01{top: 14vh;left: 12%;width: 19vh;}
	.team-group.tg-02{top: 38vh;right: 0%;width: 16vh;}
	.team-group.tg-03{top: 49vh;left: 0%;width: 20vh;}
	section.architects_sec-01{padding-bottom: 20px;}
	section.architects_sec-01 h3{margin-bottom:30px;}

	section.architects_sec-01 ul.team-list > li{width: 100%;}
	section.architects_sec-01 ul.team-list li .t_members .tm-detail h4{margin-bottom:5px;}
	section.architects_sec-01 ul.team-list li .t_members.btn-teams{padding: 15px 15px;}
	section.architects_sec-01 ul.team-list li .t_members.btn-teams:after{left: 7%;}
	section.architects_sec-01 ul.team-list li .t_members .tm-photo{width:40%;}
	section.architects_sec-01 ul.team-list li .t_members .tm-detail{width:60%;}
	section.architects_sec-01 ul.team-list li .t_members .tm-detail p{font-size:15px;}
	
	section.architects_sec-01 ul{margin-top:10px}
	section.architects_sec-01 ul li span{width:30px;height:30px;}
	section.architects_sec-01 ul li .btn-linkedin span:before{background-size:18px;}


	.team-popup{width: 100%;right: -100%;}
	.team-popup.current{right: 0%;}

	.team-popup .tp-details{padding: 60px 30px 20px 30px;}
	.team-popup .tp-details .tpd-in .tpd-name h4{font-size:18px;}
	.team-popup .tp-details .tpd-in .tpd-name p{font-size:14px;}
	.team-popup .tp-details .tpd-para p{font-size:15px;}
	
} 