@charset "UTF-8";
/*
Theme Name: TSS INDIA
Theme URI: 
Author: TSS WordPress team
Author URI: 
Description: Our 2019 default theme is designed to show off the power of the block editor. It features custom styles for all the default blocks, and is built so that what you see in the editor looks like what you'll see on your website. Twenty Nineteen is designed to be adaptable to a wide range of websites, whether you’re running a photo blog, launching a new business, or supporting a non-profit. Featuring ample whitespace and modern sans-serif headlines paired with classic serif body text, it's built to be beautiful on all screen sizes.
Tested up to: 6.5
Requires at least: 4.7
Requires PHP: 5.2.4
Version: 2.8
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentynineteen
Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, rtl-language-support, sticky-post, threaded-comments, translation-ready, block-patterns

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Twenty Nineteen is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/

Bundled block pattern images:
Abstract Background by HD Wallpapers, CC0. https://stocksnap.io/photo/abstract-background-0SRRVNMKBX
Abstract Waves by HD Wallpapers, CC0. https://stocksnap.io/photo/abstract-waves-0KREGLTZQ3
Abstract Bokeh by HD Wallpapers, CC0. https://stocksnap.io/photo/abstract-bokeh-P4KVZBMQ6L
Colorful Bokeh by HD Wallpapers, CC0. https://stocksnap.io/photo/colorful-bokeh-VN4G84GL8H
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Variables
# Normalize
# Typography
	## Headings
	## Copy
# Elements
	## Lists
	## Tables
# Forms
	## Buttons
	## Fields
# Navigation
	## Links
	## Menus
	## Next & Previous
# Accessibility
# Alignments
# Clearings
# Layout
# Widgets
# Content
	## Archives
	## Posts and pages
	## Comments
# Blocks
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/
/*
 * Chrome renders extra-wide   characters for the Hoefler Text font.
 * This results in a jumping cursor when typing in both the Classic and block
 * editors. The following font-face override fixes the issue by manually inserting
 * a custom font that includes just a Hoefler Text space replacement for that
 * character instead.
 */




/** Created by Avnish Maurya **/
/** Custom CSS to Mega Menu > Menu Themes > Custom Styling **/

@import url('https://fonts.googleapis.com/css2?family=Helvetica+Neue&display=swap');

:root {
  --color-white:  #ffffff;
  --color-black: #000000;
  --color-light-black:#333333;
  --color-yellow: #f9c2a0;
  --color-pink: #e98693;
  --color-gray: #cccccc;
  --color-red:#dd242b;
 --color-white-smoke: #f8f8f8;
 --linear-grad: linear-gradient(to right, #ec8593, #ec8593);
 --grad-pink1: #ec8593;
 --grad-pink2: #ec8593;
 --color-dark-yellow:#f9c2a0;
 --color-dark-pink:#d26d7a;
 --color-alice-blue:#eef4f7;
 --color-brick-red:#cb4154;
 --linear-bg-pigmentation: radial-gradient(circle at center, #dfc9b8, #c39674);
 --linear-bg-acne: radial-gradient(circle at center, #fff, #9d9d42);
 --linear-bg-ageing: radial-gradient(circle at center, #fff, #6f5753);  ;
 --linear-bg-dehydration : radial-gradient(circle at center, #fff, #6d55a3);   ;
 --linear-bg-sensitive  : radial-gradient(circle at center, #fff, #e92f3d);  ;
}


/* Define CSS variables */
@font-face {
  font-family: Futura;
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("../tssindia/assets/fonts/futura/futura_n4.df36ce3d9db534a4d7947f4aa825495ed740e410.woff2") format("woff2"),
    url("../tssindia/assets/fonts/futura/futura_n4.df36ce3d9db534a4d7947f4aa825495ed740e410.woff2") format("woff");
}


@font-face {
  font-family: Futura;
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url("../tssindia/assets/fonts/futura/futura_n6.bbe2e25d5b96d13ff36b242171a3d07cf5a60170.woff2") format("woff2"),
    url("../tssindia/assets/fonts/futura/futura_n6.bbe2e25d5b96d13ff36b242171a3d07cf5a60170.woff2") format("woff");
}

@font-face {
  font-family: Futura;
  font-weight: 400;
  font-style: oblique;
  font-display: swap;
  src: url("../tssindia/assets/fonts/futura/futura_o4.9747e2e6ed2f11b894984527c927b42234e48815.woff2") format("woff2"),
    url("../tssindia/assets/fonts/futura/futura_o4.9747e2e6ed2f11b894984527c927b42234e48815.woff2") format("woff");
}

@font-face {
  font-family: Futura;
  font-weight: 600;
  font-style: oblique;
  font-display: swap;
  src: url("../tssindia/assets/fonts/futura/futura_n6.bbe2e25d5b96d13ff36b242171a3d07cf5a60170.woff2") format("woff2"),
    url("../tssindia/assets/fonts/futura/futura_n6.bbe2e25d5b96d13ff36b242171a3d07cf5a60170.woff2") format("woff");
}

@font-face {
  font-family: 'Times New Roman';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url("../tssindia/assets/fonts/timeroman/tiemann_n4.5b52e2bce962763887021fba63a434499fd58ec1.woff2") format("woff2"),
    url("../tssindia/assets/fonts/timeroman/tiemann_n4.5b52e2bce962763887021fba63a434499fd58ec1.woff2") format("woff");
}

@font-face {
  font-family: 'Times New Roman';
  font-weight: 600;
  font-style: oblique;
  font-display: swap;
  src: url("../tssindia/assets/fonts/timeroman/tiemann_n4.5b52e2bce962763887021fba63a434499fd58ec1.woff2") format("woff2"),
    url("../tssindia/assets/fonts/timeroman/tiemann_n4.5b52e2bce962763887021fba63a434499fd58ec1.woff2") format("woff");
}
@font-face {
  font-family: 'typo';
  font-weight: 600;
  font-style: oblique;
  font-display: swap;
  src: url("../fonts/typo-font/TypoGroteskRounded-rpqO.ttf") format("woff2"),
    url("../fonts/typo-font/TypoGroteskRounded-rpqO.ttf") format("woff");
}
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');


*,
::after,
::before {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

html {
  font-family: Futura;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent
}

article,
aside,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
  display: block
}

body {
  margin: 0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.6;
  text-align: left;
  background-color: var(--color-white);
  font-family: Futura;

}

article,
aside,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
  display: block
}


ul {
  list-style: none
}

a {
  color: var(--color-black);
  text-decoration: none;
  background-color: transparent;
  font-family: 'Futura';
  outline: 0;
}

img {
  max-width: 100%;
  width: auto;
  height: auto;
}

.relative {
  position: relative;
}

.spacer {
  height: 65px;
}
.spacer-half{
 height: 32.5px
}
@media (max-width: 1200px) {
  .spacer {
    height: 35px;
  }
}

@media (max-width: 767px) {
  .spacer {
    height: 30px;
  }
}

/* end */

/*-------------------- tss home main banner js start -----------------*/
.tss-home-main-banner {
  width: 100%;
  /* border-bottom: 1px solid var(--color-pink); */
}
.tss-home-main-banner .swiper-slide{
  width: 100% !important;;
}

.tss-home-main-banner .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--color-black);
  position: relative;
  opacity: 0; /* Start with invisible slides */
  transform: scale(0.6);
  transition: opacity 1000ms linear; /* Default transition */
}
.tss-home-main-banner .swiper-slide img {
  border-bottom: 1px solid var(--color-pink);
  width: 100%;
}
.tss-home-main-banner .swiper-slide.swiper-slide-active {
  opacity: 1; /* Visible active slide */
}

.tss-home-main-banner .hero__text-shadow {
  position: relative;
  display: inline-block;
}

.tss-home-main-banner .swiper-slide .text {
  position: absolute;
  padding: 20px;
  bottom: 10%;
}
.tss-home-main-banner .swiper-slide .text.text-left{
  left:15%;
  text-align: left;
}
.tss-home-main-banner .swiper-slide .text.text-right{
  right:15%;
  text-align: right;
}
.tss-home-main-banner .text.text-right.text-align-left{
  text-align: left;
}
.tss-home-main-banner .swiper-slide .text.text-align-left{
    bottom: 10%;
}
.tss-home-main-banner .swiper-slide .text.text-align-left .animation-contents{
  margin-bottom: 1rem;
}
.tss-home-main-banner .swiper-slide .text.text-align-left .hero-svg{
  display: grid;
  align-items: center;
  gap: 5px;
  grid-template-columns: 25px 96%;
}

.tss-home-main-banner .swiper-slide .text.text-align-left .hero-svg svg{
  height: 22px;
  width: 22px;
}
.tss-home-main-banner .swiper-slide .text.text-left.text-align-3rd {
  left: 30%;
}

@supports (animation: grow 1s cubic-bezier(.25, .25, .25, 1) forwards) {
  .tick {
    stroke-opacity: 0;
    stroke-dasharray: 29px;
    stroke-dashoffset: 29px;
    animation: draw 1s cubic-bezier(0.25, 0.25, 0.25, 1) forwards;
    animation-delay: 1s;
    fill: #e72347;
 }
  .circle {
    fill-opacity: 0;
    stroke: #e72347;
    fill: rgb(231, 35, 71);
    stroke-width: 16px;
    transform-origin: center;
    transform: scale(0);
    animation: grow 0.5s cubic-bezier(0.25, 0.25, 0.25, 1.25) forwards;
 }
}
@keyframes grow {
  60% {
    transform: scale(0.8);
    stroke-width: 4px;
    fill-opacity: 0;
 }
  100% {
    transform: scale(0.9);
    stroke-width: 8px;
    fill-opacity: 1;
    fill: rgb(231, 35, 71);
 }
}
@keyframes draw {
  0%, 100% {
    stroke-opacity: 1;
 }
  100% {
    stroke-dashoffset: 0;
 }
}

.tss-home-main-banner .hero__top-subtitle {
  text-transform: uppercase;
  letter-spacing: .3em;
  font-size: 1.5em;
  margin-bottom: 5px;
}
.tss-home-main-banner .swiper-pagination{
  bottom: 15px !important;
}
.tss-home-main-banner .swiper-slide .hero__link .btn {
  opacity: 0;
  /* transition: none; */
}
.tss-home-main-banner .swiper-slide.swiper-slide-active .hero__link .btn{
  animation:fade-in 2s ease 1.3s forwards;
}

.tss-home-main-banner .swiper-slide.swiper-slide-active .hero__link .btn:nth-child(2){
  animation:fade-in 2s ease 1.6s forwards;
}
.tss-home-main-banner .hero__title {
  display: block;
  margin-bottom: 0;
  font-size: 48px;
  font-family: 'Times New Roman';
  text-transform: capitalize;
}
.tss-home-main-banner .hero__subtitle {
  font-size: 1.3em;
  display: block;
  vertical-align: middle;
  margin-top: 5px;
  margin-bottom: 5px;
}
.tss-home-main-banner .animation-cropper {
  overflow: hidden;
  display: inline-flex;
}
.tss-home-main-banner .hero__link .btn {
  margin: 4px 3px 2px 0;
  color: var(--color-black);
  text-transform: uppercase;
  border: 2px solid var(--color-black);
  border-radius: 0;
  font-weight: 600;
  letter-spacing: .3em;
  display: inline-block;
  padding: 11px 20px;
  font-size: 13px;
  transition: all 0.5s ease;
}
.tss-home-main-banner .hero__link .btn:hover {
  background-color: var(--color-black);
  color: var(--color-white);
}
.tss-home-main-banner .swiper-slide .animation-contents {
  opacity: 0;
  transform: translateY(15px);
  transition: none;
  text-transform: capitalize;
}
.tss-home-main-banner .swiper-slide.swiper-slide-active .animation-contents {
  transform: translateY(0);
  animation: .8s cubic-bezier(.26,.54,.32,1) .3s forwards;
  animation-name: rise-up;
  text-shadow: 0px 0px var(--color-black);
}

@keyframes rise-up{
  0%{
    opacity:1;
    transform:translateY(120%);
  }
  to{
    opacity:1;
    transform:translateY(0%);
  }
}
@keyframes fade-in{
  0%{
    opacity:0;
  }
  to{
    opacity:1;
  }
}
.tss-home-main-banner  .mobile-only{
  display: none;
}
@media screen and (max-width:1600px) {
  .tss-home-main-banner .swiper-slide .text.text-left{
    left:10%;
  }
  .tss-home-main-banner .swiper-slide .text.text-right {
    right: 10%;
  }
}
@media screen and (max-width:1400px) {
  .tss-home-main-banner .swiper-slide .text.text-align-left .animation-contents {
    margin-bottom: 0.5rem;
  }
  .tss-home-main-banner .hero__title {
    font-size: 38px;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left {
    bottom: 8%;
}
  .tss-home-main-banner .swiper-slide .text.text-align-left .animation-contents h2{
     font-size: 1.5rem;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left .hero__subtitle{
    font-size: 1rem;
  }
}
@media screen and (max-width:1200px) {
  .tss-home-main-banner .hero__title {
    font-size: 30px;
  }
  .tss-home-main-banner .hero__top-subtitle {
    font-size: 1.2em;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left {
    right: 5%;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left {
    bottom: 6%;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left .hero-svg{
    margin-bottom: 0.5rem;
  }
}

@media screen and (max-width:991px) {
  .tss-home-main-banner .swiper-slide .text.text-align-left .animation-contents h2 {
    font-size: 1.2rem;
    margin-bottom: 0rem;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left .hero__subtitle {
    font-size: 0.9rem;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left .hero-svg {
    margin-bottom: 0.1rem;
    font-size: 13px;
}
  .tss-home-main-banner .swiper-slide .text.text-align-left .hero-svg svg {
    height: 18px;
    width: 18px;
  }
  .tss-home-main-banner .hero__top-subtitle{
    font-size: 0.7em;
  }
  .tss-home-main-banner .hero__title{
    font-size: 22px;
  }
  .tss-home-main-banner .hero__subtitle {
    font-size: 16px;
  }
  .tss-home-main-banner .hero__link .btn {
    font-weight: 600;
    letter-spacing: .2em;
    padding: 8px 10px;
    font-size: 12px;
  } 
  .tss-home-main-banner .swiper-slide .text.text-left{
    left:6%;
  }
  .tss-home-main-banner .swiper-slide .text.text-right {
    right: 6%;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left{
    right:0%;
  }
  
}
@media screen and (max-width:767px) {
  .tss-home-main-banner .hero__title {
    font-size: 18px;
  }
  .tss-home-main-banner .hero__subtitle {
    font-size: 14px;
    width:90%
  }
  .tss-home-main-banner .swiper-button-next, .tss-home-main-banner .swiper-button-prev{
    display: none;
  }
  .tss-home-main-banner .desktop-only{
    display: none;
  }
  .tss-home-main-banner .mobile-only{
    display: block;
  }
  .tss-home-main-banner .swiper-slide .text {
    bottom: 5%;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left .animation-contents h2 {
    font-size: .9rem;
    margin-bottom: 0rem;

  }
  .tss-home-main-banner .swiper-slide .text.text-align-left .hero-svg {
    font-size: 12px;
    line-height: 14px;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left {
    bottom: 0%;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left .hero-svg {
    gap: 3px;
    grid-template-columns: 14px 95%;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left .animation-contents {
    margin-bottom: 0rem;
  }
  .tss-home-main-banner .swiper-slide .text.text-align-left .hero-svg svg {
    height: 14px;
    width: 14px;
  }
  .tss-home-main-banner .hero__top-subtitle {
    font-size: 0.8em;
    letter-spacing: 1px;
  }
  .tss-home-main-banner .swiper-slide .text.text-left.text-align-3rd {
    left: 3%;
  }
}
/* ---------------------- tss home main banner js start --------------------------------*/
/*-------------------- enroll and book a demo section start -----------------*/
.enroll-book-demo-section {
  padding: 2rem 0;
  /* background-image: url(../img/icons/pattern-01.png); */
  background-color: var(--color-alice-blue);
  position: relative;
  overflow: hidden;

}
.enroll-book-demo-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 1));
  pointer-events: none;
}
@media screen and (max-width:767px) {
  .enroll-book-demo-section .book-a-demo-box{
      margin-top: 1rem;
  }
}
/*-------------------- enroll and book a demo section end -----------------*/
/*-------------------- TSS heading section start -----------------*/
.tss-heading-section {
  position: relative;
  text-align: center;
  overflow: hidden;
}
.faded-text {
  -webkit-animation: linear infinite alternate;
  -webkit-animation-name: run;
  -webkit-animation-duration: 25s;
  -ms-animation: linear infinite alternate;
  -ms-animation-name: run;
  -ms-animation-duration: 25s;
  -moz-animation: linear infinite alternate;
  -moz-animation-name: run;
  -moz-animation-duration: 25s;
}
.faded-text {
  position: absolute;
  left: 0;
  top: -8px;
  width: 100%;
  text-align: center;
  font-family: futura;
}

@-webkit-keyframes run {
    0% { left: -30%;}
    50%{ left : 0%;}
    100%{ left: 30%;}
}

@-moz-keyframes run {
    0% { left: -30%;}
    50%{ left : 0%;}
    100%{ left: 30%;}
}  
.faded-text .f-text {
  position: relative;
  display: block;
  text-transform: uppercase;
}

.faded-text .f-text span {
    position: relative;
    display: block;
    font-size: 90px;
    line-height: 1em;
    letter-spacing: 0px;
    color: var(--color-white);
    font-weight: 700;
    text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.05), 1px -1px 0 rgba(0, 0, 0, 0.05), -1px 1px 0 rgba(0, 0, 0, 0.05), 1px 1px 0 rgba(0, 0, 0, 0.05);
}

.team-section .f-text span {
  color: var(--colo-white);
  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.07), 1px -1px 0 rgba(0, 0, 0, 0.07), -1px 1px 0 rgba(0, 0, 0, 0.07), 1px 1px 0 rgba(0, 0, 0, 0.07);
}
.auto-container {
  position: static;
  padding: 0px 15px;
  margin: 0 auto;
}
.sec-title {
  position: relative;
  margin-bottom: 2rem;
}

.sec-title .sub-title {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  font-size: 18px;
  line-height: 1.5em;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--color-brick-red);
  letter-spacing: 3px;
  margin-bottom: 10px;
}
.sec-title .sub-title:before {
  content: '';
  position: absolute;
  top: 11px;
  right: 100%;
  margin-right: 15px;
  width: 70px;
  border-bottom: 2px solid var(--color-brick-red);
}
.sec-title .sub-title:after {
  content: '';
  position: absolute;
  top: 11px;
  left: 100%;
  margin-left: 15px;
  width: 70px;
  border-bottom: 2px solid var(--color-brick-red);
}
.sec-title h2 {
  position: relative;
  display: block;
  font-size: 38px;
  line-height: 1em;
  letter-spacing: 2px;
  color: var(--color-light-black);
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 0px;
  font-family: 'Times New Roman';
}
@media screen and (max-width:1200px) {
  .faded-text .f-text span{
    font-size: 78px;
  }
  .sec-title h2 {
    font-size: 26px;
  }
}
@media screen and (max-width:767px) {
  .sec-title h2 {
    font-size: 22px;
  }
  .faded-text .f-text span {
    font-size: 73px;
  }
}

/*-------------------- TSS heading section end -----------------*/

/*--------------------------------- contact us page design css start ------------------------------------------------*/
.contact-us-box {
  padding: 20px;
  min-height: 450px;
  box-shadow: 0px 0px 10px var(--color-gray);
  border-radius: 10px;
  background: var( --color-white-smoke);
  font-family: futura;
}

.contact-us-box form .form-label {
  font-weight: 600;
}

.contact-us-box form label span {
  color: var(--color-red);
}

.contact-us-box form a {
  color: var(--color-pink);
  font-weight: 600;
}

.contact-us-box form a:hover {
  color: var(--color-red);
}
.calendaricon {
  position: absolute;
  right: 10px;
  top: 50%;
  pointer-events: none;
}

/*--------------------------------- contact us page design css end ------------------------------------------------*/
 /* ----------------------virtual container form heading section cssstart---------------------------------------- */
 .virtual-heading-box{
    position: relative;
    margin: 0 auto;
    /* background: linear-gradient(45deg, #783e9f, #03a9f4); */
    background: radial-gradient(circle at center, var(--color-yellow), var(--color-brick-red));
    text-align: center;
    
 }

 .vertual-text{
    color:var(--color-black);
    padding: 20px;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    animation-name: focus-in-contract;
    animation-duration: 2.2s;
    animation-timing-function: ease;
    animation-delay: 1s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: none;
 }
 

@keyframes focus-in-contract {
    
  0% {
    letter-spacing:1em;
    filter:blur(12px);
    opacity:0;
  }
  100% {
    filter:blur(0);
    opacity:1;
  }
}
.virtual-container .field input,.virtual-container .field select,.virtual-container .field textarea{
  opacity: 0.8;
}
  /* ---------------------virtual container form heading section  css end ----------------------------------------*/
/*--------------------------------- TSS virtual consultation form page design css start ------------------------------------------------*/
.virtual-container {
  min-height: 450px;
  box-shadow: 0px 0px 10px #a3a3a3;
  border-radius: 10px;
  background: var(--color-alice-blue);
  padding: 20px;
  position: relative;
  overflow: hidden;
  font-family: "Public Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}
.virtual-ovelay-image-box{
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width:100%;
  pointer-events: none;
}
.virtual-ovelay-image-box .virtual-ovelay-image{
  background-image: url(../img/vr-ts.png);
  background-size: 20%;
  background-repeat: no-repeat;
  height: 100%;
  opacity: 0.09;
  background-attachment: fixed;
  background-position: 50% 50%;
}
.tss-heading {
  margin-bottom: 1.5rem;
}
.virtual-container .personal-info label{
  display: block;
  margin-bottom: 15px;
}
.virtual-container label {
  font-weight: 500;
  font-size: 15px;
}

.radio-box {
  gap: 1px;
  height: calc(1em + 1.6rem);
  padding: .75rem 1rem;
  border-radius: .3125rem;

}

.radio-box .form-check-input {
  margin-top: 0em;
}

.radio-box label {
  margin-bottom: 0.0rem;
}
.border-bottom{
  border-bottom: 1px solid var(--color-black)!important;
}


.virtual-container .upload-box {
  width: 100%;
  padding: 10px;
  border: 2px dashed var(--color-gray);
  text-align: center;
  margin: 10px auto;
  overflow: hidden;
}

.virtual-container .preview-box {
  width: 100%;
  height: 300px;
  border: 1px solid var(--color-gray);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.virtual-container .preview-box img {
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
}

.virtual-container .drop-target {
  border: 2px dashed var(--color-black);
  height: 150px;
}

.virtual-container .img-upload-box h4 {
  
  width: 100%;
  /* text-align: center; */
  color: var(--color-black);
  margin-bottom: 0px;
  padding: 4px;
  text-transform: capitalize;
  font-size: 18px;
  font-weight: 600;
}
.virtual-container .img-upload-box h5 {
  
  width: 100%;
  text-align: center;
  color: var(--color-black);
  margin-bottom: 0;
  padding: 2px;
  text-transform: uppercase;
  font-size: 20px;
  font-weight: 600;
}

:not(.input-group)>.bootstrap-select.form-control:not([class*=col-]) {
  width: 100%;
  padding: 0;
}
.aggremet-txt h5 {
  font-family: futura;
}

.aggremet-txt label {
  font-weight: 400;
  font-size: 14px;
}

.virtual-container .img-upload-box.table-section {
  overflow: scroll;
}

.virtual-container .img-upload-box.table-section::-webkit-scrollbar {
  display: none;
}

.virtual-container .table-bordered td,
.virtual-container .table-bordered th {
  min-width: 170px;
}

.color-yellow {
  color: var(--color-yellow);
}

.virtual-container .table>:not(caption)>*>* {
  background-color: transparent;
}

.section-heading-helvetica {
  font-family: 'Times New Roman';
}


@media screen and (max-width:1200px) {
  .calendaricon {
    left: 95%;
  }
  .virtual-container .preview-box {
    height: 215px;
  }
}


@media(max-width:991px) {
  .virtual-container .preview-box {
    height: 200px;
  }
}

@media(max-width:767px) {
  .virtual-ovelay-image-box .virtual-ovelay-image {
    background-size: 60%;
  }
  .sm-px-0{
    padding: 0!important;
  }
  .calendaricon {
    left: 92%;
  }
  .section-heading-helvetica {
    font-size: 25px;
  }

  .virtual-container {
    padding: 10px;
  }

  .virtual-container .mobile-grid {
    display: grid;
    grid-template-columns: 30% 70%;
    align-items: center;
  }

  .tss-heading {
    margin-bottom: 0.5rem;
  }

  .virtual-container .mb-3,
  .virtual-container .my-3 {
    margin-bottom: 5px !important;
  }

  .virtual-container label {
    margin-bottom: 10px;
    display: block;
  }
  .virtual-container .h5, .virtual-container h5 {
    font-size: 1rem;
  }
  .virtual-container .form-control {
    padding: 0 15px;
  }
  .virtual-container .img-upload-box h4 {
    font-size: 16px;
  }

  .virtual-container .p-3 {
    padding: 0rem !important;
  }

  .virtual-container .border {
    border: unset !important;
  }

  .sm-mb-1 {
    margin-bottom: 1rem;
    ;
  }
}

/*--------------------------------- TSS New virtual consultation form page design css end ------------------------------------------------*/

.virtual-container .translatecontainer {
  display: flex;
  width: 100%;
}

.virtual-container .translate30 {
  width: 100%;
  background-color: var(--color-yellow);
  padding: 5px;
  border-radius: 0.375rem;
  transition: all 1.5s;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: #f9bc9ac4;
}

.virtual-container .priscription-details {
  width: 0%;
  visibility: hidden;
  opacity: 0;
  transition: all 1.5s;
  height: 70px;
  overflow: hidden;
}

.translatecontainer.active .translate30 {
  transition: all 1.5s;
  width: 30%;
}

.translatecontainer.active .priscription-details {
  transition: all 1.5s;
  width: 70%;
  visibility: visible;
  opacity: 1;
}

.virtual-container .check-box-group {
  display: grid;
  grid-template-columns: 19% 19% 19% 19% 19%;
  gap: 5px;
  padding: 0 0 0 15px;
  position: relative;
  height: 100%;
}

.virtual-container .check-box-group label {
  font-size: 14px;
}

.virtual-container .check-box-group .form-check {
  border: 1px solid #ccc;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 5px;
  border-radius: 5px;
  overflow: hidden;
  text-align: center;
}

.virtual-container .check-box-group .form-check-input {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  right: 0;
  margin: 0;
  opacity: 0;
}

.virtual-container .check-box-group label {
  font-size: 14px;
  position: absolute;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  text-align: center;
  font-weight: 600;
}

.virtual-container .priscription-details input[type=checkbox]:checked+.form-check-label {
  background: var(--color-pink);
  color: var(--color-white);
}
.mutli-select-button .bootstrap-select .dropdown-toggle{
  color: #000 !important;
  background-color: #fff !important;
  width: 100% !important;
  padding: .475rem .75rem !important;
  border: var(--bs-border-width) solid var(--bs-border-color)!important;
  line-height: 1.5 !important;
  min-width: 100%;
  font-family: inherit !important;
  font-weight: 400;
  font-size: 1rem;
  letter-spacing: unset !important;
  text-transform: capitalize;
}
.mutli-select-button .bootstrap-select .dropdown-toggle:focus{
  border-color: var(--color-pink);
  outline-offset: unset;
  border-color: var(--color-pink);
  outline: 1px !important;
  box-shadow: 0 0 0 .25rem rgb(233 134 147 / 26%);
  border: var(--bs-border-width) solid var(--color-pink) !important;
}
.hasDatepicker{
  background-image: url(../tssindia/assets/img/icons/calendar.gif);
  background-repeat: no-repeat;
  background-position: right;
  background-origin: content-box;
}
.dropdown-item.active, .dropdown-item:active {
  color: var(--color-white);
  text-decoration: none;
  background-color: var(--color-pink);
}
/* ------------------------------------------------------------- */


.virtual-container .label-before, .virtual-container .field input:focus + label::before,.virtual-container .field input:valid + label::before,.virtual-container .field select:valid + label::before {
  line-height: 20px;
  font-size: 12px;
  top: -10px;
  background: #fff;
  padding: 0 6px;
  left: 10px;
  border-radius: 10px;
}

.virtual-container .field {
  position: relative;
}
.virtual-container .field label::before {
  content: attr(title);
  position: absolute;
  top: 0;
  left: 20px;
  pointer-events: none;
  line-height: 40px;
  transition: 300ms all;
}
.virtual-container .field input,.virtual-container .field select  {
  width: 100%;
  line-height: 40px;
  padding: 0 15px;
  box-sizing: border-box;
  color: #222;
}

.virtual-container .field input:valid + label::before, .virtual-container .field select:valid + label::before  {
  content: attr(data-title);
}


/* ------------------------------------------------------------- */


@media(max-width:1400px) {}

@media(max-width:1200px) {
  .virtual-container .check-box-group {
    grid-template-columns: 32% 32% 32%;
    /* grid-auto-rows: minmax(auto, auto); */
    padding: 0px 0 0 10px;
  }

  /* .check-box-group:first-child div:nth-child(4) {
      grid-column: 1 / -1;
      width: 100%;
  } */

  .virtual-container .translate30,
  .virtual-container .priscription-details {
    height: 80px;
  }

  .virtual-container .check-box-group label {
    font-size: 12px;
  }

  .virtual-container .img-upload-box h4 {
    font-size: 20px;
  }
}

@media(max-width:991px) {

  .virtual-container .translate30,
  .virtual-container .priscription-details {
    height: 90px;
  }

  .virtual-container .img-upload-box h4 {
    font-size: 16px;
    font-weight: 600;
    padding: 10px;
  }
}

@media(max-width:767px) {
  .virtual-container .check-box-group {
    grid-template-columns: 49% 49% !important;
    grid-auto-rows: minmax(auto, auto);
    padding: 10px 0 0 0px;
  }
  .virtual-container .img-upload-box h5 {
    font-size: 18px;
}
  .virtual-container .check-box-group .form-check {
    height: 50px;
  }
  .virtual-container .translatecontainer label {
    margin-bottom: 0px !important;
  }
  .virtual-container .translatecontainer {
    display: block;
  }

  .virtual-container .translate30 {
    width: 100%;
    height: 40px;
  }

  .virtual-container .priscription-details {
    width: 100%;
    height: 0px;
  }

  .translatecontainer.active .translate30 {
    width: 100%;
  }

  .translatecontainer.active .priscription-details {
    width: 100%;
    height: 135px;
  }

  .translatecontainer:first-child.active .priscription-details {
    height: 180px;
  }
}

/*--------------------------------- TSS virtual consultation form page design css end ------------------------------------------------*/
.promoted-input-checkbox {
  position: relative;
  padding: 0!important;
}

.promoted-input-checkbox .hidden-content {
  /* display: none; */
  visibility: hidden;
  opacity: 0;
}

.promoted-input-checkbox input {
  box-sizing: border-box;
  padding: 0 !important;
  height: 40px;
  width: 100%;
  opacity: 0;
}

.promoted-input-checkbox input[type="checkbox"]:checked {
  opacity: 0;
}

.promoted-input-checkbox input[type="checkbox"]:checked~.hidden-content {
  /* display: block; */
  visibility: visible;
  opacity: 1;
}

.promoted-input-checkbox i {
  font-size: 20px;
}

/* -------------home page texts slider section with swiper css start-------------- */
.text-slider-container {
  background-color: var(--color-pink);
}

.text-slider-container .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-pink);
  height: 100% !important;
}

/* .text-slider-container .swiper-slide:nth-child(1n) {
  background-color: var(--color-pink);
} */

.home-text-slider p {
  color: var(--color-white);
  font-family: futura;
  margin-bottom: 0;
  font-size: .975rem;
  padding: 7px 8%;
  text-align: center;
}

@media(max-width:1200px) {
  .home-text-slider p {
    line-height: .875rem;
    font-size: .775rem;
  }
}

/* -------------home page texts slider section with swiper css end-------------- */
/* -------------home page texts image section  css start-------------- */
.tss-section-boxes .tss-h5 {
  text-transform: uppercase;
  letter-spacing: .3em;
  margin-bottom: 10px;
  line-height: 1.6;
}

.tss-section-boxes .tss-text-box-left {
  padding-right: 60px;
}

.tss-section-boxes .tss-text-box-right {
  padding-left: 60px;
}

.tss-section-boxes .tss-h3 {
  font-size: 1.5rem;
  margin-bottom: 10px;
  font-weight: 400;
  font-family: 'Times New Roman';
  line-height: 1;
}

.tss-section-boxes .tss-featured-subtext p {
  font-family: Futura;
  font-size: 1.1em;
  text-align: justify;
  line-height: 1.6;
  margin-bottom: 0.7rem;
  letter-spacing: 0.025em;
}

.tss-featured-subtext {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}
img.attachment-large-square-image{
  transition: all 1s ease;
  box-shadow: 0 0 3px var(--color-alice-blue);
}
img.attachment-large-square-image:hover{
  transform: scale(1.04);
 
}
.tss-main-section1, .tss-main-section3{
  overflow: hidden;
}
.tss-main-section2{
  background-color: var(--color-alice-blue);
  padding: 2rem 0;
  overflow: hidden;
}
@media(max-width:1200px) {
  .tss-section-boxes .tss-text-box-left {
    padding-right: 15px;
  }

  .tss-section-boxes .tss-text-box-right {
    padding-left: 15px;
  }
}

@media(max-width:991px) {
  .tss-section-boxes .tss-featured-subtext p {
    font-size: 1em;
    line-height: 1.5;
  }

  .tss-section-boxes .tss-h3 {
    font-size: 1.3rem;
    ;
  }

  .tss-featured-subtext {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }

  .tss-section-boxes .tss-h5 {
    line-height: 1;
  }
}

@media(max-width:767px) {
  .tss-section-boxes .tss-text-box-left {
    padding-right: 0px;
    padding-bottom: 0px;
    padding-top: 30px;
    text-align: center;
  }

  .tss-section-boxes .tss-featured-subtext p {
    text-align: center;
  }

  .tss-section-boxes .tss-text-box-right {
    padding-left: 0px;
    padding-top: 30px;
    text-align: center;
  }

  .tss-section-boxes .button3 {
    margin: 0 auto;
  }
  
}
@media screen and (min-device-width: 600px) and (max-device-width: 768px) { 
  .tss-section-boxes .tss-text-box-left{
    margin-bottom: 15px;
  }
}
/* -------------home page texts image section  css end-------------- */
/* -------------home page testimonial section  css start-------------- */
.testimonial-container {
  padding: 45px 0;
  background-color: var(--color-alice-blue);
  position: relative;
  background-image: url(../tssindia/assets/img/banner/bg-6.jpg);

}

.section-header {
  text-align: center;
  margin-bottom: 2rem;
  position: relative;
  z-index: 1;
}

.testimonial-slider {
  width: 100%;
  overflow: hidden;
  padding: 3rem 10px;

}

.testimonial-slider .swiper-wrapper {}

.testimonial-slider .swiper-slide {
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: center;
  border-radius: 10px;
  transition: transform 0.3s;
  box-shadow: 0 0px 6px rgba(0, 0, 0, 0.1);
  text-align: center;
  box-shadow: 0 0px 15px #0000001a;
  position: relative;
  z-index: 10;
  background-color: #ffffff7a;
  color: var(--color-black);
  width: 30%;
  padding: 20px;
  min-height: 350px;
  font-family: Futura;
  text-align: left;
}

.testimonial-slider .swiper-slide.swiper-slide-active {
  transform: scale(1.2);
}

.testimonial-slider .stars {
  margin-bottom: 10px;
}

.testimonial-slider .stars i {
  color: var(--color-yellow);
  margin: 0 2px;
}

.testimonial-slider .testimonial-text {
  font-size: 16px;
  margin-bottom: 10px;
  text-align: justify;

}

.testimonial-slider .testimonial-name {
  font-weight: bold;
}

.testimonial-slider .testimonial-designation {
  font-size: 14px;
  color: #777;
}

.testimonial-slider .swiper-button-prev,
.testimonial-slider .swiper-button-next {
  top: 55%;
}

.testimonial-slider .swiper-horizontal>.swiper-pagination-bullets,
.testimonial-slider .swiper-pagination-bullets.swiper-pagination-horizontal,
.testimonial-slider .swiper-pagination-custom,
.testimonial-slider .swiper-pagination-fraction {
  bottom: 5%;
}

@media(max-width:1400px) {
  .testimonial-slider .swiper-slide {
    min-height: 400px;
  }
	.testimonial-slider .swiper-horizontal>.swiper-pagination-bullets,
.testimonial-slider .swiper-pagination-bullets.swiper-pagination-horizontal,
.testimonial-slider .swiper-pagination-custom,
.testimonial-slider .swiper-pagination-fraction {
  bottom: 3%;
}
}

@media(max-width:1200px) {
  .testimonial-slider .swiper-slide {
    min-height: 350px;
  }

  .testimonial-slider {
    padding: 1rem 10px;
  }

  .testimonial-container {
    padding: 30px 0;
  }

  .testimonial-slider .swiper-horizontal>.swiper-pagination-bullets,
  .testimonial-slider .swiper-pagination-bullets.swiper-pagination-horizontal,
  .testimonial-slider .swiper-pagination-custom,
  .testimonial-slider .swiper-pagination-fraction {
    bottom: 2%;
  }

  .testimonial-slider .swiper-slide.swiper-slide-active {
    transform: unset;
  }

  .testimonial-container .section-header {
    margin-bottom: 1rem;
  }
}

@media(max-width:991px) {
  .testimonial-slider .swiper-slide {
    min-height: 440px;
  }
}

@media(max-width:767px) {
  .testimonial-slider {
    padding: 1rem 10px;
  }

  .testimonial-slider .swiper-slide {
    min-height: 440px;
  }

}

/* -------------home page testimonial section  css end-------------- */
/* -------------home page Blog section  css start-------------- */
.view_all_btn {
  padding: 6px 10px;
  letter-spacing: .3em;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid #ddd;
  color: var(--color-black);
  border-radius: 0;
  cursor: pointer;
}

.view_all_btn:hover {
  border: 1px solid #ddd;
}
.tss-blog-section{
  padding: 60px 0;
  width: 100%;
  position: relative;
  overflow: hidden;
  background: var(--color-alice-blue);
}
.tss-blog-section:before {
  position: absolute;
  content: "";
  left: 0;
  background: var(--color-white);
  width: 100%;
  height: 70%;
  transform: skew(0deg, 356deg);
  bottom: 40%;
}
.tss-blog-section .blog-grid .grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2%;
}

.tss-blog-section .grid_image-ratio {
  overflow: hidden;
  
}
.tss-blog-section .grid_image-ratio img{
  transition: all 1s ease;
}
.tss-blog-section .grid_image-ratio img:hover {
  transform: scale(1.2);
}
.tss-blog-section .grid_image-ratio img {
  width: 100%;
  height: 100%;
}

.tss-blog-section .article_grid-meta {
  padding-top: 1rem;
  text-align: center;

}

.tss-blog-section .article_date {
  font-size: 12px;
  font-family: 'Futura';
  color: var(--color-black);
}

.tss-blog-section .article_title {
  font-size: 18px;
  font-family: 'Futura';
  color: var(--color-black);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
}

.tss-blog-section.tss-blog-page .article_title {
  display: block;
  font-family: 'Times New Roman';
  font-size: 22px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tss-blog-section.tss-blog-page .article_grid-meta {
  text-align: left;
}

.article_name p {
  font-size: 13px;
}

.bloggle_blog_item_desc {
  text-align: left;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: futura;
}

.tss-blog-section.tss-blog-page .article_date {
  text-align: left;
  padding: 5px 0 15px 0;
}

.tss-blog-section.tss-blog-page .read_more_btn {
  border-bottom: 1px solid var(--color-black);
}

.blog-detail-text-box {
  padding: 0 6%;
}

.blog-detail-text-box h3 {
  font-family: 'Times New Roman';
  margin-bottom: 2rem;
  margin-top: 2rem;
}

.blog-detail-text-box h3:first-child {
  margin-top: unset;
}

.article_title_detail {
  font-size: 38px;
  font-family: 'Times New Roman';
  line-height: 1;
  padding: 0 6%;
}

.blog-detail-text-box ul {
  list-style: disc;
}

.blog-detail-text-box ul li {
  text-align: justify;
  margin-bottom: 2rem;
  font-family: 'Futura';
}

.blog-detail-text-box .bloggle_blog_item_desc {
  text-align: justify;
  display: block;
}

.return-link .icon {
  width: 20px;
  margin-right: 8px;
}

@media(max-width:1400px) {}

@media(max-width:1200px) {
  .blog-detail-text-box {
    padding: 0 0%;
  }

  .blog-detail-text-box ul li {
    margin-bottom: 1rem;
  }

  .tss-blog-section.tss-blog-page .article_grid-meta {
    margin-bottom: 20px;
  }
}

@media(max-width:991px) {

  .article_title_detail {
    font-size: 24px;
  }
}

@media(max-width:767px) {
  .article_title_detail {
    padding: 0 0%;
  }

  .tss-blog-section .blog-grid .grid {
    display: block;
    margin-top: 15px;
  }

  .tss-blog-section .blog-grid .grid .grid_item {
    padding-bottom: 10px;
    border: 1px solid var(--color-gray);
    margin-bottom: 15px;
  }

  .tss-blog-section .article_grid-meta {
    padding-left: 15px;
    padding-right: 15px;
  }

}

/* -------------home page Blog section  css end-------------- */
/* -------------home page Faq section  css start-------------- */
.faq-section{
  background: var(--color-alice-blue);
  overflow: hidden;
  position: relative;
  background-image: url(../tssindia/assets/img/banner/bg-6.jpg);
  background-repeat: repeat;
  padding: 3rem 0;
}

/* waves */
.ocean {
  height: 80px; /* change the height of the waves here */
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  overflow-x: hidden;
}

.wave {
  background: url("../tssindia/assets/img/icons/wave-01.svg") ;
  position: absolute;
  width: 200%;
  height: 100%;
  animation: wave 15s -5s linear infinite;
  transform: translate3d(0, 0, 0);
  opacity: 0.8;
}

.wave:nth-of-type(2) {
  bottom: 0;
  animation: wave 22s linear reverse infinite;
  opacity: 0.5;
}

.wave:nth-of-type(3) {
  bottom: 0;
  animation: wave 28s -1s linear infinite;
  opacity: 0.5;
}

@keyframes wave {
    0% {transform: translateX(0);}
    50% {transform: translateX(-25%);}
    100% {transform: translateX(-50%);}
}



.faq-section .tss-nav-pills, .faq-section .tab-content{
  background: #fdfdfd9c;
  padding: 10px;
  border-radius: 10px;
  height: 100%;
  min-height: 380px;
  box-shadow: -6px 5px 10px #b3aeae;
}
.faq-section .nav-pills .nav-link {
  border-radius: var(--bs-nav-pills-border-radius);
  min-width: 260px;
  color: var(--color-black);
  text-align: left;
  margin-top: 15px;
}
.faq-section .nav-pills .nav-link.active,.faq-section .nav-pills .show>.nav-link {
  color: var(--color-white);
  background-color: var(--color-brick-red);
}
.faq-section .nav-link:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 .25rem rgba(240, 135, 147, .25);
}
.faq-section .tab-content{
  width:100%;
}
.faq-section  .accordion-item{
  margin-top:10px;
}
.faq-section .tab-content .accordion-button:focus {
  z-index: 3;
  outline: 0;
  box-shadow: unset;
}
.faq-section .accordion-button:not(.collapsed) {
  color: var(--color-white);
  background-color: var(--color-brick-red);
  box-shadow: inset 0 calc(-1* var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}
.faq-section  .accordion-button:not(.collapsed)::after {
  -webkit-filter: grayscale(1) invert(1);
  filter: grayscale(1) invert(1);
}
.faq-section  .faq-tab-heading{
  margin-top: 10px;
  text-align: center;
  font-weight: 600;
}



@media(max-width:991px) {
  .faq-section .nav-pills .nav-link {
    min-width: 200px;
    padding: 8px 4px;
    font-size: 13px;
  }
}
@media(max-width:767px) {
  .faq-section{
    padding: 2rem 0;
  }
  .faq-section .tss-nav-pills, .faq-section .tab-content {
    min-height: 325px;
  }
  .faq-section .nav-pills .nav-link {
    min-width: unset;
  }
  .faq-section .nav-pills .nav-link .list-title {
    display: none;
  }
  .faq-section .accordion-button{
    border-top-left-radius: var(--bs-accordion-inner-border-radius);
    border-top-right-radius: var(--bs-accordion-inner-border-radius);
    padding: 10px 10px;
  }
  .faq-section .accordion-body{
    padding: 10px 10px;
  }
  .faq-section {
    background-size: cover;
  }
  .ocean {
    height: 65px;
  }
}
/* -------------home page Faq section  css end-------------- */
/*--------------------------------- instagram video and images section css start ----------------------------------------------*/
.stay-connected {
  background-color: var(--color-alice-blue);
}

.stay-connected h3 {
  font-size: 26px;
  margin-bottom: 12px
}

.stay-container {
  font-size: 14px;
  font-family: -apple-system, BlinkMacSystemFont, Roboto, Open Sans, Helvetica Neue, sans-serif;
  line-height: 18px;
  font-weight: 400;
  overflow: hidden !important;
  width: 100%;
  max-height: 100%;
  position: relative;
  box-sizing: border-box;
  min-width: 150px;
  min-height: 100px;
}

.instagram-video-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  width: 100%;
  height: auto;
  gap: 2%;
}

.insta-video-box {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  position: relative;
  background: var(--color-white);
  transition: opacity 0.2s ease, visibility 0.2s ease;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  flex-grow: 0;
  flex-shrink: 0;
}

.instagram-video-container .insta-video-box {
  opacity: 1;
  visibility: visible;
}

.insta-link {
  width: 100%;
  box-sizing: border-box;
  display: flex;
}

.instagram-item-media {
  width: 100%;
}

.instagram-item-image {
  width: 100%;
}

video.instagram-posts-item-video {
  display: none;
}

.instagram-image-icon {
  display: none;
  position: absolute;
  z-index: 2;
  top: 0.6em;
  left: 0.6em;
  width: 24px;
  height: 24px;
  transition: all 0.3s ease;
}

.instagram-image-icon svg {
  display: block;
  width: 24px;
  height: 24px;
  fill: rgba(255, 255, 255, 0.8);
}

.instagram-image-icon.instagram-icon-video {
  display: block;
}

.instagram-image-icon.instagram-icon-carousel {
  display: block;
}

.instagram-posts-item-overlay {
  position: absolute;
  z-index: 2;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s, visibility 0.3s;
  text-align: center;
  box-sizing: border-box;
  color:  var(--color-white);
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  align-items: center;
}

.instagram-posts-item-content {
  transform: translateY(10%);
  width: 80%;
  max-height: 80%;
  margin: 0 auto;
  position: relative;
  transition: 0.3s all ease
}

.instagram-posts-item-text {
  color:  var(--color-white);
  font-size: 14px;
  line-height: 21px;
  display: inline-block;
  overflow: hidden;
  margin-top: 12%;
  text-align: center;
  max-height: 84px;
  width: 100%;
}

img.emoji {
  display: inline !important;
  border: none !important;
  box-shadow: none !important;
  height: 1em !important;
  width: 1em !important;
  margin: 0 0.07em !important;
  vertical-align: -0.1em !important;
  background: none !important;
  padding: 0 !important;
}

.insta-video-box:hover .instagram-posts-item-overlay {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  padding-top: 0;
}

.instagram-popup iframe {
  width: 600px;
  height: 90vh;
}

.fancybox-content {
  padding: 25px 15px !important;
}
.instagram-video-container .insta-video-box .instagram-item-image-wrapper img{
  transition: all 1s ease;
}
.instagram-video-container .insta-video-box:hover .instagram-item-image-wrapper img{
  transform: scale(1.05);
}
@media(max-width:991px) {
  .instagram-video-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media(max-width:767px) {
  .instagram-popup iframe {
    width: 100%;
    height: 80vh;
  }


}

/*--------------------------------- instagram video and images section css end ------------------------------------------------*/

/*--------------------------------- home page location section css start ------------------------------------------------*/
.location-section {
  background-image: url(../tssindia/assets/img/icons/map-pattern-2.png);
  background-color: #f9c2a057;
  padding: 3rem 0;
  background-size: contain;
  background-repeat: repeat;
  background-position: center left;
  overflow: hidden;
}
.location-section .location-container {
  display: flex;
  justify-content: space-evenly;
}

.location-section .location-container .image-section {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 15%;
}

@media(max-width:767px) {
  .location-section .location-container .image-section {
    grid-gap: 0%;
  }

  .location-section .location-container .image-section .image-container {
    padding: 10px;
  }
}

/*--------------------------------- home page location section css end ------------------------------------------------*/
/*--------------------------------- home page our brand css end ------------------------------------------------*/

.our-network-section .our-network h2 {
  font-family: var(--font-family-serif);
  font-size: 1.875rem;
  padding-right: 50px !important;
  border-right: 2px solid var(--color-brick-red);
  height: 150px;
  display: flex;
  align-items: center;
  position: relative;
}

.our-network-swiper {
  overflow: hidden;
}

.our-network-section .our-network-logo-img-box {
  display: flex;
  justify-content: center;
}

.our-network-section .our-network-logo-box {
  width: 100px;
  height: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media(max-width:1200px) {
  .our-network-section .our-network h2 {
    font-size: calc(1.3125rem + .75vw)
  }
}

@media(max-width:767px) {
  .our-network-section .our-network h2 {
    font-family: var(--font-family-serif);
    padding-right: 0px !important;
    border-right: unset;
    height: 60px;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .our-network-section .our-network h2::after {
    content: ' ';
    position: absolute;
    bottom: 8px;
    height: 2px;
    width: 70%;
    background: var(--color-pink);
  }

}

/*--------------------------------- home page our brand  section css end ------------------------------------------------*/
/* ------------------------------------- footer section design css start -------------------------------------------------*/

footer {
  background-color: var(--color-pink);
  color:  var(--color-white);
  font-family: futura;
}

footer .custom-html-widget {
  padding-right: 60px;
}

footer .custom-html-widget .footer_title {
  text-transform: uppercase;
  letter-spacing: .3em;
  font-size: 1em;
  font-family: 'Futura';
  color:  var(--color-white);
  font-weight: 400;
}

footer .footer-about-details p {
  letter-spacing: 0.025em;
  color:  var(--color-white);
  line-height: 1.5;
  font-family: 'Futura';
  font-size: 14px;
  text-align: justify;
  font-weight: 400;
  padding: 0;
}

footer .footer_collapsible .no-bullets {
  padding: 0px;
}

footer .footer_collapsible .no-bullets li {
  margin-bottom: .25em;
}

footer .footer_collapsible .no-bullets li a {
  color:  var(--color-white);
  padding: 4px 0;
  padding-left: 15px;
  position: relative;
  transition: all 1s ease;
}
footer .footer_collapsible .no-bullets li a:before{
  content: '-';
  position: absolute;
  left: 0;
  top: -4px;
  color: var(--color-white);
  line-height: 38px;
  font-weight: 600;
  transition: all 0.5s ease;
}
footer .footer_collapsible .no-bullets li a:hover,footer .footer_collapsible .no-bullets li a:hover:before{
  color:var(--color-black)
}

footer .footer_collapsible p {
  color:  var(--color-white);
}
footer .footer_collapsible .accordion-body p {
  margin-bottom: 0.5rem;
}
footer .widget_custom_html{
  margin-top:1rem;
}
footer .footer_copy_text {
  font-size: max(calc(var(--typeBaseSize)*.7), 12px);
  padding: 7.5px 0;
  margin: 0;
  text-align: center;
  color:  var(--color-white);
}
.footer_container .accordion-body .d-inline-block .footer-socil-icon{
  background-color: var(--color-white);
  height: 30px;
  width: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-pink);
}
.footer_container .accordion-body .d-inline-block .footer-socil-icon{
  transition: all 0.6s ease;
}
.footer_container .accordion-body .d-inline-block.facebook-box:hover .footer-socil-icon {
  background-color: #2363fa;
  color:  var(--color-white);
}
.footer_container .accordion-body .d-inline-block.instagram-box:hover .footer-socil-icon {
  background-color: #f92f80;
  color:  var(--color-white);
}
.footer_container .accordion-body .d-inline-block.linkedin-box:hover .footer-socil-icon {
  background-color: #1d64be;
  color:  var(--color-white);
}
.footer_container .accordion-body .d-inline-block.twitter-box:hover .footer-socil-icon {
  background-color: var(--color-black);
  color:  var(--color-white);
}



/*------------------------ footer accordion start-----------------------*/
.footer_container .accordion-item {
  background: transparent;
  border: transparent;
}
.footer_container  .accordion-button{
  background-color: transparent;
  box-shadow: unset;
  text-align: center;
  position: relative;
}
.footer_container .accordion-button::after{
  background-image:url("../tssindia/assets/img/icons/down-arrow.svg") !important;
}
.footer_container .desktop_hide{
  display: none;
}
.footer_container .small_hide{
  display: block;
}

.footer_container .collapse{
  transition: all 1s ease;
}
.footer_container .collapse:not(.show) {
  display: block;
  transition: all 1s ease;
}
.footer_container  .accordion-body {
  padding: 0;
}
/*------------------------ footer accordion end-----------------------*/
.bottom-footer{
  box-shadow: 0 0 10px #dd5b6c;
}




@media(max-width:1200px) {
  footer .custom-html-widget {
    padding-right: 20px;
  }
}

@media (max-width: 767px) {
  footer .widget_custom_html{
    margin-top:0rem;
  }
  .footer_container .small_hide{
    display: none;
  }
  .footer_container .desktop_hide{
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .footer_container .collapse:not(.show) {
    display: none;
  }
  .footer_container .accordion-collapse.show .accordion-body{
    transform: translateY(0px);
    transition: all .3s cubic-bezier(.25,.46,.45,.94);
  }
  .footer_container .accordion-collapse .accordion-body{
    transform: translateY(40px);
    transition: all .3s cubic-bezier(.25,.46,.45,.94);
  }
  .footer_container .accordion-button::after {
    flex-shrink: unset;
    margin-left: unset;
    position: absolute;
    right: 0;
  }
  .footer_container .accordion-body {
    padding-bottom: 15px;
}
  footer .custom-html-widget .footer_title {
    padding: 1rem 0rem;
  }
  footer .custom-html-widget {
    padding-right: 0px;
    margin-top: 0px;
    text-align: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  }

  .footer_container .pt-sm-0 {
    padding-top: 0 !important;
  }
}

/* ------------------------------------- footer section design css end -------------------------------------------------*/
/* tss buttons start */

.btn-light,
.button3 {
  color:  var(--color-white);
  border: 1px solid var( --color-brick-red) !important;
  display: -ms-flexbox;
  display: flex;
  white-space: nowrap;
  -ms-flex-pack: center;
  justify-content: center;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  transition: all .2s;
  background-color: var( --color-brick-red) !important;
  white-space: normal;
  text-align: center;
  padding: 6px 15px;
  font-size: 12px;
  font-family: 'Futura' !important;
  font-weight: 600;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  position: relative;
  overflow: hidden;
  transition: all 0.5s ease;
}


.btn-light:hover {
  background-color: var(--color-dark-pink) !important;
  color:  var(--color-white) !important;
}

.button3 {
  transition: 0.5s;
  animation: blurr3 2s;
  animation-iteration-count: infinite;
  cursor: pointer;
  padding: 6px 15px;
  font-size: 12px;
  font-family: 'Futura' !important;
  font-weight: 600;
  letter-spacing: 0.3em;
}

@keyframes blurr3 {

  0%,
  100% {
    box-shadow: 0 0 3px var(--color-pink);
  }

  50% {
    box-shadow: 0 0 15px var(--color-pink);
  }
}


@media(max-width:991px) {
  .button3 {
    padding: 6px 15px;
    font-size: 12px;
  }
}

.form-check-input:checked {
  background-color: var( --color-brick-red);
  border-color: var( --color-brick-red);
}

.form-check-input:focus {
  border-color: var(--color-pink);
  outline: 0;
  box-shadow: 0 0 0 .25rem rgb(233 134 147 / 26%);
}

.form-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.form-row>.col,
.form-row>[class*=col-] {
  padding-right: 5px;
  padding-left: 5px
}

.custom-select {
  display: inline-block;
  width: 100%;
  height: calc(1em + 1.6rem);
  /* padding: .75rem/ 1rem; */
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.6;
  color: #1e2022;
  vertical-align: middle;
  background:  var(--color-white) url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='%2371869d' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.72,15.78a.75.75,0,0,1-.53.22h-.38a.77.77,0,0,1-.53-.22L6.15,10.64a.5.5,0,0,1,0-.71l.71-.71a.49.49,0,0,1,.7,0L12,13.67l4.44-4.45a.5.5,0,0,1,.71,0l.7.71a.5.5,0,0,1,0,.71Z'/%3E%3C/svg%3E") no-repeat right .5rem center/1rem 1rem;
  border: .0625rem solid #e7eaf3;
  border-radius: .3125rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0 10px;
}

.custom-select:focus {
  border-color: var(--color-pink);
  outline: 0;
  box-shadow: 0 0 0 .25rem rgb(233 134 147 / 26%);
}



.custom-select:focus::-ms-value {
  color: #1e2022;
  background-color:  var(--color-white);
}

.custom-select[multiple],
.custom-select[size]:not([size="1"]) {
  height: auto;
  padding-right: 1rem;
  background-image: none
}

.custom-select:disabled {
  color: #8c98a4;
  background-color: #f8fafd
}

.custom-select::-ms-expand {
  display: none
}

.custom-select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 var(--color-pink);
}


.form-check {
  position: relative;
  display: block;
  padding-left: 1.25rem;
}

.custom-control-label::before,
.custom-file-label,
.custom-select {
  transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.form-control{
  padding: .475rem .75rem;
}
.form-control:focus {
  border-color: var(--color-brick-red);
  outline: 0;
  box-shadow: 0 0 0 .25rem rgb(233 134 147 / 26%);
}




@media(max-width:767px) {
  .tss-order-sm-2 {
    -ms-flex-order: 2;
    order: 2;
  }

  .tss-order-sm-1 {
    -ms-flex-order: 1;
    order: 1;
  }
}

.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after,
.swiper-button-next,.swiper-button-prev,
.swiper-rtl .swiper-button-prev {
  content: 'prev';
  background: var(--color-brick-red);
  color:  var(--color-white);
  width: 30px;
  height: 30px;
  font-size: 14px;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
  font-size: 16px;
}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: -5px;
}

.swiper-pagination-bullet-active {
  background: var(--color-brick-red);
}

/* tss buttons end */

/*-------------------- about us page css start --------------------------*/
.tss-about-our-story .our-story-txt {
  font-size: 38px;
}

.tss-about-our-story .tss-about-container {}

.tss-about-h3-txt {
  font-family: 'Times New Roman';
}

.tss-about-p-txt {
  font-size: 16px;
  font-family: futura;
}

.tss-mbt h3 {
  margin-top: 60px;
  margin-bottom: 25px;
}

.tss-mbt h3:first-child {
  margin-top: 0px;
}

.tss-mbt p {
  margin-bottom: 25px;
}

@media (max-width: 1200px) {
  .tss-mbt h3 {
    margin-top: 30px;
    margin-bottom: 25px;
  }

}

@media (max-width: 767px) {
  .tss-about-our-story .our-story-txt {
    font-size: 38px;
  }

  .tss-about-our-story .tss-about-container {
    text-align: center;
  }
}

/*-------------------- about us page css end --------------------------*/
/*-------------------- tss academy page css start --------------------------*/
.tss-academy-container .tss_product_details {
  text-align: center;
  position: relative;
  line-height: 1.5;
  font-size: 14px;
  padding: 10px;
  font-family: 'Futura';
}

.tss_product_contents {
  margin-bottom: 30px;
}

.tss-academy-container .tss_product_title {
  text-transform: uppercase;
  letter-spacing: .2em;
}

.tss-academy-container .tss_product_vendor {
  text-transform: uppercase;
  letter-spacing: .3em;
  font-size: .85em;
  margin-top: 5px;
  opacity: .75;
}

.tss-academy-container .tss_product_review i {
  color: var(--color-pink);
}

.tss-academy-container .review_text {
  font-weight: 500;
  font-size: 16px;
}

.tss-academy-container .tss-login-purchase {
  font-size: 1.1rem;

}

.tss-academy-container .tss_product_review {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 1200px) {
  .tss_product_contents {
    margin-bottom: 20px;
  }
}

@media (max-width: 767px) {
  .tss-academy-container .tss_product_title {
    font-size: 12px;
  }

  .tss-academy-container .tss_product_vendor {
    font-size: .75em;
  }

  .tss_product_review {
    font-size: 12px;
  }

  .tss-academy-container .review_text {
    font-weight: 500;
    font-size: 12px;
  }

  .tss-academy-container .tss-login-purchase {
    font-size: .84rem;

  }
}

/*-------------------- tss academy page css end --------------------------*/
/*-------------------- tss login page css start --------------------------*/
.login-container-main form {
  height: 100%;
  display: flex; 
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0px 15px;  
}
.login-container-main .infield {
  position: relative;
  margin: 8px 0px;
  width: 100%;
}
.login-container-main input {
  width: 100%;
  padding: 12px 15px;
  background-color: var(--color-white);
  border: none;
  outline: none;
}
.login-container-main samp {
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  width: 0%;
  height: 2px;
  background: var(--linear-grad);
  transition: width 0.3s ease;
}

.login-container-main input:focus ~ samp {
  width: 100%;
}
.login-container-main a.forgot {
  padding-bottom: 3px;
  border-bottom: 2px solid var(--color-gray);
}
.login-container-main a {
  color: #333;
  font-size: 14px;
  text-decoration: none;
  margin: 15px 0px;
}
.login-container-main p {
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: 0.5px;
  margin: 6px 0px 0px;
}
.modal-title {
  color: var(--color-black);
}
.modal-content {
  background-color: #f8f8f8;
}
.reset-text {
  text-align: center;
  color: var(--color-black);
  font-family: 'Futura';
  padding-bottom: 15px;
}
.error-text{
  color:  var(--color-pink);
 }
 .error-text{
  display: none;
 }
 .error-text.active{
  display: block;
 }
 .login-container-main button {
  border: 1px solid var(--grad-pink1);
  background: var(--grad-pink2);
  color: var(--color-white);
  font-size: 12px;
  font-weight: bold;
  padding: 6px 15px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.login-container-main button:hover{
    opacity: 0.8;
}
@media screen and (max-width:767px) {
  .login-container-main form{
    padding: 0px 0px;
  }
  .virtual-container .h5, .virtual-container h5 {
    font-size: 1rem;
  }
  .virtual-container .form-control {
    padding: .35rem .55rem;
  }
}
/*--------------------- tss login page css end ---------------------------*/

/*--------------------- tss calender css start ---------------------------*/
.ui-datepicker{
  font-family: 'Futura';
}
.ui-icon-circle-triangle-w {
  background-position: -97px 0px;
}
.ui-icon-circle-triangle-e {
  background-position: -33px 0px;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
  background: var(--color-brick-red);
}
.ui-datepicker .ui-datepicker-prev {
  left: 2px;

}
.ui-datepicker .ui-datepicker-next {
  right: 2px;
}
.ui-widget-header .ui-icon{
  filter: brightness(500%);
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
  border: 1px solid #c5c5c5;
  background: var(--color-white);
  color: var(--color-black);
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
  background: var(--color-black);
  color: var(--color-white);
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
  background: var( --color-brick-red);
  color: var(--color-white);
}
.ui-datepicker .ui-datepicker-title select {
  margin: 0;
  padding: 4px;
  font-family: Futura;
  border: 1px solid #dee2e6;
  border-radius: 5px;
}
/*--------------------- tss calender css end ---------------------------*/
/*-------------------- tss call to action section css end ----------------- */

.call-to-section{
	position:relative;
	padding: 120px 0px 100px;
	background: #e98693;
	background: -webkit-linear-gradient(left, #e98693 ,#000000);
	background: -ms-linear-gradient(left,#e98693,#000000);
	background: -moz-linear-gradient(left,#e98693,#000000);
	color: #ffffff;
}

.call-to-section:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url(../tssindia/assets/img/icons/pattern-3.png) left top repeat;
}


.call-to-section .content{
	position:relative;
	display: block;
	text-align: center;
}

.call-to-section .content h2{
	position: relative;
	display: block;
	font-size:78px;
	line-height: 1.2em;
	letter-spacing: -1px;
	color: #ffffff;
	font-weight: 400;
	text-transform: uppercase;
	margin-bottom: 0px;
}

.call-to-section .content .sub-title{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	font-size: 18px;
	line-height: 1.5em;
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	letter-spacing: 3px;
	margin-bottom: 10px;
}

.call-to-section .content .sub-title:before{
	content: '';
	position: absolute;
	top: 11px;
	right: 100%;
	margin-right: 15px;
	width: 70px;
	border-bottom: 2px solid #ffffff;
}

.call-to-section .content .sub-title:after{
	content: '';
	position: absolute;
	top: 11px;
	left: 100%;
	margin-left: 15px;
	width: 70px;
	border-bottom: 2px solid #ffffff;
}

.call-to-section .content .lower-text{
	position: relative;
	display: block;
	font-size: 18px;
	line-height: 1.6em;
	font-weight: 600;
	color: #5a8299;
	padding: 20px 0px 0px;
}

.call-to-section .content .link-box{
	position: relative;
	display: flex;
  align-items: center;
  justify-content: center;
	padding-top: 35px;
}

.call-to-section .link-box .theme-btn{
	min-width: 175px;
	margin: 0px 10px 0px;
}

.call-to-section .link-box .btn-style-one .btn-title{
	color: #ffffff;
	border-color: rgba(255,255,255,0.20);
}
.btn-style-two .btn-title, .btn-style-one .btn-title  {
  position: relative;
  display: block;
  font-size: 14px;
  line-height: 30px;
  font-weight: 700;
  padding: 13px 40px;
  border-radius: 0px;
  z-index: 1;
  transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
}
.btn-style-one {
  background-color: transparent!important;
}
.btn-style-two:hover{
  background-color:var(--color-black)!important;
  border: 1px solid var(--color-black)!important;
}

/** bubble-dotted **/

.bubble-dotted{
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
}

.bubble-dotted .dotted{
  position: absolute;
  border-radius: 50%;
}

.bubble-dotted .dotted-1{
  width: 11px;
  height: 11px;
  left: 100px;
  top: 50%;
  -webkit-animation: animateBubble 15s linear infinite,sideWays 2s ease-in-out infinite alternate;
  -moz-animation: animateBubble 15s linear infinite,sideWays 2s ease-in-out infinite alternate;
  animation: animateBubble 15s linear infinite,sideWays 2s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-2{
  width: 7px;
  height: 7px;
  left: 240px;
  top: 40%;
  -webkit-animation: animateBubble 10s linear infinite,sideWays 4s ease-in-out infinite alternate;
  -moz-animation: animateBubble 10s linear infinite,sideWays 4s ease-in-out infinite alternate;
  animation: animateBubble 10s linear infinite,sideWays 4s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-3{
  width: 11px;
  height: 11px;
  left: 460px;
  top: 30%;
  -webkit-animation: animateBubble 18s linear infinite,sideWays 2s ease-in-out infinite alternate;
  -moz-animation: animateBubble 18s linear infinite,sideWays 2s ease-in-out infinite alternate;
  animation: animateBubble 18s linear infinite,sideWays 2s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-4{
  width: 16px;
  height: 16px;
  left: 430px;
  top: 90%;
  -webkit-animation: animateBubble 12s linear infinite,sideWays 3s ease-in-out infinite alternate;
  -moz-animation: animateBubble 12s linear infinite,sideWays 3s ease-in-out infinite alternate;
  animation: animateBubble 12s linear infinite,sideWays 3s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-5{
  width: 6px;
  height: 6px;
  left: 50%;
  top: 50%;
  -webkit-animation: animateBubble 19s linear infinite,sideWays 4s ease-in-out infinite alternate;
  -moz-animation: animateBubble 19s linear infinite,sideWays 4s ease-in-out infinite alternate;
  animation: animateBubble 19s linear infinite,sideWays 4s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-6{
  width: 9px;
  height: 9px;
  left: 70%;
  top: 230px;
  -webkit-animation: animateBubble 11s linear infinite,sideWays 2s ease-in-out infinite alternate;
  -moz-animation: animateBubble 11s linear infinite,sideWays 2s ease-in-out infinite alternate;
  animation: animateBubble 11s linear infinite,sideWays 2s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-7{
  width: 6px;
  height: 6px;
  left: 65%;
  top: 30%;
  -webkit-animation: animateBubble 10s linear infinite,sideWays 2s ease-in-out infinite alternate;
  -moz-animation: animateBubble 10s linear infinite,sideWays 2s ease-in-out infinite alternate;
  animation: animateBubble 10s linear infinite,sideWays 2s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-8{
  width: 6px;
  height: 6px;
  left: 85%;
  top: 35%;
  -webkit-animation: animateBubble 12s linear infinite,sideWays 3s ease-in-out infinite alternate;
  -moz-animation: animateBubble 12s linear infinite,sideWays 3s ease-in-out infinite alternate;
  animation: animateBubble 12s linear infinite,sideWays 3s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-9{
  width: 13px;
  height: 13px;
  left: 90%;
  top: 40%;
  -webkit-animation: animateBubble 19s linear infinite,sideWays 4s ease-in-out infinite alternate;
  -moz-animation: animateBubble 19s linear infinite,sideWays 4s ease-in-out infinite alternate;
  animation: animateBubble 19s linear infinite,sideWays 4s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-10{
  width: 12px;
  height: 12px;
  left: 80%;
  top: 70%;
  -webkit-animation: animateBubble 16s linear infinite,sideWays 2s ease-in-out infinite alternate;
  -moz-animation: animateBubble 16s linear infinite,sideWays 2s ease-in-out infinite alternate;
  animation: animateBubble 16s linear infinite,sideWays 2s ease-in-out infinite alternate;
}

.bubble-dotted .dotted-1{
  background: -webkit-linear-gradient(0deg, #58f106, #23c10e 50%);
  background: -ms-linear-gradient(0deg, #58f106, #23c10e 50%);
  background: -moz-linear-gradient(0deg, #58f106, #23c10e 50%);
}

.bubble-dotted .dotted-2{
  background: -webkit-linear-gradient(0deg, #862ff1, #163fae 50%);
  background: -ms-linear-gradient(0deg, #862ff1, #163fae 50%);
  background: -moz-linear-gradient(0deg, #862ff1, #163fae 50%);
}

.bubble-dotted .dotted-3{
  background: -webkit-linear-gradient(0deg, #ff5d06, #ffc806 50%);
  background: -ms-linear-gradient(0deg, #ff5d06, #ffc806 50%);
  background: -moz-linear-gradient(0deg, #ff5d06, #ffc806 50%);
}

.bubble-dotted .dotted-4{
  background: -webkit-linear-gradient(0deg, #d406b7, #fc1a66 50%);
  background: -ms-linear-gradient(0deg, #d406b7, #fc1a66 50%);
  background: -moz-linear-gradient(0deg, #d406b7, #fc1a66 50%);
}

.bubble-dotted .dotted-5{
  background: -webkit-linear-gradient(0deg, #fe5f12, #fec412 50%);
  background: -ms-linear-gradient(0deg, #fe5f12, #fec412 50%);
  background: -moz-linear-gradient(0deg, #fe5f12, #fec412 50%);
}

.bubble-dotted .dotted-6{
  background: -webkit-linear-gradient(0deg, #d622bf, #fb196a 50%);
  background: -ms-linear-gradient(0deg, #d622bf, #fb196a 50%);
  background: -moz-linear-gradient(0deg, #d622bf, #fb196a 50%);
}

.bubble-dotted .dotted-7{
  background: -webkit-linear-gradient(0deg, #60f112, #30c719 50%);
  background: -ms-linear-gradient(0deg, #60f112, #30c719 50%);
  background: -moz-linear-gradient(0deg, #60f112, #30c719 50%);
}

.bubble-dotted .dotted-8{
  background: -webkit-linear-gradient(0deg, #fe5f12, #fec412 50%);
  background: -ms-linear-gradient(0deg, #fe5f12, #fec412 50%);
  background: -moz-linear-gradient(0deg, #fe5f12, #fec412 50%);
}

.bubble-dotted .dotted-9{
  background: -webkit-linear-gradient(0deg, #842af1, #0f40aa 50%);
  background: -ms-linear-gradient(0deg, #842af1, #0f40aa 50%);
  background: -moz-linear-gradient(0deg, #842af1, #0f40aa 50%);
}

.bubble-dotted .dotted-10{
  background: -webkit-linear-gradient(0deg, #58f106, #23c10f 50%);
  background: -ms-linear-gradient(0deg, #58f106, #23c10f 50%);
  background: -moz-linear-gradient(0deg, #58f106, #23c10f 50%);
}

.dotted-bubble-01{
	position: absolute;
	display: block;
  width: 90px;
  height: 70px;
  left: 70%;
  top: 50%;
  border-radius: 50%;
  -webkit-animation: animateBubble 15s linear infinite,sideWays 2s ease-in-out infinite alternate;
  -moz-animation: animateBubble 15s linear infinite,sideWays 2s ease-in-out infinite alternate;
  animation: animateBubble 15s linear infinite,sideWays 2s ease-in-out infinite alternate;
  background: -webkit-linear-gradient(0deg, #65ce90, #c2e858 50%);
  background: -ms-linear-gradient(0deg, #65ce90, #c2e858 50%);
  background: -moz-linear-gradient(0deg, #65ce90, #c2e858 50%);
  box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.30);
  z-index: 1;
}

.dotted-bubble-02{
	position: absolute;
	display: block;
  width: 150px;
  height: 110px;
  left: 50%;
  top: 40%;
  border-radius: 50%;
-webkit-animation: animateBubble 10s linear infinite,sideWays 4s ease-in-out infinite alternate;
  -moz-animation: animateBubble 10s linear infinite,sideWays 4s ease-in-out infinite alternate;
  animation: animateBubble 10s linear infinite,sideWays 4s ease-in-out infinite alternate;
  background: -webkit-linear-gradient(0deg, #6b29ca, #5e9aef 50%);
  background: -ms-linear-gradient(0deg, #6b29ca, #5e9aef 50%);
  background: -moz-linear-gradient(0deg, #6b29ca, #5e9aef 50%);
  box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.30);
  z-index: 1;
}

.dotted-bubble-03{
	position: absolute;
	display: block;
  width: 70px;
  height: 50px;
  left: 30%;
  top: 30%;
  border-radius: 50%;
  -webkit-animation: animateBubble 18s linear infinite,sideWays 2s ease-in-out infinite alternate;
  -moz-animation: animateBubble 18s linear infinite,sideWays 2s ease-in-out infinite alternate;
  animation: animateBubble 18s linear infinite,sideWays 2s ease-in-out infinite alternate;
  background: -webkit-linear-gradient(0deg, #cf7790, #eaa477 50%);
  background: -ms-linear-gradient(0deg, #cf7790, #eaa477 50%);
  background: -moz-linear-gradient(0deg, #cf7790, #eaa477 50%);
  box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.30);
  z-index: 1;
}
@-webkit-keyframes animateBubble{0%{margin-top:20%}100%{margin-top:-30%}}@-moz-keyframes animateBubble{0%{margin-top:20%}100%{margin-top:-30%}}@keyframes animateBubble{0%{margin-top:20%}100%{margin-top:-30%}}
@-webkit-keyframes sideWays{0%{margin-left:0}100%{margin-left:25px}}@-moz-keyframes sideWays{0%{margin-left:0}100%{margin-left:25px}}@keyframes sideWays{0%{margin-left:0}100%{margin-left:25px}}

@media screen and (max-width:991px) {
  .call-to-section .content h2 {
    font-size: 60px;
  }
}

@media screen and (max-width:767px) {
  .call-to-section .content h2 {
    font-size: 28px;
  }
  .call-to-section .content .sub-title{
    font-size: 12px;
  }
  .call-to-section .content .sub-title:before {
    top: 9px;
    right: 100%;
    margin-right: 5px;
    width: 40px;
  }
  .call-to-section .content .sub-title:after {
    top: 9px;
    left: 100%;
    margin-left: 5px;
    width: 40px;
  }
  .call-to-section .content .link-box{
    display: grid;
  }
  .call-to-section .link-box .theme-btn {
    min-width: 260px;
    margin: 0px 10px 20px;
    padding: 0px 10px;
}
}
/*-------------------- tss call to action section css end ----------------- */
/*-------------------- tss appointment page css start ----------------- */
#calendar{
  background-image:unset;
}
#calendar .ui-widget.ui-widget-content {
  width: 100%;
  padding: 20px;
}
.appointment-section .tss-date-box{
  margin-bottom: 15px;
}
.appointment-section .appointment_box {
  border: 1px solid var(--color-gray);
  padding: 12px 0px;
  background-color: var(--color-white);
  margin-bottom: 15px;
  transition: all 0.5s ease;
}
.appointment-section .appointment_box:hover{
  background-color:var(--color-alice-blue);
}
.appointment-section .spots-available {
  font-weight: 500;
  text-transform: uppercase;
  font-size: .7rem;
  display: block;
  line-height: 2.7;
  color: var(--color-yellow);
  padding-bottom: 8px;
}
.tss-appointment-form-box {
  display: none;
  background-color: var(--color-white);
  padding: 20px;
  border: 1px solid #e1e6eb;
  margin-bottom: 15px;
  /* opacity: 0; */
}
.appointment-section .instruction-box{
  background:var(--color-alice-blue);
  padding:20px;
}

.appointment-heading{
  background-color: var(--color-yellow);
  padding: 10px;
}
.appointment-heading .appointment-heading-text{
  margin-bottom: 0;
}
@media screen and (max-width:991px) {
  .appointment-section .book-a-call-btn span {
      padding: 4px 10px;
      font-size: 12px;
  }
  .appointment-section form{
    padding: 0;
  }
}
/*-------------------- tss appointment page css end ------------------- */
.tss-blog-section .container{
	position:relative;
	z-index:1;
}