.font-size-type-container {
    position: relative;
}

.font-size-type-dropdown {
    display:none;
    position: absolute;
    top: 12px;
    left: 0;
    width: 64px;
    height: 98px;
    border: 1px solid #979797;
    background-color: #f0f0f0;
}

.font-size-type-dropdown-li {
    display:inline-block;
    cursor:pointer;
    color: #000;
    font-size: 16px;
    text-align: center;
    width: 100%;
    height: 30px;
    line-height: 30px;
    margin-top: 3px;
    margin-left: 0;
}

    .font-size-type-dropdown-li.selectd {
        background-color: #fa6b27;
        color: #fff !important;
        font-weight:bold;
    }

    .font-size-type-dropdown-li:hover {
        background-color: #fa6b27;
        color: #fff !important;
        font-weight:bold;
    }


.large-font-span:hover ~ .font-size-type-dropdown { 
      display:block;
}

.font-size-type-dropdown:hover {
     display:block;
}

.size12,.size12 p  {
    font-size:12px !important;
}

.size14,.size14 p  {
    font-size:14px !important;
}

.size16,.size16 p {
    font-size:16px !important;
}

.size18,.size18 p {
    font-size:18px !important;
}

.size20,.size20 p {
    font-size:20px !important;
}

.size22,.size22 p {
    font-size:22px !important;
}

.ellipsis {
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
}