/** Shopify CDN: Minification failed

Line 156:17 Expected identifier but found whitespace
Line 156:19 Unexpected "{"
Line 156:28 Expected ":"

**/

.all-loyalty-container{
    padding: 100px 20px 100px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/*Seccion de titulo*/

.loyalty-section-title{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 40px;
}

@media(max-width: 615px){
    .loyalty-section-title{
        margin-bottom: 30px;
    }
    
}

.loyalty-section-title h2 {
font-size: 30px;
line-height: 36px;
font-weight: 700;
color: #FFFFFF;
font-family: 'Barlow Condensed';
text-align: center;
text-transform: uppercase;
margin: 0 30px;
}


.first-left-line{
width: 7vw;
min-width: 40px;
max-width: 100px;
height: 3px;
background-color: #20FFF1;

}

.first-left-line:nth-of-type(1){
margin-bottom: 3px;
}

.first-right-line{
width: 7vw;
max-width: 100px;
height: 3px;
background-color: #20FFF1;

}

.first-right-line:nth-of-type(1){
margin-bottom: 3px;
min-width: 40px;
}

.first-right-line:nth-of-type(2){
width: 5.5vw;
max-width: 80px;
min-width: 26px;
}

@media(max-width: 630px){
    .all-loyalty-container{
    padding: 50px 15px 50px 15px;
}



.left-lines-title{
margin-top: auto;
margin-bottom: auto;
}

.right-lines-title{
margin-top: auto;
margin-bottom: auto;
}

}

@media(max-width: 615px){
    .loyalty-section-title h2 {
        font-size: 25px;
        line-height: 30px;
        max-width: 245px;
        margin: 0 10px;
        }
}


/*Seccion de descripcion*/

.loyalty-section-description{
    width:100%;
    max-width: 460px;
    text-align: center;
    margin: 0 auto;
    margin-bottom:20px;
}

.loyalty-section-description p{
    width:100%;
    text-align: center;
    font-size: 15px;
    color: #fff;
    font-weight: 600;
    margin-bottom: 0 !important;
}


/*bottom description*/
.loyalty-section-bottom-description{
    margin-bottom: 20px;
}

.loyalty-section-bottom-description ul{
margin:0 ;
padding: 0;
text-align: center;
max-width: 384px;
}

.loyalty-section-bottom-description ul li{
font-size: 15px;
font-weight: 600;
color: #fff;
}

/*button*/

.loyalty-section-button{
text-transform: uppercase;
font-size: 20px;
font-weight: 700;
color: #fff;
padding: 0 15px;
height: 44px; 
display: flex;
justify-content: center;
align-items: center;
font-family: 'Barlow Condensed';
background-color: {{ section.settings.background_color_button }};
transition: background-color 0.3s ease, color 0.3s ease;
}

.loyalty-section-button:hover{
color: #d6d4d5;
background-color: #bd2f73;
}

/*Medias querys*/

@media(max-width: 450px){
.loyalty-section-description p{
    max-width: 240px;
    font-size: 14px;
    margin: 0 auto;
}

.loyalty-section-bottom-description ul{
max-width: 240px;
}

.loyalty-section-bottom-description ul li{
font-size: 14px;
}
}

@media(max-width: 385px){
.loyalty-section-title h2 {
font-size: 22px;
max-width: 215px;
}
}

/*Bloque estilos*/
.loyalty-section-blocks{
width: 100%;
max-width: 560px;
margin-bottom: 50px;
}

.loyalty-block-content{
width: 100%;
max-width: 519px;

}

.loyalty-block-item{
width: 100%;
min-height: 100px;
align-items: center;
display: flex;
justify-content: flex-end;
position: relative;
margin-bottom: 15px;
}

.loyalty-block-item:last-of-type{
margin-bottom: 0px;
}

.loyalty-block-info{
background-color: #fff;
padding: 10px 0;
display: flex;
flex-direction: column;
justify-content: center;
min-height: 75.95px;
border-radius: 10px;
position:relative;
padding-left: 90px;
padding-right: 30%;
}



.loyalty-block-info div.loyalty-block-td{
width: 100%;
max-width: 265px;
}

.loyalty-block-star{
position: absolute;
top: 0;
right: 0;
height: 100%;
width: 27.5%;
background-color: #DCDCDC;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
}

.loyalty-block-info div h3{
    font-size: 15px;
    font-weight: 800;
    margin-bottom: 3px;
}

.loyalty-block-description p{
margin-bottom: 0;
font-size: 12px;
font-weight: 500;
color: #171E2A;
line-height: 15.98px;
}

.loyalty-block-description p strong{
margin-bottom: 0;
font-size: 12px;
font-weight: 800;
color: #8013E6;
}

/*Imagen de bloque*/
.loyalty-block-image{
position: absolute;
z-index: 9;
top: 0;
left: 0;
width: 100px;
height: 100px;
border-radius: 50%;
background-color: #171E2A;
display: flex;
justify-content: center;
align-items: center;
}

.loyalty-block-image-into1{
width: 84px;
height: 84px;
border-radius: 50%;
border: 1px solid #00E600;
display: flex;
align-items: center;
justify-content: center;
}

.loyalty-block-image-into2{
width: 76.47px;
height: 76.47px;
border-radius: 50%;
border: 3px solid #000000;
background-color: #fff;
display: flex;
justify-content: center;
align-items: center;
}

/*Mobile*/

@media(max-width: 630px){

.loyalty-section-blocks{
max-width: 460px;
}

.loyalty-block-info{
background-color: #fff;
padding: 20px 0;
display: flex;
flex-direction: column;
min-height: 117px;
border-radius: 10px;
position:relative;
padding-left: 30px;
padding-right: 30%;
margin-left: 30px;
}



.loyalty-block-info div.loyalty-block-td{
width: 100%;
max-width: 265px;
}

.loyalty-block-star{
border-left: 3px solid #0E141F;
}

.loyalty-block-image{
width: 50px;
height: 50px;
top: 50%;
transform: translateY(-50%);
}

.loyalty-block-image-into1{
width: 42px;
height: 42px;
}

.loyalty-block-image-into2{
width: 38px;
height: 38px;
}

.loyalty-block-star img{
width: 17px;
height: 17px;
}



}


@media(max-width: 950px){
  .loyalty-section-title h2 {
    margin: 0 15px;
}

.loyalty-block-content {
    margin-left: 6%;
}

.loyalty-section-blocks {
    padding: 0 30px;
}

.loyalty-section-title {
    padding: 0 30px;
}
}

@media(max-width: 850px){
    .loyalty-section-blocks {
        padding: 0 75px;
    }
    
    .loyalty-section-title {
        padding: 0 60px;
    }
}

@media(max-width: 800px){
    .loyalty-section-blocks {
        padding: 0 80px;
    }
    
    .loyalty-section-title {
        padding: 0 70px;
    }
}

@media(max-width: 630px){
    
.loyalty-block-content {
    margin-left: 0;
}

.loyalty-section-title {
    padding: 0 50px;
}

.loyalty-section-blocks {
    padding: 0 60px;
}
}

@media(max-width: 500px){
    .loyalty-section-title {
        padding: 0 60px;
    }

    .loyalty-section-blocks {
        padding: 0 55px;
    }
}