/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/
 
 
/*==========  Mobile First Method  ==========*/
 
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
}


/*==========  Non-Mobile First Method  ==========*/
 
/* Large Devices, Wide Screens */
@media only screen and (max-width : 1199px) {
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 991px) {
}

/* Small Devices, Tablets */
@media only screen and (max-width : 767px) {
}
/* Extra Small Devices, Phones */
@media only screen and (max-width : 479px) {
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 360px) {

}

/* Custom, iPhone Retina */
@media only screen and (max-width : 319px) {
}
@media (min-width:100px) and (max-width:1200px) {
    body {
        overflow-x: hidden
    }
    .icono:hover span {
        display: none
    }

    .fullwidth {
        display: none !important
    }

    .responsive {
        display: block !important
    }

    .wtext p {
        background: #f1f1f1;
        color: var(--negro) !important;
        position: absolute;
        bottom: -20px;
        padding: 10px;
        right: 10px;
        font-size: 12px;
        border-radius: 20px 20px 0;
        box-shadow: rgba(0, 0, 0, .1) 0 10px 15px -3px, rgba(0, 0, 0, .05) 0 4px 6px -2px;
        line-height: normal;
        -webkit-animation: 1s cubic-bezier(.25, .46, .45, .94) 2s both slide-in-right;
        animation: .5s cubic-bezier(.25, .46, .45, .94) 2s both slide-in-right;
        width: 200px
    }

    .wtext .close {
        font-size: 1em;
        position: absolute;
        color: #000;
        border-radius: 100px;
        -webkit-animation: 1s cubic-bezier(.25, .46, .45, .94) 2s both slide-in-right;
        animation: 1s cubic-bezier(.25, .46, .45, .94) 2s both slide-in-right;
        background-color: #f1f1f1;
        bottom: 30px;
        right: 0;
        z-index: 999;
        padding: 1px;
        padding-right: 4px;
        padding-left: 4px;
        border: 1px solid #f1f1f1;
        line-height: 1
    }

    .wtext {
        display: none;
        transform: scale(0);
        right: 20px;
        bottom: 50px
    }

    .btn-whatsapp {
        display: none !important
    }

    .icono,
    .icono span,
    .icono:hover i {
        position: relative;
        transition: .5s
    }

    .icono {
        margin-top: 0;
        border-radius: 10px;
        background: transparent;
        box-shadow: none !important;
        border: 0px !important
    }

    .icono:hover {
        padding: 5px;
        border: 3px solid rgba(255, 255, 255, .5);
        transition: .5s;
        width: 50px;
        background: transparent
    }

    .icono span {
        font-size: .3em;
        padding-right: 5px;
        transform: scale(0);
        width: max-content
    }

    .icono i {
        position: absolute;
        z-index: 2;
        margin: 0;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #fff;
        transition: .5s;
        font-size: 1em
    }

    .icono:hover i {
        position: absolute;
        top: 55%;
        left: 40%;
        transform: translate(-50%, -55%)
    }

    .icono .notificacion {
        display: block;
        position: absolute;
        background: red;
        color: #fff;
        top: 5px;
        right: -10px;
        padding: 3px 7px;
        border-radius: 100px;
        text-align: center;
        line-height: 1.5
    }

    .social-bar {
        position: fixed;
        left: 0;
        bottom: 0;
        font-size: 2rem;
        display: inline-flex;
        flex-direction: row;
        align-items: center;
        z-index: 100;
        width: 100%;
        justify-content: space-around;
        flex-wrap: nowrap;
        background: #583a72;
        -webkit-animation: bounce-in-bottom 1.1s both;
        animation: bounce-in-bottom 1.1s both
    }

    @-webkit-keyframes bounce-in-bottom {
        0% {
            -webkit-transform: translateY(500px);
            transform: translateY(500px);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
            opacity: 0
        }

        38% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
            opacity: 1
        }

        55% {
            -webkit-transform: translateY(65px);
            transform: translateY(65px);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in
        }

        72% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out
        }

        81% {
            -webkit-transform: translateY(28px);
            transform: translateY(28px);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in
        }

        90% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out
        }

        95% {
            -webkit-transform: translateY(8px);
            transform: translateY(8px);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in
        }

        100% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out
        }
    }

    @keyframes bounce-in-bottom {
        0% {
            -webkit-transform: translateY(500px);
            transform: translateY(500px);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
            opacity: 0
        }

        38% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
            opacity: 1
        }

        55% {
            -webkit-transform: translateY(65px);
            transform: translateY(65px);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in
        }

        72% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out
        }

        81% {
            -webkit-transform: translateY(28px);
            transform: translateY(28px);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in
        }

        90% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out
        }

        95% {
            -webkit-transform: translateY(8px);
            transform: translateY(8px);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in
        }

        100% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out
        }
    }

    .whatsapp-cta2 {
        margin-bottom: 15px
    }

    .show {
        transform: scale(1) !important;
        transition: .5s ease !important
    }
}