* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   font-family: sans-serif;
}

body {
   width: 100vw;
   display: flex;
   justify-content: center;
   align-items: center;
   position: relative;
   background-color: rgb(251, 252, 253) !important;
   background-color: #fbfcfd !important;
}

.ring {
   width: 200px;
   height: 200px;
   border: 0px solid black;
   border-radius: 50%;
   position: absolute;
}

.Container {
   position:absolute;
   display: flex;
   justify-content: center;
   align-items: center;
}

.ring:nth-child(1) {
   border-bottom-width: 8px;
   border-color: aqua;
   animation: rotate1 2s linear infinite;
}

.ring:nth-child(2) {
   border-right-width: 8px;
   border-color: white;
   animation: rotate2 2s linear infinite;
}

.ring:nth-child(3) {
   border-top-width: 8px;
   border-color: yellow;
   animation: rotate3 2s linear infinite;
}

.loading {
   color: white;
}

@keyframes rotate1 {
   0% {
      transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
   }

   100% {
      transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
   }
}

@keyframes rotate2 {
   0% {
      transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
   }

   100% {
      transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
   }
}

@keyframes rotate3 {
   0% {
      transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
   }

   100% {
      transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
   }
}


html {
   font-size: 62.5%;
   height: 100%;
}

.Outer-div {
    /* height: 90%; */
    min-width: 50%;
    /* border-color: rgb(242, 241, 241); */
    display: flex;
    flex-direction: row;
    /*align-items: center;*/
    /* border-radius: 5px; */
    border: 1px solid rgba(26,26,26,0.1);
    border-radius: 8px;
    box-shadow: 0 1px 8px 0 rgb(0 0 0/8%);
    /*width: 65%;*/
    margin: auto;
    margin-top: 66px;
    margin-bottom: 30px;
    max-width: 800px;
    min-height: 550px;
    width: 100%;
    flex-wrap:wrap;
    position:relative;
}
 .Outer-div.time-slot-active{
        max-width:70%!important;
   }
.Left-Side-Inner-div {
   background-color: white;
   /*height: 100%;*/
   flex:1;
   border-radius: 5px 0px 0px 5px;
   /* border: solid rgb(240, 240, 240);
   border-width: 1px;
   border-right-width: 0px; */
   display: flex;
      flex-direction: column;
      gap: 30px;
      padding-bottom: 3rem;
}
.Left-Side-Inner-div.time-slot-active{
    width:35%;
    min-width:300px;
}

.img-heading-para-container {
   padding-top: 2.5rem;
   height: 91.5%;
}

.img-heading-container {
   display: flex;
   justify-content: center;
   flex-direction: column;
}

.logo {
   height: 70.8%;
   width: 16.26%;
   max-height: 65px;
   max-width: 65px;
   border-radius: 50%;
   margin-left: 7.6%;
}

.Harshit {
   color: #1A1A1A9C;
   font-size: 1.6rem;
   font-weight: bold;
   margin-top: 2%;
   padding: 0rem 1rem 0rem 3rem;
}

.Business-Growth-h1 {
   font-size: 2.8rem;
   color: #1A1A1A;
   margin-top: 0.5%;
   /*margin-bottom: 24px;*/
   font-weight: bolder;
   padding: 0rem 1rem 0rem 3rem;
   font-family: 'Jost', sans-serif;
}

.svg-45-min {
   height: 10%;
   width: 100%;
   padding: 0.1rem 1rem 0rem 3rem;
   display: flex;
   align-items: center;
   margin-top: 2%;
   /*justify-content: center;*/
    margin-bottom: 20px;
}
.span-45-min {
   color: #1A1A1A9C;
   font-size: 1.5rem;
   font-weight: bold;
   padding-left: 2%;
   padding-top: 1%;
}

.para-Left-div {
   font-family: sans-serif;
   font-size: 1.5rem;
   font-weight: lighter;
   color: #1A1A1A;
   /*padding: 0rem 1rem 0rem 3rem;*/
   margin-top: 3.5%;
   text-align: justify;
   padding:0 30px;
   line-height:25px;
}

.Cookie-Report {
   display: flex;
   justify-content: space-between;
}

#Cookie-settings-button {
   border: none;
   background-color: white;
   color: #0069FF;
   /*padding: 0rem 1rem 0rem 3rem;*/
   font-weight: bolder;
   font-family: 'Jost', sans-serif;
   font-family: 'Montserrat', sans-serif;
   align-self: start;
    padding-right: 10px;
    padding-left: 30px;
    font-size: 14px;
    line-height: 19px;
}

.Report-abuse {
   color: #1A1A1A;
   font-family: sans-serif;
   /*padding: 0rem 3rem 0rem 1rem;*/
   margin-right: 30px;
    margin-left: 10px;
    font-size: 14px;
    line-height: 19px;
}

.Right-Side-Inner-div {
   background-color: white;
   /*height: 100%;*/
   /*max-width: 50%;*/
   flex:1;
   border-radius: 0px 5px 5px 0px;
   border: solid rgb(240, 240, 240);
   border-width: 0px;
   border-left-width: 1px;
   padding:1rem;
}
.Right-Side-Inner-div.time-slot-active{
    width:65%;

}
.Select-a-Date-and-Time
{
   display: flex;
   text-align: center;
}

.Select-a-Date-and-Time h2 {
   font-size: 1.9rem;
   padding-top:2rem;
   width: 100%;
   font-family: sans-serif;
   font-weight: bold;
   margin-top: 0px;
   margin-bottom:20px;
}

.Date-chart-Time-zone {
   height: 100%;
   width: 100%;
}

.Date-chart {
   height: 100%;
   width: auto;
   margin: 0 19px;
   display:flex;
    /*flex-wrap: wrap;*/
}

/*.Month-Year {*/
   /*margin: 2px 6px 10px 13px;*/
/*   height: 11%;*/
/*   display: flex;*/
/*   justify-content: center;*/
/*   align-items: center;*/
/*   flex-direction: row;*/
/*   width: 92.2%;*/
/*   margin: 6px 6px 15px;*/
/*}*/

.Month-Year {
    /* margin: 2px 6px 10px 13px; */
    /* height: 11%; */
    display: flex;
    justify-content: center;
    align-items: center;
    /* flex-direction: row; */
    /* width: 100%; */
    margin: 6px 6px 15px;
    gap: 10px;
}

.Arrow-Icon-Left {
   height: 40px;
   width: 40px;
   display: flex;
   justify-content: center;
   align-items: center;
   /*margin-right: 5%;*/
}

.Month-Name {
   font-family: sans-serif;
   font-size: 1.6rem;
   color: #1A1A1A;
   /*width: 125px;*/
   /*height: 24px;*/
}

.Arrow-Icon-Right-div {
   height:40px;
   width: 40px;
}

.Arrow-Icon-Right {
   border: none;
   width: 40px;
   height: 40px;
   background-color: #0069FF11;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
}

.table {
   height:80.6%;
   display: flex;
   justify-content: space-around;
   table-layout: fixed;
  
}

.table th {
   font-size: 1.1rem;
   font-family: sans-serif;
   font-weight: lighter;
   height: 0.218%;
   width: 11%;
   text-align:center;
}

.table td {
   height: 10%;
   width: 11%;
   font-size: 1.45rem;
   font-family: sans-serif;
   color: #777776;
}

.day-btn {
    padding-left: 3%;
    height: 40px;
    width: 40px;
    border: none;
    background-color: transparent;
    margin:6px;
    color: rgba(26,26,26,0.61);
}

.available.within-range {
   height:40px;
   width:40px;
   background-color: #0069FF11;
   border-radius: 50%;
   border: none;
   margin-right: 7px;
   color: #0069E6;
   font-size: 1.5rem;
   font-family: sans-serif;
   font-weight: bolder;
   
}

.available:hover,
.Arrow-Icon-Right:hover {
   background-color: #d5e5fe;
}

.available.selected {
   background-color: #0069E6;
   color:#fff;
}

.available.selected span {
   color: white;
}

.Time-zone {
   /*height:19.3%;*/
   width: 100%;
}
.today {
        position: relative;
    }

    .today:after {
        content: "";
        position: absolute;
        bottom: 5px;
        left: 50%;
        transform: translateX(-50%);
        width: 5px;
        height: 5px;
        background-color: currentColor;
        border-radius: 50%;
    }

.Time-zone-para {
   color: #1A1A1A;
   font-weight: bolder;
   font-size: 1.5rem;
   font-family: sans-serif;
   padding: 0rem 3.2rem;
   margin-bottom: 3px;
}
.Indian-standard-time{
    padding: 0rem 3.2rem;
}
.Indian-standard-time-button {
    border: none;
    background-color: white;
    display: flex;
    flex-direction: row;
    /* height: 30px; */
    /* width: 100%; */
    /* margin-left: 10%; */
    align-items: center;
    font-size: 14px;
    padding: 0.5rem;
    gap: 5px;
}

.Indian-standard-time-button:hover {
   background-color: #dcdcdb;
   border-radius: 20px;
}

.written-IST {
   /*height: 64%;*/
   /*width: 45.4%;*/
   font-weight: lighter;
   font-family: sans-serif;
}

.earth-svg {
   margin-left: 5px;
}

.dot-and-10 {
   display: flex;
   flex-direction: column;
   padding-top: 2%;
}

/*time slot design*/
#time-slots-div{
    max-height:45rem;
}
    .time-slots{

       display: flex;
        flex-direction: column;
        align-items: center;
        gap:5px;
        padding-right:10px;
   }
   
.time-slot
{
 height:55px;
 width:222px;
 background-color:white;
 margin-bottom:1%;
border:1px solid  rgba(0,105,255,0.5);
border-radius:4px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.slot-time{
    color:#0069E6;
    font-weight:700;
    font-size:16px;
}
.time-slot:hover{
    border:2px solid #0069E6;
}
.disabled-slot-btn{
        color: white;
    background-color: rgb(0 0 0/60%);
    border-radius: 3px;
    font-family: sans-serif;
    font-size: 16px;
    font-weight: bold;
    border: 0px solid;
    height: 50px;
    width: 120px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.time-slot.selected{
    border:none;
    gap:7px;
}
.action-btn{
    
        color: white;
    border-radius: 3px;
    font-family: sans-serif;
    font-size: 16px;
    font-weight: bold;
    border: 0px solid #0069FF;
    background-color: #0069FF;
    height: 50px;
    width: 120px;
}
   #xyadsss{
       display:none;
   }
   
   
   /*Branding section */
        .VJL48qbQzWENTFAh1Knk {
            position: absolute;
            top: -5px;
            right: -5px;
            z-index: 1;
            overflow: hidden;
            width: 105px;
            height: 105px;
            text-decoration: none;
            pointer-events: none;
            transition: all .1s ease-in;
            will-change: transform;
        }
        .jWSwi_R_Xl7kPjUhuQoo {
            position: relative;
            top: 21px;
            left: -11px;
            z-index: 1;
            display: block;
            width: 160px;
            padding: 9px 0 6px;
            background-color: #505960;
            color: #fff;
            box-shadow: 0 2px 4px 0 rgb(0 0 0/20%);
            font-weight: 700;
            line-height: 1.2;
            text-align: center;
            text-decoration: none;
            pointer-events: auto;
            transition: all .1s ease-in;
            transform: rotate(45deg);
        }
        .VJL48qbQzWENTFAh1Knk._i6SG2jlTfccH2ZZblil::before, .VJL48qbQzWENTFAh1Knk._i6SG2jlTfccH2ZZblil::after {
            content: "";
            position: absolute;
            width: 6px;
            height: 6px;
            background-color: #505960;
            transition: all .1s ease-in;
        }
        .VJL48qbQzWENTFAh1Knk._i6SG2jlTfccH2ZZblil::after {
            content: "";
            position: absolute;
            width: 6px;
            height: 6px;
            background-color: #505960;
            transition: all .1s ease-in;
        }
        .V7YfvNqWv0XKYKys7N7K {
            margin-left: -7px;
            color: var(--color-grey-4,#F2F2F2);
            font-size: 8px;
            text-transform: uppercase;
        }
        .HvybhIo63ZbBJxHh7Ann {
            margin-left: -7px;
            color: #fff;
            font-size: 14px;
        }
        .VJL48qbQzWENTFAh1Knk._i6SG2jlTfccH2ZZblil::before {
            top: 0;
            left: 0;
        }
        .VJL48qbQzWENTFAh1Knk._i6SG2jlTfccH2ZZblil::after {
            right: 0;
            bottom: 0;
        }
        
    .selected-day-date{
        margin-bottom: 1.5rem;
        margin-top: 1rem;
        margin-left: -10px;
    }
@media  screen and (max-width:1440px) {
   .logo {
      margin-left:5%;
   }
}
@media  screen and (max-width:1024px) {
   .Chart-button {
      height:38px;
      width:38px;
   }
   /*.written-IST {*/
   /*   width: 48%;*/
   /*}*/
   .Arrow-Icon-Right {
      width: 38px;
      height: 38px;
   }
   .logo {
      margin-left:7.8%;
   }
   .Outer-div.time-slot-active{
        max-width:92%!important;
   }
}
@media screen and (max-width:1000px) {
    
}
@media screen and (max-width:768px) {
   .Outer-div {
      flex-direction:column;
      max-width:95%;
        width: 95%;
        padding: 1rem 2rem;
        margin: 2rem;
        position: relative;
        margin:auto;
   }
    .Outer-div.time-slot-active{
        max-width:95%!important;
   }
   .Left-Side-Inner-div.time-slot-active {
    
       width:60%;
       margin:auto;
   }
   .Left-Side-Inner-div {
      width: 65%;
      border: none;
      margin:auto;
   }
   .Right-Side-Inner-div.time-slot-active{
       width:100%;
   }
   .Right-Side-Inner-div {
     width:100%;
      border-top:1px solid rgb(240, 240, 240);
      padding-bottom:2rem;
   }
   .logo {
      margin-left:0%;
   }
   
   .Harshit {
      padding:0px;
   }
   
   .Business-Growth-h1 {
      padding:0px;
      padding-right: calc((100% - 440px)/2);
    padding-left: calc((100% - 440px)/2);
   }
   .span-45-min{
        max-width: 400px;
        padding: 0 30px;
   }
   .svg-45-min{
       /*margin:auto;*/
       justify-content: center;
   }
   .img-heading-para-container {
      padding-top:0px;
   }
   .img-heading-container {
      align-items: center;
   }
   .Chart-button {
      height:38px;
      width:38px;
   }
   /*.written-IST {*/
   /*   width: 40%;*/
   /*}*/
  
   .Time-zone {
      text-align: center;
   }
   .Indian-standard-time
   {
      display: flex;
      justify-content: center;
   }
   .Indian-standard-time-button{
       justify-content:center;
   }
   .Cookie-Report {
      position: absolute;
      bottom: 0px;
      display: flex;
      width: 100%;
      /*margin-left: -2rem;*/
    /*padding: 1rem 2rem;*/
    left:0;
  }
  .Indian-standard-time-button {
   width:100%;
  }
  /*.Date-chart-Time-zone {*/
  /* height:400px;*/
  /*}*/
  .para-Left-div {
    padding:0rem 0rem 0rem 0rem;
    }
}
@media screen and (max-width:500px) {
    #time-slots-div{
        width:100%;
        max-height:100%;
    }
    .ssxesgs.time-slot-active{
        flex-direction:column-reverse!important;
    }
    .page-wraper{
        width:100%;
    }
   .Business-Growth-h1 {
     text-align: center;
   }
   .Outer-div.time-slot-active {
        max-width: 100%!important;
        padding:0;
    }
    
   .Outer-div {
        width: 100%;
        padding:0;
        margin: 0rem;
        max-width:100%;

   }
   .Right-Side-Inner-div.time-slot-active {
        width: 100%;
        padding:0;
    }
   .Left-Side-Inner-div{
       width:80%;
   }
   .time-slots{
       margin-bottom:2rem;
        padding: 1px 15px;
        padding-bottom:2rem;
        padding-right:15px;
   }
   .time-slot{
       width:100%;
   }
   .time-slot-active{
       /*display:none;*/
   }
   .calender-div{
       height:100%;
   }
   .img-heading-para-container.time-slot-active, .Select-a-Date-and-Time.time-slot-active, .data-chart-container.time-slot-active{
        display:none;
   }
   .Date-chart-Time-zone{
       flex-direction:column;
   }

   #backToCalenderSES{
        display: flex;
        padding: 5px;
        position: absolute;
        left: 0;
        top: 0px;
        justify-content: center;
        align-items: center;
        width: 43px;
        height: 43px;
        border: 1px solid rgba(26,26,26,0.1);
        border-radius: 50%;
        background-clip: padding-box;
        color: rgb(0,105,255);
        font-size: 24px;
   }
   #selectedDaySES{
       font-size:2.5rem;
   }
   #selectedDateSES{
       font-size: 1.5rem;
       text-align: center;
   }
   .disabled-slot-btn, .action-btn{
       width:48%;
   }
   .Right-Side-Inner-div{
       width:100%;
   }
   .Time-zone {
        border-bottom: 1px solid #dee2e6!important;
    }
   /*.written-IST {*/
   /*     width: 50%;*/
   /* }*/
    .xyadsss.time-slot-active{
        display:block!important;
    }
}
@media screen and (max-width:375px) {
   .img-heading-para-container {
      width:100%;
   }
  
 }
@media screen and (max-width:320px) {
   .para-Left-div {
      width:100%;
   }
   /*.written-IST {*/
   /*   width: 55%;*/
   /*}*/
} 

::-webkit-scrollbar-track {
  /* background-color: #f5f5f5; */
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: #888;
  border-radius: 10px;
}

::-webkit-scrollbar {
  width: 8px;
  height: 5px;
}
::-webkit-scrollbar-thumb:hover{
  background-color: #b0adad;
}
.hide{
    display:none;
}