/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
.hide{ display:none; }
.red-icon-w-white-bg .e-fas-question-circle { background: #fff; border-radius: 50%; border: 1px solid transparent; }

/* Start - Quizz shortcode */
.quiz-shortcode{ font-family: "Poppins", Sans-serif; }
.quiz-shortcode .theory-test-info{ padding: 2em 0px; font-size: 18px; color: #000; }
.quiz-shortcode .quiz-title{ background-color: var(--e-global-color-primary); color: #fff; padding: 28px; margin: 0px; font-weight: 600; }
.quiz-shortcode h3{ font-size: 1.5em; }
.quiz-shortcode #quiz-guide{ color: var(--e-global-color-accent); }
.quiz-shortcode .quiz-sub-title{ display: inline-block; }
.quiz-shortcode .quiz-sub-title-area .btn-sort{ padding: 2px 8px; margin-left: 15px; cursor: pointer; border: 2px solid #ccc; border-radius: 5px; }
.quiz-shortcode .quiz-title, .quiz-shortcode #quiz-guide, .quiz-shortcode .quiz-btns, .quiz-shortcode .theory-test-info{ text-align:center; }
.quiz-shortcode #quiz-guide, .quiz-shortcode .result .score, .quiz-shortcode .dropzone.question { font-weight: bold; }
.quiz-shortcode .quiz-content{ padding: 20px; height: 100%; margin: 0 auto; max-width: 1140px; width:100%; }
.quiz-shortcode .quiz-container { display: flex; flex-wrap: wrap; margin: auto; }
.quiz-shortcode .quiz-container.quiz-drag{ display: grid; grid-template-areas: "questions answers"; grid-template-columns: 68.5% auto; }
.quiz-shortcode .quiz-drag .quiz-quest{ grid-area: questions; max-width: calc(100vw - 20px); min-width: 0; }
.quiz-shortcode .quiz-drag .quiz-ans{ grid-area: answers; align-self: start; position: sticky; top: 0px; margin-left: 1em; z-index: 100; }
.quiz-shortcode .quiz-tap .quiz-quest, .quiz-shortcode .quiz-tap .quiz-ans{ width: 100%; height: 50vh; overflow: scroll; position: relative; }
.quiz-shortcode .quiz-tap .quiz-sub-title-area{ position: sticky; top: 0px; z-index: 2; background: #fff; }
.quiz-shortcode .quiz-container #questions, .quiz-shortcode .quiz-container #answers { display: flex; flex-wrap: wrap; flex-direction: column; gap: 10px; }
.quiz-shortcode .quiz-container #questions.reverse, .quiz-shortcode .quiz-container #answers.reverse { flex-direction: column-reverse; }
.quiz-shortcode .item, .quiz-shortcode .dropzone, .quiz-shortcode .answer { padding: 10px; border: 2px solid #ccc; border-radius: 5px; background-color: #f9f9f9; min-width: 300px; transition: background-color 0.3s; text-align: center; width: 100%; font-size: 0.95em; line-height: 1.4em; }
.quiz-shortcode .quiz-drag .answer{ cursor: pointer; }
.quiz-shortcode .answer { font-weight: normal !important; border-style: dashed !important; }
.quiz-shortcode .dropzone .answer, .quiz-shortcode .question .answer { margin-top: 5px; margin-bottom: 0px; }
.quiz-shortcode .selected { background-color: #ffe58a; }
.quiz-shortcode .matched-answer { background-color: #ddd; color: #888; text-decoration: line-through; cursor: not-allowed; }
.quiz-shortcode .matched { background-color: #e6f7ff; }
.quiz-shortcode .correct { background-color: #d4edda !important; border-color: #28a745; }
.quiz-shortcode .wrong { background-color: #f8d7da !important; border-color: #dc3545; }			
.quiz-shortcode .quiz-btns { margin-top: 20px; }
.quiz-shortcode .btn { padding: 10px 20px; cursor: pointer; background-color: var(--e-global-color-accent); color: #fff; border:none; }
.quiz-shortcode .btn:hover{ background-color: var(--e-global-color-primary); }
.quiz-shortcode .result .result-content { margin-top: 20px; background-color: var(--e-global-color-primary); color: #fff; padding: 20px; border-radius: 5px; }
.quiz-shortcode .result .score{ text-align: center; font-size: 1.2em;}
.quiz-shortcode .result .correct-answers-text{ font-size: 1.2em; }
.quiz-shortcode .result .correct-answers-list{ padding: 0px; list-style: none; }
.quiz-shortcode .result .correct-answers-list li{ padding: 20px 10px; }
.quiz-shortcode .result .correct-answers-list li + li{ border-top: 1px solid; }
.quiz-shortcode .btn-book .btn {background-color: #0E1A86; border-radius: 3px; font-size: 20px; font-weight: 500; padding: 10px 25px 10px 25px; }
.quiz-shortcode .btn-book .btn:hover { background-color: #C21938; }
/* End - Quizz shortcode */

@media(max-width: 767px){
	.quiz-shortcode .quiz-title{ font-size: 38px; }
}