/******************************************************/
/*********************** FONTS ************************/
/******************************************************/

@font-face {
    font-family: 'BraunLinearBold';
    src: url('../font/BraunLinear-Bold.ttf');
}

@font-face {
    font-family: 'BraunLinearMedium';
    src: url('../font/BraunLinear-Medium.ttf');
}

@font-face {
    font-family: 'BraunLinearRegular';
    src: url('../font/BraunLinear-Regular.ttf');
}

.BraunRegular{
    font-family: BraunLinearRegular;
}


/******************************************************/
/*********************** GLOBALS ************************/
/******************************************************/

.cookies-button {
    background-color: rgb(0, 61, 167);
    border-radius: 5px;
    border: 2px solid rgb(255, 255, 255);
    bottom: 0px;
    color: rgb(255, 255, 255);
    cursor: pointer;
    font-size: 0.875rem;
    margin: -0.5rem 0px 0px -5.125rem;
    padding: 0.375rem 0.625rem;
    position: fixed;
    right: 0px;
    z-index: 800;
}

.customStyle{
    color:#FFFFFF;
    font-family: BraunLinearBold;
}

.customStyle a{
    color:#FFFFFF;
}

.limit_words{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.custom-btn{
    background-color:#FFFFFF;
    border-radius:2rem;
    padding: 0.2rem 0.75rem;
    width:300px;
    font-family: BraunLinearBold;
    font-size:0.9em;
    max-width: 80%;
}

.full-screen{
    position: relative;
    min-height: 100vh;
    top: 0;
    left: 0;
    background-color:#000000;
}

.header .logo img{
    object-fit: contain;
    height: 110px;
    width: auto;
    max-width: 80%;
}

.footer .legal{
    color:#717171;
    font-family: BraunLinearRegular;
}

.footer .legal a{
    color:#717171;
    text-decoration: underline;
}

.footer .legal a:hover{
    color:#717171;
}

/******************************************************/
/*********************** HOME ************************/
/******************************************************/

.home .logo img{
    object-fit: contain;
    height: 130px;
    width: auto;
    max-width: 80%;
}

.home .claim{
    color:#FFFFFF;
    font-family: BraunLinearMedium;
    letter-spacing: .075rem;
}

.home a{
    color:#000000;
}

/******************************************************/
/*********************** REGISTER ************************/
/******************************************************/

.register h1{
    font-size:2em;
}

.register .info{
    width: 100%;
    margin-top: 0.25rem;
    font-size: .875em;
    color: #FFFFFF;
    font-family: BraunLinearRegular;
}

.register .custom-btn{
    background-color:#ea9e1c;
    color:#000000;
    width:180px;
}

.register .legal-form{
    font-size:0.8em;
}

.register .legal-form a, .register .legal-form b{
    color:#ea9e1c;
}


@media all and (max-width: 768px){
    .register h1{
        font-size:1.5em;
    }
}

/******************************************************/
/*********************** LOGIN ************************/
/******************************************************/

.login h1{
    font-size:2em;
}

.login .custom-btn{
    background-color:#ea9e1c;
    color:#000000;
    width:180px;
}


@media all and (max-width: 768px){
    .login h1{
        font-size:1.5em;
    }
}

/******************************************************/
/*********************** PUNTOS v1, v2 y redención de puntos 2 ************************/
/******************************************************/

.points h1{
    font-size:1.6em;
}

.points h2{
    font-size:1.3em;
    font-family:BraunLinearRegular;
}

.points .points_icon{
    object-fit: contain;
    width:130px;
    height:auto;
    max-width:80%;
}

.points .content_points{
    border-radius: 0.5rem;
    font-size: 2.8em;
    color: #000000;
    background-color: #FFFFFF;
    padding: 0 40px;
    text-align: center;
}

.points .custom-btn{
    background-color:#ea9e1c;
    color:#000000;
}

.points .info-success{
    font-size:1.3em;
    font-family:BraunLinearRegular;
}

@media all and (max-width: 768px){
    .points .points_icon{
        width:100px;
    }
    .points .content_points{
        font-size: 1.8em;
    }
    .points .info-success{
        font-size:1.1em;
    }
}

/******************************************************/
/*********************** CANJE PUNTOS ************************/
/******************************************************/

.gifts .gift{
    background-color:#FFFFFF;
    border-radius:.5rem;
    padding: 0.5rem 1rem 1rem 1rem;
}

.gifts .gift .gift-points{
    width:100%;
    float:left;
    height:auto;
    font-size:1em;
    color:#000000;
    padding-bottom:.5rem;
}

.gifts .gift .gift-image{
    width:100%;
    float:left;
    height:auto;
}

.gifts .gift .gift-image img{
    object-fit: contain;
    width:100%;
    height: auto;
    border-radius:.5rem;
}

.gifts .gift .gift-desc{
    width:100%;
    float:left;
    height:auto;
    font-size:1em;
    color:#000000;
    padding-top:.5rem;
}

.gifts .gift .gift-desc h2{
    font-size:1em;
}

.gifts .gift .gift-desc p{
    font-size:0.9em;
    font-family: BraunLinearRegular;
}

.gifts .gift .gift-button{
    width:100%;
    float:left;
    height:auto;
}

.gifts .gift .gift-button .custom-btn{
    color:#FFFFFF;
    background-color:#000000;
    font-size:1em;
    width:100% !important;
    max-width:100%;
}

#modalGift .custom-btn{
    background-color:#FFFFFF;
    color:#000000;
    width:150px;
}

#modalGift .custom-btn.black{
    background-color:#000000;
    color:#FFFFFF;
}

#modalGift .modal-content{
    background-color:#e8e8e8;
    color:#000000;
    padding: 0 1rem;
}

#modalGift .modal-body b{
    font-size:0.9em;
}

#modalGift .modal-body p{
    font-size:0.8em;
    font-family: BraunLinearRegular;
}

#modalGift .modal-header{
    border-bottom:0;
    padding: 1rem 1rem 0 1rem;
}

#modalGift .modal-content img{
    object-fit: contain;
    height:160px;
    max-width: 100%;
    display:block;
    margin-bottom: 13px;
    border-radius:.5rem;
}

#modalGift .modal-footer{
    border-top:0;
    justify-content: flex-end;
}

#modalGift .info{
    width: 100%;
    margin-top: 0.25rem;
    font-size: .7em;
    color: #000000;
    font-family: BraunLinearRegular;
}

#modalGift  .form-control:disabled, .form-control[readonly] {
    background-color: #FFFFFF;
    opacity: 1;
}

#modalGift .btn-close{
    color:#000000;
    opacity:1;
}


/******************************************************/
/*********************** FICHA CANJE PUNTOS ************************/
/******************************************************/

.gift-ficha .modal{
    display:block;
    position: static;
}