/*CSS for cell : knowee*/
.knowee-holder
{
    position:absolute;
    left:0px;
    top:0px;

}

.knowee-inner-frame
{
    position:absolute;
    width: 95%;
    height:95%;
    border-radius: 6px;
    overflow:hidden;
}

.knowee-reRead-inner-frame
{
    position:absolute;
    width: 95%;
    height:95%;
    border-radius: 6px;
}

.re-read-content-frame
{
    position:absolute;
    border-radius: 6px;
    border: 3px solid #feb300;
    text-align: justify;
    color: black;
    font-size: 30px;
    padding: 20px 20px 20px 20px;

    
    
    white-space: pre-wrap;
    word-wrap:break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens:auto;
    overflow-x: hidden;

}

.bottom-Div-Pref-knowee
{
    position:absolute;
    border-radius: 6px;
    overflow-y:auto;
}
/*
.bottom-Div-Pref-knowee::-webkit-scrollbar {
    display: none; 
}

.bottom-Div-Pref-knowee {
    -ms-overflow-style: none;  
    scrollbar-width: none;  
}
*/
.inner-bottom-ele
{
    border-radius: 6px;
    border: thin solid #feb300;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    margin-bottom: 20px;
    color: #feb300;
}
.read-result-Holder
{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.read-text-element
{
    margin-bottom: 10px;
}

.read-aloud-icon
{
    position: absolute;
    border: thin solid #feb300;
    border-radius: 50%;
}

.TA-search
{
    position: absolute;
    color : #7D3BBB;
    font-style : italic;
    text-align: center;
    position: absolute;

}

.button-more-knowee
{
    border-radius: 6px;
   
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #feb300;
    font-size: 2.5vw;
    text-decoration: underline;
}
.button-more-knowee:hover
{
    cursor: pointer;
    color: ghostwhite;
}

.connect-more-knowee
{
    position:absolute;
    border-radius: 6px;
    border: transparent;
    display: flex;
    align-items:center;
    justify-content:center;
    text-align: center;
    color: ghostwhite;
    font-size: 2.5vw;
    flex-direction: column;
}

.suggest-Topic-knowee
{
    border-radius: 6px;
    border: thin solid #feb300;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: ghostwhite;
    flex-direction:row;
    margin: 5px 5px 5px 5px;
    background-color: #feb300;
    
}

.connected-w-knowee
{
    border-radius: 6px;
    
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: ghostwhite;

    margin: 10px 10px 10px 10px;
}

.knowee-bubble-txt
{
    position: absolute;
    color:  #7D3BBB;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 5px;
}

.knowee-age
{
    color: #feb300;
    font-size: 40px;
    margin-right: 20px;
}
.knowee-age:hover
{
    cursor: pointer;
    transform: scale(1.2);
}
.knowee-age:hover:after 
{
    content: "Magian Ideation Portal - Harness Your Creative Energy to Innovate on Targetted Problems";
    display: block;
    position: relative;
    top: var(--top-tooltip);
    right: 130px;
    width: 400px;
    color: #7D3BBB;
    font-size: 10px;
}

.knowee-age-inner
{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 20px 20px 20px 20px;   
}

.knowee-age-aa
{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #feb300;
    margin-right: 10px;
    border: thin solid #feb300;
    border-radius: 50%;
}
.knowee-suggest
{
    color: #feb300;
    font-size: 40px;
    margin-right: 20px;
}
.knowee-suggest:hover
{
    cursor: pointer;
    transform: scale(1.2);
}
.knowee-suggest:hover:after 
{
    content: "Quickerpedia - Learn a Topic by Knowledge Domain";
    display: block;
    position: relative;
    top: var(--top-tooltip);
    right: 50px;
    width: 300px;
    color: #7D3BBB;
    font-size: 10px;
}

.knowee-history
{
    color: #feb300;
    font-size: 40px;
    margin-right: 20px;
  
}
.knowee-history:hover
{
    cursor: pointer;
    transform: scale(1.2);
}
.knowee-history:hover:after 
{
    content: "Storytelling - Boost Your Creativity by Practicing the Art of Storytelling to Communicate Ideas";
    display: block;
    position: relative;
    top: var(--top-tooltip);
    right: 130px;
    width: 400px;
    color: #7D3BBB;
    font-size: 10px;
}

.knowee-game
{
    color: #feb300;
    font-size: 40px;
    margin-right: 20px;
  
}
.knowee-game:hover
{
    cursor: pointer;
    transform: scale(1.2);
}
.knowee-game:hover:after 
{
    content: "Connective Games - Play to Link the Unconnected and Boost Your Creativity";
    display: block;
    position: relative;
    top: var(--top-tooltip);
    right: 100px;
    width: 300px;
    color: #7D3BBB;
    font-size: 10px;
}

.knowee-gym
{
    color: #feb300;
    font-size: 40px;
    margin-right: 20px;
  
}
.knowee-gym:hover
{
    cursor: pointer;
    transform: scale(1.2);
}
.knowee-gym:hover:after 
{
    content: "Brain Gymnastics - Strengthen Connective Thinking with Science-Based Games";
    display: block;
    position: relative;
    top: var(--top-tooltip);
    right: 100px;
    width: 300px;
    color: #7D3BBB;
    font-size: 10px;
}

.knowee-dissem
{
    color: #feb300;
    font-size: 40px;
}
.knowee-dissem:hover
{
    cursor: pointer;
    transform: scale(1.2);
}
.knowee-dissem:hover:after 
{
    content: "Disseminate / Share Your Ideas on Social Media";
    display: block;
    position: relative;
    top: var(--top-tooltip);
    right: 50px;
    width: 400px;
    color: #7D3BBB;
    font-size: 10px;
}


.knowee-search
{
    position: absolute;
    border-radius: 50%;
    margin: 20px 20px 20px 20px;
}
.knowee-search:hover
{
    cursor: pointer;
}

.answer-gpt-area
{
    position: absolute;
    
    border-radius: 5px;
    color: ghostwhite;
    overflow-y: auto;
}
.linkology-design-label
{
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #7D3BBB;/*#feb300;*/
    font-size: 1vw;
    border-color: thin solid #feb300;
    border-radius: 5px;
}
.knowee-all-button
{
    position: absolute;
    display: flex;
    justify-content: center;
    justify-items: center;
    align-items: center;
    flex-direction: row;
    border-radius: 5px;
}

.image-hold-button
{
    background: linear-gradient(to bottom,  #7D3BBB, purple);
    position: absolute;
    border-radius : 50%;
    border: thick solid #7D3BBB;
}
.header-knowee-leaves
{
    position: absolute;
    border: thin solid #feb300;
    border-radius: 5px;
    
}

.slider-holder-knowee
{
    position: absolute;
   
    border-radius: 5px; 
}
.slider-holder-unit-knowee
{
    position: absolute;
    display: flex;
    justify-content: center;
    justify-items: center;
    align-items: center;
}
.hheader-knowee
{
    position: absolute;
    border-radius: 4px;
    display: flex;
    justify-content: center;
    justify-items: center;
    align-items: center;
    flex-direction: row;
}
.hheader-knowee-inner-logo
{
    border-radius: 4px;
}
.hheader-knowee-inner-label 
{
    border: thin solid #feb300;
    border-radius: 4px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    color: #7D3BBB;
     /* Optional: to add some padding inside the div */
    position: relative; /* Necessary for absolute positioning */
}


.hheader-knowee-inner-label span 
{
    position: absolute;
    bottom: 0;
    left: 0;
}