/* BUTTONS  */

.btn_icon{

    width: fit-content;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;

    padding: 0.6rem 1rem;

    border-radius: var(--input-border-radius-full);
    color: #000;
    cursor: pointer;

    font-size: .9rem;
    font-weight: 300;
}

.btn_full_white{

   background: #fff;
   color: #000;
   border: none;
}

.btn_icon img{

    transform: translateX(0);
    transition: 0.3s ease-in-out;
}

.btn_icon:hover img{

    transform: translateX(-5px);
    transition: 0.3s ease-in-out;
}

.btn{

    display: flex;
    align-items: center;
    flex-shrink: 0;

    padding: 0.6rem 1.6rem;
    width: fit-content;
    max-height: 2.6rem;
    
    border-radius: var(--input-border-radius-full);
    gap: 1rem;

    font-size: .9rem;
    font-weight: 300;

    cursor: pointer;
}

.btn_border{

    border-radius: 10rem;
    color: #fff;
    border: 1px solid #fff;
}

.btn_border:active {
    box-shadow: 0 0 0 3px #fff;
}

.btn_underline{
    border-bottom: 1px solid #fff;
    width: fit-content;
    margin: 0 auto;
    font-size: 1rem;
}

/* .btn_underline a{
   border-bottom: 1px solid #fff;
} */


.effect-shine:hover {
    -webkit-mask-image: linear-gradient(-75deg, rgba(0,0,0,.6) 30%, #000 50%, rgba(0,0,0,.6) 70%);
    -webkit-mask-size: 200%;
    animation: shine 2s infinite;
  }
  
@-webkit-keyframes shine {
    from {
      -webkit-mask-position: 150%;
    }
    
    to {
      -webkit-mask-position: -50%;
    }
}




.floating_button{

    position: fixed;
    top: 70%;
    right: 0;
    z-index: 99;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    
    padding: 1rem 1rem 1rem 2.5rem;
    
    background: #fff;
    color: #000;
    border-radius: 10rem 0 0 10rem;
}

.floating_button p{

    font-weight: 600;
    font-size: 1.1rem;
}

.com_popup_trigger{

    color: #000;
    cursor: pointer;
}

.floating_button .com_popup_trigger{

    font-weight: 300;
    text-decoration: underline;

    font-size: 0.9rem;
}

/* BUTTONS END  */


@media only screen and (max-width: 768px) {

    .btn,.btn_icon{
        
        font-size: 1rem;
    }
    .floating_button p{
    
        font-size: 1.2rem;
    }
    .floating_button{
    
        top: 80%;
    }
}


@media screen and (min-width: 1200px) {

    .floating_button {

        position: fixed;
        top: calc(100vh - 310px);
        right: 0;
        z-index: 99;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 1rem 1rem 1rem 2.5rem;
        background: #fff;
        color: #000;
        border-radius: 10rem 0 0 10rem;
        margin-left: auto;
        width: fit-content;
    }
    
}