.referOuter{

    padding: 30px 30px;

    width: calc(100% - 210px);

    max-width: 1376px;

    height: calc(100vh - 30px);

    overflow-y: scroll;

}

.referLinkBox{

    padding: 25px 35px;

    border-radius: 20px;

background: #FFF;

border: 1px solid #E9F0FD;

}

.referLinkBox h1{

font-size: 30px;

font-weight: 500;

line-height: normal;

padding-bottom: 20px;

margin-bottom: 15px;

border-bottom: 2px solid #EBEBEC;

}

.referLinkBox p{

    color: #0E101A;

    font-size: 17px;

    font-style: normal;

    font-weight: 450;

    line-height: 150%;

}

.linkWrapper{

    margin-top: 20px;

}

.linkBoxOuter{

    display: none;

    align-items: center;

    gap: 20px;

    margin-top: 15px;

}

.linkInputWrapper{

    display: flex;

    background: #FFF;

}

.linkInputWrapper input{

    appearance: none;

    padding: 10px 15px 11px;

    color: #A9A9A9;

    font-size: 16px;

    font-weight: 450;

    line-height: 150%;

    background: #fff;

    border: none;

    border-radius: 6px 0 0 6px;

    border: 1px solid #1176CA;

    min-width: 293px;

}

button {

    appearance: none;

    border: none;

    outline: none;

    display: block;

    cursor: pointer;

}

.linkInputWrapper button{

    padding: 12px 15px 12px 16px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    border-radius: 0px 6px 6px 0px;

    background: #1176CA;

}

.linkInputWrapper button:hover{

    background: #1150CA;

}

.linkInputWrapper button span{

    color: #FFF;

    font-size: 16px;

font-weight: 450;

line-height: 150%;

}

.shareWhatsapp{

    padding: 12px 15px;    

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    border-radius: 6px;

background: #00B65F;

}

.shareWhatsapp:hover{

    background: #02974f; 

}

.shareWhatsapp span{

    color: #FFF;

font-size: 16px;

font-weight: 450;

line-height: 150%;

}

.statsOuter{

    margin-top: 20px;

    padding: 25px 35px;

    border-radius: 20px;

    background: #FFF;

    border: 1px solid #E9F0FD;

}

.statsOuter h2{

    color: #0E101A;

font-size: 25px;

font-weight: 500;

line-height: normal;

}

.statsWrapper{

    display: flex;

    align-items: center;

    gap: 30px;

    margin: 25px 0 40px;

}

.singleStat{

    max-width: 245px;

    width: 100%;

    padding: 11px 18px 18px;

    border-radius: 15px;

    border: 1px solid #DAEEFA;

    background: #FFF;

    box-shadow: 0px 2px 21px 0px rgba(89, 89, 89, 0.15);

    position: relative;

}

.referralValue{

    color: #1176CA;

    font-size: 40px;

    font-weight: 450;

    line-height: normal;

}

.statDesc{

    color: #0E101A;

font-size: 14px;

font-weight: 450;

line-height: 150%;

}

.statIcon{

    position: absolute;

    right: 0;

    top: 0;

}

.referQuestions h3{

    color: #0E101A;

    font-size: 17px;

    font-weight: 500;

    line-height: normal;

    margin-top: 20px;

}

.referQuestions h3:first-child{

    margin-top: 0;

}

.referQuestions p{

    margin-top: 10px;

    color: #747474;

font-size: 16px;

font-weight: 450;

line-height: normal;

}

.topWallet{

    display: none;

}

@media (max-width:450px) {

    .topWallet{

        display: block;

    }

    .referOuter{

        padding: 35px 15px 0;

        width: 100%;

    }

    .referLinkBox h1{

        font-size: 23px;

        padding-bottom: 15px;

    }

    .referLinkBox{

        padding: 20px 18px;

    }

    .linkBoxOuter{

        flex-direction: column;

        gap: 15px;

        align-items: flex-start;

    }

    .linkInputWrapper input{

        min-width: unset;

        flex-grow: 1;

    }

    .statsOuter{

        padding: 20px 18px 35px;

    }

    .statsWrapper{

        margin: 15px 0 30px;

        flex-direction: column;

        gap: 20px;

    }

    .singleStat{

        max-width: unset;

        padding: 11px 18px;

    }

    .statDesc{

        font-size: 16px;

        margin-top: 5px;

    }

    .referQuestions {

        padding: 0 10px;

    }

    .referQuestions h3{

        font-size: 18px;

    }

    .referQuestions p{

        font-size: 15px;

        line-height: 160%;

    }

    .referralValue{

        font-size: 35px;

    }

}