.bpa-front-module--location-items-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); margin-left: -12px; margin-right: -12px; } .bpa-front-tabs.--bpa-top .bpa-front-module--location-items-row{ grid-template-columns: repeat( auto-fit, minmax(450px, 1fr)); } .bpa-fm-li--col-item { padding-left: 12px; padding-right: 12px; } .bpa-fm-li--col-item .bpa-fm-li__card { padding: 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; border: 1px solid var(--bpa-gt-gray-400); border-radius: var(--bpa-radius-8px); display: flex; align-items: center; position: relative; cursor: pointer; margin-bottom: 24px; -webkit-animation-name: bpaLocFadeInUp; animation-name: bpaLocFadeInUp; animation-timing-function: cubic-bezier(.51,.92,.24,1.15);     -webkit-animation-duration: 0.3s; animation-duration: 0.3s;     -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes bpaLocFadeInUp { 0% { opacity: 0; transform: translateY(10%); transform-origin: center; } 100% { opacity: 1; transform: translateY(0); } } .bpa-fm-li--col-item:nth-child(2) .bpa-fm-li__card{animation-delay: 0.1s;} .bpa-fm-li--col-item:nth-child(3) .bpa-fm-li__card{animation-delay: 0.2s;} .bpa-fm-li--col-item:nth-child(4) .bpa-fm-li__card{animation-delay: 0.3s;} .bpa-fm-li--col-item:nth-child(5) .bpa-fm-li__card{animation-delay: 0.4s;} .bpa-fm-li--col-item:nth-child(6) .bpa-fm-li__card{animation-delay: 0.5s;} .bpa-fm-li--col-item:nth-child(7) .bpa-fm-li__card{animation-delay: 0.6s;} .bpa-fm-li--col-item:nth-child(8) .bpa-fm-li__card{animation-delay: 0.7s;} .bpa-fm-li--col-item:nth-child(9) .bpa-fm-li__card{animation-delay: 0.8s;} .bpa-fm-li--col-item:nth-child(10) .bpa-fm-li__card{animation-delay: 0.9s;} .bpa-fm-li--col-item:nth-child(11) .bpa-fm-li__card{animation-delay: 1s;} .bpa-fm-li--col-item:nth-child(12) .bpa-fm-li__card{animation-delay: 1.1s;} .bpa-fm-li--col-item .bpa-fm-li__card.__bpa-is-selected{ border-color: var(--bpa-pt-main-green); box-shadow: 0 8px 16px rgba(114, 124, 149, 0.12), 0 4px 8px rgba(114, 124, 149, 0.12); } .bpa-fm-li--col-item .bpa-fm-li__card .bpa-li-col__image { margin-right: 16px; } .bpa-fm-li--col-item .bpa-fm-li__card .bpa-li-col__image img { width: 92px; max-width: 92px; height: 92px; border-radius: var(--bpa-radius-16px); } .bpa-li-col__body .bpa-li-col__title { font-size: 15px; font-weight: 500; color: var(--bpa-dt-black-400); margin-bottom: 8px; font-family: var(--bpa-primary-font); } .bpa-li-col__body .bpa-li-col__address { font-size: 14px; line-height: 18px; color: var(--bpa-dt-black-300); font-family: var(--bpa-primary-font); } .bpa-li-col__body .bpa-li-col__address.bpa-li-col__phone-no { margin-top: 8px; } .bpa-fm-li--col-item .bpa-fm-li__card .bpa-front-si-card--checkmark-icon { position: absolute; top: 12px; right: 12px; } .bpa-fm-li--col-item .bpa-fm-li__card .bpa-front-si-card--checkmark-icon svg{ width: 28px; fill:var(--bpa-pt-main-green); } .bpa-fm-li--col-item .bpa-fm-li__card .bpa-front-si-card--checkmark-icon span{ color: var(--bpa-pt-main-green); font-size: 24px; } .bpa-is-location-val__summary{ border: 1px solid var(--bpa-gt-gray-400); border-radius: var(--bpa-radius-4px); display: flex; margin-top: 16px; -webkit-animation-name: bpaFadeInUp; animation-name: bpaFadeInUp;     animation-timing-function: cubic-bezier(.51,.92,.24,1.15); -webkit-animation-duration: 0.4s; animation-duration: 0.4s;     -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-delay: 0.3s;   animation-delay: 0.3s; } .bpa-is-location-val__summary .bpa-lvs__label{ padding: 4px 8px; background-color: var(--bpa-gt-gray-100); font-size: 14px; font-weight: normal; font-family: var(--bpa-primary-font); line-height: 20px; color: var(--bpa-dt-black-300); border-radius: var(--bpa-radius-4px) 0 0 var(--bpa-radius-4px); } .bpa-is-location-val__summary .bpa-lvs__val{ display: flex; align-items: center; padding: 4px 16px; } .bpa-is-location-val__summary .bpa-lvs__val svg{ width: 16px; min-width: 16px; height: 16px; margin-right: 4px; fill: var(--bpa-pt-main-green); } .bpa-is-location-val__summary .bpa-lvs__val .bpa-lvs__val-text{ font-size: 14px; font-weight: normal; font-family: var(--bpa-primary-font); line-height: 20px; color: var(--bpa-dt-black-400); } .bpa-front-module--location-items-row .bpa-front-li-card__left{ margin-right:20px; } .bpa-front-module--location-items-row .bpa-front-li__default-img{ width: 72px; height:72px; border-radius:var( --bpa-radius-16px ); border:1px solid var(--bpa-gt-gray-400); display:flex; align-items: center; justify-content: center; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; } @media (max-width: 576px) { .bpa-front-module--location-items-row .bpa-front-li-card__left{ margin-right:0px; } .bpa-front-module-location-module .bpa-front-module-heading { padding-left: 20px; } .bpa-front-module--location-items-row { margin: 0 20px; display: block; } .bpa-fm-li--col-item { padding: 0; } .bpa-fm-li--col-item .bpa-fm-li__card { flex-direction: column; align-items: center; } .bpa-fm-li--col-item .bpa-fm-li__card .bpa-li-col__image { margin-right: 0; margin-bottom: 16px; } .bpa-fm-li--col-item .bpa-fm-li__card .bpa-li-col__body { text-align: center; } .bpa-is-location-val__summary{ flex-direction: column; margin: 16px 12px 0 12px; } .bpa-is-location-val__summary .bpa-lvs__label{ padding: 8px 0; border-radius: var(--bpa-radius-4px) var(--bpa-radius-4px) 0 0; } .bpa-is-location-val__summary .bpa-lvs__val{ padding: 8px 12px; } .bpa-is-location-val__summary .bpa-lvs__val svg{ margin-right: 6px; } .bpa-is-location-val__summary .bpa-lvs__val .bpa-lvs__val-text{ text-align: left; } } @-webkit-keyframes bpaFadeInUp { 0% { opacity: 0; transform: translateY(10%); transform-origin: center; } 100% { opacity: 1; transform: translateY(0); } } @keyframes bpaFadeInUp { 0% { opacity: 0; transform: translateY(10%); transform-origin: center; } 100% { opacity: 1; transform: translateY(0); } }