@import url('general.css');
.main_content_container{
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: white;
    width: fit-content;
    margin: 20px auto 20px auto;
    padding: 20px;
    font-family: 'Roboto';
    width: 400px;
    gap: 10px;
}
.main_content_container_second{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
}
.main_content_container h2 {
    color: #2e2e2e;
    text-align: center;
    font-weight: 400;
    font-size: 14px;
    padding: 10px 5px 10px 5px;
}
.porcentage_txt{
    font-size: 26px;
}
.main_content_container a {
    color: #0055b6;
    font-size: 14px;
}
.main_content_container button{
    width: auto;
    background: #00a2e8;
    width: auto; 
    padding: 10px 30px;
    transition: all 0.3s;
    border-radius: 5px;

    font-weight: 700;
    font-size: 15px;
    font-family: 'Roboto';
    color: #F4F4F4;
}
.start_process{
    width: auto;
    background: #00a2e8;
    width: auto;
    padding: 10px 30px;
    transition: all 0.3s;
    border-radius: 5px;

    font-weight: 700;
    font-size: 15px;
    font-family: 'Roboto';
    color: #F4F4F4 !important;
}
.start_process:hover{
    background: var(--color-primario);
}


.main_content_container button:hover{
    background: var(--color-primario);
}
.main_content_container .unselected {
    border: 1px solid #2e2e2e;
    background-color: #a3a3a3;
    color: #2e2e2e;
}
.main_content_container .unselected:hover {
    background-color: #757575;
}
/* SCALE SYSTEM */
.crescent_main_moon_container{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.crescent_moon_container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 165px; 
    height: 165px; 
}

.crescent_moon_container img {
    width: 165px;
    display: block;
}

.crescent-moon {
    display: block;
}

.fa-arrow-up {
    color: #000;
    font-size: 30px;
    z-index: 2;
    position: absolute;
    bottom: 12%;
    left: 50%;
    transform: translate(-50%, -50%);
}
