*{box-sizing: border-box;}
body{font-family: Poppins, sans-serif; margin:0; padding:12px 0; min-height:100vh; background-color:rgba(1, 115, 55, 0.04);}
.up-icon{position:absolute; top:10px; right:10px; width:40px; height:40px; line-height:40px; text-align: center; border-radius:50%; background-color:#4364af; padding-top:6px;}
.up-icon:hover, .up-icon:focus{background-color:#000; color:#fff;}
.max-wd{max-width:700px; margin:0 auto; padding:0 12px;}

.web-detail{background-color:#fff; border-radius:12px; padding:20px 120px 20px 20px; display: flex; grid-gap:26px; align-items: center; box-shadow:0 4px 30px 0 rgba(0,0,0,0.05); margin-bottom:25px; position: relative;}
.web-detail address{font-size:15px; line-height:25px; font-weight:300; font-style: normal; margin:0 0 15px;}
.web-detail-title{font-size:25px; color:#3E3E3E; font-weight:500;}
.mid-Vline{width:1px; background-color:rgba(0,0,0,0.12); height:145px;}

.header-social a{display: inline-flex;align-items: center;justify-content: center;vertical-align: top;font-size: 16px; color:#3E3E3E; text-decoration: none; background: rgba(0,0,0,.06); width: 36px; height: 36px; text-align: center; line-height: 34px; border-radius: 34px; margin: 0 4px 5px 0; -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; transition: .3s ease-in-out}
.header-social a:hover{background: #4364af; color: #fff; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg)}

.header-social a:hover svg{fill:#fff}
.web-menu a{font-size: 18px; font-weight:300; background: #4364af; color: #fff; padding: 0 20px; border-radius: 12px; margin-top:12px; display: grid; align-items: center; justify-content: space-between; text-decoration: none; min-height: 60px; grid-template-columns: 6% 87% 2%; grid-auto-flow: column; grid-auto-columns: 1fr;  -webkit-transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;-o-transition:.3s ease-in-out;transition:.3s ease-in-out;}
.web-menu a:hover, .web-menu a:focus{background: #000; color: #fff;}



.popup{position: fixed; width:94%; max-width:500px; border-radius: 10px; top: 50%; left: 50%; transform: translate(-50%,-50%); background:#fff; visibility: hidden; opacity: 0;
  /* "delay" the visibility transition */
  -webkit-transition: opacity .5s, visibility 0s linear .5s;
  transition: opacity .5s, visibility 0s linear .5s;
  z-index: 1;
}
.popup:target{visibility: visible; opacity: 1;
  /* cancel visibility transition delay */
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
.popup-close{position: absolute; padding: 10px; max-width: 500px; border-radius: 10px; top: 50%; left: 50%; transform: translate(-50%,-50%); background: rgba(255,255,255,.9);}
.popup .close{position: absolute; right: 10px; top: 5px; padding: 5px; color: #000; transition: color .3s; font-size: 2em; line-height: .6em; font-weight: bold;}
.popup .close:hover{color: #00E5EE;}
.close-popup{background: rgba(0,0,0,.7); cursor: default; position: fixed; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; visibility: hidden;
  /* "delay" the visibility transition */
  -webkit-transition: opacity .5s, visibility 0s linear .5s;
  transition: opacity .5s, visibility 0s linear .5s;
}
.popup:target + .close-popup{opacity: 1; visibility: visible;
  /* cancel visibility transition delay */
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}

.popup-head{border-bottom:1px solid #d9d9d9; padding:12px 20px;}
.popup-body{padding:20px;}
.copy-link-div{padding-top: 16px; position: relative; display: flex;}
.share-content-wrapper{display: flex; grid-gap:20px; justify-content: space-between;}
.dnl-btn{background-color: #4364af; color:#fff; border-radius: 4px; padding:8px 15px; transition: all .3s ease; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); border:0; outline: none; box-shadow: none; cursor: pointer;}

.flip-card{background-color: transparent; width:185px; height:185px; perspective: 1000px;}
.flip-card-inner{position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.6s; transform-style: preserve-3d;}
.flip-card:hover .flip-card-inner{transform: rotateY(180deg);}
.flip-card-front, .flip-card-back{position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden; box-shadow:0 5px 12px 0 rgba(0,0,0,0.1); padding:10px; background-color:#fff; border-radius:10px;}
.flip-card-front img, .flip-card-back img, .flip-card-front svg, .flip-card-back svg{width:100%; height:100%;}
.flip-card-back{transform: rotateY(180deg); background-color:rgba(0,0,0,0.15);}
.flip-card-back img{opacity:0.6}

.copy-link-div .input-area{height: 45px; border-radius: 8px 0 0 8px; border: 1px solid #d9d9d9; padding: 10px 16px; font-weight: normal; width: 100%; background: #fff;}
.copy-link-div .share-copy{width: 100px; border: 0; background: #4364af; color: #fff; font-size: 16px; border-radius: 0 8px 8px 0; cursor: pointer;}
.whatsapp-icon{color: #25D366;font-size: 20px;}
.share-item {border-radius: 6px; padding:10px 15px; width: 100%;  border:1px solid transparent;}
/*.share-url{border:1px solid  transparent; cursor: pointer;}
.share-url:hover{color:#000; border-color:#f0f0f0;}*/
.share-item, .share-links {align-items: center;color: inherit;display: flex;font-weight: 500;justify-content: space-between;text-decoration: none;}
.share-item:hover{border-color:#4364af36; background: #f1f5ff; color: #4364af;}
.text-14{font-size: 14px;}
.share-item:hover .share-svg-arrow svg path{stroke: #4364af;}
.item-center{display: flex; align-items: center;}
.item-center .ml-8{margin-left: 8px; font-size: 14px;}
.share-items-wrapper{width:100%;}
.share-svg{margin: 0 0 -3px; min-width: 25px; text-align: center;}
.share-items-wrapper .st-btn{width:100%; display: block !important; margin:5px 0 0;}
#st-1.st-has-labels .st-btn.st-remove-label > span{display:inline-block !important; font-size: 15px;}


@media (max-width:767px){
  .web-menu a{grid-template-columns: 7% 86% 3%;}
}
@media (max-width:600px){
  .mid-Vline{height:1px; width:100%; margin:15px 0;}
  .web-detail{display: block; padding:10px; text-align: center;}
  .web-detail-title{font-size:20px;}
  .web-detail address{font-size: 14px; line-height: 22px;}
  .web-menu-list-img{max-width:30px; max-height:30px;}
  .web-menu a{grid-template-columns:12% 81% 5%; font-size: 15px; min-height:44px; border-radius:10px; padding:0 10px;}
  .share-content-wrapper{display: block;}
  .popup-body{text-align: center;}
  .flip-card{margin: 0 auto 20px;}
}