@charset "utf-8";
/* CSS Document */

body {font-family:Calibri; font-size: 14px;}

a {text-decoration: none; transition: .2s}

img {border: none;}

@font-face {
	font-family:Calibri;
	src:url(../fonts/Calibri_1.eot);
	src:local('Calibri'),url(../fonts/Calibri_1.ttf) format('truetype'),
		url(../fonts/Calibri_1.woff) format('woff'),
		url(../fonts/Calibri_1.svg) format('svg');
	font-weight:400;font-style:normal
}

.main-container {max-width: 768px; margin: 0 auto;}

/*Header CSS Start*/
#st-plan-header {
	background-color: #143066;
	padding: 15px;
	text-align: center;
}
#st-plan-header h1 {font-family: 'Oswald', sans-serif; font-weight: 500; font-size: 30px; color: #fff; margin: 0; line-height: 30px;}

#date-cal {max-width: 100%; padding: 10px 15px; text-align: center;}
#date-cal:after {clear: both;content: '';display: block;}
#date-cal .deadline {
    margin-bottom: 10px;
    width: 25%;
    float: left;
    text-align: left;
    display:block;
}
#date-cal .date_right {margin-left:5px;float: left;display: block;justify-content: flex-end;width:44%;}
#date-cal .deadline a {font-size: 17px; color: #3a3a3a;}
#date-cal .date {margin-bottom: 10px;text-align: left;}
#date-cal .date {font-size: 18px; color: #d73c4c; font-weight:400;padding-right: 5px;}
#date-cal .calender-img {margin-bottom: 10px;padding-right: 5px;float:left;}
#date-cal .calender-img img {margin: 0 auto;width: 18px;}
#date-cal .daysleft {font-size: 16px; color: #262626;display:block;}
#date-cal .daysleft p {margin: 0}

/*todays task tabs CSS*/

#tabpanel {max-width: 100%;}
#tabpanel .nav-tabs .nav-link.tod-task,
#tabpanel .nav-tabs .nav-link.over-perf {
	font-size: 18px; 
	background-color: #26c6da; 
	color: #fff; 
	font-family: 'Oswald', sans-serif;
	border-radius: 0;
}
#tabpanel .nav-tabs .nav-link.tod-task {
	background-color: #26c6da;
}
#tabpanel .nav-tabs .nav-link.over-perf {
	background-color: #1897a7;
}
#tabpanel .nav-tabs .nav-link.tod-task {margin-left: 5px;}
#tabpanel .nav-tabs .nav-link.over-perf {margin-left: 2px;}

#tabpanel .nav-tabs .tod-task.active {
    color: #1d1c1c;
    background-color: #26c6da;
    border-color: #26c6da #26c6da #26c6da;
}
#tabpanel .nav-tabs .over-perf.active {
    color: #fff;
    background-color: #1897a7;
    border-color: #1897a7 #1897a7 #1897a7;
}

#tabpanel .tab-content .tod-task{background-color: #26c6da;}
#tabpanel .tab-content .over-perf{background-color: #1897a7;}

#dgoal {}
#dgoal .daygoal {
    padding: 30px 11px;
}
#dgoal .goal_icon {
    float: left;
    width: 25px;
    margin-right: 8px;
}
#dgoal .daygoal h2 {
    font-size: 22px;
    color: #fff;
    font-weight: bold;
    margin: 0;
    line-height: 1;
}
#dgoal .daygoal .goalRow {
    width: 100%;
    padding: 15px 0 0;
}
#dgoal .daygoal .leftGoalRow {width: 100%;margin-top:13px; }
#dgoal .daygoal .leftGoalRow:after {clear: both; content: '';display: block;}
#dgoal .daygoal .leftGoalRow h4 {
    font-size: 14px;
    color: #fff;
    font-weight: normal;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 90%;
}
#dgoal .daygoal .goalGraph {
    float: left;
    margin-top: 5px;
    position: relative;
    width:95%;
    height: 8px;
    background: #fff;
}
#dgoal .daygoal .practice {width: 25%; float: right; text-align: right;}
#dgoal .daygoal .practice a {background: #fff; padding: 3px 7px; color: #606060; font-size: 14px; border-radius: 3px;}
#dgoal .daygoal .goalGraph .achiver {
    position: absolute;
    font-size: 12px;
    padding: 1px 5px 1px;
    background: #ff6161;
    color: #fff;
    right: -20px;
    top: -23px;
    text-align: center;
    width: 120px;

}
#dgoal .daygoal .goalGraph .achiver i {
    background: url(../images/orangeDownArrow.png) center top no-repeat;
    height: 7px;
    position: absolute;
    bottom: -6px;
    width: 100%;
    left: 0;

}

#ovrperfor {padding: 15px; padding-top: 5px;}
#ovrperfor .row {max-width: 100%; width:100%; margin: 0 auto; border-bottom: 1px #094a52 solid; padding-bottom: 10px; padding-top: 10px;}
#ovrperfor .row .row:after {clear: both; content: ''; display: block;}
#ovrperfor .row .rowleft {width:68%; max-width: 68%; float: left;}
#ovrperfor .row .rowleft h3 {font-family: 'Oswald', sans-serif;	font-size: 18px; color: #fff; padding-top:13px; margin: 0;}
#ovrperfor .row .rowright {max-width: 30%; width: 30%; float: right}
#ovrperfor .row .rowright p {font-size: 15px; color: #fff; margin-bottom: 3px; text-align: right}


@media only screen and (min-width:576px) {
	#dgoal .daygoal .goalGraph {max-width: 95%; width: 95%;}
	#dgoal .daygoal .practice {max-width: 13%; width: 13%;}
}


/*Start Test CSS start here*/

.q-container {max-width: 95%; margin: 0 auto 60px;}
#q-head {}
#q-head .row {max-width: 100%; padding: 10px 0; margin: 0;}
#q-head .row:after {clear: both; display: none; content: '';}
#q-head .left {max-width: 70%; width:70%; float: left;}
#q-head .left a {color: #3a3a3a; font-size: 16px;}
#q-head .right {max-width: 30%; width: 30%; float: right; text-align: right;}
#q-head .right input[type="button"] {
	background: #0370c7;
	width:100px;
	padding: 5px;
	border-radius: 5px;
	font-size: 14px;
	color:#fff;
	border:none;
}

#q-timer {max-width: 100%; background-color: #f2f2f2; padding: 5px; margin-bottom: 10px;}
#q-timer .row {max-width: 100%; margin: 0;}
#q-timer .row:after {clear: both; display: none; content: '';}
#q-timer .q-count {max-width: 40%; width: 40%; float: left;}
#q-timer .q-count, #q-timer .q-time {font-size: 18px; color: #535353;}
#q-timer .q-time {max-width: 15%; width: 15%; float: left;}
#q-timer .q-pause {max-width: 45%; width: 45%; text-align: right; float: right;}
#q-timer .q-pause span img {margin-top: -2px;}

#q-timer .incorrectOvertime {max-width: 45%; width: 45%; text-align: right; float: right;}
#q-timer .incorrectOvertime .correct,
#q-timer .incorrectOvertime .incorrect,
#q-timer .incorrectOvertime .overtime {
	border-radius: 5px;
	color: #fff;
	font-size: 14px;
	padding: 2px 7px;
}
#q-timer .incorrectOvertime .correct {
	background: #26c6da;
}
#q-timer .incorrectOvertime .incorrect {
	background: #ff6161;
}
#q-timer .incorrectOvertime .overtime {
	background: #7460ee;
}
.hide {display: none !important;}



.paragraph {max-width: 100%;}
.paragraph p {font-size: 16px; color: #222121;}

#answers {max-width: 100%; margin: 15px 0 0}
#answers ul {margin: 0; padding: 0; list-style: none;}
#answers li {
	background-color: #f2f2f2;
	padding: 10px;
	cursor: pointer;
	margin-bottom: 3px;
}
#answers li span {color: #212121; font-size: 16px;}
#answers li .alphabet {padding-right: 5px;}
#answers li.active {background-color: #a5a5a5; color: #313131;}

#buttons {margin: 25px auto; text-align: center;}
#buttons .form-group {
	display: inline-block;
}
#buttons .form-group input[type="button"] {width:80px; border:none; font-size: 16px; border-radius: 5px; padding: 5px 15px;}
#buttons .form-group input.submit {background-color: #0370c7; color: #fff; margin-right: 20px;}
#buttons .form-group input.hidden {background-color: #eeeeee; color: #b1b1b1;}


/*Wrong Answer Screen CSS*/

#answers li.rightoption {background: #d9f0f1;}
#answers li.rightoption i.comIcon {background-position: -1px -46px;}
#answers li i.comIcon {
    background: url(../images/wrong-right.png) -1px -1px no-repeat;
    height: 23px;
    width: 23px;
    float: right;

}
#answers li.rightoption .ansSolution {
    float: left;
    width: 98%;
    box-sizing: border-box;
    border-left: 2px solid #25a763;
    margin: 14px 1%;
}
#answers li.rightoption .ansSolution h3 {
    width: 100%;
    padding: 0px 0 15px 25px;
    margin: 0;
    font-weight: bold;
    font-size: 17px;
    color: #18864c;
}
#answers li.rightoption .ansSolution .sol-main {
    margin: 0;
    padding: 0 0 15px 25px;
    width: 100%;
}
#answers li.rightoption .solutionButtons {text-align: center; margin-top: 15px;}
#answers li.rightoption .solutionButtons .solBtn {
    display: inline-block;
    background: #fff;
    border: 1px solid #b0dcc5;
    padding: 5px 10px;
    text-align: center;
    font-size: 15px;
    margin: 0 6px 0;
    cursor: pointer;
    color: #323232;
}
#answers li.wrongOption {
    background: #ffe1e1;
}


@media only screen and (max-width:575px) {
	#answers li i.comIcon {margin: -25px -4px 0 0;}
}


#fixed-ftr {
	background-color: #143066;
	padding: 15px 0;
	position: fixed;
	bottom: 0; 
	max-width: 768px; 
	margin: 0 auto;
	min-width: 320px;
	width: 100%;
}
#fixed-ftr .inner {max-width: 90%; margin: 0 auto;display: flex;justify-content: center;}
#fixed-ftr .inner ul {margin: 0; padding: 0; list-style: none;}
#fixed-ftr .inner ul:after {clear: both;display: block;content: ''}
#fixed-ftr .inner li {float: left; margin-right: 60px;line-height: 16px;}
#fixed-ftr .inner li:last-child{margin-right: 0;}
#fixed-ftr .inner li.br-right {position: relative;}
#fixed-ftr .inner li.br-right:after {
	content: '';
	background: #fff;
	height: 15px;
	width: 1px;
	position: absolute;
	right: -30px;
	top: 3px;
}
#fixed-ftr .inner li a {cursor: pointer;color: #fff;line-height: 18px;font-size: 16px;}


#sessionanal.modal {top:25%}
#sessionanal .modal-title {font-weight: 400;font-family: 'Oswald', sans-serif;font-size: 24px;color: #262626;line-height: 26px;padding-bottom: 15px;margin: 0;}
#sessionanal .modal-header {padding-bottom: 0;border:none;}

#sessionanal .questionRight{width: 100%;}
#sessionanal .questionRight .rightMainQues{width:100%;padding:8px 15px; margin:40px 0 15px; box-sizing:border-box; border:1px solid #ececec}
#sessionanal .questionRight .rightMainQues h3{width:100%; text-align:left; font-weight:bold; font-size:18px; color:#444;font-family: calibri,calibriregular; padding:0 0 8px; margin:0}
#sessionanal .questionRight .rightMainQues .ansDetail{width:100%;}
#sessionanal .questionRight .rightMainQues .ansDetail ul:after {clear: both;display: block;content: ''}
#sessionanal .questionRight .rightMainQues .ansDetail ul{list-style:none; margin:0; padding:0}
#sessionanal .questionRight .rightMainQues .ansDetail li{float:left; width:50%;}
#sessionanal .questionRight .rightMainQues .ansDetail li .detailCircle{background: url(https://www.tcyonline.com/study-planner/images/color-boxes.png) -6px -4px no-repeat;
border-radius: 80px;box-sizing: border-box;color: #fff;display: table-cell;font-family: calibri,calibriregular;font-size: 18px;height: 38px;text-align: center;
vertical-align: middle; width: 38px;font-weight:bold;}
#sessionanal .questionRight .rightMainQues .ansDetail li p{color: #444;display: table-cell;font-family: calibri,calibriregular;
font-size: 16px;margin: 0;padding: 8px 0 0 8px;text-align: left;}
#sessionanal .questionRight .rightMainQues .ansDetail li .correct{background-position: -6px -54px}
#sessionanal .questionRight .rightMainQues .ansDetail li .incorrect{background-position: -6px -104px}
#sessionanal .questionRight .rightMainQues .ansDetail li .overtime{background-position: -6px -154px}
#sessionanal .questionRight .rightMainQues .ansDetail li:nth-child(1){margin-bottom:18px;}
#sessionanal .questionRight .rightMainQues .ansDetail li:nth-child(2){margin-bottom:18px;}
#sessionanal .questionRight .rightMainQues .tags{width:100%;}
#sessionanal .questionRight .rightMainQues .tags .tagBox{background: #f6f6f6; background: -moz-linear-gradient(top, #f6f6f6 0%, #cdcdcd 100%); 
background: -webkit-linear-gradient(top, #f6f6f6 0%,#cdcdcd 100%); background: linear-gradient(to bottom, #f6f6f6 0%,#cdcdcd 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#cdcdcd',GradientType=0 ); /* IE6-9 */float:left; margin:0 8px 8px 0; padding:3px 12px; font-size:15px; color:#222222;font-family: calibri,calibriregular; border-radius:5px;border:1px solid #ddd;}
#sessionanal .questionRight .rightMainQues .tags .blueBox{background: #0ad2ea; /* Old browsers */
background: -moz-linear-gradient(top, #0ad2ea 0%, #0093a5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #0ad2ea 0%,#0093a5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #0ad2ea 0%,#0093a5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0ad2ea', endColorstr='#0093a5',GradientType=0 ); /* IE6-9 */ color:#fff; border:1px solid #1abdd1}
#sessionanal .questionRight .rightMainQues .addnewTag{float:left; width:100%; background:#f3f3f3; border-radius:5px;border:1px solid #e0e0e0; box-shadow:inset 2px 2px 2px #ccc;font-size:15px; padding:8px 10px; box-sizing:border-box; margin:5px 0 5px; color:#444;font-family: calibri,calibriregular;}
#sessionanal .questionRight .rightMainQues .tags p{float:left; width:100%; text-align:left; font-size:14px; color:#999;font-family: calibri,calibriregular; padding:5px 5px 15px; box-sizing:border-box; margin:0}
#sessionanal .questionRight .rightMainQues .quesLevel{float:left; width:100%}
#sessionanal .questionRight .rightMainQues .quesLevel ul{list-style:none; margin:0; padding:0}
#sessionanal .questionRight .rightMainQues .quesLevel li{float:left; width:50%}
#sessionanal .questionRight .rightMainQues .quesLevel li:nth-child(1){margin-bottom:18px;}
#sessionanal .questionRight .rightMainQues .quesLevel li:nth-child(2){margin-bottom:18px;}
#sessionanal .questionRight .rightMainQues .quesLevel li label span{color:#444;font-family: calibri,calibriregular; font-size:15px;}

#sessionanal .topicPercent h2{color:#777;font-size:17px; font-weight:normal; margin:0; padding:5px 0 0; font-family: calibri,calibriregular; }
#sessionanal .topicPercent .fluidOutter{width:100%;}
.topic_name {font-size: 17px}
#sessionanal .topicPercent .fluidOutter h3{width:100%; font-size:17px; font-weight:normal; margin:0 0 4px; padding:0; color:#777777;font-family: calibri,calibriregular;}
#sessionanal .topicPercent .fluidOutter .fluidPercent{margin-bottom: 21px; width:100%; background:#dcdcdc; height:8px; position:relative;}
#sessionanal .topicPercent .fluidOutter .fluidPercent .fluidFiller{height:8px; width:35%; background:#7460ee}
#sessionanal .topicPercent .fluidOutter .fluidPercent .fluidTotal{float: right;margin-top: 12px; padding:2px 4px; background:#ff6161; font-size:14px; color:#fff;font-family: calibri,calibriregular;}
#sessionanal .topicPercent .fluidOutter .fluidPercent .fluidTotal i{position:absolute; left:0; bottom:-7px; background:url(../images/orangeDownArrow.png) center top no-repeat; width:100%; height:8px;}
#sessionanal .questionPart{width:100%; padding:0;}


@media only screen and (max-width:560px) {
	#sessionanal.modal {top:15%}
}
@media only screen and (min-width:561px) {
	#sessionanal.modal {top:1%}
}



/*Accordion Panel*/

#faqaccordion {
    margin: 25px auto;
    max-width: 100%;
}
#faqaccordion .card {
    background: #fff;
    border:1px #d8d8d8 solid;
    padding:0px 10px;
    border-radius: 5px;
    margin-bottom: 5px;
}
#faqaccordion .btn {
    padding:0;
    padding-left: 20px;
    line-height: 18px;
    text-align: left;
    color: #3c3c3c;
    margin: 0;
    font-size: 16px;
    width: 100%;
    position: relative;
}
#faqaccordion .btn::before {
    content: '';
    background: url(https://www.tcyonline.com/mobile/images/test_icon.png) no-repeat;
    width: 15px;
    height: 20px;
    position: absolute;
    left: 0;
}
#faqaccordion .mb-0 {font-size: 0;}
#faqaccordion .card-header {padding: 0;border: none;background: none}
#faqaccordion .card-body {padding:10px;background: none;border-radius: 0;border: none;}
#faqaccordion .links a {color: #bbbbbb; font-size: 15px; line-height: 25px; text-decoration: none}
#faqaccordion .links a:hover {text-decoration: underline;}

#faqaccordion .btn-link:after {
    content: '\f0d8';
    font-family: fontawesome;
    font-size: 18px;
    color: #2196f3;
    position: absolute;
    right: 0;
    top: 0;
}
#faqaccordion .collapsed:after {
    content: '\f0d7';
    font-family: fontawesome;
    display: block;
    font-size:18px;
    color: #2196f3;
    position: absolute;
    right: 0;
    top: 0;
}

#faqaccordion .collapse {visibility: visible}

#test_perf {}
#test_perf .goal_icon {
    float: left;
    width: 25px;
    margin-right: 8px;
}
#test_perf h2 {
    font-size: 22px;
    color: #fff;
    font-weight: bold;
    margin: 0;
    line-height: 1;
}
#test_perf .goalRow {
    width: 100%;
    padding: 15px 0 0;
}
#test_perf .leftGoalRow {width: 100%; }
#test_perf .leftGoalRow:after {clear: both; content: '';display: block;}
#test_perf .leftGoalRow h4 {
    font-size: 16px;
    color: #7f7f7f;
    font-weight:bold;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 90%;
}
#test_perf .goalGraph {
    float: left;
    margin-top: 14px;
    position: relative;
    width: 72%;
    height: 8px;
    background:#e2e2e2;
}
#test_perf .goalGraph .goalReached {
    width: 10%;
    background: #7460ee;
    height: 8px;
    position: relative;
    float: left;
}
#test_perf .practice {width: 25%; float: right; text-align: right;}
#test_perf .practice a {background: #7f7f7f; padding: 4px 7px; color: #fff; font-size: 14px; border-radius: 3px;}
#test_perf .goalGraph .achiver {
    position: absolute;
    font-size: 12px;
    padding: 1px 5px 1px;
    background: #ff6161;
    color: #fff;
    right: -24px;
    top: -26px;
    text-align: center;
    width: 45px;

}
#test_perf .goalGraph .achiver i {
    background: url(../images/orangeDownArrow.png) center top no-repeat;
    height: 7px;
    position: absolute;
    bottom: -6px;
    width: 100%;
    left: 0;

}


.fade
{
    opacity:1;
}
#dgoal .daygoal .goalGraph .goalReached {
   background: #7460ee
;
   height: 8px;
   width: 45%;
   float: left;
}
#HP_dullDiv{
    background: url(/india/images/pop-up-dull-bg.png);
    border: .0625em solid #114eab;
    filter: alpha(opacity=90);
    left: 0;
    opacity: .9;
    z-index: 3;
}
#HP_dullDiv{
    height: 100%;
    width: 100%;
    top: 0;
    position: fixed;
    display: none;
    z-index: 12 !important;
}
.ui-datepicker-inline
{
    width:100%;
}
.ui-datepicker td span, .ui-datepicker td a
{
  text-align: center !important;
}
#datepicker
{
  margin:0px auto;
  width:320px;
  z-index:999 !important;
}
#feedback_popup {left: 0!important;right: 0!important;margin: 10px; position: fixed;}
#form_questions {float: left; width: 100%; padding: 10px; background: #fff;}
#form_questions .inner-wrap textarea {width: 100%; min-height: 70px;}
#form_questions .buttonSbt {font-size: 16px;color: #fff;padding: 3px 10px;background-color: #478dcd;border-radius: 5px;border: none;}

#first_popup_merge {left: 0!important;right: 0!important; margin: 10px; position: fixed;}
#first_popup {left: 0!important; right: 0!important; margin: 10px; position: fixed;}
#first_popup .popupLeft {
    float: left;
    width: 100%;
    padding: 15px;
    background: #fff;
}
#first_popup .ui-widget.ui-widget-content {
    height: auto;
    /* max-height: 250px; */
    overflow-y: scroll;
    width: 100% !important;
    left: 0px !important;
}
#datepicker {width: 290px;}
.ui-datepicker .ui-datepicker-title select {padding:0px 5px;}

@media only screen and (max-width: 767px) {
	.ui-widget.ui-widget-content {position: relative !important;left: auto !important;}	
	#first_popup .ui-widget.ui-widget-content {max-height: unset;}
}
