@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-contactus.png); 
background-repeat:no-repeat; background-position: right 0px top 0px; background-attachment:fixed; background-size: auto 100%;}

#contents {background-color:rgba(72, 72, 72, 0.5); backdrop-filter: blur(7px); overflow:hidden; padding-top:5%; padding-bottom:5%; width:90%; margin:auto; margin-bottom:7%; border-radius:50px;}

#contacts #location, #form, #phone { display:flex; flex-direction:column; margin:auto; width:100%; padding:1% 0 2.2% 0;}
#phone a {text-decoration:none; color:#FFF;}
#contacts .icons {width:40%; padding:2%; margin:5%; margin-top:0; margin-bottom:0; }
#contacts { width:22%; float:left; margin:auto; margin-right:0; padding:0; text-align:center; color:#fff; top:0; font-size:1.5vw; white-space:nowrap;}
#contacts a, #telenum {font-size:1.8rem; text-shadow: 0 2px 2px rgba(0, 0, 0, 1), 0 0px 5px rgba(0, 0, 0, 0.8); margin:0; list-style:none; text-decoration:none;}
#contacts h2 { width:60%; padding:3%; margin:auto; text-wrap:none; text-align:center; font-size:1.8rem; text-shadow: 0 2px 2px rgba(0, 0, 0, 1), 0 0px 5px rgba(0, 0, 0, 0.8); }

#maploc {display:block; padding:0; margin:0 auto; width:100%;}
#maploc iframe {width:52vw; height:30vw;  box-shadow:#333 8px 10px 20px; }

.hop { margin:1.7% auto; width:50%; color:#FFF; font-size:4vh; text-align:center; text-shadow: 0 0px 7px rgba(0, 0, 0, 1), 0 0px 11px rgba(0, 0, 0, 0.8);}

#SocialContactPage {display:inline-block; padding:0; padding-bottom:1%; margin:0; text-align:center; width:100%; height:auto; background-color: rgba( 100, 121, 100, 0.4);}
#SocialContactPage a { width:6%; display: inline-block; margin:0; padding:0;}
#SocialContactPage img { width:55%; height:auto; cursor: pointer; transition: transform 0.3s, opacity 0.3s;}
#SocialContactPage img:hover { transform: scale(1.33); position:relative;}
#SocialContactPage h2 {text-wrap:none; text-align:center; color: #fff; margin:1%; font-size:1.6vw;}

#phone img, #location img{ transition: transform 0.2s ease, background-color 0.2s ease; cursor: pointer;}
#phone img:hover, #location img:hover {transform:scale(1.2);}
#phone img:active, #location img:active {transform: scale(0.95);}
#openFormBtn { display:flex; align-items: center;justify-content: center; border-radius: 50%; cursor: pointer; border:none; background:none; width:40%; height:28%; margin:0 auto; 
padding:0; box-shadow:none; margin-bottom:6%; margin-top:2.5%; transition: all 0.3s ease;}
#openFormBtn img {width:100%; height:100%; object-fit: contain; border-radius:50px; pointer-events: none;}
#openFormBtn:hover {transform:scale(1.2); box-shadow:none;}

@media (max-width: 760px) {
	
#lure { background-position: right 0px top 0px;background-position: right 0px top 0px; background-attachment:fixed; background-size: auto 45%; 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%);}	

	
#contents {border-radius:10px;}
#titlebar { width:100%; padding-top:6%; margin:auto; white-space:pre-wrap; font-size:8vw;}
#maploc {display:flex;}	
#maploc iframe { width:85vw; height:73vw; box-shadow:#000 8px 10px 25px; margin:auto; margin-top:8%; }
.hop {color:#FFF; font-size:3.3vh; margin:6% auto; text-align:center; width:100%;}
#telenum {display:none;}
#contacts {display: flex; flex-direction: row; justify-content:space-around; width: 100%;}
#contacts > #phone,  #contacts > #form,  #contacts > #location {width: 100%;}	
#contacts > #phone img,  #contacts > #form img,  #contacts > #location img {width:65%;}

#contacts h2 {text-align:center; width:100%; margin:0; padding:0; font-size:1.4rem;}
#openFormBtn {width:100%;  margin:0; padding:0; margin-bottom:14%}	
	
#SocialContactPage { display:inline-block; gap: 6%; margin-top: 10%;}
#SocialContactPage h2 {font-size:2.5vh; padding:0; margin:auto; margin-top: 4%; text-align:center; line-height:none;}
#SocialContactPage a { display:inline-block; width: 20%; margin:auto; padding:5%; }
#SocialContactPage img {width: 90%; padding:0; margin:0;}

.sitemap #compinfo {display:none; padding:0; margin:0;}
.sitemap #links {margin-bottom:5%;}
#legal {display:block;}
#legal p {display:none;}
#legal img {display:block; width:90%; margin:auto; margin-bottom:10%;}
#facebook-logo, #x-logo, #insta-logo {display:none;}
}