/*----------------------------The below CSS is used in the plan tag box on dashboard page------------------------------*/
.plan_box_dashboard {
	border: 1px solid #3F4DCB; 
	border-radius: 10px; 
	padding: 5px 10px;
	width: auto; 
	max-width: 100%; 
	height: auto;
	display: flex; 
	align-items: center; 
	justify-content: center;
}

.plan_box_dashboard_outerbox{
    display: flex; 
	align-items: flex-end; 
	justify-content: flex-end;
}

/*----------------------------The above CSS is used in the plan tag box on dashboard page------------------------------*/	



/* Container for quiz data */
.dashboard_quiz_data {
    display: flex; /* Display quiz data horizontally */
    justify-content: center; /* Align content to the top */
    align-items: stretch;
    padding-bottom: 20px;    
}

.read-more-btn {
    background-color: unset;
    color: #3F4DCB;
    padding: 5px 5px;
    border: unset;
    cursor: pointer;
}

.read-more-btn:hover {
    background-color: unset;
    color: #000039;
}


/* Styles for the quiz box */
.dashboard_quiz_box {
    display: flex;
    flex-direction: column; /* Arrange items vertically within each box */
    justify-content: flex-start; /* Align content to the top */
    align-items: center; /* Center items horizontally */
    width: 20vw; /* Set a consistent width for each box */
    height: auto; /* Adjust height dynamically */
    box-sizing: border-box; /* Ensure padding is included in dimensions */
    padding: 20px;   /* Add padding for spacing */
}

/* Styles for the attribute box */
.dashboard_attribute_box {
    text-align: center;
    text-transform: uppercase;
    color: #ffff;
    padding: 10px;
    width: 100%; /* Make it span the width of the box */
}

/* Styles for the description box */
.dashboard_description_box {
    text-align: center; /* Align text to the left */
    padding: 10px;
    width: 100%; /* Make it span the width of the box */
    color: #ffff;
}

.edvdo_dashboard_assessment_new_outerblue_box{
    display: block; 
    text-align: center; 
    width: 100%; 
    height: 38vh; 
    padding: 5%;
}

.edvdo_dashboard_assessment_new_resultbutton1{
    position:absolute;
    top:70%;
    left:15%;
    width: 70%; height: 50px;
    border-radius: 5px; 
    display: flex; 
    justify-content: center;
    align-items: center;
    padding: 10px 10px; 
    background-color:rgb(63, 77, 203);
    color: #ffffff;
}

@media screen and (min-width: 1025px) and (max-width: 1440px){
    /* Styles for the quiz box */
    .dashboard_quiz_box {
        display: flex;
        flex-direction: column; /* Arrange items vertically within each box */
        justify-content: flex-start; /* Align content to the top */
        align-items: center; /* Center items horizontally */
        width: 25vw; /* Set a consistent width for each box */
        box-sizing: border-box; /* Ensure padding is included in dimensions */
        padding: 20px;   /* Add padding for spacing */
        margin-bottom: 10px; 
    }

    .edvdo_dashboard_assessment_new_outerblue_box{
        display: block; 
        text-align: center; 
        width: 100%; 
        height: 40vh; 
        padding: 3%;
    } 

    .edvdo_dashboard_assessment_new_resultbutton1{
        position:absolute;
        top:80%;
        left:15%;
        width: 70%; height: 35px;
        border-radius: 5px;
        display: flex; 
        justify-content: center;
        align-items: center;
        padding: 3%; 
        background-color:rgb(63, 77, 203);
        color: #ffffff;
    }   
}


@media screen and (min-width: 481px) and (max-width: 1024px){

    /* Styles for the quiz box */
    .dashboard_quiz_box {
        display: flex;
        flex-direction: column; /* Arrange items vertically within each box */
        justify-content: flex-start; /* Align content to the top */
        align-items: center; /* Center items horizontally */
        width: 30vw; /* Set a consistent width for each box */
        box-sizing: border-box; /* Ensure padding is included in dimensions */
        padding: 10px;   /* Add padding for spacing */
        margin-bottom: 10px; 
    }

    .edvdo_dashboard_assessment_new_outerblue_box{
        display: block; 
        text-align: center; 
        width: 100%; 
        height: 25vh; 
        padding: 3%;
    } 

    .edvdo_dashboard_assessment_new_resultbutton1{
        position:absolute;
        top:79%;
        left:15%;
        width: 70%; height: 35px;
        border-radius: 5px;
        display: flex; 
        justify-content: center;
        align-items: center;
        padding: 3%; 
        background-color:rgb(63, 77, 203);
        color: #ffffff;
    }   
}

@media screen and (min-width: 320px) and (max-width: 480px){


/*----------------------------The below CSS is used in the plan tag box on dashboard page------------------------------*/
.plan_box_dashboard {
	border: 1px solid #3F4DCB; 
	border-radius: 10px; 
	padding: 5px 10px;
	width: auto; 
	max-width: 100%; 
	height: 30px;
	display: flex; 
	align-items: center; 
	justify-content: center;
}

/*----------------------------The above CSS is used in the plan tag box on dashboard page------------------------------*/	


    /* Container for quiz data */
    .dashboard_quiz_data {
        display: flex; /* Display quiz data horizontally */
        justify-content: center; /* Align content to the top */
        flex-direction: column; /* Arrange items vertically within each box */
        align-items: center;
        padding-bottom: 20px;    
    }

    /* Styles for the quiz box */
    .dashboard_quiz_box {
        display: flex;
        flex-direction: column; /* Arrange items vertically within each box */
        justify-content: flex-start; /* Align content to the top */
        align-items: center; /* Center items horizontally */
        width: 85vw; /* Set a consistent width for each box */
        box-sizing: border-box; /* Ensure padding is included in dimensions */
        padding: 20px;   /* Add padding for spacing */
    }

    .edvdo_dashboard_assessment_new_outerblue_box{
        display: block; 
        text-align: center; 
        width: 100%; 
        height: 30vh; 
        padding: 3%;
    } 

    .edvdo_dashboard_assessment_new_resultbutton1{
        position:absolute;
        top:70%;
        left:15%;
        width: 70%; height: 35px;
        border-radius: 5px;
        display: flex; 
        justify-content: center;
        align-items: center;
        padding: 3%; 
        background-color:rgb(63, 77, 203);
        color: #ffffff;
    }   
}