/* @import url('https://fonts.googleapis.com/css?family=Lato:300,400,400i,700,700i,900&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');*/
body { background:#f2f7ff; font-family: 'Open Sans', sans-serif; }
.page-sub-header,.page-sub-header .navbar-collapse { padding-left: 0px;} 
/*
.page-sub-header .navbar-nav>li:first-child a { background:#e8ebfb; padding-left: 30px; padding-right: 30px; position: relative; } 
.page-sub-header .navbar-nav>li:first-child a:after { content: ""; display: inline-block; width: 0px; height: 0px; border-top: 6px solid transparent; border-bottom: 6px solid transparent;border-left: 10px solid #e8ebfb; position: absolute; right:-10px; top:15px; z-index: 1;}
*/
.page-sub-header .leaderborad-btn { float: right; display: inline-block; text-transform: uppercase; padding: 6px 14px; color: #fff; text-align: center; text-decoration: none; background: #13aae6; border-radius: 6px; margin-top: 7px; font-size: 12px; line-height: 16px;}
.navbar-default .page-sub-header .navbar-nav>li>a { color:#000}
.navbar-default .page-sub-header .navbar-nav>li>a .caret { border-style: solid; border-color: #000; border-width: 0 1px 1px 0; transform: rotate(45deg); height: 4px; width: 4px; } 
.quiz-detail { padding:15px; background:#fff;  margin:0 0 30px 0;  }
.quiz-detail ol {   padding:0 0 0 20px; }
.quiz-detail ol li { font-size:13px; line-height:21px; margin-bottom: 10px;}

.dashboard-wrapper { display: flex; padding: 50px 0px;}
.dashboard-wrapper .outer-container { flex:1}
.pie-chart-wrap { display: flex; align-items: center; justify-content: center;}
.pie-chart figure img { max-width: 400px;} 
.dashboard-wrapper .pie-chart { background: #fff; border-radius: 12px; box-shadow: 0px 0px 6px #dedede; padding: 20px 30px; margin-right: 30px; display: flex;}
.time-view { color: var(--sec-color); float:right; font-size:18px; line-height:40px; margin:0 30px 0 0; }

.quiz-header {  background:#fff; padding:6px 0; margin:0 0 0px 0; border-bottom:1px solid #dddddd;  top:0; width:100%; left:0; } 
.signals {width:40px; height:40px; display:block; background:#fafafa; float:right; text-align:center; padding:15px 10px 0 0; }
.dashboard-wrapper .panel-box { border-color: #39b4e9; box-shadow: none; padding: 20px 15px; text-align: center; margin-bottom: 40px;}
.dashboard-wrapper .panel-box a { text-decoration: none;}
.dashboard-wrapper .panel-box .panel-btn { display: block; border-radius: 8px; background: #8fcd33; color: #fff; text-transform: uppercase; font-size: 12px; line-height: 20px; padding: 4px 8px; text-decoration: none;}  
.dashboard-wrapper .panel-box .huge { font-size: 20px; line-height: 24px; color: #000; font-weight: 400; margin-bottom: 12px;}
.dashboard-wrapper .panel-box h6 { margin-bottom: 12px; font-weight: 400; color: #000; margin-top: 0px; font-size: 12px; line-height: 18px;}

.quick-links h2 { font-size: 16px; line-height: 20px; margin-bottom: 12px; margin-top: 0px;} 
.quick-links .default-box { background: #fff; border-radius: 6px; border: 1px solid #dedede; padding: 15px 20px; } 
.quick-links .default-box ul { margin: 0px 0px 12px 20px; padding: 0 0 6px 0px; border-bottom: 1px solid #dadada; list-style-type: disc;  }
.quick-links .default-box ul:last-child { margin-bottom: 0px; border: none; padding-bottom: 0px;}
.quick-links .default-box ul li { margin-bottom: 6px; padding-left: 4px;} 
.quick-links .default-box ul li a { text-decoration: none; color: #000; font-size: 14px; line-height: 20px; }
.quick-links .default-box ul li a:hover { text-decoration: underline; color: var(--main-color);}

img{ border:0px; }
.question_container{  font-size:18px; line-height:30px; padding:10px 20px;  font-weight: 600;}
.option_container{ padding:4px; height:45%; overflow-y:auto; padding:30px 20px 0px 20px ; font-size:16px; line-height:30px; }
.op{padding:4px; }

.navbar-default { background:#fff; margin-bottom:0px ;  border: none; border-bottom: 1px solid #dedede; border-radius: 0px;}	
.quuestion-secs { border-right:1px solid #dddddd; padding:0px; min-height:450px; }

.question_container br {    }
.question_container p { display:inline; }

.question_div{ display:none;  }
table { font-size:14px; }
.footer_buttons{   bottom:0px;  width:100%;  }
.footer_buttons-in {background:#e7ebfb; padding:10px;  margin: 0 20px 0 0;}
tr th { background:#222; color: #fff;}
	
.qbtn{ cursor:pointer; width:40px; height:30px; border-radius:5px; background-color:#212121; color:#ffffff; float:left; font-size:15px; padding:2px; text-align:center;margin:5px;}

.save_answer_signal{float:right; width:6px;height:6px;border-radius:2px;background-color:#666666;margin:2px;}	
 #photograph{width:150px;height:150px; }
.home-login { background:url(../images/login-bg.jpg) no-repeat fixed ; background-size:cover; position:relative; height:100%; padding:100px 0 0 0; }

.sidr-ques .qbtn { line-height: 16px; width:26px; height:26px; border-radius:5px; padding:5px 0 0 0; font-size:12px; background:#999999; }
.sidr-ques  b { font-size:14px; padding:0 0 10px 0; margin:0 0 10px 0 ; border-bottom:1px solid #eee; display:block; }

.home-login .login-panel { font-family: 'Lato', sans-serif; padding:20px; box-shadow:0px 0px 30px #313893; -moz-box-shadow:0px 0px 30px #313893; -webkit-box-shadow:0px 0px 30px #313893; }
.home-login .form-signin { margin:20px 0 0 0; border-top:1px solid #ccc; }

.home-login .form-signin h2 { text-transform:uppercase; font-size:20px; margin:16px 0 !important; }

.login-heading { padding:60px 0 0 0; font-size:50px; line-height:56px; text-transform:uppercase; color: #fff; font-weight:600; text-shadow:2px 2px 30px #313893; -moz-text-shadow:2px 2px 30px #313893; -webkit-text-shadow:2px 2px 30px #313893;}

.option_container .op p { display:inline; }
.option_container .op input[type=checkbox], .option_container .op input[type=radio] {   }

#quiz_detail .btn-success { margin:0px auto; display: inherit; }


#warning_div { background:rgba(0,0,0,0.6) !important; top:0 !important; left:0 !important; height:100% !important; }
#warning_div center { background:#fff; width:500px; margin: 100px auto; padding:20px; }

.navbar-brand { padding:11px 25px 0px 25px !important; height:58px; border-right:1px solid #ccc; margin:0 10px 0 0;    }
#quiz-menu {min-height: 42px;}
#quiz-menu .navbar-nav>li>a { padding-top:11px !important; padding-bottom:11px !important;  }
#quiz-menu.navbar-default .navbar-nav>.active>a, #quiz-menu.navbar-default .navbar-nav>.active>a:focus, #quiz-menu.navbar-default .navbar-nav>.active>a:hover{background-color: #e7ebfb;}
.main-in table tr:first-child td { background:#222; color: #fff; }

select { color:#333; font-size:12px; font-weight:normal; }

.tob-h-btn { float:right; }
.tob-h-btn li { border-left:1px solid #ccc;  }
.tob-h-btn li:first-child { border:0; }
.tob-h-btn li p { line-height:58px; padding:0 20px; margin:0; }
.div-view-in { display:inline-block; width:100%; }

.results-inner { padding:20px; margin:0 0 20px 0;}
.view-resalst .op { float:left; width:50%; text-align:left; display:inline ; padding:5px 0; }
.div-view-in .op input { display:inline; margin:0 6px; } 
.div-view-in .op p { display:inline; } 


.q-1 { border-bottom:1px solid #ccc; margin:0 0 10px 0; }
.q-1 p { float:left; font-size:18px; }
.q-1 b { float:left; font-size:18px; margin:0 5px 0 0; }

.correct-options {clear: both;
    padding: 20px 0 0 0;
    font-size: 14px;
    font-weight: 700;
    background-color: rgba(255,255,255,0.7);
    /* line-height: 1px; */
    padding: 10px;}
.correct-options p { display:inline; padding:0 0 0 5px; font-size:14px; }



.derail-table { width:100%; }
.derail-table tr th { background:#222; color:#fff; }



.quiz-progress  { list-style:none; margin:0; padding:0; }
.quiz-progress li { display:block; float:left; font-size:16px; width:31.3%; float:left; padding:15px 10px; border:1px solid #dddddd; margin:0 3% 3% 0; text-align:center; }

.quiz-progress li p ,.quiz-progress li b { margin:5px 0; display:block; }

.quiz-progress li:nth-child(3n+0) { float:right; margin:0 0 3% 0; }

.quiz-progress li:first-child {  width:100%; float:left; padding:20px; margin:0  0 3% 0; }

.class-fail { background:rgba(255,0,0,0.5); border-color:#ff0000; }
.class-pass { background:rgba(20,150,50,0.5); border-color:#149632; }


.information-btn { list-style:none; padding:0; margin:0;  }
.information-btn li { display:block; line-height:40px; float: left; margin: 0 15px 0 0;  text-align:left; font-size:12px; }
.information-btn li .qbtn { height:24px; width:24px; border-radius:50px; -moz-border-radius:50px; -webkit-border-radius:50px;  display:block; margin:7px 5px 0 0px  !important; float: left; }

.print-view td { font-size:16px !important; } 

.commonn-footer { padding:20px; background:#fff; display:block; text-align:center; }


.canvas-chart .canvasjs-chart-credit { display:none !important; }
.edit-user1 { width:60%; margin:0px auto; }





.inp-con { height: 20px;width: 20px; top: 4px; display: inline-block; position: relative;padding-left: 0px; margin:0 10px; cursor: pointer; font-size: 22px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.inp-con input {position: absolute;opacity: 0;cursor: pointer; z-index: 1; height: 20px;width: 20px;}
.checkmark { position: absolute;top: 0;left: 0;height: 20px;width: 20px;background-color: #eee;border-radius: 50%;border:1px solid #dadada;}
.inp-con:hover input ~ .checkmark { background-color: #ccc;}
.inp-con input:checked ~ .checkmark {  background-color: #2196F3;border-color:#2196F3;}
.checkmark:after {content: "";position: absolute;}
.inp-con input:checked ~ .checkmark:after {display: block;}
.inp-con .checkmark:after {top: 5px;left: 5px;width: 8px;height: 8px;border-radius: 50%;background: white;}




.preloader-defalt { position: fixed; background: rgba(0,0,0,0.6); width: 100%; height: 100%; top: 0; left: 0; z-index: 999; }

.loader {
  border: 10px solid #fff;
    border-radius: 50%;
    border-top: 10px solid blue;
    border-bottom: 10px solid blue;
    width: 80px;
    height: 80px;
    margin: 200px auto 0;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

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

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.important-headings {  }
.important-headings h4 { font-size: 14px;  }
.important-headings ol { margin: 10px 0 0 0px; padding: 0 0 0 10px;  }
                .important-headings ol li { font-size: 12px; line-height: 20px; }


.header-login { position: fixed; z-index: 1;width: 100%;  }
.header-nav { margin: 0; padding:0 ; float: right; }
.header-nav li { display: block; }
.header-nav li a { display: block; padding: 15px 20px; color: #fff; font-size: 16px; text-transform: uppercase; }



.winner-header  { position: fixed; z-index: 1;width: 100%; background: #fff; padding: 10px; top: 0 }
.winner-nav { margin: 0; padding:0 ; float: right; }
.winner-nav li { display: block; }
.winner-nav li a { display: block; padding: 10px 20px; color: #212121; font-size: 14px; text-transform: uppercase; }
.winner-logo { float:left; }
.winner-logo img { float:left; width: 120px; }



.winner-list { margin: 100px 0 0px 0; }
.winner-in  { background: #fff; padding: 20px; text-align: center; display: inline-block; width: 100%; margin: 0 0 30px 0; min-height: 310px; }
.winner-in strong { font-size: 18px; padding: 0 0 20px 0; }

.winner-in ul  { list-style: none; padding: 0; margin: 0; }


.winner-in ul li { width: 50%; float: left; list-style: none; padding: 20px 0 0 0; }
.winner-in ul li img { width: 40px; }
.winner-in ul li:first-child { width: 100%; flex: none; }
.winner-in ul li:first-child img { width: 70px;  }

.winner-in ul li span { display: block; font-size: 16px; padding: 10px 0 0 0; }


.winners-header { display: block; padding: 0 0 30px 0; text-align: center; }
.winners-header h2 { display: block; font-size: 30px; }




.winners-table { background: #fff; padding: 20px; margin: 0 0 2px 0; }
.winners-table h4 { margin: 0 0 10px 0; padding: 0;  }
.winners-table table { width: 100%; }

.winners-table table th { background: #ccc; border: 1px solid #ccc; padding: 5px; }

.winners-table table td { border: 1px solid #ccc; padding: 5px; }
.winners-table table tr:nth-child(2) td { background: #fafafa;}
.winners-table table tr:nth-child(3) td { background: #fbfbfb; }
.winners-table table tr:nth-child(4) td { background: #fcfcfc; }


@media (min-width:320px) and (max-width:767px) {

.home-login { background:url(../images/2nd-bg.jpg) no-repeat fixed; background-size: cover; }
.tob-h-btn { float: none; width: 100%; background: #fafafa; margin: 0 0 10px 0; }
.tob-h-btn li { float:right; }
.tob-h-btn li:first-child { float:left; }
.edit-user1 { width:100%; margin:0px auto; }
.outer-container .col-md-12 { overflow:scroll; }
.outer-container .col-md-12 .table { min-width:700px; }

}


@media print {
 .btn-warning {display: none;  }
}


.form-control{box-shadow: none;height:42px;color: #333;}

.primary-link{color: var(--main-color);text-decoration: underline;}
.primary-button{line-height: 30px;}
.primary-button, .grey-botton, .button2, .button1,.white-button{border-radius: 5px; background-color: var(--main-color); border: none; color: #FFFFFF; width: auto;cursor: pointer; font-weight: 400; display: inline-block; justify-content: center; align-items: center;padding: 5px 30px;height: 40px;line-height: 30px;}
.primary-button:hover{color: #ffffff;}
.primary-button a {color: #ffffff;}
.primary-button span {cursor: pointer;display: inline-block; position: relative; transition: 0.5s;}
.primary-button span:after {content: '\00bb'; position: absolute; opacity: 0; top: 0; right: -20px; transition: 0.5s;}
.primary-button:hover span {padding-right: 25px;}
.primary-button:hover span:after {opacity: 1;right: 0;}

.primary-link{color: var(--main-color); text-decoration: underline;}

.primary-button-border{border-radius: 5px; border: 1px solid var(--main-color); color: var(--main-color); width: 170px;cursor: pointer;font-weight: 400; display: flex; justify-content: center; align-items: center;height: 40px;background-color:#ffffff;}
.primary-button-border:hover{color: #ffffff;background-color:var(--main-color);}

.primary-button-noborder{border-radius: 0 0 5px 5px; color: var(--main-color); width: 100%;cursor: pointer;font-weight: 400; display: flex; justify-content: center; align-items: center;height: 40px;background-color:#ffffff;}
.primary-button-noborder:hover{color: #ffffff;background-color:var(--main-color);}

.primary-button-border span {cursor: pointer;display: inline-block; position: relative; transition: 0.5s;}
.primary-button-border span:after {content: '\00bb'; position: absolute; opacity: 0; top: 0; right: -20px; transition: 0.5s;}
.primary-button-border:hover span {padding-right: 25px;}
.primary-button-border:hover span:after {opacity: 1;right: 0;}

.sec-button{background-color: var(--sec-color);color:#fff;padding: var(--btn-padding);border-radius: 5px;}
.sec-button:hover{background-color: #000000; color:#ffffff;}

.sec-button-sml, .edit-reminder-tab .all-reminders li a.sec-button-sml{background-color: var(--sec-color);color:#fff;padding: 5px 20px;border-radius: 5px;}
.sec-button-sml:hover, .edit-reminder-tab .all-reminders li a.sec-button-sml:hover{background-color: var(--main-color); color:#ffffff;}

.grey-botton, .button1{background-color:rgba(3,3,3,0.5); color: #ffffff !important;}
.grey-botton:hover, .button1{background-color:rgba(3,3,3,0.7);transition: all 0.5s ease;color: #fff;}

.white-button{background-color:#ffffff; color: #333333 !important;}


.panel{box-shadow: 0 8px 16px 0 rgb(162 169 204 / 24%);}

.form-group label{font-weight: normal; text-transform: uppercase; font-size: 11px;}
tr th{background-color: #13aae6;}
tr td img{width: 16px;}



.import-panel{margin-top: 30px;font-size: 12px;}
.import-panel form h4{margin-left: 15px;}
.import-panel form > div{margin-bottom: 10px;}
.import-panel .panel-body{padding: 5px 15px 0;}
.import-panel a{font-size: 12px;line-height: 37px; text-decoration: underline;}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{padding: 5px;}

.buttons-bottom{border:1px solid #dadada;}
.canvasjs-chart-credit{display: none;}

.attempt-alerts{display:flex;}
.attempt-alerts>div{font-size: 20px;display: flex; align-items: center;}
.attempt-alerts i{font-size:24px;margin-right:8px;}

.quiz-stage{margin-top:20px;width:80%;}
.quiz-stage .num_score{font-size:24px;margin-bottom:10px;}
.quiz-stage .progress{margin: 0px; background-color: #e7ebfb; border-radius: 50px; height: 16px;box-shadow: none;line-height: 16px;text-align: center;}
.quiz-stage .progress span{color: #333333;}
.quiz-stage .progress-bar{background-color: #8FCC33; color: #ffffff; text-align: center; line-height: 16px; text-align: center;}  

.quiz-info-panel{padding: 15px;border-radius: 5px;}
.quiz-info-panel ul{margin: 0; padding: 10px 10px 0 10px;}
.quiz-info-panel p{font-size: 24px;}
.quiz-result-show{display: flex;margin-top: 10px; background: #ffffff; color: #333333;}
.quiz-result-show ul{margin: 0; padding: 0;}
.quiz-result-show{display: flex;}
.quiz-result-show>div{width: 48%; border-right: 1px dashed #dadada;}
.quiz-result-show>div:last-child{border: none;padding-left: 20px;}
.result-radio{display: flex;align-items: flex-start;}
.div-view-in .op .result-radio input{margin-top: 8px;}
.print-btn{display: flex; justify-content: flex-end;}
.print-btn a:nth-child(2){margin: 0 10px;}
/*.print-btn .printbtn{margin-left: 10px;}*/

.quiz-list{background-color: #ffffff;
    padding: 0;
    text-align: left;
    border-radius: 5px;
    position: relative;
    box-shadow: 0 14px 28px 0 rgb(99 118 129 / 50%);
    margin-bottom: 20px;
}

.quiz-list ul {padding: 20px;}
.quiz-list ul li{display: flex; justify-content: space-between;padding: 10px; border-bottom: 1px dashed #dadada;position: relative;align-items: center;}
.quiz-list ul li span{text-align: right;}
.quiz-list ul li label{font-size: 16px;font-weight: normal;}
.quiz-list ul li .q-update {display: block; background-color: #ffffff;padding: 0 10px;border-radius: 50px; font-size: 11px;margin-top: 0px;color: rgba(0,0,0,0.5);}
.quiz-list ul li .q-update i{width: 6px;height: 6px;background: red;border-radius: 50%; display: inline-block; line-height: 4px; margin-right: 4px;}
.result-alert .alert{padding:2px 10px; margin:0;}
.question_container_sample_url p{font-size:16px;}
.question_container_sample_url p a{font-size:16px; color:#31708f;}
.has-table .dataTables_filter{margin-bottom: 10px;}
.has-table .data-table-des td{border-left:1px solid #dadada; }
.has-table .data-table-des th, .has-table .data-table-des td{font-size: 12px;padding: 5px;}
.has-table .data-table-des td:last-child{border-right:1px solid #dadada; }
.has-table .form-fields{border:1px solid #dadada; padding: 5px;width: 100%;border-radius: 5px;}
.has-table .grey-botton{height: 30px; padding: 0 15px; font-size: 12px;}

.quiz-list ul li:last-child:before, .quiz-list ul li:nth-last-child(2):before{
    position: absolute;
    content: "New Quiz";
    top: 12px;
    left: 32px;
    background: red;
    color: #ffffff;
    padding: 0 4px;
    border-radius: 5px;
    font-size: 10px;
    height: 16px;
    line-height: 15px;
} 
.q-update{display: block; background-color: #F7CCD0; padding: 0 10px;border-radius: 50px;font-size: 12px;}