/* version 1.4.1
Version Style ebmpapst  */

:root {
	/* Colors */
	--mgznkr-quiz-background: #fff;
	--mgznkr-quiz-y-color: #00a633;
	--mgznkr-quiz-n-color: #e07a0c;
}

/* Style start */

.mgznkr-quiz {
	background: var(--mgznkr-quiz-background,#eee);
	padding: 2rem 4rem;
	border-radius: 2.5rem;
	border: 4px solid #007cbc;
	margin-top: 5rem;
}

.mgznkr-quiz:before {
	position: absolute;
	content: '?';
	display: inline-block;
	font-size: 4rem;
	color: #fff;
	width: 5rem;
	height: 5rem;
	font-weight: 400;
	text-align: center;
	line-height: 4rem;
	top: -3.2rem;
	right: 3.5rem;
	background: #007cbc;
	border: 0.4rem solid #007dc6;
	border-radius: 50%;
	font-family: "Helvetica Neue LT W01_67 Md Cn";
}

.mgznkr-quiz-after h4 {
	position: relative;
	font-family: 'Helvetica Neue LT W01_67 Md Cn', Arial, sans-serif;
  font-size: 1.4em;
  letter-spacing: 0.06em;
	}


.mgznkr-quiz-after hr.wp-block-separator:first-child {
margin-top: 5px;
}

.mgznkr-quiz .wp-block-button a {
  background: #e07a0c;
  }
  
.article-content .mgznkr-quiz h3 {
	margin-top: 6px;
}

.mgznkr-quiz .wp-block-buttons {
margin-bottom: 6px;
}

.mgznkr-quiz .wp-block-button a:after {
	content: '\f054';
	font-family: 'Font Awesome 5 Free';
	font-weight: 700;
	margin-left: 6px;
	
}

/* Style end */


.mgznkr-quiz,
.mgznkr-quiz-after {
	position: relative;
}

.mgznkr-quiz-after {
  display: none;
  padding: 2rem 0 0;
}

.mgznkr-quiz:not(.mgznkr-quiz-check) ul li,
.mgznkr-quiz:not(.mgznkr-quiz-check) ul li:before {
	cursor: pointer;
}

.mgznkr-quiz ul li,
.mgznkr-quiz ul li:before {
	list-style: none;
}

.mgznkr-quiz ul li.mgznkr-quiz-select {
	font-weight: bold;
}

.mgznkr-quiz ul.mgznkr-quiz-single li:before,
.mgznkr-quiz ul.mgznkr-quiz-multi li:before {
	content: '\f111';
	font-family: 'Font Awesome 5 Free';
	font-weight: 500;
	margin: 0 0 0 -3.4rem;
	width: 3.4rem;
	height: 100%;
	background: none;
	display: inline-block;
}

.mgznkr-quiz ul.mgznkr-quiz-multi li:before {
	content: '\f0c8';
}

.mgznkr-quiz ul.mgznkr-quiz-multi li.mgznkr-quiz-select:before {
	content: '\f0fe';
}

.mgznkr-quiz.mgznkr-quiz-check ul li.mgznkr-quiz-y:before {
	content: '\f058';
	color: var(--mgznkr-quiz-y-color, green);
}

.mgznkr-quiz.mgznkr-quiz-check ul li.mgznkr-quiz-n:before {
	content: '\f057';
	color: var(--mgznkr-quiz-n-color, red);
}

.mgznkr-quiz.mgznkr-quiz-check ul li.mgznkr-quiz-n.mgznkr-quiz-select {
  	animation-duration: 1.2s;
  	animation-name: headShake;
  	animation-fill-mode: both;
  	animation-delay: 0.8s;
  	animation-timing-function: ease-in-out;
}

.mgznkr-quiz.mgznkr-quiz-check ul li.mgznkr-quiz-y.mgznkr-quiz-select {
	animation: tada;
  	animation-duration: 1s;
  	animation-fill-mode: both;
  	animation-delay: 0s;
  	animation-timing-function: ease-in-out;
}

.mgznkr-quiz.mgznkr-quiz-check ul li.mgznkr-quiz-n {
	text-decoration: line-through;
}

.mgznkr-quiz.mgznkr-quiz-check ul.mgznkr-quiz-multi li.mgznkr-quiz-y:before {
	content: '\f14a';
}

.mgznkr-quiz.mgznkr-quiz-check ul.mgznkr-quiz-multi li.mgznkr-quiz-n:before {
	content: '\f146';
}


.mgznkr-quiz.mgznkr-quiz-check ul.mgznkr-quiz-multi + .wp-block-buttons a,
.mgznkr-quiz.mgznkr-quiz-check ul.mgznkr-quiz-multi + .wp-block-buttons a:hover,
.mgznkr-quiz.mgznkr-quiz-check ul.mgznkr-quiz-multi + .wp-block-buttons a:active,
.mgznkr-quiz.mgznkr-quiz-check ul.mgznkr-quiz-multi + .wp-block-buttons a:focus {
	background-color: #999;
	cursor: default;
	text-decoration: none;
}

.mgznkr-quiz > [class*="__inner-container"] .mgznkr-quiz-after:not(.alignfull):not(.alignwide):not(.alignleft):not(.alignright) {
	display: none;
	max-width: unset;
}






@keyframes headShake {
  0% {
    transform: translateX(0);
  }

  6.5% {
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    transform: translateX(0);
  }
}


@keyframes tada {
  from {
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -2deg);
  }

  30%,
  50%,
  70%,
  90% {

    transform: scale3d(1.05, 1.05, 1.05) rotate3d(0, 0, 1, 2deg);
  }

  40%,
  60%,
  80% {
    transform: scale3d(1.05, 1.05, 1.05) rotate3d(0, 0, 1, -2deg);
  }

  to {
    transform: scale3d(1, 1, 1);
  }
}