.settings{
    flex-wrap: wrap;
    display: flex;
    padding:10px;
    font-size:18px;
    border: transparent solid 1px;
    border-radius: 20px;
    color: rgb(255, 255, 255);
}
.settings_profile{
    text-align: center;
    margin: 0;
    color:rgb(255, 255, 255);
    box-shadow: none;
    background-color:transparent;
}
.settings_profile a{
    color: rgb(255, 255, 255);
    text-decoration:underline;
    font-size: 16px;
}
.settings_profile a:hover{
    color: rgb(218,165,32);
    -webkit-transition: all 800ms ease;
    -moz-transition: all 800ms ease;
    -ms-transition: all 800ms ease;
    -o-transition: all 800ms ease;
    transition: all 800ms ease;
}
.settings span{
    width: 46%;
    margin:5px;
    text-align: center;
}
.settings img,.pr-pic{
    width:150px;
    height: 150px;
    color:rgb(0, 255, 149);
    border:  rgb(0, 255, 149) solid 1px;
    box-shadow: rgb(0, 255, 149)  0px 1px 4px;
    border-radius: 50%;
    margin-bottom:10px;
    object-fit: cover;
    object-position: center;
}
.settings img:hover,.pr-pic:hover{
    box-shadow: rgba(0, 255, 149, 0.418)  0px 1px 4px;
    color: rgba(0, 255, 149, 0.418);
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}
.settings div{
    text-align: left;
    word-wrap: break-word;
    padding: 10px;
}
.settings h5{
    background-color: transparent;
    border: rgba(0, 0, 0, 0.603) solid 1px;
    box-shadow: rgba(218, 165, 32, 0.726) 0px 1px 4px;
    border-radius:8px;
    font-size:17px;
    padding:5px;
    padding-left:8px;
}
.settings h4{
    text-align: center;
}
.setting_h6{
    margin-top: 100px;
}
#reflink{
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    display: flex;
    word-wrap:break-word;
}
#reflink h5{
    width:85%;
}
#copyicon{
    width:30px;
    height: 28px;
    margin: 0;
    padding: 0;
    cursor: pointer;
}
.sub_account{
    display: flex;
    flex-wrap: wrap;
    height:150px;
    max-height: 250px;
    overflow: auto;
    border: transparent solid 1px;
    box-shadow: rgb(218,165, 32)  0px 1px 4px;
    border-radius: 10px;
}
.sub_account::-webkit-scrollbar {
    display: none;
}
.sub_account{
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
.sub_account img,.sub-pic{
    width:70px;
    height: 70px;
    color:rgb(0, 255, 149);
    border:  rgb(0, 255, 149) solid 1px;
    box-shadow: rgb(0, 255, 149)  0px 1px 4px;
    border-radius: 50%;
    object-fit: cover;
    object-position: center;
}
.sub_account_tooltip{
    display: inline-block;
    position: relative;
    border: transparent solid 1px;
    border-radius:50%;
}
.sub_account_tooltip .sub_account_tooltiptext{
    visibility: hidden;
    padding: 5px;
    width: 90px;
    word-wrap: break-word;
    font-size: 12px;
    top:100%;
    left: 50%;
    margin-left: -40px;
    background-color: rgba(0, 0, 0, 0.616);
    color: white;
    text-align: center;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    box-shadow: rgb(218,165, 32) 0px 1px 4px;
}
.sub_account_tooltip:hover .sub_account_tooltiptext{
    visibility: visible;
}
.sub_account div{
    width:29%;
    margin-right: 8px;
    margin-bottom: 8px;
    padding: 0;
}
.sub_form input{
    margin-bottom: 20px;
}
.circular-chart-pn {
    width:31%;
    height: 120px;
    stroke: transparent;
    padding: 0;
    margin: 0;
}
.circle-pn-bg {
    fill: none;
    stroke: rgba(54, 54, 54, 0.678);
    stroke-width: 2px;
    
}
.circle-pn {
    fill: none;
    stroke-width: 2px;
    animation: progress 5s ease-out forwards;
    
}  
.circle-pn{
    stroke: rgba(255, 255, 255, 0.897);
}
.clrblue{
    stroke: rgb(0, 255, 221);
    
}
.clrred{
    stroke: red;
}
.clrorange{
    stroke: rgb(251, 255, 0);
}
.prclrblue{
    fill:rgb(0, 255, 221);
}
.prclrred{
    fill:red;
}
.prclrorange{
    fill:rgb(251, 255, 0);
}
.percentage-pn{
    font-size:6px;
    text-anchor: middle;
}
@keyframes countdown {
    from {
      stroke-dashoffset: 0px;
    }
    to {
      stroke-dashoffset: 113px;
    }
}
@media screen and (max-width:300px) {
    #reflink h5{
        width:75%;
    }
}
@media screen and (max-width:310px) {
    .sub_account img,.sub-pic{
        width:60px;
        height: 60px;
    }
    .sub_account div{
        width:42%;
    }
}
@media screen and (max-width:770px) {
    .settings span{
        width: 100%;
    }
    .setting_h6{
        margin-top:0;
    }
    .sub_account img,.sub-pic{
        width:50px;
        height: 50px;
    }
}