/*
* Common Styles
*/ 
.gd-paywall-header {
  padding: 3% 0;
}
.gd-paywall-title {
  text-align: center;
  font-size: 28px;
  line-height: 1.4;
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: 1px;
}
.gd-paywall-subtitle {
  text-align: center;
  color: #b49c56;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}

.gd-button {
  display: inline-block;
  padding: 10px 30px;
  margin-right: 10px;
  border: none;
  outline: none;
  border-radius: 0 !important;
  cursor: pointer;
}
/* Irritating salient button radius fix */
body[data-button-style*="slightly_rounded"] .gd-button {
  border-radius: 0 !important;
}

.gd-button.gd-primary {
  background: rgb(180, 156, 86);
  color: #000;
}
.gd-button.gd-secondary {
  background: #444;
  color: #fff;
  margin-bottom: 20px;
}

/*
* Course Page
*/
.gd-course,
.gd-quiz,
.gd-module {
  border: 1px solid #eee;
  padding: 3%;
  padding-top: 0;
  border-radius: 30px;
  margin-bottom: 5%;
}
/*
* Component on Course Page
*/
.gd-course-component {
  position: relative;
  border-bottom: 1px solid #70707088;
}
.gd-course-component:last-child {
  border-bottom: none;
}
.gd-course-component-link {
  width: 100%;
  display: flex;
  gap: 20px;
  align-content: center;
  background: #fff;
  transition: 0.25s background;
}
.gd-course-component-link:hover {
  background: #e4e4e4;
  transition: 0.25s background;
}
.gd-course-component-icon img{
  margin-bottom: 0 !important;
  height: 20px !important;
  width: auto !important;
}
.gd-course-component-content {
  display: flex;
  gap: 10px;
  align-content: center;
  width: 100%;
  padding: 8px;
  padding-top: 12px;
}
.gd-course-component-icon {
  flex: 1;
  flex-grow: 0;
  min-width: 20px;
  text-align: center;
}
.gd-course-component-title {
  line-height: 20px;
  color: #000;
  font-weight: 400;
  margin-bottom: 0;
  text-transform: uppercase;
  flex: 1;
  flex-grow: 1;
}


/*
* Quiz Styles
*/
.gd-question-answers label {
  display: block;
}

.gd-question-outer.active {
  max-height: 100vh;
  overflow: hidden;
  transition: 0.25s max-height;
}

.gd-question-outer {
  max-height: 0;
  overflow: hidden;
  transition: 0.25s max-height;
}

.quiz-navigation-dot {
  display: block;
  width: 20px;
  height: 20px;
  background: #0002;
  border-radius: 10px;
  transition: 0.25s background;
}
.quiz-navigation-dot.active {
  background: #b49c56;
  transition: 0.25s background;
}
.quiz-navigation {
  display: flex;
}
.quiz-navigation {
  flex: 1;
  flex-grow: 0;
  left: 0;
  padding: 20px 3%;
}
#quiz-navigation-dots {
  display: flex;
  flex: 1;
  flex-grow: 1;
  align-content: space-around;
}
.gd-quiz {
	display: flex;
  height: auto;
  transition: 0.25s height;
	flex-direction: column;
  border: 1px solid #eee;
  padding-bottom: 100px;
}
.gd-quiz .gd-question-outer {
	flex: 1;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	background: #fff;
}
.gd-quiz .quiz-navigation {
	flex: 1;
	flex-grow: 0;
}
.gd-quiz .gd-question-answers,
.gd-quiz .gd-question-question{
	padding: 0 3%;
}
.gd-quiz .gd-question-answers label {
	font-size: 20px;
	line-height: 1.4;
	cursor: pointer;
	width: 100%;
	border-bottom: 1px solid #eee;
	padding: 20px 10px;
}
.gd-quiz .gd-question-answers label:last-child {
	border-bottom: none;
}
.gd-quiz .gd-question-question {
	padding: 3%;
}
#quiz-navigation-dots {
	justify-content: center;
}
.quiz-navigation {
	position: absolute !important;
	bottom: 0px;
	width: 100%;
  box-sizing: border-box;
}
.quiz-navigation-dot {
  margin-right: 10px;
  position: relative;
}
.quiz-navigation-dot.done::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 24px;
  width: 60%;
  height: 60%;
  border-radius: 50%;
  background: #0001;
}
.quiz-navigation-dot:last-child {
	margin-right: 0;
}
#gd-ajax-indicator {
  position: absolute;
  background: #fff;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.0;
  pointer-events: none;
  z-index: 1000000;
  background-image: url('/wp-content/plugins/gd-academy/assets/loader.gif');
  background-position: center center;
  background-repeat: no-repeat;  
}
#gd-ajax-indicator.active {
  opacity: 1.0;
  pointer-events: all;
}
.quiz-results-percentage {
  margin-bottom: 20px;
}