7@import url('../../fonts.googleapis.com/css2%3Ffamily=Bubblegum+Sans&display=swap.css');
.main-container {
    float: left;
    width: 100%;
}

.text1 {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 18px;
    padding: 10px 0px;
    color: white;
    background: #fb1010;
}

.header {
    float: left;
    width: 100%;
    padding: 10px;

  
}
.header-left {
    float: left;
    width: 100%;
}
.header-left img{
    float: left;
    width: 100%;
  
}
.logo {
    float: left;
    width: 100%;
}
.logo img {
   float: left;
    width: 100%;
}
.header-right {
    float: left;
    width: 100%;
}
.header-right img{
    float: left;
    width: 100%;
  
}
.banner_container {
    float: left;
    width: 100%;
}
.banner_container img{
    float: left;
    width: 100%;
}
.banner3
{
        width: 100%;
        float: left;
}
.banner3 img
{
        width: 100%;
        float: left;
}


.copyrt {
width: 100%;

float: left;  
text-align: center;
font-size: 16px;

padding: 20px;
color: black;
background: white;
}

.last-row
{
float: left;
width: 100%;
}
.cal
{

bottom: 0px;
left: 10px;
position: fixed;
z-index: 1111;

}

.whatsaapp img {
    -webkit-animation: mover 0.5s infinite  alternate;
    animation: mover 0.5s infinite  alternate;
}
.cal img {
    -webkit-animation: mover 0.5s infinite  alternate;
    animation: mover 0.5s infinite  alternate;
}
@-webkit-keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}
@keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}

.whatsaapp
{

bottom: 0px;
right: 16px;
position: fixed;
z-index: 1111;

}
.services-icon {
    display: none;
}

.text4 {
    float: left;
    width: 100%;
    background-color: black;
    color: white;
    font-size: 25px;
    padding: 5px 0px;
    text-align: center;
}
.text3 {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 25px;
    padding: 10px 0px;
  
  
    animation: example 0.8s linear infinite;

}
.text3 a{
  
    color: black;
   

}
@keyframes example {
    from {background-color: rgb(150, 175, 155);}
    to {background-color: rgb(224, 140, 140);}
   
    
  }
  .about-astrologer {
    float: left;
    width: 100%;
    padding: 50px 0px;
    background-image: url(../images/abt-bg.jpg);
    background-size: cover;
}
.abt-header {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 45px;
    padding-bottom: 30px;
    color: black;
    font-family: 'Bubblegum Sans', cursive;
}
.abt-desc {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 20px;
    padding-bottom: 30px;
    color: black;
}
.about-astrologer img
{
float: left;
width: 100%;
}
.abt-call {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 25px;
    padding-top: 30px;
}
.abt-call a {
    color: white;
    background-color: black;
    padding: 10px 15px;
    border: 2px solid #fb1010;
}

.best-servvices {
    float: left;
    width: 100%;
    padding: 50px 0px;
    background-color: #070753;
}
.bes-header {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 45px;
    padding-bottom: 30px;
    color: white;
    font-family: 'Bubblegum Sans', cursive;
}
.best-border {
    float: left;
    width: 100%;
    border: 2px solid white;
    padding: 10px;
    border-radius: 30px 0px;
}
.best-img {
    float: left;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.best-img img{
    float: left;
    width: 100%;
    border-radius: 30px 0px;
   
}
.best-border:hover  .best-img img{
    animation: scale 5s linear infinite;
}
@keyframes scale {
    50% {
      -webkit-transform:scale(1.2);
      -moz-transform:scale(1.2);
      -ms-transform:scale(1.2);
      -o-transform:scale(1.2);
      transform:scale(1.2);
     
    }
  }
  .best-border:hover
  {
      
    box-shadow:3px 3px 5px 1px black;
  }
.best-title {
    float: left;
    width: 100%;
    text-align: center;
    padding: 10px 0px;
    font-size: 30px;
    color: white;
    font-family: 'Bubblegum Sans', cursive;
}
.best-call {
    float: left;
    width: 100%;
    text-align: center;
}
.best-call a {
    color: black;
    background: #fb1010;
    font-size: 18px;
    padding: 7px 12px;
    border: 2px solid black;
}
.best-border:hover .best-call a
{
   background: white;
   color: black; 
}
.why-us {
    float: left;
    width: 100%;
    padding: 50px 0px;
}
.why-header {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 35px;
    padding-bottom: 20px;
    color: black;
    font-family: 'Bubblegum Sans', cursive;
}
.why-desc {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 20px;
    color: black;
    padding-bottom: 30px;
}
ul.why-list {
    font-size: 20px;
    float: left;
    width: 100%;
    color: black;
}
i.fa.fa-arrow-circle-o-right {
    color: red;
}
li
  {
     list-style: none;
    
  }
  .why-img {
    float: left;
    width: 100%;
    padding: 30px 0px;
    
}
.why-img img{
    float: left;
    width: 75%;
    box-shadow:3px 3px 5px 1px #fd0000;
}
.call-section {
    float: left;
    width: 100%;
    padding: 10px 0px;
}
.call-left {
    float: right;
    font-size: 35px;
    color: black;
    font-family: math;
}
.call-right {
    float: left;
    font-size: 35px;
    color: black;
    font-family: math;
}
   li
  {
     list-style: none;
    
  }
  .call-left i
  {
    color: #fd0000;
    
  }
  .call-right i
  {
    color: #fd0000;
    
  }
  .call-right a 
  {
      color: black;
  }
  .call-left a
  {
      color: black;
  }
  .testimonials {
    float: left;
    width: 100%;
    padding: 50px 0px;
    background-color: black;
   
}
.testi-header {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 45px;
    padding-bottom: 30px;
    color: white;
    font-family: 'Bubblegum Sans', cursive;
}
.testi-border {
    float: left;
    width: 100%;
    background: #070753;
    padding: 20px 10px;
    position: relative;
}
.testi-desc {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 18px;
    color: white;
}
.testi-desc::after{
    content: "";
    width: 20px;
    height: 20px;
    background: inherit;
    border-style: none none solid solid;
    border-width: 0 0 1px 1px;
    border-color: inherit;
    position: absolute;
    bottom: -11px;
    left: 6%;
    -webkit-transform: skewY(-45deg);
    transform: skewY(-45deg);
    background: #070753;
    color: #070753;
}
.tesi-img {
    float: left;
    width: 100%;
    padding-top: 30px;
}
.tesi-img img {
    border-radius: 50%;
    float: left;
    width: 100%;
}
.testi-name span {
    float: left;
    width: 100%;
    color: white;
    font-size: 20px;
    padding-top: 55px;
}
.testi-name small {
    text-align: center;
    font-size: 15px;
    color: #070753;
}
.other-services {
    float: left;
    width: 100%;
    padding: 50px 0px;
    background-color: #070753;
}
.other-header {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 45px;
    padding-bottom: 30px;
    color: white;
    font-family: 'Bubblegum Sans', cursive;
}   
.other-border {
    float: left;
    width: 100%;
    border: 5px solid #966f46;
    padding: 20px;
    margin-bottom: 30px;
}
.other-img {
    float: left;
    width: 100%;
    position: relative;
    overflow: hidden;
  
}
.other-img img{
    float: left;
    width: 100%;
   
}


.other-border:hover  .other-img img{
    animation: scale 5s linear infinite;
}
@keyframes scale {
    50% {
      -webkit-transform:scale(1.2);
      -moz-transform:scale(1.2);
      -ms-transform:scale(1.2);
      -o-transform:scale(1.2);
      transform:scale(1.2);
     
    }
  }


.other-title {
    float: left;
    width: 100%;
    font-size: 25px;
    color: white;
    padding: 10px 0px;
    text-align: center;
}
.other-call {
    float: left;
    width: 100%;
    text-align: center;
    padding: 10px;
}
.other-call a {
    background-color: #fb1010;
    color: black;
    padding: 7px 12px;
    font-size: 18px;
    border: 2px solid white;
}
.other-border:hover .other-call a
{
    background-color: #d83612;
    color: white;
   
    border: 2px solid black; 
}
.footer {
    float: left;
    width: 100%;
    padding: 50px 0px;
    background-color: black;
}
.footer-header {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 45px;
    padding-bottom: 30px;
    color: white;
    font-family: 'Archivo', sans-serif;
    font-family: 'Bubblegum Sans', cursive;
}

ul.service-list {
    float: left;
    width: 100%;
    font-size: 20px;
    line-height: 35px;
    color: white;
}



/*services*/
.services-container {
    float: left;
    width: 100%;
    padding: 3%;
    text-align: center;
    background-color: #fff;
}
.service-title {
    float: left;
    width: 100%;
    color: #c71f43;
    font-size: 34px;
    position: relative;
    font-family: 'Paytone One', sans-serif;
    text-transform: uppercase;
}

.service-desc {
    float: left;
    width: 100%;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    padding: 25px;
    font-size: 16px;
    line-height: 25px;
    color: #4d4869;
    font-weight: 600;
    padding-top: 75px;
}
.services-titel1 {
    float: left;
    width: 100%;
    color: #c71f43;
    font-size: 18px;
    position: relative;
    font-family: 'Paytone One', sans-serif;
    text-transform: uppercase;
    text-align: center;
    padding-top: 16px;
}
.services_block_container {
    float: left;
    width: 100%;
}

.services_block {
    float: left;
    width: 100%;
    text-align: left;
    position: relative;
    margin-bottom: 30px;
    padding-bottom: 20px;
    transition: 0.5s;
    background-color: #fb1010;
    border: 5px solid #4d4869;
}

.services_image {
    float: left;
    width: 100%;
    position: relative;
}

.services_image img {
    float: left;
    width: 100%;
}

.services_title {
    float: left;
    width: 100%;
    font-size: 26px;
    padding: 15px 0px;
    color: #fff;
    padding-left: 10px;
    font-family: 'Bubblegum Sans', cursive;
}

.services_desc {
    float: left;
    width: 100%;
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    color: #fff;
    padding-left: 10px;
    padding-right: 10px;
}

.services_call {
    float: left;
    width: 100%;
    padding-top: 25px;
}

.services_call a {
    padding: 10px 30px;
    color: #c71f43;
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    font-size: 15px;
    letter-spacing: 1.5px;
    text-decoration: none;
    margin-left: 10px;
    background-color: #fff;
    animation: blinkingText1 1.2s infinite;
    border-radius: 20px;
}

@keyframes blinkingText1{
    0%{     color: #000;    }
    49%{    color: #000; }
    60%{    color: #c71f43 }
    99%{    color:#c71f43;  }
    100%{   color: #000;    }
}

.services_call a:hover {
    text-decoration: none;
    color: #8c0951;
}

.services-icon i {
    position: absolute;
    bottom: 168px;
    right: 23px;
    background-color: white;
    padding: 12px 10px 12px 15px;
    border-radius: 8px;
}

.services-icon i {
    color: #c71f43;
    font-size: 20px;
}
.service-title::before {
    content: url(../images/texture.png.html);
    position: absolute;
    bottom: -65px;
    left: calc(20%);
}
/*services*/


@media(min-width:320px) and (max-width:479px)
{
    .text1 {
        font-size: 16px;
    }
    .logo {
        display: none;
    }
    .text3 {
        font-size: 16px;
    }
    .text4 {
        font-size: 16px;
    }
    .abt-header {
        font-size: 35px;
    }
    .abt-desc {
        font-size: 18px;
    }
    .about-astrologer img {
       
        margin-bottom: 30px;
    }
    .abt-call {
        font-size: 18px;
    }
    .bes-header {
        font-size: 35px;
    }
    .best-border {
        margin-bottom: 30px;
    }
    .why-img img {
       
        margin: 0 auto;
        display: table;
        float: none;
    }
    .call-left {
        font-size: 17px;
    }
    .call-right {
        font-size: 17px;
    }
    .testi-header {
        font-size: 35px;
    }
    .tesi-img {
        width: 50%;
    }
    .tesi-img img {
       
        width: 57%;
    }
    .testi-name {
        float: left;
        width: 50%;
    }
    .testi-border {
        margin-top: 30px;
    }
    .other-header {
        font-size: 35px;
    }
    .other-title {
        font-size: 20px;
    }
    .other-call a {
      
        padding: 7px 10px;
        font-size: 16px;
     
    }
    .footer-header {
        font-size: 35px;
    }
    ul.service-list {
        
        font-size: 18px;
       
    }
}
@media(min-width:480px) and (max-width:639px)
{
    .text1 {
        font-size: 16px;
    }
    .logo {
        display: none;
    }
    .text3 {
        font-size: 16px;
    }
    .text4 {
        font-size: 16px;
    }
    .abt-header {
        font-size: 35px;
    }
    .abt-desc {
        font-size: 18px;
    }
    .about-astrologer img {
       
        margin-bottom: 30px;
    }
    .abt-call {
        font-size: 18px;
    }
    .bes-header {
        font-size: 35px;
    }
    .best-border {
        margin-bottom: 30px;
    }
    .why-img img {
       
        margin: 0 auto;
        display: table;
        float: none;
    }
    .call-left {
        font-size: 17px;
    }
    .call-right {
        font-size: 17px;
    }
    .testi-header {
        font-size: 35px;
    }
    .tesi-img {
        width: 50%;
    }
    .tesi-img img {
       
        width: 50%;
    }
    .testi-name {
        float: left;
        width: 50%;
    }
    .testi-border {
        margin-top: 30px;
    }
    .other-header {
        font-size: 35px;
    }
    .other-title {
        font-size: 20px;
    }
    .other-call a {
      
        padding: 7px 10px;
        font-size: 16px;
     
    }
    .footer-header {
        font-size: 35px;
    }
    ul.service-list {
        
        font-size: 18px;
       
    }
}
@media(min-width:640px) and (max-width:767px){
    
    .logo {
        display: none;
    }
   
   
    .abt-header {
        font-size: 35px;
    }
   
    .about-astrologer img {
       
        margin-bottom: 30px;
    }
   
    .bes-header {
        font-size: 35px;
    }
    .best-border {
        margin-bottom: 30px;
    }
    .why-img img {
       
        margin: 0 auto;
        display: table;
        float: none;
    }
   
    .testi-header {
        font-size: 35px;
    }
    .tesi-img {
        width: 50%;
    }
    .tesi-img img {
        width: 35%;
    }
    .testi-name {
        float: left;
        width: 50%;
    }
    .testi-border {
        margin-top: 30px;
    }
    .other-header {
        font-size: 35px;
    }
    
   
    .footer-header {
        font-size: 35px;
    }
   
}

@media(min-width:768px) and (max-width:991px){
    .best-servvices .col-sm-3
    {
        width: 50%;
    }
    .best-border {
        margin-bottom: 30px;
    }
    .why-us .col-sm-6
    {
        width: 100%;
    }
    .why-us img
    {
float: none;
margin: 0 auto;
display: table;
    }
    .testimonials .col-sm-4
    {
    width: 50%;
}
.testi-name span
{
    padding-top: 0px;
}
.testi-border {
    margin-top: 30px;
}
.testi-name {
    float: left;
    width: 100%;
    text-align: center;
    padding: 10px 0px;
}
.other-services .col-sm-3
{
    width: 50%;
}
.footer .col-sm-3
{
    width: 50%;
}
.service-list
{
    margin-bottom: 30px;
}
    

}
@media(min-width:992px) and (max-width:1200px){
    .footer .col-sm-3
{
    width: 50%;
  
}
.service-list
{
    margin-bottom: 30px;
}
}
@media(min-width:1201px) and (max-width:1650px){

}