body {
    font-family: Arial, sans-serif;
    background-color:transparent;
    height: 100vh;
    margin: 0;
    font-size: medium;
    -ms-overflow-style: none; /* Hide scrollbar */
    overflow: hidden; /* Optional: hide overflow */
}

.waterMark{
  background-image: url('/img/logos/unesco-logo-blue.svg'); /* URL of your watermark image */
  background-repeat: no-repeat; /* Prevent tiling */
  background-position: center; /* Position the watermark at the center */
  background-size: cover; /* Adjust the size to cover the whole screen or contain based on preference */
  opacity: 0.8; /* Adjust transparency if the watermark is too prominent */
  pointer-events: none; /* Ensure the watermark does not interfere with user interactions */  
  position: absolute;
  left:2px;
  top:2px;
  height: 40px;
  width: 190px;
  z-index: 1;
  display: none;
}

#Group_Title{
  color: black;
}
.card {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.card-header {
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
}

.chat-area {
  border-radius: 15px;
  flex-grow: 1;
  overflow-y: auto;
  height: 100%;
}

#chat-content {
  flex-grow: 1;
  overflow-y: auto;
}

.form-outline .form-control:focus~.form-label {
  color: #39c0ed;
  transition: all 0.2s linear;
}

.form-outline .form-control~.form-label {
  color: #bfbfbf;
}

.fullwidth {
  width: 100%;
}

.botInput {
  right: 40px;
  bottom: 40px;
}

.inputBar {
  width: 100%;
}

.ArrayOfButtons {
  width: 99.9%;
  display: flex;
  align-items: center;
  flex-direction: row;
  align-items: space-around;
  background-color: yellow;
}

#thesmallTitle {
  font-size: x-Large;
  width: fit-content;
  height: 40px;
  font-weight:bold;
  font-variant: small-caps;
  color: #f2f2f2;
}

.theContainer {
  position: absolute;
  width: 100%;
  left: 0px;
  top: 0px;
  height: 100%;
  display: none;
  overflow: hidden;
  z-index: 2;
}


#dataInput{
  position: absolute;
  bottom: 15px;
  left: 0px;
  right: 88px;
  height: 48px;
}

.avatar {
  width: 48px;
  height: 48px;
  min-width: 48px;
  min-height: 48px;
  border-radius: 50%;
}

#submitBtn {
  position: absolute;
  bottom: 10px;
  width: 48px;
  right: 20px;
  height: 48px;
  border-radius: 50%;
  background-image: url("https://icons.iconarchive.com/icons/fa-team/fontawesome-regular/48/FontAwesome-Regular-Paper-Plane-icon.png");
}

.UserBox {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 5px;
}

.UserBox_Content {
  background-color: rgba(57, 192, 237);
  padding: 10px;
  border-radius: 10px;
  min-height: 48px;
  width: 100%;
}

.UserBox_Btn {
  display: none;
  background-image: url('https://icons.iconarchive.com/icons/aha-soft/large-user/48/Coffee-break-icon.png');
}

.AssistantBox_Btn {
  display: none;
  background-image: url('https://icons.iconarchive.com/icons/aha-soft/large-user/48/Notary-icon.png');
}

.AssistantBox {
  width: 100%;
  display: flex;
  gap: 5px;
}

.AssistantBox_Content {
  background-color: rgba(229, 255, 0);
  padding: 10px;
  border-radius: 10px;
  min-height: 48px;
  width:100%
}

#responseDiv {
  position: absolute;
  bottom: 80px;
  top: 50px;
  left: 10px;
  right: 10px;
  padding: 10px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;

}

#StartBtn {
  position: absolute;
  width: 200px;
  height:200px;
  margin-left: -100px;
  top: -220px;
  left: 50%;
  display: none;
  border-width: 1px;
  border-style: solid;
  font-size: x-large;
  color: red;
  background-image: url("/img/logoSPL0.png");
  z-index: 9;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 50%;
  opacity: 0.7;
}

#StartBtn:hover{
  opacity: 1;
} 

blockquote {
  margin-left: 40px;
  /* adds space to the left */
  margin-right: 40px;
  /* adds space to the right */
  padding: 20px;
  /* adds space inside the blockquote */
  border-left: 4px solid #ccc;
  /* adds a vertical line to the left */
  font-style: italic;
  /* makes text italic */
  background-color: #f9f9f9;
  /* sets a background color */
  border-radius: 10px;
}

.question {
  font-weight: bold;
  font-style: italic;
  padding: 5px;
}

.choice {
  text-indent: 2em;
}

.theCode {
  padding: 10px;
  width: 100%;
}

.FormatedTable {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%
}

.FormatedTable td,
.FormatedTable th {
  border: 1px solid #ddd;
  padding: 2px;
  vertical-align: middle;
}

.FormatedTable tr:nth-child(even) {
  background-color: #f2f2f2;
}

.FormatedTable tr:hover {
  background-color: #ddd;
}

.FormatedTable th {
  padding-top: 2px;
  padding-bottom: 2px;
  text-align: center;
  background-color: #3A454b;
  color: white;
  font-weight: bold;
}

.FormatedTable td {
  color: rgb(10, 10, 10);
  text-align: center;
}




.DetailedTable {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
  background-color:rgb(48, 2, 2);
  max-height: 90%;
  overflow: auto;
}

.DetailedTable td,
.DetailedTable th {
  border: 1px solid #ddd;
  padding: 2px;
  vertical-align: middle;
}

.DetailedTable tr:nth-child(even) {
  background-color: black
}

.DetailedTable tr:hover {
  background-color: rgb(0, 21, 255)
}

.DetailedTable th {
  padding-top: 2px;
  padding-bottom: 2px;
  text-align: center;
  background-color: #07689c;
  color: white;
  font-weight: bold;
}

.DetailedTable td {
  color: rgb(239, 234, 234);
  text-align: left;
}



#TheITSEntry {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
}

#TheITSEntry td,
#TheITSEntry th {
  border: 1px solid #ddd;
  padding: 8px;
}

#TheITSEntry tr:nth-child(even) {
  background-color: #f2f2f2;
}

#TheITSEntry tr:hover {
  background-color: #ddd;
}

#TheITSEntry th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #4CAF50;
  color: white;
}

#theProcessedPanel {
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  padding: 0px;
  z-index: 1000;
  overflow: hidden;
}

.theContent {
  position: absolute;
  height: fit-content;
  width: fit-content;
  top: 0px;
  left: 0px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 5px;
  border-width: 1px;
  border-style: solid;
  z-index: 1000;
  border-radius: 15px;
  background-color:#e7e7e7
}

.theBodyContainer{
  overflow: hidden;
  top:0px;
  left:10px;
  right: 10px;
  bottom: 10px;
  position: absolute;
}
.LearningOnlyStuff{
  overflow: hidden;
  top:0px;
  left:0%;
  width:100%;
  height:100%;
  position: absolute;
  z-index: 1;
}

.theBodyContainerPhone{
  overflow: hidden;
  top:0px;
  left:0%;
  width:100%;
  height:100%;
  position: absolute;
}


#YourOwnLang{
  display: none;
}
.theSPLBtn1{
  display: inline-block; /* Ensure the button behaves like a block element */
  padding: 5px;
  border-width: 3px;
  border-radius: 5px;
  cursor: pointer;
  background-color: #004080;
  color: #FFFFFF;
  white-space: nowrap; /* Prevent the text from wrapping */
  overflow: hidden; /* Hide any overflowing text */
  opacity: 0.7;
}

.theSPLBtn1:hover{
  opacity: 1;
}


.genAnswer{
  background-color: #284aa7;
  color: chartreuse;
  opacity: 0.8;
}

.genAnswer:hover{
  opacity: 1;
}

.theHelpContent{
  border-radius: 10px;
}
.HelpArea{
  display:flex;
  width: fit-content;
  flex-direction: column;
  position: absolute;
  background-color: transparent;
  padding: 0px;
  gap: 3px;
  display: none;
  z-index: 100;
  border-color: #026661;
  border-radius: 10px;
  border-width: 1px;
  border-style: solid;
}
.ListEM{
  display: none;
}

.theResponses{
  width:700px;
}
.ListDetails{
  display:flex;
  width: 100%;
  flex-direction: row;
  background-color: antiquewhite;
}
.ListLCC{
  display: none; 
}
.theButtonsArea{
  display:flex;
  gap: 4px;
}
.theSPLBtn{
  display: inline-block; /* Ensure the button behaves like a block element */
  width: 150px;
  text-overflow: ellipsis;
  padding: 5px;
  border-width: 3px;
  border-radius: 5px;
  cursor: pointer;
  background-color: #004080;
  color: #FFFFFF;
  white-space: nowrap; /* Prevent the text from wrapping */
  overflow: hidden; /* Hide any overflowing text */
  opacity: 0.7;
}

.buttonHover{
  font-style: italic;
}
.theSPLBtn:hover{
  opacity: 1;
}
.inPanel{
  width: 150px;
  font-size: small; 
}
.Truncated{
  width:80px
}
.Truncated::after { 
  content: attr(data-tooltip); /* Fetch tooltip content */
  position: absolute; /* Absolute position relative to button */
  top: 100%; /* Below the button */
  left: 50%; /* Center-align */
  transform: translateX(-50%); /* Adjust for centering */
  white-space: nowrap; /* Prevent tooltip text wrapping */
  background: #333; /* Tooltip background color */
  color: #fff; /* Tooltip text color */
  padding: 5px 10px; /* Tooltip padding */
  border-radius: 4px; /* Rounded corners for tooltip */
  font-size: 12px; /* Tooltip font size */
  visibility: hidden; /* Hide tooltip by default */
  opacity: 0; /* Fully transparent initially */
  transition: opacity 0.2s ease-in-out; /* Smooth fade-in */
  z-index: 10; /* Ensure it appears above other elements */
}
.Truncated:hover::after {
  visibility: visible; /* Show tooltip on hover */
  opacity: 1; /* Fully visible */
}

.theBold{
  font-weight: bold;
}
.LearnBtn{
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-image: url("/img/RSS-Reader-Green-icon.png");
}
#theHTMLContainer{
  width: 640px;
  height: 480px;
  position: absolute;
  top:50%;
  left: 50%;
  margin-top: -240px;
  margin-left:-320px;
  padding: 10px;
  border-radius: 10px;
  border-color: #07689c;
  border-width: 1px;
  border-style: solid;
  display: none;
  background-color: #f2f2f2;
  overflow-y: auto;
}
.theTitle {
  width: 200px;
  border-radius: 0px;
  background-color: rgb(2, 55, 9);
  padding: 5px;
  text-align: center;
  color: white;
  text-decoration: underline;
}

#theConfigWin {
  display: none;
  background-color: lightgray;
  border-radius: 10px;
  padding: 20px;
  width: fit-content;
  height: fit-content;
  border-width: 1px;
  border-style: solid;
  z-index: 10;
}

#StartNewBtn {
  display: none;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
}

.configuInput {
  width: 300px;
  height: 50px;
  ;
}

#ProgressBtn {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  display: none;
  font-size: xx-small;
  z-index: -1
}

#theListOfshowSomeAnswers{
  padding: 5px;
  background-color: #e0e5e7;
}
#InteractionArea{
  display: flex;
  gap:4px;
  flex-direction: column;
  padding: 5px;
  width:100%;
  height:100%;
  overflow:auto;
}
.feefbackFromAssistent{
  background-color:lightcyan;
  display: flex;
  gap:4px;
  flex-direction: column;
  border-radius: 5px;
  padding: 5px;
}
.FromAssistent{
  background-image: url("/img/teacher.png"); /* Add the image */
  background-size: auto; /* Keep the original size of the image */
  background-position: top left; /* Position the image at the top-left corner */
  background-repeat: no-repeat; /* Prevent tiling */
  padding-left: 50px;
  border-width: 0px;
  border-left-width: 5px;
  border-style: solid;
  border-color:#28a745;
}
.theResponse{
  padding: 3px;
  background-color: #39c0ed;
  border-radius: 3px;
  border-width: 0px;
  border-left-width: 5px;
  min-height: 50px;
  font-size: large;
  font-weight: bold;
  padding-left: 50px;
  border-style: solid;
  background-image: url("/img/students.png"); /* Add the image */
  background-size: auto; /* Keep the original size of the image */
  background-position: top left; /* Position the image at the top-left corner */
  background-repeat: no-repeat; /* Prevent tiling */
}
#theNewProgressBtn{
  position: absolute;
  width: 50px;
  height: 50px;
  right:10px;
  top:10px;
  display: block;
  border-width: 1px;
  border-style: solid;
  border-radius: 50%;
  background-image: url("/img/logos/polyulogo.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  display: none;
  font-size:xx-small;
  background-color: #4CAF50;
  opacity: 0.5;
  z-index: 1000000;
}


#TheDiscussion {
  display: none;
  left: 30px;
  right: 30px;
  top: 80px;
  bottom: 80px;
  position: absolute;
}

#theDiscussionFrame {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
}

#FeedbackWin {
  position: absolute;
  height: 800px;
  width: 1000px;
  overflow: auto;
  background-color: gray;
  min-width: 100px;
  min-height: 100px;
  margin-left: -500px;
  margin-top: -400px;
  top: 50%;
  left: 50%;
  display: none;
  z-index: 100001;
  padding: 20px;
  background-color: #39c0ed;
}


.thCellForContent {
  max-height: 100px;
  overflow: auto;
  vertical-align: top;
}

#ConfigueVoice {
  position: absolute;
  width: 800px;
  height: 700px;
  background-color: cadetblue;
  display: none;
  border-radius: 30px;
  border-width: 2px;
  border-style: solid;
}

.CloseBtn {
  position: absolute;
  right: 20px;
  bottom: 20px;
  z-index: 2;
}

.GameDisplay {
  display: none;
  width:100%;
  bottom:0px;
  top: 50px;
  left: 0px;
  padding: 20px;
  border-radius: 20px;
  position: absolute;;
}

.GameDisplay00 {
  display: none;
  width: 1045px;
  height: 710px;
  padding: 20px;
  z-index: 3;
  position: absolute;
  border-style: solid;
  border-radius: 10px;
  top: 50%;
  left: 50%;
  margin-left: -523px;
  margin-top: -355px;

}

#jeopardyFrame {
  width:100%;
  height:100%;
  top: 0px;
  left: 0px;
  padding: 20px;
  position: absolute;
}

.UpDownBtn {
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  border-radius: 50%;
  border-width: 0px;
  background-color: transparent;
}

.theActionArea {
  vertical-align: middle;
  display: flex;
  justify-content: center;
  align-items: center;
}
.theMessages{
  border-radius: 5px;
  background-color: #39c0ed;
  padding: 4px;
  height: fit-content;
}
.theDescriptions{
  background-color: #defa79;
  border-radius: 5px;
  padding-left: 4px;
  height: fit-content;
  border-color:#0f13f0;
  border-width: 1px;
  border-left-width: 10px;
  border-style: solid;

}
.theScenario{
  width: 100%;
  height: fit-content;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding:10px;
  border-color:#07689c;
  background-color: #e0e5e7;
  border-width: 1px;
  border-bottom-width: 10px;
  border-style: solid;
  border-top-left-radius:30px ;
  border-top-right-radius:30px ;
}
.theConcepts{
  width: fit-content;
  max-width: 100px
}

.upBtn {
  background-image: url("https://icons.iconarchive.com/icons/graphicloads/100-flat-2/48/arrow-up-icon.png");
}

.downBtn {
  background-image: url("https://icons.iconarchive.com/icons/ampeross/smooth/48/Apple-Books-Border-icon.png");
  opacity: 0.5;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.g-signin2 {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 120px;
  height: 36px;
  margin-left: -60px;
  margin-top: -18;
  display: block;

}

#LoginPanel {
  width: 640px;
  height: 500px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -320px;
  margin-top: -250px;
  display: none;
  border-radius: 20px;
  border-width: 1;
  border-style: double;
  z-index: 1001;
  background-color: azure;
}

.toCenter {
  align-content: center;
  width: 100%;
  padding: 30px;
}

.buttonPanel {
  display: flex;
  width: 100%;
  justify-content: space-around;
  border-radius: 20px;
  padding: 2px;
}

#loginiFrame {
  width: 100%;
  height: 100%;
  border-radius: 25px;
}

#login_logout {
  position: absolute;
  bottom: 10px;
  left: 10px;
  display: none;
  width: fit-content;
}

#disclamer {
  font-size: x-small;
  float: right;
}

.login_logout {
  border-radius: 10px;
}

#theTitle {
  display: flex;
  width: 100%;
  justify-content: space-around;
  border-radius: 20px;
  padding: 2px;
  font-size: x-large;
  font-family: sans-serif
}

#PrefBtn {
  border-radius: 5px;
  width: fit-content;
  display: none;
}

.QuestionMark {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  position: absolute;
  top: 15px;
  right: 15px;
}

#theEmbeded iframe {
  width: 100%;
  height: 100%;
}

.theEmbeded {
  position: absolute;
  max-height: 100%;
  max-width: 100%;
  height: 680px;
  width: 1010px;
  padding: 10px;
  top: 50%;
  left: 50%;
  margin-top: -350px;
  margin-left: -505px;
  z-index: 1001;
  border-radius: 30px;
  background-color: transparent;
  display: none;
}

.theiFrame {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

#cloceBtn {
  position: absolute;
  top: 0px;
  right: 0px;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  background-color: red;
}

#WizardInterface {
  display: none;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 1000;
}

#theWizardBtn {
  width: 200px;
  border-radius: 10px;
  background-color: rgb(112, 177, 121);
  padding: 5px;
  height: 60px;
  display: none;
  background-image: url("/img/socrates.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.wizardBtn {
  width: fit-content;
}

.theTopPanel {
  position: absolute;
  top: 0px;
  left: 5px;
  height: 50px;
  display: flex;
  gap: 10px;
  z-index: 1000;
  border-radius: 15px;
  border-bottom-right-radius: 0px;
  border-width: 1px;
  border-style: solid;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 0px;
  padding-right: 60px;
  
  /* Enable flex items to wrap */
  justify-content: space-around;
  /* Distribute items evenly */
}

.theTopPanelOld {
  position: absolute;
  height: 70px;
  width: 100%;
  top: 0px;
  left: 0px;
  display: flex;
  flex-direction: row;
  gap: 5px;
  padding: 10px;

}

#TheWizardBody {
  position: absolute;
  height: 100%;
  top: 0px;
  left: 310px;
  padding: 10px;
}

#theMessage {
  position: absolute;
  right:40px;
  left:40px;
  height: fit-content;
  margin-top: 130px;
  top: 50%;
  display: block;
  border-width: 1px;
  border-style: solid;
  border-radius: 30px;
  font-size: large;
  z-index: 1000;
  background-color: #b5c6cc;
  display: none;
  padding: 20px;
}

.OutPutClass {
  position: absolute;
  width: fit-content;
  height: fit-content;
  border-radius: 20px;
  padding: 30px;
  border-width: 1px;
  border-style: solid;
  display: none;
}

.translateBtn {
  position: absolute;
  bottom: 10px;
  right: 10px;
}

.Deliver {
  border-radius: 5px;
  padding: 5px;
  background-color: whitesmoke;
}

thekey {
  font-weight: bold;
}

.theMessage {
  font-weight: bold;
}

.theDescription {
  font-style: italic;
  font-size: smaller;
  text-indent: 50px;
}

#Status {
  bottom: 0px;
  height: 30px;
  left: 0px;
  width: 100%;
  display: flex;
  background-color: lightgrey;
  z-index: 1000;
  position: absolute;
  gap: 5px;
  display: none;
}

#histBtn1 {
  width: 30px;
  height: 30px;
}

#MoreDetails {
  top: 0;
  left: 10;
  width: 89%;
  height: fit-content;
  position: absolute;
  display: none;
  background-color: rgb(70, 63, 63);
  padding: 10px;
}


#activityTree {
  position: absolute;
  top: 0px;
  left: 0px;
  height: fit-content;
  background-color: lightgray;
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: 5px;
  flex-wrap: wrap;
  justify-content: center;
  /* Center children horizontally */
  align-items: center;
  /* Center children vertically */
}

#Tabs {
  position: absolute;
  top: 30px;
  left: 0px;
  width: 100%;
  bottom: 0px;
  flex-direction: row;
  display: flex;
}

.TheTabs {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
}

.btn1 {
  padding: 5px;
  background-color: #28a745;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

.btn2 {
  border-radius: 5px;
}
.action-btn{
  border-radius: 50%;
  width: 30px;
  height: 30px;
}
.highlight {
  background-color: yellow;
}

#topEditandLunch{
  position: absolute;
  top:0px;
  left: 0px;
  width:fit-content;
  display: none;
}

.withSpeech {
  cursor: url("https://icons.iconarchive.com/icons/google/noto-emoji-people-clothing-objects/48/12134-mouth-icon.png");
}

.tinyfont {
  font-size: small;
  color: black;
}

#theAboutBtn {
  position: absolute;
  top: 2px;
  right: 2px;
  width: fit-content;
  display: none;
}

#theInform {
  background-color: #39c0ed;
}

#TheTotalArea {
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;

}

.feedbackbtn {
  height: 48px;
  width: 48px;
  min-width: 48px;
  max-width: 48px;
  background-image: url("/img/Feedback-icon.png");
  border-radius: 8px;
  display: none;
}

.discussion {
  background-color: bisque;
  padding: 5x;
  border-radius: 5px;
}

.role {
  font-weight: bold;
}

.toggleTheContent {
  position: absolute;
  top: -13px;
  right: 0px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #4CAF50;
  border-bottom-right-radius: 0px;
  display: block;
}

.ToggleTopPanel {
  position: absolute;
  bottom: 0px;
  top: -13px;
  right: 0px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border-bottom-right-radius: 0px;
  background-color: #4CAF50;
  display: none;
}

.clue {
  font-weight: bold;
  font-style: italic;
  padding: 5px;
}

.GeopardyCategory {
  font-weight: bold;
}
.FeedbackForm{
  flex-wrap: wrap;
}
.FeedbackQuestion{
   padding: 5px;
   border-radius: 5px;
   border-width: 1px;
   border-style: solid;
}

.theLeadFeedback {
  font-weight: bold;
  font-style: italic;
  padding: 5px;
}

.theEndFeedback {
  font-style: italic;
  padding: 5px;
}

#utilityBtns {
  display: flex;
  gap: 10px;

}

#theInformation_0 {
  width: 72px;
  height: 72px;
  background-image: url("/img/Help.png");
}

#Pref_0{
  background-image: url("/img/Configure.png");
  width: 72px;
  height: 72px;
  display: block;
}
#feedback_0 {
  background-image: url("/img/Configure.png");
  width: 72px;
  height: 72px;
  display: none;

}

#PointBelow {
  width: 150px;
  height: 70px;
  background-image: url("/img/ConceptMap.png");
  background-size: cover;
  background-position: center;
  display: none;
}

.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.enabled {
  opacity: 1;
  cursor: default
}

.adjustedScreen {
  left: 300px
}

.fullScreen {
  left: 30px
}

.bookmarkBtns {
  display: none
}

#PromptEditor {
  z-index: 10000;
  background-color: #4CAF50;
  position: absolute;
  left: 100px;
  right: 100px;
  top: 100px;
  padding: 10px;
  border-radius: 10px;
  border-width: 1px;
  display: none;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th,
td {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: left;
}

th {
  background-color: #f2f2f2;
}

tr:nth-child(even) {
  background-color: #f9f9f9;
}

.read-only {
  background-color: #e7e7e7;
}

#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
  display: none; /* Hidden by default */
}
#customDialog {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  z-index: 1000; /* Ensure it's above other content */
  display: none; /* Hidden by default */
  padding: 20px;
  width: 300px; /* Adjust as per requirement */
}

/* Dialog content styling */
#dialogForm {
  display: flex;
  flex-direction: column;
}

#dialogForm div {
  margin-bottom: 10px;
}

#dialogForm label {
  margin-bottom: 5px;
  font-weight: bold;
}

#dialogForm input[type="text"],
#dialogForm textarea {
  width: 100%;
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

#dialogForm textarea {
  resize: vertical; /* Allow vertical resize */
}

/* Buttons styling */
#dialogForm button {
  padding: 10px 15px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  margin-right: 10px;
  margin-top: 10px;
}

#submitDialog {
  background-color: #4CAF50;
  color: white;
}

#closeDialog {
  background-color: #f44336;
  color: white;
}

#dialogForm button:hover {
  opacity: 0.8;
}
svg{
  position: absolute;
  display: none;
  background-color: #e7e7e7;
  top:50%;
  left: 50%;
  width:600px;
  height: 480px;
  border-radius: 30px;
  border-width: 1px;
  border-style: solid;
  margin-top: -240px;
  margin-left: -300px;
}
#custom-menu{
  position: absolute;
  width: fit-content;
  height: fit-content;
  display: none;
  z-index: 10000;
  padding: 10px;
}
.SurveyBtn{
  float:right;
}
#TheBody_0{
  position: absolute;
  top:0px;
  left:0px;
  padding-top: 80px;
  padding-left: 50px;
  padding-right: 50px;
  padding-bottom: 150px;
  display: none;
  overflow-y: auto;
}
.ketTerm{
  font-weight: bold;
}
h1{
  font-size: x-large;
}
h2{
  font-size:large
}
h3{
  font-size: medium;
}
.SpecialAnswerList li{
  list-style-type: none;
}
.toStopBtn{
  background-image: url("/img/Button-stop-icon.png");
  display: none;
}

.ScoreBtn{
  background-image: url("/img/Score-icon.png");
  display: none;
}
.theDoBtn{
  width:fit-content;
  height: fit-content;
  display: flex;
  top:-5px;
  right:0px;
  gap: 3px;
  position: absolute;

}
.helpBtnforInteraction{
  background-image: url("/img/helpICON.png");
  display: none;
}

.theHelpBtn{
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 50%;
  opacity: 0.7;
}
.theHelpBtn:hover{
  opacity: 1;
}
#theTopBar{
  padding: 0px;
  height: fit-content;
  display: flex;
  flex-direction: row;
  background-color: #39c0ed;
  width:100%;
  min-height: 52px;
  align-items: center;
  align-content: center;
}
#TabContent{
  background-color: #ddd;
}
.Bookmarked{
  border-radius: 0px;
}

.modal {
  display: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0,0.4);
}

.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 400px;

}

.close {
  color: #aaa;
  font-size: large;
  font-weight: bold;
  width: fit-content;
  position: absolute;
  right:10px;
  top:2px
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

textarea {
  width: 100%;
  height: 90%;
}
.underlinetext{
  text-transform: capitalize;
  text-decoration: underline;
  text-wrap: nowrap;
}
.underlinetextNoClick{
  text-transform: capitalize;
  text-wrap: nowrap;
}
#helpText{
  display: block;
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  padding: 5px;
  height: fit-content;
  background-color: azure;
}


#theContextMenu {
  display: none;
  position: absolute;
  background-color: white;
  border: 1px solid #ccc;
  box-shadow: 0 2px 10px rgba(0,0,0,0.2);
  z-index: 1000;
}
#theContextMenu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#theContextMenu li {
  padding: 8px 12px;
  cursor: pointer;
}
#theContextMenu li:hover {
  background-color: #f0f0f0;
}


#explanations{
  padding-bottom: 50px;
  background-color: #ccc;
  padding: 20px;
}
#explanations1{
  width: 1024px;
  height: 768px;
  height: fit-content;
  padding: 20px;
  z-index: 30000;
  background-color: #bfbfbf;
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -512px;
  margin-top: -384px;
  border-radius: 20px;
  overflow-y: auto;
  padding-bottom: 50px;
}
.theExplanations{
  max-width: 1024px;
  width: fit-content;
  max-height: 768px;
  height: fit-content;
  padding: 20px;
  background-color: #bfbfbf;
  overflow-y: auto;
}
.LearnMore{
  max-width: 1024px;
  width: fit-content;
  max-height: 768px;
  height: fit-content;
  padding: 20px;
  background-color: #bfbfbf;
  overflow-y: auto;
}
.disabled {
  pointer-events: none;
  opacity: 0.5; /* Optional: to visually indicate the div is disabled */
}
pre {
  max-width: 80%;
  white-space: pre-wrap;
  overflow-wrap: break-word;
}

#Login{
  font-family: Arial, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin: 0;
    background-color: #f0f0f0;
    z-index: 1000000;
}

.login-container {
  background-color: #fff;
  padding: 20px;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  width: fit-content;
  text-align: center;
  z-index: 10;
}

.form-group {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap:10px;
}
.form-check{
  border-radius: 3px;
  border-width: 0px;
  border-style: solid;
  background-color:transparent;
}

.form-check:hover {
  border-radius: 3px;
  border-width: 0px;
  border-style: solid;
  background-color: yellow;
}
#message {
  margin-top: 15px;
  color: red;
}
.hidden{
  display: none;
}
#thesvg{
  z-index: 1002;
}
.tooltip{
  max-width: 300px;
  height: fit-content;
  z-index: 1003;
}
.theTD{
  width:100%;
}

#bookmarkBox {
  position: absolute;
  top: 50px;
  right: 50px;
  left: 50px;
  bottom: 50px;
  overflow: auto;
  background-color: gray;
  display: none;
  z-index: 1;
  padding: 10px;
  background-color: #39c0ed;

}

#bookmarkBoxOld{
  position: absolute;
  height: fit-content;
  max-height: 400px;
  left: 100px;
  right: 100px;
  overflow: auto;
  background-color: gray;
  min-width: 100px;
  min-height: 100px;
  top: 50px;
  display: none;
  z-index: 1;
  padding: 10px;
  background-color: #39c0ed;

}

#UserDetailBox {
  position: absolute;
  height: fit-content;
  left: 100px;
  right: 100px;
  overflow: auto;
  background-color: gray;
  min-width: 100px;
  max-height: 100%;
  bottom: 50px;
  display: none;
  z-index: 3;
  padding: 10px;
  background-color: #026661;
  border-width: 1px;
  border-style: outset;

}

#theExamples{
  position: absolute;
  left: 5px;
  right: 5px;
  overflow: auto;
  background-color: gray;
  bottom: 50px;
  top: 45px;
  display: none;
  z-index: -1;
  padding: 30px;
  border-width: 1px;
  border-style: outset;
  z-index: 998;
}

#historyBox {
  position: absolute;
  height: fit-content;
  max-height: 400px;
  left: 100px;
  right: 100px;
  overflow: auto;
  background-color: gray;
  min-width: 100px;
  min-height: 100px;
  top: 50px;
  display: none;
  z-index: 100001;
  padding: 10px;
  background-color: #39c0ed;

}
.hidenDiv{
  display: none;
}


.modal-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: fit-content;
  height: fit-content;
  background-color: rgba(0, 0, 0, 0.5);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 10000000000;
  padding: 10px;
  border-radius: 5px;
  border-width: 1px;
  border-style: solid;
  border-color: #39c0ed;
}
.modal-contentOld {
  background-color: white;
  width: 100%;
  height: 100%;
  padding: 20px;
  position: relative;

}
.modal-content iframe {
  width: 100%;
  height: 100%;
  border: none;
}
.close-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  background: red;
  color: white;
  border: none;
  padding: 5px 10px;
  cursor: pointer;
}

#TestInput{
  width:100%
}
#Submit{
  color:white
}
.TheNewReportTable{
  display: none;
  width: fit-content;
}
#theCode{
  width:95%;
  height: 150px;
}

#TheAvatarTable{
  width: fit-content;
  border-radius: 5px;
  border-width: 1px;
  border-style: solid;
  border-color: #39c0ed;
}
#TheAvatar{
  background-color: transparent;
}

#theSelection{
  display: none;
}
.ReportTable {
  width: 800px;
}

.SpeechEditor {
  width: 100%
}

.actionSelectionPulldown {
  width: 150px;
}

#TheAvatar {
  background-color: lightgrey;
  border-radius: 5px;
  border-width: 1px;
  border-style: dashed;
}

#advancedConfig {
  background-color: lightgrey;
  border-radius: 5px;
  border-width: 1px;
  border-style: dashed;
}

.SpeechEditor {
  height: 50px;
}

.Col_do {
  width: 100px;
}

.Col_order {
  width: 25px;
}
.theCenteredCell{
  text-align: center; /* Horizontal centering */
  vertical-align: middle; /* Vertical centering */
  display: flex;
  align-items: center; /* Vertical centering */
  justify-content: center; /* Horizontal centering */
  text-align: center; /* Ensure text inside is centered */
}
#theCaptions{
  display: none;
  background-color: #ccc;
  position: absolute;
  height: fit-content;
  top: 0px;
  left: 0px;
  padding: 10px;
  border-radius: 10px;
}
.launchAvatar{
  position: absolute;
  top:5px;
  right:5px;
  border-radius: 10px;
}
.CloseExplanantionBtn{
  position: absolute;
  bottom:5px;
  right:5px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-image: url("/img/close-icon2.png");
}

.submitConfusionButton{
  position: absolute;
  top: 5px;
  right: 5px;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background-image: url("/img/helpBtn.png");
  display: none;
}
.CloseConfusionButton{
  position: absolute;
  top: 5px;
  left: 5px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-image: url("/img/close-icon2.png");
}
.MoreHelpBtn{
  position: absolute;
  bottom:5px;
  height: 48px;
  width: 48px;
  border-radius: 50%;
  left:5px;
  background-image: url("/img/Confused.png");
}
#theDisplayedLoginInfor{
  position: absolute;
  display:block;
  bottom:5px;
  right:5px;
  width: fit-content;
  height:fit-content;
  display:flex;
  align-items:end;
  flex-direction: row;  
  justify-content: center; /* Align items horizontally (center, flex-start, flex-end, space-between, space-around) */
  align-items: center; /* Align items vertically (center, flex-start, flex-end) */
  z-index: 1000000;
}
#theUserNameLabel{
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
  flex-direction: row;
  text-align: end;
  justify-content: center; /* Align items horizontally (center, flex-start, flex-end, space-between, space-around) */
  align-items: center; /* Align items vertically (center, flex-start, flex-end) */
  gap: 5px;
  font-weight: bold;
}
.helpBtn{
  height: 25px;
  width: 25px;
  border-radius: 50%;
  background-image: url("https://icons.iconarchive.com/icons/ionic/ionicons/48/help-sharp-icon.png");
  background-size: cover; /* This makes the background image cover the entire element */
  background-position: center; /* This centers the image in the element */
  background-repeat: no-repeat; /* This prevents the image from repeating */

}

.tryBtn{
  height: 25px;
  width: 25px;
  border-radius: 50%;
  background-image: url("https://icons.iconarchive.com/icons/pictogrammers/material-light/48/play-icon.png");
  background-size: cover; /* This makes the background image cover the entire element */
  background-position: center; /* This centers the image in the element */
  background-repeat: no-repeat; /* This prevents the image from repeating */

}
#theCogfigAvatarBtn{
  display: block;
}

.DesktopOnly{
  top:0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

#URightLogo{
  right:0px;
  bottom: 0px;
}

#TopightLogo{
  right:10px;
  top: 10px;
}
.fullImg{
  background-position: center center;
  background-repeat: no-repeat;  
  background-size: 100% 100%;
  position: absolute;
  border-width: 0px;
}
.theLogo{
  position: absolute;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-position: center center;
  background-repeat: no-repeat;  
  background-size: 100% 100%;
}
#centerLogo{
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -50px;
  background-color: white;
  border-color: blue;
  border-style: solid;
  border-width: 1px;
}
.centerLogo{
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -50px;
  background-color: white;
  border-color: blue;
  border-style: solid;
  border-width: 1px;
}

.Inputbutton {
  padding: 10px;
  background-color: #28a745;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  margin-bottom: 10px;
}
#TheDescriptionTeacher{
  font-size: small;
  width: 100%;
  text-align: center;
  font-weight: normal;
  font-style: italic ;
}
#theCATPlayground{
  display: none;
  z-index: 10000;
  position: absolute;
  left: 0px;
  top: 50px;
  right: 0px;
  padding: 20px;
  bottom: 0px;
  overflow: auto;
  background-color:whitesmoke;
}


.theQuoteMsg{
  padding: 5px;
  font-style: italic;
  height:fit-content;
  font-size:small;
  color:red;
}

#theInputArea {
  position: absolute;
  left:20px;
  right: 20px;
  bottom: 0px;
}


.theQuote{
  bottom:2px;
  right: 0px;
  left: 0px;
  z-index: 1;
  position: absolute;
  text-align: center;
  height:fit-content;
}
.CheckListBtn{
  width: 100px;
  display: none;
}
#theTypeImg{
  border-radius: 15px;
  left:0px;
  width: 150px;
  display: none;
}

.theTypeImgIphone{
  max-width: 100px
}
.TheBody{
  position: absolute;
  top: 0px;
  left: -20px;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
ifram{
  border: none;
  scrollbar-width: none; /* Firefox */
  scrollbar-gutter: none;
  scroll-padding: 0px;
}
.theTopPanelPhone{
  height: 100%;
  top: 0px;
  left: 0px;
  padding: 5px;
  overflow: auto;
  z-index: 100000;
  position: absolute
};
.theSelfReflectionQuestion{
  font-weight: bold;
  font-size: large;
  color: black;
  padding: 5px;
}
.FollowupQuestion{
  font-weight: bold;
  font-size: large;
  color: black;
  padding: 5px;
}
.answerArea{
  display: flex;
  flex-direction: column;
  gap:5px;
  height: fit-content;
}
.theExpectation{
  display: none;
}
.theMisconception{
  display: none;
}
.theExpectationColor{
  background-color: greenyellow;
  color: black;
  width: 100%;
  padding: 20px;
  border-radius: 10px;
}


.Relevant_and_New{
  background-color: greenyellow;
  padding: 4px;
}
.Relevant_and_Old{
  background-color: greenyellow;
  padding: 4px;
}
.Current_Correct_Contribution{
  background-color: greenyellow;
  padding: 4px;
}
.Accumulated_Correct_Contribution{
  background-color: greenyellow;
  padding: 4px;
}


.Irrelevant_and_New{
  background-color:  #f44336;
  padding: 4px;
  color: floralwhite;
}
.Irrelevant_and_Old{
  background-color:  #f44336;
  padding: 4px;
  color: floralwhite;
}
.Current_Wrong_Contribution{
  background-color:  #f44336;
  padding: 4px;
  color: floralwhite;
}
.Accumulated_Wrong_Contribution{
  background-color:  #f44336;
  padding: 4px;
  color: floralwhite;
}
.Overall_Score{
  background-color:  #3643f4; 
  color:#defa79;
  padding: 4px;
}
.buttonPanels{
  display: flex;
  width:fit-content;
  flex-direction: column;
  gap:0px;
}
.theLCCBtns{
  border-radius: 5px;
  border-width: 1px;
  border-style: solid;
  background-color: #007bff;
  color: #FFFFFF;
  opacity: 0.5;
  width: 100px;
  height: 30px;
}
.theLCCBtns:hover{
  opacity: 1;
}

.theMisconceptionColor{
  background-color:  #f44336;
  color:white;
  width:100%;
  padding: 20px;
  border-radius: 10px;
}
.LaaS{
  background-image: url("/img/LaaS.webp");
  width: 400px;
  height: 400px;
  border-radius: 50%; 
  opacity: 1;
  position: absolute;
  margin-left:-200px;
  left: 50%;
  display: none;
  bottom: 20px;
  background-size: cover; /* This makes the background image cover the entire element */
  background-position: center; /* This centers the image in the element */
  background-repeat: no-repeat; /* This prevents the image from repeating */
}


.theDescriptionOfAction{
  height:fit-content;
  padding: 8px;
  max-width:350px ;
  width:fit-content;
  min-height: 50px;
  border-radius: 2px;
  border-color: #f7f8f2;
  border-style: ridge;
}
.descriptionBtnOld{
  width: 300px;
  height: 50px;
  border-radius: 5px;
  border-left-width: 0px;
}


.descriptionBtn{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;                /* Space between image and text */
  padding: 10px 20px;
  font-size: large;
  background-color: #007bff;
  color: white;
  border: none;
  padding: 8px 15px;
  border-radius: 5px;
  cursor: pointer;
  width: 350px;
}

.descriptionBtn:hover{
  background-color: yellow;
  color: black
}



.theStyleIcon{
  width:50px;
  height: 50px;  
}
.img_Btn{
  display: flex;
  width: 350px;
}
.theLinkBtnDes{
  padding:10px;
  display: flex;
  flex-direction: column;
  width: fit-content;
  max-width: 100%;
  gap: 3px;
}

.theTopNewProgressBtn{
  position: absolute;
  width: 100px;
  height: 100px;
  left:30px;
  bottom:20px;
  border-width: 1px;
  border-style: solid;
  border-radius: 50%;
  background-image: url("/img/logos/polyulogo.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  display: none;
  font-size:xx-small;
  background-color: #4CAF50;
  opacity: 0.5;
  z-index: 1000000;
}
.launchBtn{
   background-image: url("/img/launch.png");
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
}
.disabledStartBtn{
  opacity: 0.5;
  background-image: url("background-image:url('https://icons.iconarchive.com/icons/custom-icon-design/flatastic-9/48/Start-icon.png')");
}
.enabledStartBtn{
  opacity: 1;
  background-image: url("background-image:url('https://icons.iconarchive.com/icons/custom-icon-design/flatastic-9/48/Start-icon.png')");
}

.typewriter {
  font-family: monospace;
  white-space: pre;
  border-right: 2px solid black; /* Cursor effect */
  display: inline-block;
  overflow: hidden;
}
/* Blinking cursor animation */
@keyframes blink {
  0%, 100% { border-color: transparent; }
  50% { border-color: black; }
}
.typewriter.blinking {
  animation: blink 0.7s step-end infinite;
}
.theLogoInPopup{
  bottom:5px;
  left: 5px;
  position: absolute;
  width: 60px;
  height: 60px;

}
button{
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.DisplayArea{
  border-width: 0;
  border-style: solid;
  border-color: #007bff;
  border-bottom-width: 5px;
  padding: 0px;
  padding-top: 5px;
  width: 100%;
  text-align: left;
}
.theWarning{
  padding: 3px;
  border-color: red;
  border-width: 0x;
  border-bottom-width:4px;
  border-style: solid;
  text-align: center;
  border-radius: 5px;
}
.the_Target_Concept{
  background-color: #e7f436f8;
  color:red;
  padding: 3px;
  border-radius: 2px;
}
.fullScreen{
  position: absolute;
  left:0px;
  top:0px;
  width: 100%;
  height: 100%;
}
.DiscussionHelp{
  display: none;
  background-color: transparent;
  width: 48px;
  height: 48px;
}
#DiscussionInfoBtn{
  background-image: url("/img/logos/helpEM.png");
}

#SuggestionBtn{
  background-image: url("/img/logos/Check-icon.png");
}
#toggleBtn{
  background-image: url("/img/logos/Chaticon.png");
}

#SuggestedAnswers{
  position: absolute;
  width: 80%;
  background-color: darkkhaki;
  border-radius: 20px;
  border-color: #026661;
  border-width: 1px;
  border-style: solid;
  padding: 10px;
}
.theSuggestedAnswer{
 padding: 5px;
}
.highlighted{
  background-color: yellow;
  border-radius: 10px;
}
.boldLabel{
  font-weight: bold;
}


#ReviewBox {
  position: absolute;
  overflow: auto;
  background-color: rgb(202, 235, 53);
  top: 20px;
  left: 20px;
  right: 20px;
  height: fit-content;
  max-height: 90%;
  padding: 10px;
  padding-top: 50px;
  display: none;
  border-radius: 5px;
  z-index: 4;
}


#evaluation{
  position: absolute;
  overflow: auto;
  background-color: rgb(152, 159, 177);
  top: 40px;
  left: 40px;
  right: 40px;
  height: fit-content;
  max-height: 90%;
  padding: 10px;
  padding-top: 50px;
  display: none;
  border-radius: 5px;
  z-index: 5;
  overflow: auto;
}