* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

@font-face {
    font-family: 'Mikado Bold Kids';
    src: url('https://cdn1.byjus.com/me/grades/grade_4/assets/fonts/MikadoBoldKids.eot');
    src: url('../fonts/MikadoBoldKids.eot?#iefix') format('embedded-opentype'), url('../fonts/MikadoBoldKids.woff2') format('woff2'), url('../fonts/MikadoBoldKids.woff') format('woff'), url('../fonts/MikadoBoldKids.ttf') format('truetype'), url('../fonts/MikadoBoldKids.svg#MikadoBoldKids') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Sassoon Montessori Md Kids';
    src: url('../fonts/SassoonMontessoriMd-Kids.eot');
    src: url('../fonts/SassoonMontessoriMd-Kids.eot?#iefix') format('embedded-opentype'), url('../fonts/SassoonMontessoriMd-Kids.woff2') format('woff2'), url('../fonts/SassoonMontessoriMd-Kids.woff') format('woff'), url('../fonts/SassoonMontessoriMd-Kids.ttf') format('truetype'), url('../fonts/SassoonMontessoriMd-Kids.svg#SassoonMontessoriMd-Kids') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GothamSSm';
    src: url('../fonts/GothamSSm-Book.eot');
    src: url('../fonts/GothamSSm-Book.eot?#iefix') format('embedded-opentype'), url('../fonts/GothamSSm-Book.woff2') format('woff2'), url('../fonts/GothamSSm-Book.woff') format('woff'), url('../fonts/GothamSSm-Book.ttf') format('truetype'), url('../fonts/GothamSSm-Book.svg#GothamSSm-Book') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GothamSSm';
    src: url('../fonts/GothamSSm-Bold.eot');
    src: url('../fonts/GothamSSm-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/GothamSSm-Bold.woff2') format('woff2'), url('../fonts/GothamSSm-Bold.woff') format('woff'), url('../fonts/GothamSSm-Bold.ttf') format('truetype'), url('../fonts/GothamSSm-Bold.svg#GothamSSm-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GothamSSm';
    src: url('../fonts/GothamSSm-Medium.eot');
    src: url('../fonts/GothamSSm-Medium.eot?#iefix') format('embedded-opentype'), url('../fonts/GothamSSm-Medium.woff2') format('woff2'), url('../fonts/GothamSSm-Medium.woff') format('woff'), url('../fonts/GothamSSm-Medium.ttf') format('truetype'), url('../fonts/GothamSSm-Medium.svg#GothamSSm-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

body {
    /* overflow: hidden;*/
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img {
    max-width: 100%;
}

.main-bg {
    opacity: 1;
    background-color: #632698;
    background-image: url("https://cdn1.byjus.com/me/grades/grade_4/assets/img/splash-screen-bg.png");
    background-repeat: no-repeat;
    background-position: top right;
    background-size: cover;
    min-height: 100vh;
    width: 100%;
}

.main-box-overflow {
    overflow: hidden;
}

.logo-panel {
    position: absolute;
    top: 15px;
    left: 20px;
}

.logo-panel img {
    max-width: 60px;
}

.main-container {
    max-width: 960px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    /* min-height: 100vh;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center; */
}

.main-container-inner {
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: 20px;
}

.main-container-inner.question-panel-active {
    justify-content: space-between;
}

.top-heading {
    text-align: center;
    font-family: 'Sassoon Montessori Md Kids';
    padding-top: 10px;
    padding-bottom: 10px;
}

.top-heading h1 {
    font-size: 48px;
    line-height: 58px;
    font-weight: 400;
    color: #fff;
}

.top-heading h1 span {
    /*background: url("../img/dotted-line.png") repeat-x 0 100%;*/
    padding-bottom: 10px;
}

.top-heading h2 {
    font-size: 42px;
    line-height: 46px;
    font-weight: 400;
    color: #fff;
}

.first-graphics {
    max-width: 580px;
    margin-left: auto;
    margin-right: auto;
}

.first-input-fld {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 730px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 15px;
}

.first-input-fld input {
    font-family: 'Mikado Bold Kids';
    border: 2px solid #fff;
    border-radius: 15px;
    padding: 5px 15px;
    background: transparent;
    text-align: center;
    font-size: 36px;
    margin-bottom: 10px;
    color: #fff;
}

.first-input-fld input::placeholder {
    color: #e0b9e6;
}

.first-input-fld input:focus {
    outline: none;
}

.submit-btn {
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.45);
    font-family: 'Sassoon Montessori Md Kids';
    background: rgba(0, 0, 0, 0.35);
    padding: 10px 55px;
    font-size: 42px;
    border-radius: 80px;
    color: #d8cedb;
    display: inline-block;
    border: none;
    text-transform: uppercase;
    cursor: pointer;
    outline: none;
}

.submit-btn.active-btn {
    background: #fff;
    color: #558eff;
}

.submit-btn.btn-strt:hover {
    background: #fff;
    color: #558eff;
}

.d-none {
    display: none !important;
}

.cards-wrapper {
    padding-top: 20px;
    padding-bottom: 20px;
    position: relative;
}

.card {
    box-shadow: 0 0 10px rgb(184 181 243);
    border-radius: 0px;
    background: #fff;
    overflow: hidden;
    height: 550px;
    display: none;
    position: absolute;
    width: 94%;
    border-radius: 8px;
    margin: 0 auto;
    left: 0;
    right: 0;
}

.card-header {
    /* background: #616ff3; */
    padding: 10px 25px;
    text-align: center;
}

.card-header h2 {
    font-family: 'GothamSSm';
    font-size: 27px;
    line-height: 32px !important;
    font-weight: 400;
    color: #5c5c5c;
    min-height: 100px;
    /*128px*/
    color: #797979;
    max-height: 128px;
    align-items: center;
    display: flex;
}

.card-body {
    padding: 0 20px 15px;
}

.question-type-match {
    display: flex;
    justify-content: space-between;
    /*----Rajshekhar-----*/
    position: relative;
}

.question-left-col {
    width: 55%;
}

.question-left-block {
    border: 2px solid #e1e5ff;
    padding: 5px;
    border-radius: 20px;
    display: flex;
    margin-bottom: 10px;
    transition: all 0.2s ease-in;
    position: relative;
    background: #fff;
    z-index: 999;
}

.question-left-block:last-child {
    margin-bottom: 0;
}

.question-no {
    font-family: 'Mikado Bold Kids';
    background: #e8e8e8;
    color: #6c64f5;
    border-radius: 0px;
    font-size: 24px;
    line-height: 32px;
    padding: 10px 20px;
    transition: all 0.2s ease-in;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: lowercase;
}

.question-elements {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px;
    flex-grow: 1;
}

.question-elements img {
    max-height: 61px;
    margin-left: 5px;
    margin-right: 5px;
}

.question-left-block:hover .question-no,
.question-right-block:hover .question-no {
    background: rgb(151, 82, 255);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9752ff', endColorstr='#5e93ff', GradientType=1);
    /* IE6-9 */
    color: #fff;
}

.question-left-block.active .question-no,
.question-right-block.active .question-no {
    background: rgb(151, 82, 255);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9752ff', endColorstr='#5e93ff', GradientType=1);
    /* IE6-9 */
    color: #fff;
}

.question-left-block.selected .question-no,
.question-right-block.selected .question-no {
    background: rgb(151, 82, 255);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9752ff', endColorstr='#5e93ff', GradientType=1);
    /* IE6-9 */
    color: #fff;
}

.question-right-block {
    border: 2px solid #d6d6d6;
    box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.15);
    padding: 5px;
    border-radius: 7px;
    display: flex;
    margin-bottom: 10px;
    transition: all 0.2s ease-in;
    position: relative;
    cursor: pointer;
    background: #fff;
    z-index: 999;
}

.question-block-node {
    position: absolute;
    top: 50%;
    right: -12px;
    transform: translateY(-50%);
    background: #fff;
    width: 25px;
    height: 25px;
    border: 2px solid #e1e5ff;
    border-radius: 50%;
    transition: all 0.2s ease-in;
}

.question-block-node::after {
    content: '';
    width: 15px;
    height: 27px;
    position: absolute;
    top: -3px;
    left: -4px;
    background: #fff;
    display: block;
    z-index: 1;
}

.question-block-node::before {
    content: '';
    width: 13px;
    height: 13px;
    position: absolute;
    top: 4px;
    left: 3px;
    background: #e1e5ff;
    border-radius: 50%;
    display: block;
    z-index: 2;
    transition: all 0.2s ease-in;
}

.question-left-block:hover,
.question-left-block:hover .question-block-node,
.question-right-block:hover,
.question-right-block:hover .question-block-node {
    border-color: #6c64f5;
}

.question-left-block:hover .question-block-node::before,
.question-right-block:hover .question-block-node::before {
    background: #9cb9ff;
}

.question-right-block.active,
.question-right-block.active .question-block-node,
.question-left-block.active,
.question-left-block.active .question-block-node {
    border-color: #707070;
}

.question-right-block.selected,
.question-right-block.selected .question-block-node,
.question-left-block.selected,
.question-left-block.selected .question-block-node {
    border-color: #6c64f5;
}

.question-left-block.active .question-block-node::before,
.question-right-block.active .question-block-node::before {
    background: #707070;
}

.question-left-block.selected .question-block-node::before {
    background: #9b4bff;
}

.question-right-block.selected .question-block-node::before {
    background: rgba(156, 75, 255, 1);
    background: -moz-linear-gradient(top, rgba(156, 75, 255, 1) 0%, rgba(88, 138, 255, 1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(156, 75, 255, 1)), color-stop(100%, rgba(88, 138, 255, 1)));
    background: -webkit-linear-gradient(top, rgba(156, 75, 255, 1) 0%, rgba(88, 138, 255, 1) 100%);
    background: -o-linear-gradient(top, rgba(156, 75, 255, 1) 0%, rgba(88, 138, 255, 1) 100%);
    background: -ms-linear-gradient(top, rgba(156, 75, 255, 1) 0%, rgba(88, 138, 255, 1) 100%);
    background: linear-gradient(to bottom, rgba(156, 75, 255, 1) 0%, rgba(88, 138, 255, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9c4bff', endColorstr='#588aff', GradientType=0);
}

.question-right-block .question-block-node {
    right: auto;
    left: -13px;
}

.question-right-block .question-block-node::before {
    content: "";
    width: 19px;
    height: 19px;
    position: absolute;
    top: 1px;
    left: 6px;
    background: rgb(225, 229, 255);
    border-radius: 50%;
    display: block;
    z-index: 2;
    transition: all 0.2s ease-in;
}

.question-right-block .question-block-node::after {
    content: "";
    width: 5px;
    height: 27px;
    position: absolute;
    top: -3px;
    left: auto;
    right: 5px;
    display: block;
    z-index: 1;
}

.progress-bar-panel {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 550px;
}

.arrow-left-btn {
    background: url("https://cdn1.byjus.com/me/grades/grade_4/assets/img/arrow-left.png") no-repeat 0 0;
    background-size: cover;
    width: 70px;
    height: 68px;
    display: block;
    margin-right: 15px;
    transition: all 0.2s ease-in;
}

.arrow-hover-left {
    transition: all 0.2s ease-in;
    cursor: pointer;
}

.arrow-hover-left:hover {
    background: url("https://cdn1.byjus.com/me/grades/grade_4/assets/img/arrow-left-active.png") no-repeat 0 0;
    background-size: cover;
}

.arrow-right-btn {
    background: url("https://cdn1.byjus.com/me/grades/grade_4/assets/img/arrow-right.png") no-repeat 0 0;
    background-size: cover;
    width: 70px;
    height: 68px;
    display: block;
    margin-left: 15px;
    transition: all 0.2s ease-in;
}

.arrow-hover-right {
    transition: all 0.2s ease-in;
    cursor: pointer;
}

.arrow-hover-right:hover {
    background: url("https://cdn1.byjus.com/me/grades/grade_4/assets/img/arrow-right-active.png") no-repeat 0 0;
    background-size: cover;
}

.progress-bar {
    flex-grow: 1;
}

.progress-no-panel ul {
    list-style-type: none;
    display: flex;
    justify-content: space-between;
    padding: 15px 25px;
}

.progress-no-panel ul li {
    font-family: 'GothamSSm';
    font-size: 36px;
    line-height: 36px;
    color: #6c64f5;
    width: 50px;
    text-align: center
}

.progress-no-panel ul li.active {
    background: #6c64f5;
    color: #fff;
    /* font-size: 42px; */
}

.progress-bar-wrapper {
    height: 5px;
    background: #cacaca;
    border-radius: 30px;
    position: relative;
    overflow: hidden;
}

.progress-bar-line {
    height: 5px;
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    background: #6c64f5;
    transition: all 0.2s ease-in;
}

.left-arrow,
.right-arrow {
    width: 80px;
    flex-shrink: 0;
}

.right-arrow {
    display: flex;
    justify-content: flex-end;
}

.question-type-option-left-right-wrapper {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.question-type-option-left {
    width: 100%;
    padding-left: 30px;
    padding-right: 30px;
    text-align: center;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
    margin-top: 10px;
}

.question-type-option-right {
    width: 100%;
    padding-left: 30px;
    padding-right: 30px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.question-type-option-right {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.option-text {
    /* font-family: 'Mikado Bold Kids'; */
    font-family: 'GothamSSm';
    font-size: 48px;
    color: #5d5d5d;
    padding-left: 15px;
    padding-right: 15px;
    justify-content: center;
    color: #797979;
}

.question-type-option-right .question-right-block {
    width: 48%;
}

.question-single-row {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}

.question-single-row .question-right-block {
    width: 22%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.question-single-row .question-no,
.question-block-col .question-no {
    width: 100%;
    margin-top: 10px;
    text-align: center;
    border-radius: 0 0 15px 15px;
    padding: 10px 20px;
}

.question-block-col .question-right-block {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.question-block-col .question-elements img {
    max-height: 70px;
}

.question-type-option-left-right-wrapper.only-options .question-type-option-right {
    width: 100%;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 17px;
}

.question-elements.single-elem {
    justify-content: center;
}

.question-elements.single-elem.img-lg {
    padding: 0;
}

.question-elements.img-lg img {
    max-height: 108px;
}

.card-header-quest-pic-panel {
    display: flex;
    justify-content: space-around;
    padding-top: 15px;
}

.quest-pic-left img,
.quest-pic-right img {
    max-height: 190px;
}

.quest-box-left,
.quest-box-right {
    width: 45%;
    border: 2px solid #fff;
    border-radius: 20px;
    padding: 20px;
}

.quest-box-left p,
.quest-box-right p {
    font-family: 'Sassoon Montessori Md Kids';
    font-size: 38px;
    color: #fff;
}

.quest-box-left p span,
.quest-box-right p span {
    width: 100px;
    border-bottom: 4px solid #fff;
    display: inline-block;
}

.assessment-logo {
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 15px;
    padding-bottom: 15px;
}

.assement-header-text h2 {
    background: linear-gradient(to right, #9752ff 0%, #5e93ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: 'Mikado Bold Kids';
    font-size: 48px;
    color: #fff;
    text-align: center;
    margin-bottom: 20px;
    display: inline-block;
}

.assement-card {
    background: #fff;
    border-radius: 20px;
    padding: 20px;
    margin-bottom: 20px;
}

.assement-card h3 {
    font-family: 'Mikado Bold Kids';
    text-align: center;
    font-size: 42px;
    color: #d4585d;
    margin-bottom: 20px;
}

.graph-panel {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.assement-top-panel {
    background: #ecf7fe;
    padding: 20px;
}

.assement-top-row {
    display: flex;
    align-items: center;
}

.assement-bottom-panel {
    padding: 20px;
}

.assement-bottom-row {
    display: flex;
    align-items: center;
}

.assement-top-row {
    padding-bottom: 20px;
}

.assement-top-label {
    font-family: 'Mikado Bold Kids';
    font-size: 32px;
    line-height: 36px;
    color: #d4585d;
    width: 25%;
    flex-shrink: 0;
    text-align: center;
    position: relative;
}

.assement-top-content {
    font-family: 'Mikado Bold Kids';
    font-size: 28px;
    line-height: 32px;
    font-weight: normal;
    color: #201f1f;
}

.assement-top-label h4 {
    position: relative;
    padding-right: 20px;
    margin-right: 30px;
}

.assement-top-label h4 span {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    color: #201f1f;
}

.assement-bottom-label {
    width: 40%;
    flex-shrink: 0;
}

.assement-bottom-row {
    padding-bottom: 20px;
}

.assement-bottom-label h4 {
    font-family: 'Mikado Bold Kids';
    font-size: 24px;
    line-height: 28px;
}

.assement-bottom-content {
    font-family: 'Mikado Bold Kids';
    font-size: 20px;
    line-height: 24px;
    font-weight: normal;
    color: #827e7e;
}

.first-wrapper-name-input .first-input-fld {
    display: flex;
    flex-direction: row;
    justify-content: center;
    max-width: 600px;
    padding-top: 40px;
}

.first-wrapper-name-input .first-input-fld .submit-btn {
    text-transform: none;
}

.first-wrapper-name-input .first-input-fld .arrow-left-btn {
    width: 75px;
    height: 75px;
}

.question-type-eual-col .question-left-col,
.question-type-eual-col .question-right-col {
    width: 45%;
}

.question-small-text .card-header h2 {
    font-size: 38px;
    line-height: 42px;
}

.question-small-text .option-text {
    font-size: 36px;
    line-height: 40px;
}

.mid-divider {
    position: relative;
}

.mid-divider::before {
    content: '';
    width: 4px;
    background: #c1c1c1;
    position: absolute;
    top: -114px;
    left: 50%;
    bottom: 10px;
    z-index: 99;
    transform: translateX(-50%);
}

.question-area-small {
    max-width: 850px;
    margin-left: auto;
    margin-right: auto;
}

.question-area-small .question-left-col,
.question-area-small .question-right-col {
    width: 42%;
}

.question-elements.img-xlg img {
    max-height: 120px;
}

.question-left-width-auto {
    width: auto;
}

.right-submit-btn .submit-btn {
    margin-left: 10px;
    padding-left: 25px;
    padding-right: 25px;
    /* background: rgba(0,0,0,0.35);
    color: #d8cedb; */
    margin-right: -115px;
}

.right-submit-btn .submit-btn:hover {
    /* background: #fff;
    color: #558eff; */
}

.text-height-set {
    min-height: 150px;
}

.card-body-min-height .question-type-option-left-right-wrapper {
    min-height: 335px;
}

.v-center {
    display: flex;
    align-items: center;
}

.text-center {
    text-align: center;
}

.phone-pic img {
    max-height: 275px;
}

.quest-5 .question-type-option-right {
    /* margin-top: 0;
    margin-bottom: 0; */
}

.quest-5 .question-type-option-right {
    width: 100%;
}

.quest-5 .question-type-option-right .question-right-block {
    width: 48%;
    /* margin-bottom: 17px; */
}

.quest-5 .question-elements {
    padding: 0;
}

.quest-5 .question-block-col .question-elements img {
    max-height: 103px;
}

.quest-5 .question-type-option-left {
    display: flex;
    align-items: center;
    justify-content: center;
}

.quest-5 .question-type-option-right {
    padding-right: 0;
}

.only-options .question-right-block {
    margin-bottom: 28px;
}

.quest-7 .question-left-col {
    width: 43%;
}

.quest-7 .question-right-block {
    /* height: 122px; */
}

.quest-8 .question-elements {
    padding-top: 5px;
    padding-bottom: 5px;
}

.quest-8 .question-type-match {
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 14px;
}

.quest-9 .card-header {
    padding-left: 0;
    padding-right: 0;
}

.quest-10 .question-type-match {
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}

.animate {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    /* -webkit-animation-duration:var(--animate-duration);
    animation-duration:var(--animate-duration); */
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    display: block;
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}

@-webkit-keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

@keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft
}

@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}

.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
}

.cards-wrapper .question-type-match {
    position: relative;
}

.match-line {
    height: 6px;
    background: #707070;
    position: absolute;
}

.match-line-1 {
    width: 241px;
    height: 6px;
    background: #707070;
    top: 110px;
    right: 178px;
    transform: rotate(27deg);
}

.match-line-3 {
    width: 310px;
    height: 6px;
    background: #707070;
    top: 166px;
    right: 145px;
    transform: rotate(45deg);
}

.match-line-4 {
    width: 240px;
    height: 6px;
    background: #707070;
    top: 107px;
    right: 178px;
    transform: rotate(-26deg);
}

.match-line-5 {
    width: 214px;
    height: 6px;
    background: #707070;
    top: 164px;
    right: 191px;
    transform: rotate(0deg);
}

.match-line-6 {
    width: 240px;
    height: 6px;
    background: #707070;
    top: 221px;
    right: 178px;
    transform: rotate(27deg);
}

.match-line-7 {
    width: 240px;
    height: 6px;
    background: #707070;
    top: 224px;
    right: 178px;
    transform: rotate(-27deg);
}

.match-line-8 {
    width: 310px;
    height: 6px;
    background: #707070;
    top: 167px;
    right: 140px;
    transform: rotate(-44deg);
}

.match-line-9 {
    width: 212px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 279px;
    right: 193px;
    transform: rotate(0deg);
}


/*-------Rajshakher start-------*/

.match-line {
    height: 6px;
    background: #707070;
    position: absolute;
}

.match-line-q1-A1 {
    width: 280px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 51px;
    right: 160px;
    transform: rotate(0deg);
}

.match-line-q1-A2 {
    width: 295px;
    height: 6px;
    background: #707070;
    top: 108px;
    right: 148px;
    transform: rotate(27deg);
}

.match-line-q1-A3 {
    width: 365px;
    height: 6px;
    background: #707070;
    top: 157px;
    right: 127px;
    transform: rotate(45deg);
}

.match-line-q1-B1 {
    width: 320px;
    height: 6px;
    background: #707070;
    top: 110px;
    right: 139px;
    transform: rotate(-26deg);
}

.match-line-q1-B2 {
    width: 280px;
    height: 6px;
    background: #707070;
    top: 164px;
    right: 160px;
    transform: rotate(0deg);
}

.match-line-q1-B3 {
    width: 310px;
    height: 6px;
    background: #707070;
    top: 226px;
    right: 137px;
    transform: rotate(27deg);
}

.match-line-q1-C1 {
    width: 367px;
    height: 6px;
    background: #707070;
    top: 173px;
    right: 121px;
    transform: rotate(-44deg);
}

.match-line-q1-C2 {
    width: 285px;
    height: 6px;
    background: #707070;
    top: 226px;
    right: 160px;
    transform: rotate(-27deg);
}

.match-line-q1-C3 {
    width: 280px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 279px;
    right: 160px;
    transform: rotate(0deg);
}


/*-------Rajshakher end-------*/

.match-line-q7-A1 {
    width: 330px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 58px;
    right: 220px;
    transform: rotate(0deg);
}

.match-line-q7-A2 {
    width: 380px;
    height: 6px;
    background: #707070;
    top: 123px;
    right: 195px;
    transform: rotate(24deg);
}

.match-line-q7-A3 {
    width: 446px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 182px;
    right: 170px;
    transform: rotate(42deg);
}

.match-line-q7-B1 {
    width: 350px;
    height: 6px;
    background: #707070;
    top: 124px;
    right: 206px;
    transform: rotate(-24deg);
}

.match-line-q7-B2 {
    width: 330px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 190px;
    right: 220px;
    transform: rotate(0deg);
}

.match-line-q7-B3 {
    width: 350px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 253px;
    right: 210px;
    transform: rotate(25deg);
}

.match-line-q7-C1 {
    width: 450px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 190px;
    right: 157px;
    transform: rotate(-42deg);
}

.match-line-q7-C2 {
    width: 380px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 259px;
    right: 197px;
    transform: rotate(-25deg);
}

.match-line-q7-C3 {
    width: 330px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 322px;
    right: 220px;
    transform: rotate(0deg);
}

.match-line-q10-A1 {
    width: 300px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 79px;
    right: 230px;
    transform: rotate(0deg);
}

.match-line-q10-A2 {
    width: 380px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 166px;
    right: 192px;
    transform: rotate(35deg);
}

.match-line-q10-B1 {
    width: 380px;
    height: 6px;
    background: #707070;
    top: 167px;
    right: 194px;
    transform: rotate(-34deg);
}

.match-line-q10-B2 {
    width: 300px;
    height: 6px;
    background: rgb(112, 112, 112);
    top: 252px;
    right: 240px;
    transform: rotate(0deg);
}

#loading p {
    text-align: center;
    color: #fff;
    font-size: 24px;
    opacity: 0.5;
}

#q1 .card-header h2,
#q2 .card-header h2,
#q3 .card-header h2,
#q4 .card-header h2,
#q5 .card-header h2,
#q6 .card-header h2,
#q7 .card-header h2,
#q8 .card-header h2 {
    font-size: 24px;
    line-height: 27px;
    text-align: left;
}

.preloader-panel {
    /*background: url("https://cdn1.byjus.com/me/grades/grade_4/assets/img/splash-screen-bg.png") no-repeat 0 0;
    background-size: cover;*/
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.preloader-logo {
    margin-bottom: 55px;
}

.preloader-logo img {
    max-width: 280px;
}

.preloader-progress-wrapper {
    background: #62088e;
    max-width: 500px;
    width: 100%;
    height: 30px;
    border-radius: 50px;
    position: relative;
    padding: 3px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.45);
}

.preloader-progress-bar {
    background: #fff;
    border-radius: 50px;
    height: 24px;
    transition: all 0.3s linear;
}

.text-medium .option-text {
    font-size: 30px;
    font-family: 'GothamSSm';
    padding: 5px 15px;
}

.question-col {
    flex-direction: column !important;
}

.question-col .question-right-block {
    width: 100% !important;
}

.question-col .question-elements {
    padding: 10px;
}

.question-col .option-text {
    font-size: 24px;
}

.question-col .question-no {
    /*font-size: 28px;
    line-height: 30px;
     padding: 10px; */
}

.quest-7 .question-col .question-right-block {
    height: auto;
}

.grade-select-panel {
    display: flex;
    justify-content: space-around;
    padding-bottom: 35px;
    padding-top: 25px;
}

.grade-block {
    border: 3px solid #fff;
    border-radius: 10px;
    padding: 10px 25px;
    white-space: nowrap;
    font-family: 'Mikado Bold Kids';
    font-size: 28px;
    font-weight: 600;
    color: #fff;
    margin-left: 5px;
    margin-right: 5px;
    cursor: pointer;
    transition: all 0.2s;
}

.grade-block.active,
.grade-block:hover {
    background: #fff;
    color: #8432a6;
}

.grade-select-fld {
    width: 100%;
}

.question-type-option-left-right-wrapper.only-options.width-wide .question-type-option-right {
    max-width: 880px;
}

.question-type-option-right.question-wide {
    width: 100% !important;
}

.scholarship-card {
    text-align: center;
}

.scholarship-card h4 {
    font-family: 'Mikado Bold Kids';
    font-size: 36px;
    line-height: 42px;
    color: #9023AC;
    margin-bottom: 15px;
}

.scholarship-card p {
    font-family: 'Mikado Bold Kids';
    font-size: 24px;
    line-height: 30px;
    color: #101010;
    margin-bottom: 15px;
}

.scholarship-card h5 {
    font-family: 'Mikado Bold Kids';
    font-size: 48px;
    line-height: 52px;
    color: #4E9F00;
}

.progress-bar-margin {
    margin-left: 120px;
    margin-right: 120px;
}

.scholarship-btn {
    background: rgba(142, 94, 246, 1);
    background: -moz-linear-gradient(left, rgba(142, 94, 246, 1) 0%, rgba(107, 149, 247, 1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(142, 94, 246, 1)), color-stop(100%, rgba(107, 149, 247, 1)));
    background: -webkit-linear-gradient(left, rgba(142, 94, 246, 1) 0%, rgba(107, 149, 247, 1) 100%);
    background: -o-linear-gradient(left, rgba(142, 94, 246, 1) 0%, rgba(107, 149, 247, 1) 100%);
    background: -ms-linear-gradient(left, rgba(142, 94, 246, 1) 0%, rgba(107, 149, 247, 1) 100%);
    background: linear-gradient(to right, rgba(142, 94, 246, 1) 0%, rgba(107, 149, 247, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#8e5ef6', endColorstr='#6b95f7', GradientType=1);
    display: inline-block;
    padding: 10px 40px;
    border-radius: 90px;
    font-family: 'Mikado Bold Kids';
    font-size: 30px;
    line-height: 36px;
    color: #fff;
    text-decoration: none;
    transition: all 0.2s;
}

.scholarship-btn:hover {
    background: rgba(107, 149, 247, 1);
    background: -moz-linear-gradient(left, rgba(107, 149, 247, 1) 0%, rgba(142, 94, 246, 1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(107, 149, 247, 1)), color-stop(100%, rgba(142, 94, 246, 1)));
    background: -webkit-linear-gradient(left, rgba(107, 149, 247, 1) 0%, rgba(142, 94, 246, 1) 100%);
    background: -o-linear-gradient(left, rgba(107, 149, 247, 1) 0%, rgba(142, 94, 246, 1) 100%);
    background: -ms-linear-gradient(left, rgba(107, 149, 247, 1) 0%, rgba(142, 94, 246, 1) 100%);
    background: linear-gradient(to right, rgba(107, 149, 247, 1) 0%, rgba(142, 94, 246, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#6b95f7', endColorstr='#8e5ef6', GradientType=1);
}

.question-type-option-right.question-col .question-right-block {
    width: 48%!important;
}

.question-type-option-right.question-col {
    flex-direction: row!important;
}


/* --------Background Start -----------*/

.question_bg {
    background-color: #fff!important;
    background-image: url(https://cdn1.byjus.com/me/grades/grade_4/assets/img/question_bg.png)!important;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
}

.home_background {
    background-color: #fff!important;
    background-image: url(https://cdn1.byjus.com/me/grades/grade_4/assets/img/Home.png) !important;
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 25% auto;
}

.card_background {
    background-color: #fff!important;
    background-image: url(https://cdn1.byjus.com/me/grades/grade_4/assets/img/Card_Background.png)!important;
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 25% auto;
}

.card_background2 {
    background-color: #fff!important;
    background-image: url(https://cdn1.byjus.com/me/grades/grade_4/assets/img/Card_background2.png)!important;
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 25% auto;
}


/* --------Background End -----------*/

#paper-submit .submit-btn {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9752ff+0,5e93ff+100 */
    background: rgb(151, 82, 255);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9752ff', endColorstr='#5e93ff', GradientType=1);
    /* IE6-9 */
    color: #fff;
    font-family: 'GothamSSm';
    font-size: 36px;
    text-transform: capitalize;
}

.question-type-option-left img {
    max-height: 200px;
    /* margin-bottom: 10px; */
}

.quest-7 .question-type-option-left img {
    /* max-height:170px; */
}

.quest-10 .question-type-option-left img {
    /* max-height:110px; */
}

.progress-bar-panel .arrow-left-btn {
    background: url(https://cdn1.byjus.com/me/grades/grade_4/assets/img/arrow-left-qnav.png) no-repeat 0 0;
    background-size: cover;
}

.progress-bar-panel .arrow-right-btn {
    background: url(https://cdn1.byjus.com/me/grades/grade_4/assets/img/arrow-right-qnav.png) no-repeat 0 0;
    background-size: cover;
}

#q8 .question-right-block {
    margin-bottom: 10px;
}

.question-right-block:hover .option-text,
.question-right-block.selected .option-text {
    font-weight: 600;
}

.nxt_prvbtn {
    padding: 15px 0 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.skill_notxt {
    padding: 0 0 15px 0;
    margin: 0;
    font-size: 24px;
    text-decoration: none;
    color: #333;
    text-align: left;
    font-family: 'GothamSSm';
}

.incurrect_ans {
    padding: 0 0 15px 0;
    margin: 0;
    font-size: 26px;
    text-decoration: none;
    color: #ff5067;
    text-align: left;
    font-family: 'GothamSSm';
}

.currect_ans {
    padding: 0 0 15px 0;
    margin: 0;
    font-size: 26px;
    text-decoration: none;
    color: #549410;
    text-align: left;
    font-family: 'GothamSSm';
}

.question-right-block.correct_answeroption {
    border: 2px solid #77a80d!important;
}

.correct_answeroption .question-no {
    background: rgb(115, 165, 11) !important;
    background: -moz-linear-gradient(left, rgba(115, 165, 11, 1) 0%, rgba(115, 165, 11, 1) 100%) !important;
    background: -webkit-linear-gradient(left, rgba(115, 165, 11, 1) 0%, rgba(115, 165, 11, 1) 100%) !important;
    background: linear-gradient(to right, rgba(115, 165, 11, 1) 0%, rgba(115, 165, 11, 1) 100%) !important;
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#73a50b', endColorstr='#73a50b', GradientType=1);
    /* IE6-9 */
    color: #fff;
}

.assessment_card.card_background {
    background-size: 40% auto!important;
}

.qright_wrong {
    padding: 15px 0;
    margin: 0;
}

.qright_wrong ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
}

.qright_wrong ul li {
    justify-content: space-between;
    flex-grow: 1;
    display: flex;
    justify-content: center;
}

.qright_wrong ul li span {
    width: 50px;
    height: 50px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'GothamSSm';
    font-size: 28px;
    border-radius: 50%;
}

.qright_wrong ul li span.write_ans {
    color: #56a701;
}

.qright_wrong ul li span.wrong_ans {
    color: #e44d59;
}

.qright_wrong ul li.active.correct span {
    background: rgb(86, 161, 2);
    background: -moz-linear-gradient(left, rgba(86, 161, 2, 1) 0%, rgba(143, 206, 7, 1) 100%);
    background: -webkit-linear-gradient(left, rgba(86, 161, 2, 1) 0%, rgba(143, 206, 7, 1) 100%);
    background: linear-gradient(to right, rgba(86, 161, 2, 1) 0%, rgba(143, 206, 7, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#56a102', endColorstr='#8fce07', GradientType=1);
    color: #fff;
}

.qright_wrong ul li.active.incorrect span {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ff5067+0,ff9117+100 */
    background: rgb(255, 80, 103);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(255, 80, 103, 1) 0%, rgba(255, 145, 23, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(255, 80, 103, 1) 0%, rgba(255, 145, 23, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(255, 80, 103, 1) 0%, rgba(255, 145, 23, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ff5067', endColorstr='#ff9117', GradientType=1);
    /* IE6-9 */
    color: #fff;
}

.explain_image {
    margin: 30px 0;
    text-align: center;
}

.explain_image img {
    max-height: 200px;
}

.explanation_txt p {
    font-size: 28px;
    line-height: 32px;
    font-family: 'GothamSSm';
    color: #5c5c5c;
    text-align: left;
    margin: 0 0 30px 0;
}

.explanation_txt p:last-child {
    margin-bottom: 0;
}

.assessment_card.card_background {
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #ddd;
    margin: 0 0 20px 0;
}

.assessment_card.card_background .card {
    display: block;
    position: relative;
}

.nxt_prvbtn .submit-btn {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9752ff+0,5e93ff+100 */
    background: rgb(151, 82, 255);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9752ff', endColorstr='#5e93ff', GradientType=1);
    /* IE6-9 */
    color: #fff;
}

.assessment_card.card_background .card h2 {
    text-align: left;
    font-size: 26px;
    line-height: 27px;
}

.assement-panel .nav-tabs {
    text-align: center;
    border: 2px solid #6c64f5;
    border-radius: 50px;
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}

.assement-panel .nav-tabs li {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.assement-panel .nav-tabs li a {
    font-family: 'GothamSSm';
    color: #6c64f5;
    text-decoration: none;
    text-align: center;
    font-size: 24px;
    line-height: 55px;
    border-radius: 50px;
    width: 100%;
}

.assement-panel .nav-tabs li.active a {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9752ff+0,5e93ff+100 */
    background: rgb(151, 82, 255);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9752ff', endColorstr='#5e93ff', GradientType=1);
    /* IE6-9 */
    color: #fff;
}

.gauge-wrapper {
    display: inline-block;
    width: auto;
    margin: 0 auto;
    padding: 20px 15px 15px;
}

.gauge {
    font-family: Arial, Helvetica, sans-serif;
    background: #e7e7e7;
    box-shadow: 0 -3px 7px 2px rgba(0, 0, 0, 0.70);
    width: 200px;
    height: 100px;
    border-radius: 100px 100px 0 0;
    position: relative;
    overflow: hidden;
}

.gauge.min-scaled {
    transform: scale(0.5);
}

.gauge-center {
    content: '';
    color: #fff;
    width: 40%;
    height: 40%;
    background: #15222E;
    border-radius: 100px 100px 0 0;
    position: absolute;
    box-shadow: 0 -13px 15px -10px rgba(0, 0, 0, 0.28);
    right: 30%;
    bottom: 0;
    background: #fff;
}

.gauge-center .label,
.gauge-center .number {
    display: block;
    width: 100%;
    text-align: center;
}

.gauge-center .label {
    font-size: 0.75em;
    opacity: 0.6;
    margin: 1.1em 0 0.3em 0;
}

.gauge-center .number {
    font-size: 1.2em;
}

.needle {
    width: 48px;
    height: 5px;
    background: #15222E;
    border-bottom-left-radius: 100%;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 100%;
    border-top-right-radius: 5px;
    position: absolute;
    bottom: 4px;
    left: 48px;
    transform-origin: 100% 4px;
    transform: rotate(0deg);
    box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.38);
    display: none;
    z-index: 99;
}

.rischio1 .needle {
    /*transform: rotate(16deg);*/
    animation: speed1 2s 1 both;
    animation-delay: 1s;
    display: block;
}

.rischio2 .needle {
    /*transform: rotate(65deg);*/
    animation: speed2 2s 1 both;
    animation-delay: 1s;
    display: block;
}

.rischio3 .needle {
    /*transform: rotate(115deg);*/
    animation: speed3 2s 1 both;
    animation-delay: 1s;
    display: block;
}

.rischio4 .needle {
    /*transform: rotate(164deg);*/
    animation: speed4 2s 1 both;
    animation-delay: 1s;
    display: block;
}

.slice-colors {
    height: 100%;
}

.slice-colors .st {
    position: absolute;
    bottom: 0;
    width: 0;
    height: 0;
    border: 50px solid transparent;
}

.slice-colors .st.slice-item:nth-child(2) {
    border-top: 50px #f1c40f solid;
    border-right: 50px #f1c40f solid;
    background: rgb(252, 96, 118);
    /* Old browsers */
    background: -moz-linear-gradient(45deg, rgba(252, 96, 118, 1) 0%, rgba(255, 146, 49, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(45deg, rgba(252, 96, 118, 1) 0%, rgba(255, 146, 49, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(45deg, rgba(252, 96, 118, 1) 0%, rgba(255, 146, 49, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fc6076', endColorstr='#ff9231', GradientType=1);
    /* IE6-9 fallback on horizontal gradient */
}

.slice-colors .st.slice-item:nth-child(4) {
    left: 50%;
    border-bottom: 50px #E84C3D solid;
    border-right: 50px #E84C3D solid;
    background-color: #e67e22;
}

@-webkit-keyframes speed1 {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(16deg);
    }
}

@-webkit-keyframes speed2 {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(65deg);
    }
}

@-webkit-keyframes speed3 {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(115deg);
    }
}

@-webkit-keyframes speed4 {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(164deg);
    }
}

.speed_accuracyctrl {
    display: flex;
    justify-content: center;
}

.speed_ctrl,
.accuracy_ctrl {
    width: 35%;
    margin: 15px 6% 0 6%
}

.speed_itemctrl {
    padding: 0;
    margin: 0;
}

.speed_itemctrl ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap
}

.speed_itemctrl ul li {
    width: 50%;
    margin: 0 0 15px 0;
    display: flex;
    align-items: center;
    color: #333;
    font-family: 'GothamSSm';
    font-size: 16px;
}

.speed_itemctrl ul li span {
    width: 30px;
    height: 30px;
    margin-right: 8px;
}

.speed_itemctrl ul li.fairly_slow span {
    background: rgb(252, 96, 118);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(252, 96, 118, 1) 0%, rgba(255, 146, 49, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(252, 96, 118, 1) 0%, rgba(255, 146, 49, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(252, 96, 118, 1) 0%, rgba(255, 146, 49, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fc6076', endColorstr='#ff9231', GradientType=1);
    /* IE6-9 */
}

.speed_itemctrl ul li.speedy span {
    background: rgb(141, 209, 0);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(141, 209, 0, 1) 0%, rgba(180, 225, 12, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(141, 209, 0, 1) 0%, rgba(180, 225, 12, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(141, 209, 0, 1) 0%, rgba(180, 225, 12, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#8dd100', endColorstr='#b4e10c', GradientType=1);
    /* IE6-9 */
}

.speed_itemctrl ul li.fast span {
    background: rgb(252, 126, 0);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(252, 126, 0, 1) 0%, rgba(255, 210, 0, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(252, 126, 0, 1) 0%, rgba(255, 210, 0, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(252, 126, 0, 1) 0%, rgba(255, 210, 0, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fc7e00', endColorstr='#ffd200', GradientType=1);
    /* IE6-9 */
}

.speed_itemctrl ul li.swift span {
    background: rgb(64, 197, 75);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(64, 197, 75, 1) 0%, rgba(71, 236, 89, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(64, 197, 75, 1) 0%, rgba(71, 236, 89, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(64, 197, 75, 1) 0%, rgba(71, 236, 89, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#40c54b', endColorstr='#47ec59', GradientType=1);
    /* IE6-9 */
}

.accuracy_ctrl .speed_itemctrl ul li.fairly_slow span {
    background: rgb(245, 90, 114);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(245, 90, 114, 1) 0%, rgba(241, 131, 214, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(245, 90, 114, 1) 0%, rgba(241, 131, 214, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(245, 90, 114, 1) 0%, rgba(241, 131, 214, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f55a72', endColorstr='#f183d6', GradientType=1);
    /* IE6-9 */
}

.accuracy_ctrl .speed_itemctrl ul li.speedy span {
    background: rgb(86, 161, 2);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(86, 161, 2, 1) 0%, rgba(143, 206, 7, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(86, 161, 2, 1) 0%, rgba(143, 206, 7, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(86, 161, 2, 1) 0%, rgba(143, 206, 7, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#56a102', endColorstr='#8fce07', GradientType=1);
    /* IE6-9 */
}

.accuracy_ctrl .speed_itemctrl ul li.fast span {
    background: rgb(252, 126, 0);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(252, 126, 0, 1) 0%, rgba(255, 210, 0, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(252, 126, 0, 1) 0%, rgba(255, 210, 0, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(252, 126, 0, 1) 0%, rgba(255, 210, 0, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fc7e00', endColorstr='#ffd200', GradientType=1);
    /* IE6-9 */
}

.accuracy_ctrl .speed_itemctrl ul li.swift span {
    background: rgb(0, 159, 251);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(0, 159, 251, 1) 0%, rgba(0, 203, 208, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(0, 159, 251, 1) 0%, rgba(0, 203, 208, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(0, 159, 251, 1) 0%, rgba(0, 203, 208, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#009ffb', endColorstr='#00cbd0', GradientType=1);
    /* IE6-9 */
}

.answer_currectbg {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ff5067+0,ff9117+100 */
    background: rgb(255, 80, 103);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(255, 80, 103, 1) 0%, rgba(255, 145, 23, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(255, 80, 103, 1) 0%, rgba(255, 145, 23, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(255, 80, 103, 1) 0%, rgba(255, 145, 23, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ff5067', endColorstr='#ff9117', GradientType=1);
    /* IE6-9 */
    padding: 15px;
    margin: 0 0 20px 0;
    border-radius: 10px;
}

.answer_currectbg h3 {
    padding: 0 0 15px 0;
    margin: 0;
    text-align: center;
    font-weight: 400;
    color: #fff;
    font-size: 24px;
    font-family: 'GothamSSm';
}

.answer_currectbg h3 span {
    font-size: 28px;
    font-weight: 600;
}

.answer_currectbg p {
    font-family: 'GothamSSm';
    font-size: 18px;
    text-align: center;
    text-decoration: none;
    color: #fff;
    padding: 0;
    margin: 0 0 15px 0;
}

.numbermuster_btn {
    padding: 10px 0 0 0;
    margin: 0;
}

.numbermuster_btn ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.numbermuster_btn ul li a {
    padding: 0 15px;
    margin: 0 10px 15px 10px;
    border: 2px solid #fff;
    font-family: 'Sassoon Montessori Md Kids';
    font-size: 18px;
    color: #fff;
    text-decoration: none;
    line-height: 35px;
    display: inline-flex;
}

.performance_chart {
    padding: 15px 0;
    margin: 0;
    text-align: center;
}

.across_section {
    padding: 15px;
    margin: 0 0 20px 0;
    border-radius: 10px;
    border: 1px solid #ddd;
}

.across_section.card_background2 {
    background-size: 35% auto!important;
}

.performance_txt {
    padding: 0 0 15px 0;
    margin: 0;
    font-size: 24px;
    text-decoration: none;
    color: #333;
    font-family: 'GothamSSm';
}

.assement_summery {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    text-decoration: none;
    color: #fff;
    font-family: 'GothamSSm';
    font-size: 17px;
}

.assement_summeryleft {
    width: 30%;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
}

.assement_summery span {
    margin: 0 30px;
}

.assement_summeryright {
    flex-grow: 1;
}

.assesment_bottom .assement_summery {
    color: #333;
}

.scholarship_bg {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 20px;
    margin: 0 0 20px 0;
    text-align: center;
}

.scholarship_bg .submit-btn {
    background: rgb(151, 82, 255);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(151, 82, 255, 1) 0%, rgba(94, 147, 255, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#9752ff', endColorstr='#5e93ff', GradientType=1);
    /* IE6-9 */
    color: #fff;
    font-size: 30px;
}

.congratulation_txt {
    color: #9023ac!important;
    font-weight: 600;
    font-size: 28px;
}

.eligiable {
    font-size: 20px;
    color: #000;
    font-family: 'Sassoon Montessori Md Kids';
    padding: 0 0 15px 0;
}

.congrats_code {
    padding: 15px;
    font-size: 34px;
    font-weight: 600;
    font-family: 'Sassoon Montessori Md Kids';
    color: #639c25;
}

.explain_title {
    margin-top: 20px!important;
}

#explanation_7 .explain_image img {
    max-height: 280px;
}

.option-text sup {
    position: relative;
    top: -5px;
    left: 2px;
}

.assessment_card .text-medium .option-text {
    font-size: 13px;
    line-height: 20px;
    padding: 8px 15px;
}

.assessment_card .only-options .question-right-block {
    margin-bottom: 10px;
}

.disable {
    background: #ddd!important;
    cursor: unset;
}

#q8 .text-medium .option-text,
#q4 .text-medium .option-text,
.quest-7 .text-medium .option-text {
    /*min-height: 58px;
    font-size: 22px;
    line-height: 27px;*/
    padding: 2px 5px 2px 15px;
    /*justify-content: left;*/
}

.question-type-option-left-right-wrapper.only-options.width-wide .question-type-option-right {
    padding-left: 0;
    padding-right: 0;
}

.nxt_prvbtn .submit-btn,
.scholarship_bg .submit-btn {
    font-family: 'GothamSSm';
    font-size: 26px;
    text-transform: capitalize;
    font-weight: 600;
}

.scholarship_bg .submit-btn {
    font-weight: 400;
}

#paper-submit .submit-btn {
    font-size: 30px;
}

.correct_answeroption .option-text {
    font-weight: 600;
}

.quest-5 .card-header h2 {
    font-size: 22px!important;
}

.currect_ans {
    background: url(https://cdn1.byjus.com/me/grades/grade_4/assets/img/cong.png) no-repeat;
    padding-left: 38px;
    padding-bottom: 0;
    margin-bottom: 25px;
    background-size: contain;
}

.question-type-option-right.question-col,
.question-type-option-right.question-wide,
.question-type-option-right {
    padding-left: 0;
    padding-right: 0;
}

.skill_notxt {
    padding: 0 0 25px 0;
}

.assessment_card .text-medium .option-text {
    font-size: 25px;
    line-height: 25px;
    padding: 2px 15px 2px 15px;
}

.numbermuster_btn ul li span {
    padding: 0 15px;
    margin: 0 10px 15px 10px;
    border: 2px solid #fff;
    font-family: 'GothamSSm';
    font-size: 18px;
    color: #fff;
    text-decoration: none;
    line-height: 35px;
    display: inline-flex;
    cursor: unset;
}

.assement-header-text h2,
.eligiable,
.congrats_code {
    font-family: 'GothamSSm';
}

.assement_summeryleft {
    font-weight: 600;
    width: 34%;
}

.assement_summeryleft span {
    display: none;
}

.question-no {
    font-size: 36px;
    line-height: 36px;
}

.question-right-block:hover .option-text,
.question-right-block.selected .option-text {
    font-weight: 700;
}

.assessment_card.card_background .card h2 {
    font-size: 24px;
}

.assement_summeryright {
    line-height: 24px;
}

.question-col .option-text {
    font-size: 28px;
}

.performance_txt {
    font-weight: 800;
}

.speed_itemctrl ul li,
.answer_currectbg h3,
.assement-panel .nav-tabs li a {
    font-weight: 700;
}

.answer_currectbg h3 span {
    font-size: 32px;
}


.modal {
    position:fixed;
    z-index: 999;
    width:100vw;
    height:100vh;
    background:rgba(0, 0, 0, 0.58);
    top: 0;
    left: 0;
    font-family: 'Sassoon Montessori Md Kids';
    font-size: 30px;
    display: none;
}
.modal.show {
    display:block;
}
.modal .modal-container h2 {
    text-align: center;
    color: rgb(97, 103, 110);
}
.modal .modal-container {
    position: absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    background:#fff;
    padding:25px;
    border-radius: 7px;
    box-shadow: 0  0 12px rgba(0, 0, 0, 0.28);
    width:80%;
    max-width: 480px;
}

.modal .modal-container .form-group label {
    display:block;
    font-size: 18px;
    display: none;
    color: rgb(239, 62, 62);
}

.modal .modal-container .form-group label.error {
    display: block;
}

.modal .modal-container .form-group input {
    width:100%;
    font-family: 'Mikado Bold Kids';
    border: 2px solid rgb(97, 103, 110);
    border-radius: 15px;
    padding: 5px 15px;
    background: transparent;
    font-size: 26px;
    height: 43px;
    margin-bottom: 15px;
    color: rgb(97, 103, 110);
    text-align: center;
    outline: none;
}

.modal .modal-container .form-group input::placeholder {
    color: #b6b6b6;
}
.modal .modal-container .form-group input.error {
    border: 2px solid rgb(239, 62, 62);
    color: rgb(239, 62, 62);
}
.modal .modal-container button {
    font-family: 'Sassoon Montessori Md Kids';
    background: rgba(95, 2, 95, 1);
    padding: 10px 55px;
    font-size: 42px;
    border-radius: 80px;
    color: #fff;
    display: inline-block;
    border: none;
    text-transform: uppercase;
    cursor: pointer;
    outline: none;
    display:block;
    margin : 0 auto;
}

hr {
    border:0;
    height:1px;
    background:#5e5e5e;
    margin:6px 0;
}
.line-cls {	
    margin-bottom: 20px;
    }