#tutor-list{ margin-left: 30%; margin-right: 30%; margin-top: 5%; } #grading-checkbox{ margin-left: 30%; margin-right: 30%; margin-top: 5%; display: flex; justify-content: center; } math-field{ opacity: 1; } math-field.correct_field{ background-color: #e9ecef; } .correct_field{ background-color: #e9ecef; color: green; box-shadow: 0px 0px 2px green; } .incorrect_field{ box-shadow: 0px 0px 10px red; color: red; } .hint_field{ box-shadow: 0px 0px 10px yellow !important; } input.incorrect_field { box-shadow: 0px 0px 10px red; } /* Momin add */ .bg-purple { background-color: purple !important; } #copy_message { position: fixed; bottom: 25%; /* position it in the last quarter of the page */ left: 50%; transform: translateX(-50%); /* center it horizontally */ padding: 10px 20px; background-color: #333; color: #fff; border-radius: 5px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); z-index: 1000; /* ensure it's on top of other content */ } #ask_scaffold { position: fixed; bottom: 15%; /* position it in the last quarter of the page */ left: 50%; transform: translateX(-50%); /* center it horizontally */ padding: 10px 20px; background-color: #333; color: #fff; border-radius: 5px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); z-index: 1000; /* ensure it's on top of other content */ } .hidden { display: none; } @keyframes shake { 0%, 100% { transform: rotate(0deg); } 25% { transform: rotate(-3deg); } 50% { transform: rotate(0deg); } 75% { transform: rotate(3deg); } } @keyframes shadowFadeOut { 0% { box-shadow: 0px 5px 10px rgba(36, 31, 15, 0.5); } 100% { box-shadow: 0px 5px 10px rgba(36, 31, 15, 0); } } .btn-warning-highlight { animation: shadowFadeOut 3s forwards, shake 0.1s ease-in-out 3; } .flash { width: 500px; margin: 5px auto 5px auto; } /* Used in factor_xbox */ .wrapper_small { display: grid; grid-template-columns: auto auto; } .wrapper_large { display: grid; grid-template-columns: auto auto auto; } #container-consent { margin: 5%; margin-left: 20%; margin-right: 20%; } .areabox input{ text-align:center; width: 100%; height: 90px; } .areabox div{ padding: 1px; } /* momin add start */ .textarea-like { height: 150px; /* Adjust the height as needed */ border: 1px solid #ccc; background-color: lightgrey; padding: 5px; font-size: 16px; line-height: 1.4; overflow: auto; /* Enable scrolling for long content */ resize: both; /* Allow resizing */ white-space: pre-wrap; /* Preserve line breaks */ cursor: pointer; /* Set the text cursor */ } .red-button { display: inline-block; padding: 15px 30px; background-color: red; color: white; border-radius: 50px; text-decoration: none; font-size: 18px; margin-right: 20px; /* Add space between buttons */ } .yellow-button { display: inline-block; padding: 15px 30px; background-color: yellow; color: black; border-radius: 50px; text-decoration: none; font-size: 18px; } /* momin add end */ /* Add this to your CSS file or within a