@charset "utf-8";

#lure { width:100%; padding:0; margin:auto; margin-top:3%; margin-bottom:5%; background-color: #64a70c; background-image: url(images/lures/lurebanner-aboutus.png); 
background-repeat:no-repeat; background-position: right 0px top 0px; background-attachment:fixed; background-size: auto 100%;}

#aboutus-row { display:flex; align-items:center; gap: 2rem; width:90%; padding:1.6%; margin:auto; margin-bottom:5%; text-align:center; flex-wrap: wrap;
background: linear-gradient(rgba(100, 167, 12, 0.70), 45%, rgba(100, 167, 12, 1)), url(images/hex-backgroun.jpg); background-repeat: no-repeat; background-attachment:scroll; background-size:cover; border-radius:25px; box-shadow: inset 0 2px 11px #000; backdrop-filter: blur(7px);}
#aboutus-row h2 {color:#fff; font-size:2.5vw; margin:auto; margin-bottom:1.5%; width:100%; border-bottom:2px solid #fff;;}
#aboutus-row  p { color:#fff; font-size:1.5vw; margin:0; width:90%; text-align:justify; }
#aboutus-row img { border-radius:250px; width:23%; height:auto; border:5px ridge #95FD68;}
#aboutus-row li {color:#fff; font-size:1.3vw; font-weight:600; text-align:left; padding:1%; font-style:oblique; width:70%;}
.aboutus-text {flex: 1; min-width: 300px;}

input[type="radio"] {display: none;}
/* Profile images */
.profiles {display:flex; flex-direction:row; width:66%; margin:auto; padding:0; padding-bottom:1.8%; gap: 3vw; position:relative;}
.profiles div {width:100%; padding:0; margin:0 auto;}
.profiles img {display:block; text-align:center; width: 100%; padding:0; margin:auto; border-radius: 11px; cursor: pointer; transition: transform 0.3s, opacity 0.3s; border: 2.5px solid transparent; box-shadow: 0 6px 15px; filter:blur(2.6px);}
.profiles img:hover {transform: scale(1.05); filter:blur(0);}
/* Hide all blurbs */
.profile-details .detail {display: none;}
/* Show selected blurb */
#p1:checked ~ .profiles label[for="p1"] img,#p2:checked ~ .profiles label[for="p2"] img, #p3:checked ~ .profiles label[for="p3"] img {border-color:rgba(100, 167, 10, 1); transition:ease-in 0.024s; box-shadow:rgba(100, 167, 10, 1) 0 0 23px; filter:blur(0);}
#p1:checked ~ .profile-details .p1,#p2:checked ~ .profile-details .p2,#p3:checked ~ .profile-details .p3 
{display: block; text-align:justify; font-size:23px; background-color: rgba( 255, 255, 255, 0.9); padding:0.50%; border-radius: 11px; box-shadow: 0 6.5px 22px; width:90%; margin:auto;
 margin-bottom:2.5%;}
#p1:checked ~ .profile-details .p1 h2:not(p),#p2:checked ~ .profile-details .p2 h2:not(p),#p3:checked ~ .profile-details .p3 h2:not(p) {text-align:center;}

#mobilteamProfile {display:none;}

#contact-choice { display:flex; flex-direction:row; justify-content:space-around; width:50%; margin:auto; padding:0;}

#openFormBtn { display:block; padding:0; margin:auto; width:10%; background: none; border: none; outline: none; border-radius:100px; transition: all 0.3s ease; flex:1;}
#openFormBtn:hover {transition: transform 0.3s ease-in-out; transform: scale(1.07); box-shadow:#222 0 5px 9px;}
#openFormBtn img { display:block; width:100%;}

.phonenumber img {display:block;  width:40%; margin:auto; transition: transform 0.2s ease, background-color 0.2s ease; cursor: pointer; flex:2;}
.phonenumber img:hover {transform:scale(1.1);}
.phonenumber img:active {transform: scale(0.98);}


@media (max-width: 760px) {
	
#lure  {padding: 13% 0 13% 0;}	
#lure h1 {text-align:center; font-size:2.45rem; -webkit-text-stroke: 1px #000; width:97%; margin:auto;}
#lure p {text-align:justify; text-justify: inter-character; font-size:1.35rem; text-shadow: 0 1px 6px rgba(0, 0, 0, 1), 0 0 7px rgba(0, 0, 0, 0.7); width:95%; margin:auto;}
.blur {margin:0; padding:0; width:100%; -webkit-mask-image: linear-gradient(to right, black 100%, transparent 0%);}	


#aboutus-row {background: linear-gradient(rgba(100, 167, 12, 0.8), 55%, rgba(100, 167, 12, 1)), url(images/profiles/PXL_20250820_165435230.jpg); background-repeat: no-repeat; background-position: top; background-size:cover; border-radius:25px; box-shadow: inset 0 2px 11px #000; backdrop-filter: blur(6px); width:95%; padding-top:10%; padding-bottom:10%;}
#aboutus-row h2 {font-size:2rem;}
#aboutus-row img {display:none;}
#aboutus-row p, #aboutus-row li {text-align:justify; text-justify:inter-character; font-size:1.32rem; margin:auto;}
#aboutus-row li {padding:0; margin:0; width:90%; line-height:27px;}

#desktop-team {display:none;}	
#mobilteamProfile {display:flex; align-items:center; justify-content:space-between; flex-direction:column; padding:2%; 
background: linear-gradient(rgba(50, 50, 50, 0.7), rgba(30, 30, 30, 0.9)), url(../images/hewcor-background.jpg); background-repeat:no-repeat; background-attachment:fixed; background-position:center; background-size:cover;}	
#mobilteamProfile img {width:75%; border-radius:15px; box-shadow: 0 0 26px; }
#mobilteamProfile h2 { font-size:10vw; width:100%; text-align:center; padding:0; margin:0; margin-bottom:7%; color:#fff; text-shadow:#000 0 2px 9px;}
#mobilteamProfile p { background-color:rgba(255, 255, 255, 0.91); padding:2.5%; border-radius:15px; text-align:justify; text-justify:inter-character; font-size:1.25rem;}
#mobilteamProfile h3{ font-size:2.2rem; margin:0 auto; margin-bottom:2.5%; width:100%; padding:0;background: linear-gradient(to left, rgba(000, 000, 000, 0)25%, rgba(100, 167, 12, 1)); color:#FFF; text-shadow:#000 0 2px 5px;}	

#openFormBtn { display:block; padding:0; margin:auto; width:72%; background: none; border: none; outline: none; border-radius:100px; transition:none; flex:1; margin-bottom:10%;}
#openFormBtn:hover {transition:none; transform:none; box-shadow:#222 0 5px 9px;}
#openFormBtn img { display:block; width:100%;}

}