@charset "utf-8";
/* CSS Document */
*{
font-family: 'alte_haas_groteskregular','Open Sans';
}
.banner {
	background-color: #03365A;
	height: 100px;
	position:relative;
}
.start-banner{ 
	background-color: #03365A;
	padding-top:3%;
	padding-bottom:2%;
}
.big-logo {
 	background:transparent url(../images/quiz-logo-lg.png) no-repeat;
	width: 380px;
	height: 120px;
	background-size:100%;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
.logo {
	position:absolute;
	background-image: url(../images/quiz-logo-lg.png);
	background-size:100%;
	width: 188px;
	height: 56px;
	margin: 0 auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.quiz-welcome{ 
 	margin: 0 auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position:relative;
	text-align:center;
	display:block;
}
.quiz-welcome p {
	font-family: 'alte_haas_groteskregular','Open Sans';
	font-size:3em;
	color:#F2C90C;
	text-align:center;
}
.welcome-text{ 
	font-family: 'alte_haas_groteskregular','Open Sans';
	font-size:16px;
}
.welcome-text ul{ 
	margin:0 auto;
	padding:1em; 
	background:#F1F1F1;
	border:1px solid #DADADA;
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-o-border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-ms-border-radius: 0.5em;
/* 	color:#ACD9F4; */
	line-height:2em;
	list-style:none;
	font-size:1em;
}
.welcome-text ul li:before {
    content: "• ";
	color: #F2C90C; 
	margin-right:1em;
}
.start-banner hr{ 
	width:50%;
	text-align:center;
	margin-top:3%;
	margin-bottom:3%;
	border:1px dashed #2895d5;
}
.breadcrumb-container{
	background-color: #f1f1f1;
	border-bottom: 0.0625em solid #BABABA;	
	color: rgba(3,54,90,1.00);
	 
 }
 .breadcrumb{ 
 	background:transparent !important;
	margin:0 !important;
	padding:0 !important;
	line-height:40px;
	vertical-align:middle;
 }
 .breadcrumb-items{
	
	list-style: none;
	font-weight: 500;
	display: table-cell;
	vertical-align:middle;
	padding-left:1.25em;
}
.breadcrumb-items li{
	text-decoration: none;
	position: relative;
	display: inline;
	color: rgba(95,95,95,1.00);
	font-size: small;
}
.breadcrumb-items li:after {
    content: '\0000a0 / \0000a0';
}
.breadcrumb-items li:last-child:after {
    content: '';
}

.breadcrumb-items li a {
	color: rgba(3,54,90,1.00);
	text-decoration: none;
}
.breadcrumb-items li a:hover {
	text-decoration: underline;
}


/* FLIP SWITCH  */



.flipswitch {
 float:right;
  position: relative;
  width: 100px;
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select: none;
  display:inline-table;
  margin-top:5px;
   
}
.flipswitch input[type=checkbox] {
  display: none;
}
.flipswitch-label {
  display:block;
  overflow: hidden;
  cursor: pointer;
  border: 1px solid #999999;
  border-radius: 20px;
}
.flipswitch-inner {
  width: 200%;
  margin-left: -100%;
  -webkit-transition: margin 0.3s ease-in 0s;
  -moz-transition: margin 0.3s ease-in 0s;
  -ms-transition: margin 0.3s ease-in 0s;
  -o-transition: margin 0.3s ease-in 0s;
  transition: margin 0.3s ease-in 0s;
}
.flipswitch-inner:before, .flipswitch-inner:after {
  float: left;
  width: 50%;
  height: 30px;
  padding: 0;
  line-height: 30px;
  font-size: 1em;
  color: white;
  font-family: inherit;
  font-weight:normal;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.flipswitch-inner:before {
  content: "English";
  padding-left: 15px;
  background-color: #03365A;
  color: #FFFFFF;
}
.flipswitch-inner:after {
  content: "Telugu";
  padding-right: 15px;
  background-color: #BABABA;
  color: #555555;
  text-align: right;
}
.flipswitch-switch {
  width: 30px;
  height: 32px;
  margin:0px;
  background: #FFFFFF;
  border: 1px solid #999999;
  border-radius:20px;
  position: absolute;
  top: 0px;
  bottom:0px;
  right: 70px;
  -webkit-transition: all 0.3s ease-in 0s;
  -moz-transition: all 0.3s ease-in 0s;
  -ms-transition: all 0.3s ease-in 0s;
  -o-transition: all 0.3s ease-in 0s;
  transition: all 0.3s ease-in 0s;
}
.flipswitch-cb:checked + .flipswitch-label .flipswitch-inner {
  margin-left: 0;
}
.flipswitch-cb:checked + .flipswitch-label .flipswitch-switch {
  right: 0;
}


.animate
{
	transition: all 0.1s;
	-webkit-transition: all 0.1s;
}

.action-button
{
	position: relative;
	padding: 1em 2.5em;
	margin: 0 0.625em 0.625em 0;
	border-radius: 0.3125em;
	border:0 none;
	font-family:inherit;
	font-size: 1em !important;
	color: #FFF;
	line-height: 1.5em;
	text-decoration: none;
	text-transform:uppercase;
}
.action-button:active
{
	transform: translate(0, 3px);
	-webkit-transform: translate(0, 3px);
	border-bottom: 1px solid;
}
.blue
{
	background-color: #3498DB;
	border-bottom: 3px solid #2980B9;
}
 p.submit-button { 
 	 position: relative;
     margin-top: 20px;
 }
 
 
 p.submit-button:before {
    content: "";
    display: block;
    border:1px dashed #F2C90C;
    width: 100%;
    height: 1px;
    position: absolute;
    top: 40%;
    z-index: 1;
  }
  
  p.submit-button  span{
	background:#FFFFFF;
	margin-right:-12px;
	padding-left:10px;
    position: relative;
    z-index: 5;
  }
  
 
.quiz-intro {
	color: rgba(51,51,51,1.00);
	font-size: 1.15em;
	line-height: 2em;
	margin:20px;
	text-align:justify;
}
	
.bottom-buttons{ 
	margin: 0 auto;
	text-align:center;
}

.english-question p,
.telugu-question p, 
.quiz-answer-details p{ 
	font-family: 'alte_haas_groteskregular','Open Sans';
	font-size:1.25em;
	text-align:center;
}
.header-container {
  overflow: hidden;
  text-align: center;
 
}
.questuon-header { 
	padding:20px;
	position:relative; 
	 display: flex;
     flex-direction: row;
}
.question-number-text, .question-number{ 
	display:inline-table;
}
.question-number-text, .answer-details-label, .quiz-result-label, .answer-type-c p, .answer-type-d p, .question-result-text{ 
   font-family: 'alte_haas_groteskregular','Open Sans';
   font-size:2em;
   font-weight:600;
   color:#03365A;
 }
 
 
.question-number{
   	font-family: 'alte_haas_groteskregular','Open Sans';
	font-size:2em;
	font-weight:600;
	line-height:25px;
	background-color: #F2C90C;
	color: rgba(255,255,255,1);
	padding: 0.35em 0.5em;
	margin-left: 0.30em;
    position: relative;
    z-index: 5;
 	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	 
} 
 .quiz-result-label{ 
	padding:0 !important;
 }

.english-question .question-number-text, .english-question p, .english-answer .answer-options ul li, .next-button button{
  font-family: 'alte_haas_groteskregular','Open Sans';
}
 
.questuon-header:before, 
.questuon-header:after {
  flex-grow: 1;
  height: 1px;
  border:1px dashed #F2C90C;
  content: '\a0';
  position: relative;
  top: 1em;
}

.questuon-header:before {
  margin-right:10px;
}

.questuon-header:after {
  margin-left:10px;
}
  
 
 .bottom-buttons, .answer-options, .telugu-question p, .english-question p .answer-type-c, .answer-type-d { 
 	padding-top:1em;
	padding-bottom:1em;
 }


/* -------------- Answer Options - Type : A ------------------ */ 
 
 .answer-options ul { 
    margin-left: auto;
	margin-right: auto;
	text-align: center;
}
 
.answer-options ul li {
	font-family: 'alte_haas_groteskregular','Open Sans';
	font-size: 1.25em;
	box-sizing: border-box;
	position: relative;
	text-align:left;
	vertical-align: middle;
	padding: 1em 2em;
	border: 2px solid transparent;
	margin-right: 2em;
	margin-bottom: 0.5em;
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-o-border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-ms-border-radius: 0.5em;
}

.answer-options ul li:active, .answer-options ul li.active {
	background: #F2C90C ;
	color:#FFFFFF;
}

/* .answer-options ul li.correct {
	background: green ;
	color:#FFFFFF;
}

.answer-options ul li.incorrect {
	background: red ;
	color:#FFFFFF;
}
.answer-options ul li.active	 {
	background: #F2C90C ;
	color:#FFFFFF;
} */

.answer-options ul li:hover {
	border: 2px solid #F2C90C;
}

.answer-options ul li span{
	background:rgba(255,255,255,1.00);
	border: 2px solid #F2C90C;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	-ms-border-radius: 50%;
	color: #F2C90C;
	padding: 0.35em 0.75em;
	margin-left: -3.125em;
	margin-right:0.75em;
}

.answer-options ul li:active span, .answer-options ul li.active span{
	background: #F2C90C url(../images/tick.svg) center center no-repeat;
	border-color:#FFFFFF;
 	background-size:110%;
	color:transparent;
    
 }
 .answer-options ul li.correct-answer span{ 
    background: #52D900 url(../images/tick.svg) center center no-repeat;
	border-color:#FFFFFF;
 	background-size:110%;
	color:transparent;
 	
 }
.answer-options ul li.correct-answer {
	background: #52D900 ;
	color:#FFFFFF;
}
.answer-options ul li.wrong-answer span{ 
    background: #FF5335 url(../images/cross.svg) center center no-repeat;
	border-color:#FFFFFF;
 	background-size:110%;
	color:transparent;
 	
 }
.answer-options ul li.wrong-answer {
	background: #FF5335 ;
	color:#FFFFFF;
}
 
.type-a .answer-options ul { 
    display: table;
}
.type-a .answer-options ul li{ 
    display: table-cell; 
	float: left;
}
.type-b .answer-options ul, .type-b .answer-options ul li { 
    display: block;
	text-align:left;
}


 




 .quiz-answer-details{ 
 	padding:1em; 
	background:#F1F1F1;
	border:1px solid #DADADA;
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-o-border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-ms-border-radius: 0.5em;
 }
 .next-button{ 
 	position:relative;
	text-align:right;
	display:flex;
        flex-direction: row;
	padding-top:2em;
	padding-bottom:2em;
 }
 
 .next-button:before,
 .next-button:after{
  flex-grow: 1;
  height: 1px;
  border:1px dashed #F2C90C;
  content: '\a0';
  position: relative;
  top: 1.75em;
  text-align:right;
}

.next-button:before {
  margin-right:10px;
}
.next-button:after {
  margin-left:10px;
}
  
.next-button button{ 
	color:#F2C90c;
	padding:0.55em 2em;	
	font-size:1em;
	background:#FFFFFF;
        border:2px solid #F2C90C;
	border-radius: 2em;
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	-o-border-radius: 2em;
	-ms-border-radius: 2em;
 	padding-right:0;
	vertical-align:top;
 }
 .next-button button i{
   background:transparent url(../images/right.svg) 50% 50% no-repeat;
	display:inline-block;
	margin: 0.1em 1em -0.1em 0.5em;
	width:1.25em;
	height:1em;
	
 }
  .next-button button:hover{ 
  	color:#FFFFFF;
	background:#F2C90c;
  }
  .next-button button:hover i{ 
  	background:transparent url(../images/right-hover.svg) 50% 50% no-repeat; 
  }
  .endQuiz-bottom-row .next-button button { padding-right: 2em; }
   .quiz-result-details{ 
   text-align:center;
 	padding:1em; 
	background:#F1F1F1;
	border:1px solid #DADADA;
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-o-border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-ms-border-radius: 0.5em;
 }
  .quiz-score {
    background-color: #F2C90C;
	padding: 0.35em;
    z-index: 5;
 	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	 box-sizing:border-box;
	 display:block;
	 width:120px;
	 height:120px;
	 margin: 0 auto;
  }
 
 .quiz-scrore-number{
	font-size:4em;
	font-weight:bold;
	color: rgba(255,255,255,1);
  }
  .quiz-score-total{ 
	font-size:1.25em;
	font-weight:bold;
	color: rgba(255,255,255,1);
	margin-top:-10px;
  }
  .quiz-answer-symbol-correct{
	background: transparent url(../images/blank_correct.svg) center center no-repeat; 
	width:50px;
	height:50px;
	display:inline-block;
	vertical-align:middle;
 }
   .quiz-answer-symbol-wrong{
	background: transparent url(../images/blank_wrong.svg) center center no-repeat; 
	width:50px;
	height:50px;
	display:inline-block;
	vertical-align:middle;
 }
 .fill_in_the_blank.correct, .fill_in_the_blank.wrong{ 
	
	padding:0.625em;
	border-radius:5px;
	-webkit-border-radius:5px;
	-o-border-radius:5px;
	-moz-border-radius:5px;
	ms-border-radius:5px;
	color: rgba(255,255,255,1);
 }
 .fill_in_the_blank.correct{ background:#52D900;}
 .fill_in_the_blank.wrong{ background:#FF5335; }
  
  /* ------------------ True or False Switcch ------------------------- */
 
 
/* ============================================================
  COMMON
============================================================ */
/* .question, .switch{ 
	display:table-cell;
} */
.switch{  vertical-align:top; }
.cmn-toggle {
	display:inline-block;
   visibility: hidden;
}
.cmn-toggle + label {  
  display:inline-table;  
  position: relative;
  cursor: pointer;
  outline: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
 
/* ============================================================
  SWITCH 2 - ROUND FLAT
============================================================ */
input.cmn-toggle-round-flat + label {
  padding: 2px;
  width: 100px;
  height: 50px;
  background-color: #888888;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  border-radius: 50px;
  -webkit-transition: background 0.4s;
  -moz-transition: background 0.4s;
  -o-transition: background 0.4s;
  transition: background 0.4s;
}
input.cmn-toggle-round-flat + label:before, input.cmn-toggle-round-flat + label:after {
  display: block;
  position: absolute;
  content:"";
}
 
 
input.cmn-toggle-round-flat + label:before {
  top: 2px;
  left: 2px;
  bottom: 2px;
  right: 2px;
  background-color: #ffffff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  border-radius: 50px;
  -webkit-transition: background 0.4s;
  -moz-transition: background 0.4s;
  -o-transition: background 0.4s;
  transition: background 0.4s;
}
input.cmn-toggle-round-flat + label:after {
  top: 4px;
  left: 4px;
  bottom: 4px;
  width: 44px;
  background-color: #888888;
  -webkit-border-radius: 42px;
  -moz-border-radius: 42px;
  -ms-border-radius: 42px;
  -o-border-radius: 42px;
  border-radius: 42px;
  -webkit-transition: margin 0.4s, background 0.4s;
  -moz-transition: margin 0.4s, background 0.4s;
  -o-transition: margin 0.4s, background 0.4s;
  transition: margin 0.4s, background 0.4s;
}
input.cmn-toggle-round-flat:checked + label {
  background-color: #52D900;
}
input.cmn-toggle-round-flat:checked + label:after {
  margin-left: 48px;
  background-color: #52D900;
}
.answer-type-c p, .answer-type-d p{ 
 	vertical-align:top;
}
 .answer-type-c p i{ 
 	background-size:100%;
	width:40px;
	height:40px;
	margin-left:1em;
	display:inline-block;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
 }
.answer-type-c p i.true{ 
	background: #52D900 url(../images/tick.svg) center center no-repeat;
}
.answer-type-c p i.false{ 
    background: #FF5335 url(../images/cross.svg) center center no-repeat;
}

.type-d p.questions input.fill_in_the_blank{ 
	border:0 none;
	border-bottom: 1px solid #BABABA;
}
.answer-type-d p span{ 
	font-family: 'alte_haas_groteskregular','Open Sans';
	font-size: 1em;
	color:#52D900;
	vertical-align:top;
}
.matching-questions, .matching-answers{ 
	vertical-align:top;
}
.matching-questions ul, .matching-answers ul{ 
	list-style:none;
}
.matching-questions ul li p, .matching-answers ul li p,  .matching-answers ul li div, .matching-questions ul li div{ 
	display:inline-block;
	box-sizing:border-box;
}
.matching-questions ul li div, .matching-answers ul li div { 
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	-ms-border-radius: 50%;
	padding: 0.35em 0.75em;	
    position: relative;
	box-sizing:content-box;
}
.matching-answers ul li div{ 
	background:#F2C90C;
	color: #FFFFFF;
}
 .matching-questions ul li div{ 
 	background:rgba(255,255,255,1.00);
	border: 2px solid #F2C90C;
	color: #F2C90C;	
 }
 .matching-questions ul li p { 
	margin-right:1em;
  }
  .matching-answers ul li p { 
	margin-left:1em;
  }
 .matching-questions ul li{ 
  	text-align:right; 
	margin-right:2em;
 }
 .matching-answers ul li{ 
  	text-align:left; 
	margin-left:2em;
 }
 .matching-questions ul li div.match-answer-place{ 
 	background:rgba(255,255,255,1.00);
	border: 2px solid #F2C90C;
	color: #F2C90C;	
  	border-top-left-radius: 0;
	-webkit-border-top-left-radius: 0;
	-moz-border-top-left-radius: 0;
	-o-border-top-left-radius: 0;
	-ms-border-top-left-radius: 0;
	 	border-bottom-left-radius: 0;
	-webkit-border-bottom-left-radius: 0;
	-moz-border-bottom-left-radius: 0;
	-o-border-bottom-left-radius: 0;
	-ms-border-bottom-left-radius: 0;
 }
 .matching-questions ul li div.match-question-number{ 
	background:#F2C90C;
	color: #FFFFFF;
	border-top-right-radius: 0;
	-webkit-border-top-right-radius: 0;
	-moz-border-top-right-radius: 0;
	-o-border-top-right-radius: 0;
	-ms-border-top-right-radius: 0;
	 	border-bottom-right-radius: 0;
	-webkit-border-bottom-right-radius: 0;
	-moz-border-bottom-right-radius: 0;
	-o-border-bottom-right-radius: 0;
	-ms-border-bottom-right-radius: 0;
 
 }