ul.list-locations {
list-style: none;
padding: 0 !important;
height: inherit;
display: flex;
flex-wrap: wrap;
align-items: center;
opacity: 0;
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 30%;
}
.container-location {
overflow: hidden;
width: auto;
max-width: 350px;
background-color: #fff;
border-radius: 25px;
padding-bottom: 20px;
display: block;
overflow: hidden;
margin: 0 !important;
}
.location-header{
position:relative;
width:100%;
height: 60px;
background-color:#04C7C0;
margin-bottom: 50px;
}
.container-header-img{
position:absolute;
top:50%;
left:0;
right:0;
margin:auto;
width: 70px;
height: 70px;
border-radius:50%;
background-color:#fff;
box-shadow: 2px 4px 0px rgb(4 199 192 / 30%);
}
.container-text-location{
padding: 0 10%;
}
.location-text{
text-align:center;
font-size:15px;
}
.location-phone{
text-align:center;
color: #04C7C0 !important;
font-weight: 500 !important;
font-size: 15px !important;
}
.container-buttons{
display: flex;
place-content: center;
}
.btn-redirect-locations{
margin: auto;
background-color: #012639;
border-radius: 25px;
color: #fff !important;
padding: 2px 15px;
font-size: 13px !important;
}
ul .location {
display: block;
opacity: 0;
position: absolute;
width: max-content;
z-index: 9;
}
ul .location.active { }
.elementor-widget-wp-widget-sfcom_ubiaciones_widgett {
height: 100%;
}
.elementor-widget-wp-widget-sfcom_ubiaciones_widgett .elementor-widget-container{
height: inherit;
}
li.location {
transform: translateY(-80px);
transform: translateX(-1000px);
}
li.location.active { }
.panel-map {
width: 100%;
height: 100%;
background-image: url(http://web.nucleodediagnostico.mx/wp-content/uploads/2022/09/ND_190922_PR_textura-2.png);
background-size: 85%;
background-position: -126% 100%;
background-repeat: no-repeat;
}
.container-cp form {
display: flex;
flex-wrap: wrap;
padding: 5px 20px 20px;
position:relative;
}
p.warning-zipcode {
position: absolute;
bottom: -23px; width: 100%;
color: #ff0015;
font-size: 16px;
font-weight: 600;
}
.distance-p{
background-color:#fff;
padding:0px 10px;
border-radius:25px;
font-weight:600;
color:#007EBB;
width: max-content;
margin-left: auto;
} .container-cp {
padding: 20px;
box-shadow: inset 0px 0px 10px rgb(0 0 0 / 8%);
background-color: #DBE4EE;
}
.container-cp input {
width: 70%;
margin-left:auto;
}
.container-cp .btn-lim-cp {
width: 25%;
background-color: #04C7C0;
color: #fff !important;
border: none;
border-radius: 3px;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}
.container-cp .btn-lim-cp:hover {
background-color:#007EBB;
}
.panel-map {
height: inherit;
overflow: hidden;
display: grid;
position: relative;
}
.panel-map ul {
overflow-y: auto;
position: relative;
list-style: none;
padding: 0;
}
.panel-map ul li {
padding: 10px 20px;
border-bottom: 1px solid rgb(0,0,0,0.1);
cursor: pointer;
position: relative;
}
.panel-map ul li:hover:not(.active-loc) {
background-color: #f7f7f7;
}
.panel-map ul .active-loc {
background-color: rgb(4, 199, 192, 0.6);
}
.location-info.active-loc p {
font-family: Open sans;
}
.container-hor {
opacity: 0.8;
}
.container-tel{
opacity: 0.8;
}
ul .active-loc .container-hor {
display:block;
width:55%;
}
ul .active-loc .container-tel{
display:block;
width:45%;
}
ul .active-loc .container-column-hide {
display:flex;
}
ul .active-loc .distance-p {
background-color: #fff;
padding: 0px 10px;
border-radius: 0px 0px 10px 10px;
font-weight: 600;
color: #007EBB;
width: max-content;
margin-left: auto;
margin-right: 10px;
width: 100%;
text-align: right;
} .btn-redirect-locations-full:hover {
background-color: #007EBB;
color: #fff;
}
.btn-redirect-locations-full {
background-color: #fff;
width: max-content;
display: block;
font-size: 12px !important;
margin-top: 5px;
padding: 2px 4px;
text-align: center;
border-radius: 25px;
margin-left: 10px;
margin-right: auto;
}
.tel-info{
font-weight: 600;
font-size: 14px !important;
}
.tel-info:hover{
color: rgb(255,255,255,0.7) !important;
}
.container-column-hide {
display: none;
background-color: #012639;
border-radius: 10px 10px 10px 10px;
padding: 10px 10px 0;
}
.slide-in-left {
-webkit-animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}  @-webkit-keyframes slide-in-left {
0% {
-webkit-transform: translateX(-1000px);
transform: translateX(-1000px);
opacity: 0;
}
100% {
-webkit-transform: translateX(60px);
transform: translateX(60px);
opacity: 1;
}
}
@keyframes slide-in-left {
0% {
-webkit-transform: translateX(-1000px);
transform: translateX(-1000px);
opacity: 0;
}
100% {
-webkit-transform: translateX(60px);
transform: translateX(60px);
opacity: 1;
}
}
.slide-out-left {
-webkit-animation: slide-out-left 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
animation: slide-out-left 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}  @-webkit-keyframes slide-out-left {
0% {
-webkit-transform: translateX(60px);
transform: translateX(60px);
opacity: 1;
}
100% {
-webkit-transform: translateX(-1000px);
transform: translateX(-1000px);
opacity: 0;
}
}
@keyframes slide-out-left {
0% {
-webkit-transform: translateX(60px);
transform: translateX(60px);
opacity: 1;
}
100% {
-webkit-transform: translateX(-1000px);
transform: translateX(-1000px);
opacity: 0;
}
}