/* Desktops and laptops ----------- */

@media only screen and (min-width : 1224px) {
    .fixedcall1 .phonenumber span {
        display: none;
    }

    .fixedwhatapp {
        position: fixed;
        width: 180px;
        height: 45px;
        margin: 0;
        padding: 0;
        bottom: 210px;
        right: -135px;
        z-index: 999;
        border-radius: 10px 0 0 10px;
        overflow: hidden;
        background: #fff;
        -webkit-transition: .4s;
        -moz-transition: .4s;
        -o-transition: .4s;
        transition: .4s;
    }

        .fixedwhatapp a {
            display: block;
            font-size: 14px;
            line-height: 16px;
            text-align: left;
            font-weight: 600;
            letter-spacing: .6px;
            text-decoration: none;
            color: #fff;
            margin: 0;
            padding: 0;
            -webkit-transition: .4s;
            -moz-transition: .4s;
            -o-transition: .4s;
            transition: .4s;
        }

            .fixedwhatapp a span {
                width: 45px;
                height: 45px;
                float: left;
                background: #4ac959;
                font-size: 25px;
                margin: 0 15px 0 0;
                text-align: center;
                line-height: 45px;
                color: #fff;
            }

            .fixedwhatapp a p {
                margin: 0;
                font-size: 12px;
                padding: 7px;
                color: #000;
            }

            .fixedwhatapp a svg {
                color: #fff;
                -webkit-animation: flipInY 1.25s infinite;
                -moz-animation: flipInY 1.25s infinite;
                -ms-animation: flipInY 1.25s infinite;
                animation: flipInY 1.25s infinite;
            }

        .fixedwhatapp:hover {
            right: 0;
        }
}

@media (max-width:900px) {
    .fixedcall1 .phonenumber span {
        position: fixed;
        width: 100%;
        height: 60px;
        padding: 0;
        bottom: 0px;
        border-radius: 3px;
        z-index: 999;
        background: #0b7b0b;
        font-size: 20px;
        font-family:"'Poppins', sans-serif" margin: 0 12px 0 0;
        text-align: center;
        line-height: 45px;
        color: #fff;
    }

        .fixedcall1 .phonenumber span i {
            color: #fff;
            margin-top: 15px;
            text-transform: uppercase;
            -webkit-animation: flipInY 3s infinite;
            -moz-animation: flipInY 3s infinite;
            -ms-animation: flipInY 3s infinite;
            animation: flipInY 3s infinite;
        }

    @-webkit-keyframes flipInY {
        from {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
            opacity: 0;
        }

        40% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
        }

        60% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            opacity: 1;
        }

        80% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        }

        to {
            -webkit-transform: perspective(400px);
            transform: perspective(400px);
        }
    }

    @keyframes flipInY {
        from {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
            opacity: 0;
        }

        40% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
        }

        60% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            opacity: 1;
        }

        80% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        }

        to {
            -webkit-transform: perspective(400px);
            transform: perspective(400px);
        }
    }

    .flipInY {
        -webkit-backface-visibility: visible !important;
        backface-visibility: visible !important;
        -webkit-animation-name: flipInY;
        animation-name: flipInY;
    }

    .fixedwhatapp {
        position: fixed;
        width: 180px;
        height: 45px;
        margin: 0;
        padding: 0;
        bottom: 210px;
        right: -135px;
        z-index: 999;
        border-radius: 10px 0 0 10px;
        overflow: hidden;
        background: #fff;
        -webkit-transition: .4s;
        -moz-transition: .4s;
        -o-transition: .4s;
        transition: .4s;
    }

        .fixedwhatapp a {
            display: block;
            font-size: 14px;
            line-height: 16px;
            text-align: left;
            font-weight: 600;
            letter-spacing: .6px;
            text-decoration: none;
            color: #fff;
            margin: 0;
            padding: 0;
            -webkit-transition: .4s;
            -moz-transition: .4s;
            -o-transition: .4s;
            transition: .4s;
        }

            .fixedwhatapp a span {
                width: 45px;
                height: 45px;
                float: left;
                background: #4ac959;
                font-size: 25px;
                margin: 0 15px 0 0;
                text-align: center;
                line-height: 45px;
                color: #fff;
            }

            .fixedwhatapp a p {
                margin: 0;
                font-size: 12px;
                padding: 7px;
                color: #000;
            }

            .fixedwhatapp a svg {
                color: #fff;
                -webkit-animation: flipInY 1.25s infinite;
                -moz-animation: flipInY 1.25s infinite;
                -ms-animation: flipInY 1.25s infinite;
                animation: flipInY 1.25s infinite;
            }

        .fixedwhatapp:hover {
            right: 0;
        }
}