.body{ overflow-x:hidden; } .main-body-wrap{ flex-grow:1; display: flex; flex-direction: column; width: 100%; min-height: 100%; } .main-body{ flex-grow:1; } .main-top-wrap{ position: fixed; left: 0; right: 0; top: 0; width: 100%; z-index:10; } .main-top-wrap, .main-top-base{ } .main-menu-base, .main-menu-wrap{ height:10vh; } .main-menu-wrap{ background-color:#FFF; -webkit-box-shadow: 0 0 6px rgb(0 0 0 / 16%); box-shadow: 0 0 6px rgb(0 0 0 / 16%); position: fixed; left: 0; right: 0; bottom: 0; width: 100%; } .main-menu-nav{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-around; height: 100%; } .main-menu-link{ text-align: center; border-top: 2px solid transparent; height: 100%; min-width:80px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #CBCFD2; } .main-menu-link-icon, .main-menu-link-label{ display:flex; align-items:center; } .main-menu-link-icon{ /*height:50%;*/ max-width:30px; font-size:2.2rem; } .main-menu-link-icon img{ width:100%; } .main-menu-link-label{ font-size:1.2rem; } .main-menu-link.active { border-color: #4dbde6; color:#4dbde6; } .main-menu-link .btn-badge{ top: 1px !important; right: 10px !important; } /*----FIXED CONTAINER-----*/ .fxctn{ position:fixed; top:0; left:0; right:0; bottom:0; display:none; background-color:#FFF; z-index:10; } .fxctn-wrap{ display:flex; flex-direction: column; height:100%; position:relative; } .fxctn-body{ width:100%; flex-grow:1; overflow:auto; } /*----REDEEM-----*/ .QRdecode-btn{ border: 2px dashed #4dbde6; width: 140px; background-color: aliceblue !important; } /*----MAP-----*/ .map-container{ position:fixed; top:0; left:0; right:0; bottom:0; display:none; background-color:#FFF; z-index:10; } .map-wrap{ display:flex; flex-direction: column; height:100vh; position:relative; } #map{ width:100%; flex-grow:1; } .gmnoprint{ display:none; } .custom-clustericon { color: #fff; border-radius: 100%; font-weight: bold; font-size: 15px; display: flex; align-items: center; } .custom-clustericon::after { padding: 20px; } .custom-clustericon::before { padding: 25px; } .custom-clustericon::before, .custom-clustericon::after { content: ""; display: block; position: absolute; width: 100%; height: 100%; transform: translate(-50%, -50%); top: 50%; left: 50%; opacity: 0.1; border-radius: 100%; } .custom-clustericon-1, .custom-clustericon-1::before, .custom-clustericon-1::after{ background-color: #00a2d3; } .custom-clustericon-2, .custom-clustericon-2::before, .custom-clustericon-2::after{ background-color: #ff9b00; } .custom-clustericon-3, .custom-clustericon-3::before, .custom-clustericon-3::after{ background-color: #ff6969; } .gridMapDiv{ /*width: 390px; height: 390px;*/ border-style: solid; border-width: 1px; border-color: rgb(170, 170, 170); } /*-----USER CARD------*/ .main-user-qr-wrap img{ width:100%; width:180px; height:180px; box-shadow: rgb(0 0 0 / 16%) 0px 1px 4px; padding: 5px; background-color: #FFF; } /*----VCH RATINGS----*/ .starsrate .star{ font-size:2.5rem; margin-left:0; } #rating-wrap:not(.show){ display:none; } #rating-head:not(.show), #rating-footer:not(.show){ display:none; } .vch-li-msg{ font-weight:bold; text-transform: uppercase; } .vch-li-msg.not_validated{ background-color:#f0f8ff; } .vch-li-msg.not_rated{ background-color:yellow; }