@import url('https://fonts.googleapis.com/css2?family=Ramabhadra&display=swap');
/*@import url('https://fonts.googleapis.com');*/
* {
    margin: 0;
    padding: 0;
    font-family: 'Poppins', sans-serif;
}

.header {
    min-height: 100vh;
    width: 100%;
    background-image: url(images/banner.png);
    background-position: center;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

/*--3--*/

.nav {
    display: flex;
    padding: 2% 6%;
    justify-content: space-between;
    align-items: center;
}

/*---3/2--*/

.nav img {
    width: 135px;
}

/*--3/1--*/

.nav-links {
    flex: 1;
    text-align: right;
}

/*--3/2--*/

.nav-links ul li {
    list-style: none;
    display: inline-block;
    padding: 8px 12px;
    position: relative;
}

/*--3/2--*/

.nav-links ul li a {
    color: #ffffff;
    text-decoration: none;
    font-size: 13px;
}

/*--3/2--*/

.nav-links ul li::after {
    content: '';
    width: 0%;
    height: 2px;
    background: #f44336;
    display: block;
    margin: auto;
    transition: .5s;
}

/*--3/2--*/

.nav-links ul li:hover::after {
    width: 100%;
}

/*--3/2--*/



.well {
    position: relative;
    top: 330px;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 0
}

.well img {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 730px;
    height: 730px;
    transform: translate(-50%, -50%);
    z-index: -1;
    opacity: 0.4;
    animation: spin 15s linear infinite;
    /* Apply the spin animation */
}

/* CSS Keyframes for the rotation animation */
@keyframes spin {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

.bu {
    position: relative;
    top: 330px;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 0
}

.bu img {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 730px;
    height: 730px;
    transform: translate(-50%, -50%);
    z-index: 1;

}

.pd {
    position: relative;
    top: 700px;
    left: 0;
    right: 0;
    bottom: 0px;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.pd img {
    content: '';
    position: relative;
    left: 40%;
    top: 80%;
    padding-bottom: 50px;
    width: 500px;
    height: 40%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.text-box {
    width: 90%;
    color: #ffffff;
    position: absolute;
    top: 72%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

/*---3/3-1,2,--*/

.text-box h1 {
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 500;
    font-style: normal;
    font-size: 62px;
    text-shadow: 3px 3px rgb(63, 63, 63);
}

/*--3/3/1--*/

/*.text-box p{
    margin: 20px 0 40px;
    font-size: 14px;
    color: #fff;
}*/
/*--3/3/2--*/
.hero-btn {
    display: inline-block;
    text-decoration: none;
    color: #ffffff;
    border: 1px solid #ffffff;
    padding: 12px 34px;
    font-size: 16px;
    background: transparent;
    position: relative;
    cursor: pointer;
}
.hero-btn {
    
    left: 63px;
}

/*---3/3/3-BATAN--*/

.hero-btn:hover {
    border: 1px solid #f44336;
    background: #f44336;
    transition: 1s;
}

/*--DESCTOP LO VASTHUNA EXTRA MENU SIBALS NI KANIPENCHAKUNDA UNTAM KORAKU--*/
.nav .fa {
    display: none;
}

@media(max-width: 700px) {
.nav-links ul li {
        display: block;
}

    /*SMOLL SIG DISPLEYA/1,FONT SIG DESKREG--*/

.nav-links {
        position: fixed;
        /*--?ABOSLUTE,LLO UNTEYA SMAL SCRIN LLO SID MENO OPEN UOTHUNDI--*/
        background: #369ef4;
        height: 100vh;
        width: 200px;
        top: 0;
        right: -200px;
        text-align: left;
        z-index: 2;
        transition: 1s;
        /*JAVA SCRPUT THARVATHA E SENTENS WRAYALLI, THARVATHA SMAL SCRN NI OPEN CESI CHU STHE ONEN AND CLOS BATAN VARK CESTHUNDE--*/
}

.nav-links ul {
        padding: 30px;
}

.nav .fa {
        /*--OFF SID MENU--*/
        display: block;
        color: #ffffff;
        margin: 10px;
        font-size: 22px;
        cursor: pointer;
}
.well {
    position: relative;
    top: 200px;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 0
}

.well img {
        content: '';
        position: absolute;
        left: 50%;
        top: 30%;
        max-width: 99%;
        height: auto;
        transform: translate(-50%, -50%);
        z-index: -1;
        opacity: 0.4;
        animation: spin 15s linear infinite;
}
.bu {
    position: relative;
    top: 280px;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 0
}

.bu img {
        content: '';
        position: absolute;
        left: 50%;
        top: 45%;
        max-width: 100%;
        height: auto;
        transform: translate(-50%, -50%);
        z-index: 1
}

.pd {
    position: relative;
    top: 630px;
    left: 0;
    right: 0;
    bottom: 0px;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.pd img {
        content: '';
        position: absolute;
        left: 27%;
        top: 99%;
        padding-bottom: 50%;
        max-width: 100%;
        height: auto;
}

.text-box {
        width: 90%;
        color: #ffffff;
        position: absolute;
        top: 68%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
}

.text-box h1 {
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 38px;
    text-shadow: 3px 3px rgb(63, 63, 63);
}
.hero-btn {
    left: 63px;
}
}
/*---------Our Service--------*/

.Our-Service {
    width: 80%;
    margin: auto;
    text-align: center;
    padding-top: 50px;
}

/*---4,TEXT IS CENTER AND SPEAS IN THE TOP---*/

h1 {
    font-size: 36px;
    font-weight: 600;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
}

/*---4/1,SEE CHING THE FONT SIZE & WEIGHT--*/
p {
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    color: #777;
    font-size: 14px;
    line-height: 22px;
    padding: 10px;
}

/*---4/2,SEE CHING THE FONT SIZE & WEIGHT--*/

.row {
    margin-top: 5%;
    display: flex;
    justify-content: space-between;
}


/*--4/3,SE IT IS COM THREE COLOMS--*/

.Our-Service-col {
    flex-basis: 31%;
    background: #fff3f3;
    border-radius: 10px;
    margin-bottom: 5%;
    padding: 20px 12px;
    box-sizing: border-box;
    transition: 0.5s;
}

/*--4/3,1,SE IT IS BOX OF B.G COLAR--*/

.Our-Service-col img {
    width: 100%;
    border-radius: 10px;
}

h3 {
    margin: 10px 0;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    text-align: center;
    
}

h5 {
    font-family: "Ramabhadra", sans-serif;
    font-style: normal;
    font-size: 20px;
    font-weight: 500;
    line-height: 22px;
    padding: 10px;
    text-align: left;
}

h5 a {
    color: #0aec4e;
}

/*--4/3,2,SE THE H3 IS BOX CENTER --*/

.Our-Service-col:hover {
    box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.2);
}

/*--4/3,1,SE THE BOX MOU CARSAR COM SHADOS--*/

@media(max-width: 700px) {
    .row {
        flex-direction: column;
    }

    /*--IT IS SMAL SCRE DIREKSHAN*/
}

/*----facilities------*/

.facilities {
    width: 80%;
    margin: auto;
    text-align: center;
    padding-top: 50px;
}

/*---6,TEXT IS CENTER AND SPEAS IN THE TOP--*/
.facilities-col {
    flex-basis: 31%;
    border-radius: 10px;
    margin-bottom: 5%;
    text-align: left;
}

/*--6/4,1,acilities-col IS 3 HAREJANTALS WITH SPES---*/
.facilities-col img {
    width: 100%;
    border-radius: 10px;
}

/*--6/4,2,facilities-col img'S SIG REGUS ---*/
.facilities-col p {
    padding: 0;
}

/*--6/4,4,facilities-col P ---*/
.facilities-col h3 {
    margin-top: 16px;
    margin-bottom: 15px;
    text-align: left;
}

/*--6/4,3,facilities-col H3 ---*/

/*----facilities2------*/

.facilities2 {
    width: 80%;
    margin: auto;
    text-align: center;
    padding-top: 10px;
}

/*---6,TEXT IS CENTER AND SPEAS IN THE TOP--*/
.facilities-col {
    flex-basis: 31%;
    border-radius: 10px;
    margin-bottom: 5%;
    text-align: left;
}

/*--6/4,1,acilities-col IS 3 HAREJANTALS WITH SPES---*/
.facilities-col img {
    width: 100%;
    border-radius: 10px;
}

/*--6/4,2,facilities-col img'S SIG REGUS ---*/
.facilities-col p {
    padding: 0;
}

/*--6/4,4,facilities-col P ---*/
.facilities-col h3 {
    margin-top: 16px;
    margin-bottom: 15px;
    text-align: left;
}

/*--6/4,3,facilities-col H3 ---*/
/*----facilities3------*/

.facilities3 {
    width: 80%;
    margin: auto;
    text-align: center;
    padding-top: 10px;
}

/*---6,TEXT IS CENTER AND SPEAS IN THE TOP--*/
.facilities-col {
    flex-basis: 31%;
    border-radius: 10px;
    margin-bottom: 5%;
    text-align: left;
}

/*--6/4,1,acilities-col IS 3 HAREJANTALS WITH SPES---*/
.facilities-col img {
    width: 100%;
    border-radius: 10px;
}

/*--6/4,2,facilities-col img'S SIG REGUS ---*/
.facilities-col p {
    padding: 0;
}

/*--6/4,4,facilities-col P ---*/
.facilities-col h3 {
    margin-top: 16px;
    margin-bottom: 15px;
    text-align: left;
}

/*--6/4,3,facilities-col H3 ---*/

/*----------campus------------*/

.campus {
    width: 80%;
    margin: auto;
    text-align: center;
    padding-top: 50px;
}

/*---5,-TEXT IS CENTER AND SPEAS IN THE TOP---*/
.campus-col {
    flex-basis: 32%;
    border-radius: 10px;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}

/*---5/4, COLAM IS LEFT IMG---*/
.campus-col img {
    width: 100%;
    display: block;
}

/*---5/5---*/
.layer {
    background: transparent;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transition: 0.5s;
}

.layer:hover {
    background: rgba(226, 0, 0, 0.7);
}

/*---5/6,SE THE P MOU CARSAR IN P CHING TRANSPARENT COL---*/
.layer h3 {
    width: 100%;
    font-weight: 500;
    color: #fff;
    font-size: 26px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    opacity: 0;
    transition: 05s;
}

/*--5/7,H3 NAME'S IS IMGE BOTM---*/
.layer:hover h3 {
    bottom: 49%;
    opacity: 1;
}

/*--5/7, SE CARSAR MO IMGE H3 NAME IS SCROL IMGE BOTM TO OUP---*/

/*----------testimonials-------*/

.testimonials {
    width: 80%;
    margin: auto;
    padding-top: 100px;
    text-align: center;
}

/*---7,TEXT IS CENTER AND SPEAS IN THE TOP---*/
.testimonial-col {
    flex-basis: 44%;
    border-radius: 10px;
    margin-bottom: 5%;
    text-align: left;
    background: #fff3f3;
    padding: 25px;
    cursor: pointer;
    display: flex;
}

/*---7/4, ---*/
.testimonial-col img {
    height: 40px;
    margin-left: 5px;
    margin-right: 30px;
    border-radius: 50%;
}

/*---7/5, THE IMGE'S IS A LOGO SIG---*/
.testimonial-col p {
    padding: 0;
}

/*---7/6,1---*/
.testimonial-col h3 {
    margin-top: 15px;
    text-align: left;
}

/*---7/6,2---*/
.testimonial-col .fa {
    color: #f44336;
}
.testimonials a{
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 25px;
    color: darkgreen;
    text-decoration: none;
}


/*---7/6,3, STAR I CONS COLORS CHAING---*/
@media(max-width: 700px) {
    .testimonial-col img {
        margin-left: 0px;
        /*?0PX*/
        margin-right: 15px;
    }
}

/*-----call to action-------*/

.cta {
    margin: 100px auto;
    width: 80%;
    background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/banner2-kesavan-best-astrologer-in-India.png);
    background-position: center;
    background-size: cover;
    border-radius: 10px;
    text-align: center;
    padding: 100px 0;
}

/*--8, WB CENTER IMG CANTENT---*/

.cta h1 {
    color: #fff;
    margin-bottom: 40px;
    padding: 0;
}

/*--8/1---*/

@media(max-width: 700px) {
    .cta h1 {
        font-size: 24px;
    }
}

/*------------footer---------------*/

.footer {
    width: 100%;
    text-align: center;
    padding: 30px 0;
}

/*---9--*/

.footer h4 {
    margin-bottom: 25px;
    margin-top: 20px;
    font-weight: 600;
}

/*---9/1--*/
.icons .fa {
    color: #f44336;
    margin: 0 13px;
    cursor: pointer;
    padding: 18px 0;
}

/*---9/3--*/
.fa-hearto-o {
    color: #f44336;
}

/*---9/3, CH CO--*/
/*------clous hompage----------*/


/*------about us 2cnd page ----------*/

.sub-header{
    height: 50vh;
    width: 100%;
    background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/background.jpg);
    background-position: center;
    background-size: cover;
    text-align: center;
    color: #fff;
}
.sub-header h1{
    margin-top: 100px;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 48px; 

}

.about-us{
    width: 80%;
    margin: auto;
    padding-top: 80px;
    padding-bottom: 50px;
}
.about-col{
    flex-basis: 48%;
    padding: 30px 2px;
}
.about-col  img{
    width: 100%;
    height: 1080px;
}
.about-col h1{
    padding-top: 0;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 32px;
    color: darkgoldenrod;
}
.about-col h3{
    padding-top: 0;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 32px;
    color: darkgoldenrod;
}
.about-col p{
    padding: 15px 0 25px;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 21px;
    text-align: justify;
    line-height: inherit;  
    color: #777;
}

.red-btn{
    border: 1px solid #f44336;
    background: transparent;
    color: #f44336;
}

.red-btn:hover{
    color: #fff;
}

@media(max-width: 700px){
   
.sub-header h1{
    margin-top: 100px;
    width: 100%;
    height: auto;
}

.about-us{
    width: 80%;
    margin: auto;
    padding-top: 80px;
    padding-bottom: 50px;
}
.about-col{
    flex-basis: 48%;
    padding: 30px 2px;
}
   .about-col  img{
    width: 100%;
    height: auto;
} 
}

/*------about us 2cnd page  clous----------*/


/*-----------contact us5------------*/
.sub-header-c{
     height: 50vh;
    width: 100%;
    background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/background.jpg);
    background-position: center;
    background-size: cover;
    text-align: center;
    color: #fff;
}
.sub-header-c h1{
    margin-top: 100px;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 48px; 
}

.location{
    width: 80%;
    margin: auto;
    padding: 80px 0;
}
.location iframe{
    width: 100%;
}

.contact-us{
    width: 80%;
    margin: auto;
}
.contact-col{
    flex-basis: 48%;
    margin-bottom: 30px;
}

.contact-col div{
    display: flex;
    align-items: center;
    margin-bottom: 40px;
}

.contact-col div .fa{
    font-size: 28px;
    color: #f44336;
    margin: 10px;
    margin-right: 30px;
}
    
.contact-col div p{
    padding: 0;
    font-family: "Ramabhadra", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 18px;
    text-align: left;
    color: #777;
}
.contact-col div h5{
    margin-bottom: 5px;
    font-family: "Ramabhadra", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 23px;
    color: #777;
    
}
.contact-col input, .contact-col textarea{
    width: 100%;
    padding: 15px;
    margin-bottom: 17px;
    outline: none;
    border: 1px solid #ccc;
    box-sizing: border-box;
}

.footer-link{
    text-decoration: none;
    color: #777;
}


@media (max-width:700px){
    .contact-col div h5{
        font-size: 18px;
    }
    .contact-col input, .contact-col textarea{
        width: 97%;
    }
} 

/*-----------contact us clous------------*/

/*----------- zodic-services ------------*/
.sub-header-d{
     height: 50vh;
    width: 100%;
    background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/background.jpg);
    background-position: center;
    background-size: cover;
    text-align: center;
    color: #ffffff;
}
.sub-header-d h1{
    margin-top: 100px;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 48px;
}




/*----------- zodic-services clous ------------*/

/*---------- Numerology --------*/
.sub-header-numerology{
    height: 50vh;
    width: 100%;
    background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/numaralji\ banner.png);
    background-position: center;
    background-size: cover;
    text-align: center;
    color: #fff;
}
.sub-header-numerology h1{
    margin-top: 50px;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 48px;

}
.numerology{
    width: 80%;
    margin: auto;
    padding-top: 80px;
    padding-bottom: 50px;
}
.numerology-col{
    flex-basis: 48%;
    padding: 30px 2px;
}
.numerology-col img{
    width: 100%;
    height: 1080px;
    
}
.numerology-col h1{
    padding-top: 0px;
    font-family: Ramabhadra, sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 40px;
    text-align: left;
    color: darkgreen;
}

.numerology-col p{
    padding: 15px 0 25px; 
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 21px;
    text-align: justify;
    line-height: inherit;  
    color: #777;

}
.numerology-col h3{
    padding: 0;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 32px;
    text-align: left;
    color: #999;
}

.red-btn{
    border: 1px solid #f44336;
    background: transparent;
    color: #f44336;
}

.red-btn:hover{
    color: #fff;
}

@media(max-width: 700px){
.sub-header-numerology{
    height: 50vh;
    width: 100%;
    background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/numaralji\ banner.png);
    background-position: center;
    background-size: cover;
    text-align: center;
    color: #fff;
}
.sub-header-numerology h1{
    margin-top: 72px;
    width: 100%;
    height: auto;
    font-family: Ramabhadra, sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 25px;
    line-height: inherit;
}    
.numerology-col{
    width: 100%;
    flex-basis: 48%;
    padding: 5px 2px;
}
.numerology{
    width: 80%;
    margin: auto;
    padding-top: 80px;
    padding-bottom: 50px;
}
.numerology-col h1{
    font-size: 30px;
} 
.numerology-col img{
    width: 100%;
    height: 250px;  
}
.numerology-col p{
    padding: 15px 0 25px; 
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    text-align: justify;
    line-height: inherit;  
    color: #777;
}
.numerology-col h3{
    padding: 0;
    font-family: "Ramabhadra", sans-serif; 
    font-weight: 400;
    font-style: normal;
    font-size: 25px;
    text-align: left;
    color: #999;

}


/*---------- Numerology Clous--------*/

/*------------------------------whatsapp-sticky-----------------------------------------------*/

.whatsapp-sticky{ 
    position: fixed; 
    right: 30px; 
    bottom: 80px;
    z-index: 99;
    width: 64px; 
    height: 64px; 
    display: block;
    background: url(images/whatsapp-icon.png) center no-repeat;}

/*------------------------------.mobile_footer-----------------------------------------------*/


.mobile_footer {    position: fixed;    left: 0;    bottom: 0;    width: 100%;    z-index: 99;    box-shadow: 0 -5px 3px #0000001A;    -webkit-box-shadow: 0 -5px 3px #0000001A;    padding: 12px 0;    display: flex;    flex-wrap: wrap;    background-color: #fff;}
.mobile_footer .container {    display: flex;    justify-content: space-around;    align-items: center;    padding: 0 15px;}
.mobile_footer .head_phone {    display: block;  border: #43988B solid 2px; background-color: #E9FFFB;    box-shadow: 0 0 5px #2765CF80;    -webkit-box-shadow: 0 0 5px #2765CF80;    padding: 0 6px 0 55px;    position: relative;    font-size: 16px;    color: #000000;    border-radius: 2px;    -webkit-border-radius: 2px;    width: 48%;    margin: 0 1%;    height: 50px;    line-height: 1.2;    display: flex;    align-items: center;    justify-content: center; flex-wrap: wrap;}  
.mobile_footer .btn {    border-radius: 2px;    -webkit-border-radius: 2px;    box-shadow: 0 0 5px #2765CF80;    -webkit-box-shadow: 0 0 5px #2765CF80;    font-size: 16px;    padding: 0;    width: 48%;    margin: 0 1%;    height: 50px;    display: block;    line-height: 1.2;    display: flex;    align-items: center;    justify-content: center; background: #423993;}
.mobile_footer  .head_phone::before {    content: '';    display: inline-block;    vertical-align: middle;    width: 50px;    height: 100%;    background: #439C8B;    position: absolute;    left: 0;    top: 0;}
.mobile_footer .head_phone i {    position: absolute;    left: 14px;    color: #fff;    font-size: 28px;}
@media (max-width:1023px) {
#Contact {    padding: 0 0 81px;}
}

@media (min-width:1024px) {
.mobile_ring, .mobile_footer { display: none; }
}
.mobile_ring {    position: fixed;    bottom: 18%;    left: -27px;    z-index: 1000;    transform: scale(0.7);}
.btn_top { color: #333; text-decoration: none !important;  text-transform: uppercase; cursor: pointer; color: #000000;}
.right_call {    position: absolute;    top: -43px;    left: -34px;    transform: scale(0.7);}
.btn_top:hover .phonering-alo-phone.phonering-alo-green .phonering-alo-ph-img-circle{    background-color: #75eb50;}

.btn_top {    position: relative;}




/********New Css ***************/

.mobile_footer #phonering-alo-phoneIcon {	position: absolute;	bottom: 14px;	left: -25px;	transform: scale(0.7);	z-index: 1;	height: 110px;}
.whatsapp-fix .fa.fa-whatsapp {	position: fixed;	z-index: 1000000000;	width: 60px;	height: 60px;	background: #428a21;	right: 20px;	font-size: 45px;	color: #fff;	border-radius: 100%;	padding: 6px 6px 6px 11px;	box-shadow: 1px 1px 9px rgba(0,0,0,.5);	bottom: 88px;}




/***********/


.quick-alo-phone {

    position: fixed;
    background-color: 

    transparent;
    width: 82px;
    height: 64px;
    left: 0;
    top: 65%;
    cursor: pointer;
    z-index: 200000 !important;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transition: visibility .5s;

}
.quick-alo-phone .quick-alo-green .quick-alo-ph-circle {
    border-color:#00A1FF;; 
    opacity: 0.5;
}
.quick-alo-ph-circle {  
    position: absolute; 
    width: 160px;  
    height: 160px; 
    top: 50px;   
    left: 50px;   
    border: 2px solid #00A1FF;
    background-color: transparent;
    border-radius: 100%; 
    opacity: .1;   
    animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    transition: all .5s;   
    transform-origin: 50% 50%;
}
.quick-alo-phone .quick-alo-green .quick-alo-ph-circle-fill {
    background-color: rgb(246, 202, 98); 
    opacity: .75 !important;
}
.quick-alo-ph-circle-fill { 
    position: absolute;   
    width: 100px;   
    height: 100px;  
    top: 80px;   
    left: 80px;   
    background-color: rgba(0, 161, 255, 0.5); 
    border-radius: 100%;   
    border: 2px solid transparent;  
    opacity: .1;   
    animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
    transition: all .5s;   
    transform-origin: 50% 50%;
}
.quick-alo-phone.quick-alo-green .quick-alo-ph-img-circle { 
    background-color: #00A1FF; 
}
.quick-alo-ph-img-circle { 
    position: absolute;   
    width: 60px;    
    height: 60px;  
    top: 100px;
    left: 100px;   
    background:#00A1FF 
        url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABrklEQVRYR82XjTEEQRCFX0dABlwEiAARkAEyIAJEoERACETARUAIJwIyeOqptfbm5qeP3lpTdVVXVzPd3/R0v+4zTLxsYv/4XwAkrwDsV6JyZmaLyKj1ESB5AOCpYfzazAQZttYFuDWz8zDvwE8OkNwF8NIwvjCz2SgAMkqSDuOzyDxYqgKSrwB2GhBKxHsHqGtLCiDDJ42Tj2Z27LLu2JQCnAK4a5x7M7Nth23XlhRgE8B74+SemempQtaKEpKsPUPo++sGOYCSIIU7zwJ05ficSLLkV6H/CIn7wEi2GRVkOVwFixEoREE/hz9DsR2TVKkp2zeSsI9bBUNnJNV4bhIA5cFhVCk2B5JCWVYhSEopjwAob6qa4QGQOKkqcj1iJSdIpmoqWEHIhr7Ph1BNgC4haxAPAC7UITPOc1UrCOXR12TlAnBAyKhAdHvPUg4pIn6AAYQc1ebG8QC+LXfD66XHU2HP7yKQlKhGODWu1gCTY/g7wCAaendNyltrRCQOIAERjCc/ejV1V4H3dp2ES4jU1vVJpXxpogoHSEE7oOEIp9G+/3c1OkArcpMDfAIqL6EhVS6JOAAAAABJRU5ErkJggg==") no-repeat center center;
    border-radius: 100%;    border: 2px solid transparent;    opacity: .99;    animation: quick-alo-circle-img-anim 1s infinite ease-in-out;    transform-origin: 50% 50%;}
.quick-alo-phone .quick-alo-green .quick-alo-hover .quick-alo-ph-img-circle,.quick-alo-phone.quick-alo-green:hover .quick-alo-ph-img-circle {    background-color: #ff0101;}
@-moz-keyframes quick-alo-circle-anim {
    0% {        -moz-transform: rotate(0) scale(.5) skew(1deg);        opacity: .1;        -moz-opacity: .1;        -webkit-opacity: .1;        -o-opacity: .1    }
    30% {        -moz-transform: rotate(0) scale(.7) skew(1deg);        opacity: .5;        -moz-opacity: .5;        -webkit-opacity: .5;        -o-opacity: .5    }
    100% {        -moz-transform: rotate(0) scale(1) skew(1deg);        opacity: .6;        -moz-opacity: .6;        -webkit-opacity: .6;        -o-opacity: .1
    }
}
@-webkit-keyframes quick-alo-circle-anim {
    0% {        -webkit-transform: rotate(0) scale(.5) skew(1deg);        -webkit-opacity: .1    }
    30% {        -webkit-transform: rotate(0) scale(.7) skew(1deg);        -webkit-opacity: .5    }
    100% {        -webkit-transform: rotate(0) scale(1) skew(1deg);        -webkit-opacity: .1    }
}
@-o-keyframes quick-alo-circle-anim {
    0% {        -o-transform: rotate(0) kscale(.5) skew(1deg);        -o-opacity: .1    }
    30% {        -o-transform: rotate(0) scale(.7) skew(1deg);        -o-opacity: .5    }
    100% {        -o-transform: rotate(0) scale(1) skew(1deg);        -o-opacity: .1    }
}
@-moz-keyframes quick-alo-circle-fill-anim {
    0% {        -moz-transform: rotate(0) scale(.7) skew(1deg);        opacity: .2    }
    50% {        -moz-transform: rotate(0) -moz-scale(1) skew(1deg);        opacity: .2    }
    100% {        -moz-transform: rotate(0) scale(.7) skew(1deg);        opacity: .2    }
}
@-webkit-keyframes quick-alo-circle-fill-anim {
    0% {        -webkit-transform: rotate(0) scale(.7) skew(1deg);        opacity: .2    }
    50% {        -webkit-transform: rotate(0) scale(1) skew(1deg);        opacity: .2    }
    100% {        -webkit-transform: rotate(0) scale(.7) skew(1deg);        opacity: .2    }
}
@-o-keyframes quick-alo-circle-fill-anim {
    0% {        -o-transform: rotate(0) scale(.7) skew(1deg);        opacity: .2    }
    50% {        -o-transform: rotate(0) scale(1) skew(1deg);        opacity: .2    }
    100% {        -o-transform: rotate(0) scale(.7) skew(1deg);        opacity: .2    }
}
@-moz-keyframes quick-alo-circle-img-anim {
    0% {        transform: rotate(0) scale(1) skew(1deg)    }
    10% {        -moz-transform: rotate(-25deg) scale(1) skew(1deg)    }
    20% {        -moz-transform: rotate(25deg) scale(1) skew(1deg)    }
    30% {        -moz-transform: rotate(-25deg) scale(1) skew(1deg)    }
    40% {        -moz-transform: rotate(25deg) scale(1) skew(1deg)    }
    50% {        -moz-transform: rotate(0) scale(1) skew(1deg)    }
    100% {        -moz-transform: rotate(0) scale(1) skew(1deg)    }
}
@-webkit-keyframes quick-alo-circle-img-anim {
    0% {        -webkit-transform: rotate(0) scale(1) skew(1deg)    }
    10% {        -webkit-transform: rotate(-25deg) scale(1) skew(1deg)    }
    20% {        -webkit-transform: rotate(25deg) scale(1) skew(1deg)    }
    30% {        -webkit-transform: rotate(-25deg) scale(1) skew(1deg)    }
    40% {        -webkit-transform: rotate(25deg) scale(1) skew(1deg)    }
    50% {        -webkit-transform: rotate(0) scale(1) skew(1deg)    }
    100% {        -webkit-transform: rotate(0) scale(1) skew(1deg)    }
}
@-o-keyframes quick-alo-circle-img-anim {
    0% {        -o-transform: rotate(0) scale(1) skew(1deg)    }
    10% {        -o-transform: rotate(-25deg) scale(1) skew(1deg)    }
    20% {        -o-transform: rotate(25deg) scale(1) skew(1deg)    }
    30% {        -o-transform: rotate(-25deg) scale(1) skew(1deg)    }
    40% {        -o-transform: rotate(25deg) scale(1) skew(1deg)    }
    50% {       -o-transform: rotate(0) scale(1) skew(1deg)    }
    100% {        -o-transform: rotate(0) scale(1) skew(1deg)    }
}
@-moz-keyframes fadeInRight {
    0% {        opacity: 0;        -webkit-transform: translate3d(100%, 0, 0);        -ms-transform: translate3d(100%, 0, 0);        transform: translate3d(100%, 0, 0)    }
    100% {        opacity: 1;        -webkit-transform: none;        -ms-transform: none;        transform: none    }
}
@-webkit-keyframes fadeInRight {
    0% {        opacity: 0;        -webkit-transform: translate3d(100%, 0, 0);        -ms-transform: translate3d(100%, 0, 0);        transform: translate3d(100%, 0, 0)    }
    100% {        opacity: 1;        -webkit-transform: none;        -ms-transform: none;        transform: none    }
}
@-o-keyframes fadeInRight {
    0% {        opacity: 0;        -webkit-transform: translate3d(100%, 0, 0);        -ms-transform: translate3d(100%, 0, 0);        transform: translate3d(100%, 0, 0)    }
    100% {        opacity: 1;        -webkit-transform: none;        -ms-transform: none;        transform: none    }
}




@media(max-width:767px) {
.phone.quick-alo-phone {    transform: scale(0.66);    top: 68%;    left: -58px;}
}


