﻿.tooltipquestion {
    position: relative;
}
.tooltipskill {
    position: relative;
}
.tooltiptext {
    position: absolute;
    left: 8%;
    background-color: #000;
    color: #fff;
    white-space: nowrap;
    padding: 10px 15px;
    border-radius: 7px;
    visibility: hidden;
}
.tooltipskilltext {
    position: absolute;
    left: 8%;
    background-color: #b9b1b1;
    color: #fff;
    white-space: nowrap;
    padding: 6px 15px;
    border-radius: 7px;
    visibility: hidden;
    font-size:13px;
}

    .tooltiptext::before {
        content: "";
        position: absolute;
        left: 50%;
        top: 100%;
        transform: translateX(-50%);
        border: 15px solid;
        border-color: #000 #0000 #0000 #0000;
    }
.tooltipskilltext::before {
    content: "";
    position: absolute;
    left: 35%;
    top: 100%;
    transform: translateX(-50%);
    border: 5px solid;
    border-color: #b9b1b1 #0000 #0000 #0000;
}

.tooltipquestion:hover .tooltiptext {
    visibility: visible;
    top: -60%;
    opacity: 0.8;
    z-index: 1;
}
.expectation.techinfocontainer .tooltiptext {
    top: -38px !important;
    width: 300px;
    white-space: normal;
    line-height: 18px;
    font-size: 13px;
    margin-left: 41px!important;
    margin-top: -27px!important;
}

    .expectation.techinfocontainer .tooltiptext::before, .expectation .tooltiptext::before {
        left: 23%;
    }
.expectation .tooltipskilltext {
    top: -38px !important;
    width: 200px;
    white-space: normal;
    line-height: 18px;
    font-size:13px;
    margin-top:-61px!important;
}

.question-discussed .tooltipskill:hover .tooltipskilltext {
    top: -45% !important;
}
    .tooltipskill:hover .tooltipskilltext {
    visibility: visible;
    top: -60%;
    opacity: 0.8;
    z-index: 1;
    left:0px!important;
}
.techinfocontainer {
    display: -ms-flexbox;
    display: flex;
}

.techinfoicon {
    padding: 10px 0;
    font-size: large;
    cursor: pointer;
}
.techinfocontainer .tooltiptext {
    position: absolute;
    left: -39%;
    top: -69px;
    background-color: #646161;
    color: #fff;
    white-space: nowrap;
    padding: 6px 15px;
    border-radius: 7px;
    visibility: hidden;
    font-size: 11px;
    line-height: 14px;
    font-family: Arial;
}
.tooltip-skill{
    position:relative;
}
  

    .tooltip-skill .techinfocontainer .tooltipquestion:hover .tooltiptext {
        top: -37px !important;
    }


.techinfocontainer .tooltiptext::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    border: 8px solid;
    border-color: #646161 #0000 #0000 #0000;
}

.techinfocontainer .tooltipquestion:hover .tooltiptext {
    visibility: visible;
    top: -42px;
    opacity: 0.8;
    z-index: 1000;
    left: -105px;
}