.quiz_x7k9_container_n2p {
margin: 10px;
background: linear-gradient(145deg, #FF8C00, #FFA500);
border-radius: 24px;
padding: 25px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.quiz_x7k9_content_m4j {
background: white;
border-radius: 20px;
padding: 30px;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}
.quiz_x7k9_header_p8r {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
}
.quiz_x7k9_title_h5v {
font-size: 28px;
font-weight: bold;
color: #2D3748;
animation: quiz_x7k9_fadeIn_w3q 0.5s ease;
}
.quiz_x7k9_score_container_l1d {
background: #EDF2F7;
padding: 10px 20px;
border-radius: 15px;
display: flex;
align-items: center;
gap: 8px;
}
.quiz_x7k9_score_label_t9c {
font-size: 16px;
color: #4A5568;
}
.quiz_x7k9_score_k4m {
font-size: 20px;
font-weight: bold;
color: #2D3748;
}
.quiz_x7k9_meme_container_y6b {
background: #F7FAFC;
padding: 40px;
border-radius: 20px;
display: flex;
align-items: center;
justify-content: center;
gap: 20px;
margin: 20px 0;
transition: transform 0.3s ease;
position: relative;
}
.quiz_x7k9_question_container_f2s {
display: flex;
align-items: center;
gap: 20px;
}
.quiz_x7k9_meme_container_y6b:hover {
transform: scale(1.02);
}
.quiz_x7k9_emoji_r8n {
font-size: 80px;
animation: quiz_x7k9_bounceIn_g7h 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
order: 2;
}
.quiz_x7k9_pointing_hand_z5x {
font-size: 50px;
order: 1;
animation: quiz_x7k9_pointingRight_j9w 2s infinite;
}
.quiz_x7k9_input_container_q3v {
width: 100%;
display: flex;
flex-direction: column;
gap: 15px;
margin-top: 20px;
}
.quiz_x7k9_input_b7m {
padding: 15px 20px;
border: 2px solid #E2E8F0;
border-radius: 15px;
font-size: 16px;
transition: all 0.3s ease;
outline: none;
}
.quiz_x7k9_input_b7m:focus {
border-color: #4299E1;
box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.1);
}
.quiz_x7k9_buttons_u4p {
display: flex;
gap: 10px;
width: 100%;
}
.quiz_x7k9_button_d1c {
flex: 1;
padding: 15px 25px;
border: none;
border-radius: 15px;
font-size: 16px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
}
.quiz_x7k9_submit_button_m8k {
background: #48BB78;
color: white;
}
.quiz_x7k9_submit_button_m8k:hover {
background: #38A169;
transform: translateY(-2px);
}
.quiz_x7k9_next_button_v2x {
background: #4299E1;
color: white;
}
.quiz_x7k9_next_button_v2x:hover {
background: #3182CE;
transform: translateY(-2px);
}
.quiz_x7k9_feedback_h9n {
min-height: 30px;
font-size: 18px;
font-weight: 600;
text-align: center;
margin-top: 20px;
padding: 10px 20px;
border-radius: 12px;
width: 100%;
animation: quiz_x7k9_fadeIn_w3q 0.3s ease;
}
.quiz_x7k9_correct_p5j {
background: #C6F6D5;
color: #2F855A;
}
@media only screen and (max-width: 400px) {
.quiz_x7k9_button_d1c{
padding:10px;
}
}
.quiz_x7k9_incorrect_t7m {
background: #FED7D7;
color: #C53030;
line-height:25px;
}
.quiz_x7k9_progress_bar_k2n {
width: 100%;
height: 6px;
background: #E2E8F0;
border-radius: 3px;
margin-top: 20px;
overflow: hidden;
}
.quiz_x7k9_progress_w8v {
height: 100%;
background: linear-gradient(90deg, #48BB78, #4299E1);
transition: width 0.3s ease;
}
@keyframes quiz_x7k9_bounceIn_g7h {
0% { transform: scale(0); }
50% { transform: scale(1.2); }
100% { transform: scale(1); }
}
@keyframes quiz_x7k9_fadeIn_w3q {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes quiz_x7k9_pointingRight_j9w {
0%, 100% { transform: translateX(0); }
50% { transform: translateX(10px); }
}
';
?>