body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
}

.divPageHeader {
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  color: white;
  background-color: black;
  z-index: 100;
  text-align: center;
  padding: 5em;

}

.aHomePageTrf {
  text-decoration: none;
  color: white;
  margin: 0;
  padding: 0;

}

.h1CompName {
  margin: 0;
  font-size: 3em;
  font-weight: bold;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-shadow: 0 0 10px gold;
  animation: glowCompName 1s linear infinite;
  animation-fill-mode: backwards;
}

.h2pvtltd {
  font-size: 4em;
}

@keyframes glowCompName {

  0%,
  100% {
    text-shadow: 0 0 1px gold;
  }

  50% {
    text-shadow: 0 0 20px gold;
  }
}

.divContactUsButtons {
  display: flex;
  flex-flow: row;
  align-items: center;
  gap: 2em;
}

.aContactUsCompDetails {
  background-color: blue;
  text-decoration: none;
  text-transform: uppercase;
  color: white;
  font-size: 3vw;
  font-weight: bold;
  margin-top: 1em;
  padding: 1em 1.5em;
  letter-spacing: 0.1em;
  cursor: pointer;
}

.aContactOnWhatsapp {
  background-color: darkgreen;
  text-decoration: none;
  text-transform: uppercase;
  color: white;
  font-size: 3vw;
  font-weight: bold;
  margin-top: 1em;
  padding: 1em 1.5em;
  letter-spacing: 0.1em;
  cursor: pointer;
}

.aContactUsCompDetails:hover {
  box-shadow: inset 0 0 10px white;
}

.aContactUsCompDetails:active {
  box-shadow: inset 0 0 15px white;
  transform: translateY(100);
}

.spanBold {
  font-weight: bold;
  text-decoration: underline;
  background-color: yellow;
  font-style: italic;
}

.divIsoCin {
  display: flex;
  flex-flow: column;
  gap: 1em;
  align-items: center;
}

.divCompDetails {
  display: flex;
  flex-flow: column;
  gap: 2em;
  padding: 2em;
  margin: 1em 0;
  align-items: center;
}

.divCompLogo {
  border: solid 1px black;
  box-shadow: 0 0 5px 1px black;
  margin-right: 1.5em;
}

.imgCompLogo {
  width: 35vw;
}

.spanISOLine,
.spanCIN {
  font-size: 4.5vw;
  text-align: center;
}

.divTagline {
  background-color: #1E1E1E;
  padding: 4em;
}

.divTagline h2 {
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 0em;
  font-size: 3em;
  margin: 0;
  color: cyan;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
}


.divWhatWeDo {
  border: solid 1px black;
  border-radius: 1em;
  margin: 1em;
  overflow-x: hidden;
  display: flex;
  flex-flow: column;
  width: 80%;
  margin-left: 10%;
  margin-right: 10%;
}

.divWhatWeDoHeader {
  display: flex;
  flex-flow: row;
  align-items: center;
}

.divWhatWeDoHeader h1 {
  flex: 1;
  text-align: center;
  font-size: 4em;
  ;
}

.divCards {
  display: flex;
  flex-flow: row;
  gap: 1em;
  overflow-x: auto;

}

.divCard {
  flex: 1;
  display: flex;
  flex-flow: column;
  border: solid 2px brown;
  padding: 1em;
  border-radius: 1em;
  margin-bottom: 1em;
  width: 70em;
  height: auto;
  box-shadow: 5px 5px 5px blue;
}

.spanCardNo {
  font-weight: bold;
  font-size: 3em;
}

.divCard p {
  font-size: 2em;
}


.divCLine {
  padding: 4em 0.7em;
  text-align: center;
  overflow: hidden;
}

.pCLine {
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 3em;
  font-weight: bold;
  color: navy;

}

.pVisionDetails {
  margin-top: 2em;
  font-size: 3em;
}

.divAboutComp {
  background-color: antiquewhite;
  padding: 5em;
}

.divAboutLine {
  text-align: center;
}

.spanAboutLine {
  font-size: 3em;
  text-transform: uppercase;
}

.divSocialLinks {
  display: flex;
  flex-flow: column;
  gap: 1em;
  overflow-x: auto;
  position: fixed;
  right: -38%;
  top: 40%;
  width: 40%;
  background-color: white;
  border: solid 1px black;
  border-radius: 2em;
  padding: 0.4em 0.1em;
  transition: right 0.5s ease-in;
}

.divSocialLinks:hover {
  right: 0.5%;

}

.aSocialLink {
  flex: 1;
  text-decoration: none;
  padding: 0.5em 1em;
  color: black;
  cursor: pointer;
  text-wrap: nowrap;
  font-size: 1.7em;
  display: flex;
  flex-flow: row;
  align-items: center;
}

.aSocialLink:hover {
  background-color: navy;
  box-shadow: inset 0 0 20px white;
  color: white;
  border-radius: 2em;
  animation: borderSideLinkGlowInGlowOut infinite 1s;
}

@keyframes borderSideLinkGlowInGlowOut {

  0%,
  100% {
    box-shadow: inset 0 0 0px white;
  }

  50% {
    box-shadow: inset 0 0 20px white;
  }
}

.imgSocialLink {
  width: 64px;
  height: 64px;
  margin-right: 1em;
  border-radius: 32px;
}

.divContactUs {
  text-align: center;
  padding: 5em 2em;
}

.divContactUs h1 {
  font-size: 3em;
}

.divVCard {
  display: flex;
  flex-flow: column;
}

.divVCardDetails {
  display: flex;
  flex-flow: column;
  align-items: center;
}

.divVCardDetails p {
  font-size: 1.5em;
  margin: 0 1em;
}

.imgContacts {
  width: 64px;
  height: 64px;
}

.divOperatingHours {
  display: flex;
  flex-flow: column;
  align-items: center;
  margin-top: 3em;
}

.divOperatingHours table td,
.divOperatingHours table th {
  font-size: 2em;
}

.divFooter {
  margin-top: 5em;
  padding: 8em;
  background-color: black;
}

.divFooter p {
  font-size: 2.5em;
  color: white;
}

.divLocateUs h1 {
  text-align: center;
}

.h1DetailsHead {
  color: white;
  padding: 0.3em;
  font-size: 2em;
  cursor: pointer;
  margin: 0.5em 1em;
  text-align: left;
  outline: none;
  border: none;
  font-style: italic;
}

.h1DetailsHead,
.h1DetailsHeadActive {
  background-color: #ab01ef;
}

.h1DetailsHead::after {
  content: '+';
  float: right;
  font-style: normal;
}

.h1DetailsHeadActive::after {
  content: '-';
  font-style: normal;
}

.divCards {
  max-height: 0;
  transition: max-height 0.5s ease-in-out;
  margin: 0.5em 1.6em;
  padding: 0 0.3em;
}

.divSocialFooterLinks {
  display: inline-block;
}

.aSocialFooterLink {
  padding: 1;
  margin: 0 1em;
}

.aSocialFooterLink:hover .imgSocialFooterLink {
  animation: borderFooterLinkGlowInGlowOut infinite 1s;
}

@keyframes borderFooterLinkGlowInGlowOut {

  0%,
  100% {
    box-shadow: 0 0 0px white;
  }

  50% {
    box-shadow: 0 0 20px white;
  }
}

.imgSocialFooterLink {
  width: 64px;
  height: 64px;
  border-radius: 32px;
}

.tblContactDetails td:nth-child(2) {
  text-align: left;
}

.tblOperatingHours {
  border-collapse: collapse;
}

.tblOperatingHours th {
  background-color: navy;
  color: cornsilk;
  padding: 0.7em 1em;
  border-radius: 3em;
}

.tblOperatingHours td {
  padding: 0.5em 1em;
}

.tblOperatingHours tr {
  margin: 0.5em 0;
}

.tblOperatingHours tr:nth-child(odd) {
  background-color: khaki;

}

.tblOperatingHours tr:nth-child(1) {
  background-color: none;
}

.tblOperatingHours tr:nth-child(n) td {
  border-radius: 3em;
}

.divQueryPane {
  padding: 2em 0em;
  display: flex;
  flex-flow: column;
  margin: 4em 0;
  background-color: darkgreen;
  width: 100%;
}

.divQueryUDetails {
  display: flex;
  flex-flow: row;
  width: 84%;
  margin:0 5%;
  gap: 0.5em;
}

.txtfldQueryPane {
  font-size: 2em;
  padding: 0.4em 1em;
  border-radius: 5em;
}

.divQueryUDetails .txtfldQueryPane {
  flex: 1;
  width: 28%;
}

.divQueryDlgHead h3{
  font-size: 1.5em;
}

.divQueryBox {
  display: flex;
  flex-flow: row;
  gap: 1em;
  width: 84%;
  margin: 2em 5%;
}
.divQueryBox .txtfldQueryPane{
  width: 80%;
}
.btnSendTextQueryPane {
  width: 20%;
  font-size: 2.5em;
  font-weight: bold;
  padding: 0.4em 0em;
  background: linear-gradient(to bottom right, black, white, black);
  border: solid 1px white;
  color: navy;
  box-shadow: 0 0 20px white;
  border-radius: 5em;
  transition: 0.5s;
  overflow: hidden;
  animation: btnSendTextQueryPaneBgMove 1s ease-in-out infinite;
}

.divQueryDlgHead h3 {
  color: white;
  text-align: center;
}

.btnSendTextQueryPane:hover {
  letter-spacing: 0.1em;
  animation: none;
}

.btnSendTextQueryPane:active {
  transform: translateY(10px);
  animation:none;
}

@keyframes btnSendTextQueryPaneBgMove {

  0%,
  100% {
    background: linear-gradient(to bottom right, black, white, black);
  }

  50% {
    background: linear-gradient(to bottom right, green 20%, white 50%,green);

  }
}

.divMsgDialog {
  position: absolute;
  display: none;
}