/* spa page css  */

.solutions-page{
    overflow: hidden;
  }
  
  .p-69{
    width: 69%;
    height: 100%;
  }

  

  .head-medspa-card {
    width: 310px;
}

 
  .shots-card{
    background-image: url("../images/screenshot-background.png");
    background-size: contain;
    height: 450px;
    width: 450px;
    background-repeat: no-repeat;
    z-index: -1;
  }
  .shots-card-reminder img,.shots-card-app-forms img,.shots-card-dashboard img, .shots-card-marketing img,.shots-card-performance img,.shots-card-booking img,.shots-card-appointment img,.shots-card-integrations img,
  .shots-card-integrations img,.shots-card-customized img, .shots-card-employee img, .shots-card-billing img{
    width: 100%;
  }



  
  

  .explore-card a{
    color: #C82486;
    
  }

  @media (max-width:767px){

    .solutions-subhead{
      text-align: left;
    }

    .spa-headings h1{
      padding: 0px;
  
    }
  }
  
   /* salon page */

 .shots-card-support img{
    
    width: 100%;

   }

  @media (min-width:767px){
    
      
  .pr-0{
    padding-right: 0px!important;
  }
}

@media (max-width:321px){
    .shots-card{
        height: 270px;
    }
    .shots-card-reminder{
        position: absolute;
        width: 150px; 
      }

      .shots-card-integrations,.shots-card-customized, .shots-card-employee, .shots-card-billing{
        position: absolute;
        width:290px
    }

      .shots-card-appointment{
        position: absolute;
        width: 115px; 
      }

      .shots-card-app-forms{
        position: absolute;
        height: 215px;
    }

    .shots-card-performance{
        position: absolute;
        height: 170px;
    }

    .shots-card-dashboard{
        position: absolute;
        height: 170px;
    }

    .shots-card-marketing{
        position: absolute;
        height: 195px;
    }

    .shots-card-booking{
        position: absolute;
        height: 230px;
    }

    

    .shots-card-support{
        position: absolute;
          width: 112px;
       }

       .head-medspa-card {
        width: 231px!important;
    }
}

@media (min-width:321px) and (max-width:768px){

  .head-medspa-card {
    width: 231px!important;
}

    .shots-card{
    height: 350px;
    width: 350px;
    }

    .shots-card-reminder{
        position: absolute;
        width: 165px; 
      }

      .shots-card-integrations,.shots-card-customized, .shots-card-employee, .shots-card-billing{
        position: absolute;
        width:336px
    }

      .shots-card-appointment{
        position: absolute;
        width: 140px; 
      }

      .shots-card-app-forms{
        position: absolute;
        height: 215px;
    }

    .shots-card-performance{
        position: absolute;
        height: 225px;
    }

    .shots-card-dashboard{
        position: absolute;
        height: 200px;
    }

    .shots-card-marketing{
        position: absolute;
        height: 215px;
    }

    .shots-card-booking{
        position: absolute;
        height: 243px;
    }



    .shots-card-support{
        position: absolute;
          width: 145px;
       }
}

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

    .shots-card{
        height: 450px;
    }

    .shots-background-remainder{
        height: 370px;
      }
    
    .shots-card-reminder{
        position: absolute;
        width: 210px; 
      }

    .shots-card-integrations,.shots-card-customized, .shots-card-employee, .shots-card-billing{
        position: absolute;
        width:450px;
    }

      .shots-card-appointment{
        position: absolute;
        width: 180px; 
      }

      
  .shots-card-app-forms{
    position: absolute;
    width: 420px;
    
  }

  .shots-card-performance{
    position: absolute;
    height: 307px;
}

  .shots-card-dashboard{
    position: absolute;
    width: 437px;
    
    
  }



  .shots-card-marketing{
    position: absolute;
    width: 405px;
   
    
  }

  .shots-card-booking{
        position: absolute;
        height: 340px;
    }

  /* salon page */

 .shots-card-support{
  position: absolute;
    width: 166px;
 }


}
@media (min-width:767px) and (max-width:910px){

    .px-50{
        padding-left: 0px;
        padding-right: 0px;
    }
}

