.facebook-btn{
  background-color:unset;
  border: 0px;
  background:url('../images/fb_icon.png') center no-repeat; background-size: auto 27px;
  width: 34px;
  height: 29px;  
}
.pl-1.col img[alt=Google] {height: 29px;}

.pink-pie-bg{
  background-image: url('../images/login_background.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.flower-bg{
  background-image: url('../images/register_background.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

img.logo{
  padding: 3px;
  border-radius: 3px;
  height: 30px;
  margin-top: -20px; outline: 0;
}

.bg-mycolor{
  /*background-color: #e0a019;*/
}

.text-disabled{
  color: #d1cece;
}

body {background: #ededee url(../images/Get-Started-Bg.png) center bottom no-repeat; background-size: 100% auto;}
.heading.mb-4 {font-size: 35px; color: #000; font-weight: 700;}
.card-box {box-shadow: none !important; border: 0; border-radius: 22px !important;}
.card-box .my-2 {font-size: 24px; margin-bottom: 24px !important;}
.card-box .card-footer {border: 0; background: none;}
.card-box button.active, .card-box a.btn.active {background: #000 !important; box-shadow: 1px 3px #c1baba;}
.card-box {padding-bottom: 3rem !important;}

.logoheader.logotxt {padding-top: 2rem !important;}
.logoheader.logotxt span.icon::after {content: ''; display: block; width: 40px; height: 40px; background-size: 60% 60% !important; border-radius: 50%;}
.logoheader.logotxt span.sign-out::after {background: #fff url(../images/Logout-Icon.png) center no-repeat;}
.logoheader.logotxt span.list-ul::after {background: #fff url(../images/Build-Scorm-Icon.png) center no-repeat;}
.logoheader.logotxt span.shopping-cart::after {background: #fff url(../images/Shopping-Cart-Icon.png) center no-repeat;}
.logoheader.logotxt span.book::after {background: #fff url(../images/Saved-List-Icon.png) center no-repeat;}
.logoheader.logotxt span.key::after {background: #fff url(../images/Change-Password-Icon.png) center no-repeat;}

.setPropPopHeader {padding: 3rem 2rem 1rem; border: 0; color: #000;}
.setPropPopHeader .close {opacity: 1; position: absolute; top: 2rem; right: 3rem; padding: 0; width: 43px; height: 43px; background: url(../images/Minus.png) center no-repeat; background-size: 100% auto;}
/*.setPropPopHeader .close::before {content: url(../images/Minus.png); font-size: 64px; color: #000; line-height: 32px;}*/
.setPropPopHeader .close span {display: none;}
.setPropPopHeader .modal-title {color: #000; font-weight: 700; font-size: 32px; /*max-width: 274px;*/}
.setPropPopForm .modal-body {padding: 1rem 2rem 0;}
.setPropPopForm .modal-body input[type=text] {border: 0; padding: 0; height: 42px; border-bottom: 2px solid #000; border-radius: 0;}
.setPropPopForm .modal-body .col {line-height: 42px;}
.setPropPopForm .uploader {padding: 32px 20px; background: #ededed; cursor: pointer;}
.uploader .uploader-text {color: #5c597c; font-style: italic; line-height: normal; max-width: 100%; cursor: pointer;}
.setPropPopForm .modal-footer {border: 0; display: block; text-align: center; padding: 0 0 2rem;}
.setPropPopForm .modal-footer button.btn-primary {display: inline-block; float: none !important;}
.setPropPopForm .modal-body .col:nth-child(1) {padding: 10px 4px 0 0; line-height: normal;}

.modal-content {border-radius: 20px;}

.setPropPopForm button.active, .setPropPopForm a.btn.active {background: #000 !important; box-shadow: 1px 3px #c1baba;}

/*for overflow */
body {color: #000;}
body #root {overflow: auto;}

.uploadPPT {height: 100%; background: #fff; border-radius: 20px; padding: 3rem;}
.uploadPPT .row {display: block; margin-bottom: 32px;}
.uploadPPT .text-center {width: 100%; max-width: 100%;}
.uploadPPT .uploader {padding: 32px 20px; background: #ededed; font-weight: bold; color: #000; cursor: pointer;}
.uploadPPT .uploader .uploader-text {max-width: 100%; cursor: pointer; cursor: pointer;}
.uploadPPT .uploader .uploader-text::before {content: ''; display: block; width: 50px; height: 50px; background: url(../images/UploadIcon.png) center no-repeat; background-size: auto 100%; margin: 0 auto 12px; cursor: pointer;}

.card-box.blk {color: #000;}
.ylo {color: #e0a019;}

.text-center.card-body img.clickable, .slides img.remove {height: 34px; width: 34px; padding: 0;}
.card-body ol li img {height: 22px; width: auto;}
.card-body .slides {background: #fff; position: relative; cursor: pointer;}
.card-body .slides img.remove {right: 1rem; left: auto;}
.card-body .slides img {border: 0;}
.slides img.remove {}
.p-4.text-center.card-body {background: #f1f1f1;}

.uploadVideo {height: 100%; background: #fff; border-radius: 20px; padding: 3rem;}
.uploadVideo > .row {display: block; margin-bottom: 32px;}
.uploadVideo .text-center {width: 100%; max-width: 100%;}
.uploadVideo .uploader {padding: 32px 20px; background: #ededed; font-weight: bold; color: #000; cursor: pointer;}
.uploadVideo .uploader .uploader-text {max-width: 100%; cursor: pointer}
.uploadVideo .uploader .uploader-text::before {content: ''; display: block; width: 50px; height: 50px; background: url(../images/UploadIcon.png) center no-repeat; background-size: auto 100%; margin: 0 auto 12px;  cursor: pointer;}

.smimg {text-align: left;}
.smimg img {height: 32px;}

.card {border: 0; background: none;}
.stepHead {padding: 32px 0;}
.stepHead h1 {font-size: 35px; color: #000; font-weight: 700;}
.stepHead h1 span {font-size: 30px; color: #58595b; display: block;}
.stepHead .steps {display: block; text-align: center; font-size: 24px; font-weight: 500; background: #d1d3d4; border-radius: 30px; overflow: hidden; margin: 32px 0; color: #fff;}
.stepHead .steps ul {display: block; margin: 0; padding: 0;}
.stepHead .steps ul::after, .stepHead .steps ul::before {content: ''; display: block; clear: both;}
.stepHead .steps ul li {display: inline-block; width: calc(33.33%); float: left; padding: 12px 12px; cursor: pointer;}
.stepHead .steps ul li.active {border-radius: 30px; background: #000;}

.instructions {padding: 32px 8%; color: #000;}
.instructions h3 {font-weight: 700; margin-bottom: 32px !important; font-size: 17px;}
.instructions ol {padding-left: 20px;}
.draft h3{font-weight: 700; margin-bottom: 10px !important; font-size: 17px; margin-left:20%;}

.changeCourseName .alert-warning {padding: 0; text-align: center; background: #000; color: #fff; border-radius: 30px; line-height: 52px; font-size: 26px; font-weight: 700;}
.changeCourseName .alert-warning span {display: inline-block; vertical-align: middle;}
.changeCourseName .alert-warning::after {content: ''; display: block; clear: both;}
.changeCourseName .alert-warning .clickable {float: right; font-size: 28px; line-height: 60px; width: 60px; text-align: center; display: inline-block; background: #636466; color: #fff; border-radius: 30px;}

.slInstruction {padding: 0 2rem 32px;}
.slInstruction .row {margin: 0; background: #eeefef; padding: 8px; display: block; border-radius: 30px;}
.slInstruction .row .col-sm-1 {display: inline-block; padding: 4px; text-align: center; vertical-align: middle; width: 49px; background: #d5d6d9; border-radius: 25px;}
.slInstruction .row .col-sm-1 img {margin: 8px 0;}
.slInstruction .row .col {display: inline-block; padding: 4px; vertical-align: middle; width: calc(100% - 49px - 8px - 20px); margin-left: 20px; text-align: left; line-height: normal; font-weight: 500; }
.slInstruction .row:hover, .slInstruction .row:hover .col-sm-1 {background: #000; color: #fff;}
.slCreationBtn .btn { display: inline-block; padding: 4px; text-align: center; vertical-align: middle; width: 51px; background: #000; border-radius: 25px; border: 0;}
.slCreationBtn .btn img, .slCreationBtn .btn:hover img {padding: 0; margin: 8px 0; background: none;}
.slCreationBtn.modal-footer {border: 0;}

.slInsPop {padding: 3rem 2rem 1rem; border: 0; color: #000;}
.slInsPop .close {opacity: 1; position: absolute; top: 0; right: 20px; margin:0; padding: 0; width: 43px; height: 43px; background: url(../images/Minus.png) center no-repeat; background-size: 100% auto;}
/*.setPropPopHeader .close::before {content: url(../images/Minus.png); font-size: 64px; color: #000; line-height: 32px;}*/
.slInsPop .close span {display: none;}
.slInsPop .modal-title {color: #000; font-weight: 700; font-size: 28px; max-width: 274px;}
.slInsPop .modal-body {padding: 1rem 2rem 0;}

.addQuestion .quesLabel {align-items: flex-start; border: 0; padding: 0; background: none; color: #58595b; font-size: 14px; font-weight: 700; padding-top: 2px;}
.addQuestion .form-control {border: 0; border-bottom: 1px solid #000; padding: 0; color: #000; border-radius: 0; outline: 0;box-shadow:none;}
.addQuestion input.form-control {height: 28px;}
.addQuestion textarea.form-control {height: 80px; padding-top: 2px;}

.addQuestion .type {background: #ededed; border-radius: 12px;}
.addQuestion .type .quesLabel {padding-left: 32px;}
.addQuestion .type .form-control {border: 0; background: #dddddd; padding: 0 20px; border-radius: 12px; height: 26px; font-size: 15px;}
.addQuestion .mb-3 {margin-bottom: 2rem !important;}
.addQuestion .alert {background: #e0a019; font-weight: 700; font-size: 18px; color: #fff; border-radius: 25px; border: 0; margin-bottom: 2rem;}
.addQuestion .queans .input-group {display: flex; background: #ededed; border-radius: 24px; padding: 8px;}

.addMoreOpt .btn { font-size: 40px; line-height: 28px; width: 36px; background: #41ad49; border-radius: 50%; text-align: center; padding: 0; height: auto; border: 0; padding-bottom: 7px; font-weight: 300;}

.mb80 {margin-bottom: 80px !important;}

.addQuestion .queans .input-group .btn-danger {font-size: 20px; line-height: 36px; width: 36px; background: #e0a019; border-radius: 50%; text-align: center; padding: 0; height: auto; border: 0; font-weight: 300;}

.scromlist .table td, .scromlist .table th {border: 0; padding: .50rem;}
.scromlist .table th .clickable {color: #000 !important;}
.scromlist .table .badge-dark {padding: 0; line-height: 28px; min-width: 28px; border-radius: 14px; background: #adaeb2; color: #000; font-weight: 400;}
.scromlist .table .actions .clickable {padding: 0; display: inline-block; height: 28px; width: 28px; border-radius: 14px; background: #9e9fa2; color: #000; font-weight: 400; background-size: 22px auto !important; margin: 0 2px;}
.scromlist .table .actions .clickable:hover {background-color: #000 !important;}
.scromlist .table .actions .edit {background: #9e9fa2 url(../images/edit-sm.png) center no-repeat;}
.scromlist .table .actions .clone {background: #9e9fa2 url(../images/clone-sm.png) center no-repeat;}
.scromlist .table .actions .download {background: #9e9fa2 url(../images/download-sm.png) center no-repeat;}
.scromlist .table .actions .delete {background: #9e9fa2 url(../images/delete.png) center no-repeat;}

.list-draft {float:right;}
.heading.mb-4 a {color: #000;}

.scromlist .instructions {font-size: 16px; color: #000; font-weight: 700;}
.scromlist .instructions li {margin-bottom: 8px;}
.scromlist .instructions span {font-weight: 400;}
.scromlist .instructions i {display: inline-block; vertical-align: middle; height: 28px; width: 28px; border-radius: 14px; background: #000; color: #000; font-weight: 400; background-size: 22px auto !important; margin: 0 2px;}
.scromlist .instructions i.edit {background: #000 url(../images/edit-sm.png) center no-repeat;}
.scromlist .instructions i.clone {background: #000 url(../images/clone-sm.png) center no-repeat;}
.scromlist .instructions i.download {background: #000 url(../images/download-sm.png) center no-repeat;}

.popcotentpad {padding: 1rem 2rem;}
.popcotentpad .col-sm-12 {padding: 0;}

.cusTempListWrap .listtype {margin-bottom: 32px;}
.cusTempListWrap .listtype .badge {background: #a7a7a7; padding: 12px 20px !important; border-radius: 20px; color: #fff; font-size: 16px; font-weight: 500; cursor: pointer;}
.cusTempListWrap .listtype .badge.badge-dark {background: #000;}
.cusTempListWrap h3 {font-size: 28px; color: #000; margin-bottom: 32px; font-weight: 700;}

.insList {font-size: 16px; color: #000; margin-bottom: 32px;}
.insList li {margin-bottom: 8px;}
.insList span {font-weight: 400;}

.custempage .popcotentpad {padding: 1rem 0;}
.custempage h3 {color: #000; font-weight: 700;}
.custempage p {color: #000;}

.backtoprev, .backtoprev:hover {color: #000;}

.modal-open .modal ~ .modal-backdrop.show {z-index: 1060;}
.modal-open .modal ~ .modal-backdrop.show ~ .modal.show {z-index: 1070;}
.modal-footer {border: 0; text-align: center; display: block;}

.videoedit {padding: 1rem 2rem;}
.videoedit h4, .videoedit .m-3, .videoedit .mx-md-2 {margin: 0 !important;}
.videoedit h4.m-3 {margin-bottom: 20px !important;}
.videoedit .col-sm-11 {padding: 0;}
.videoedit .col-sm-1 {padding: 0;}
.videoedit .form-control {margin-bottom: 20px; display: block; border: 0; padding: 0; border-bottom: 1px solid #000; border-radius: 0;}
.videoedit video {background: #ddd;}
.videoedit hr {border: 0;}
.videoedit .cta {text-align: center; margin-bottom: 20px;}
.videoedit .cta .btn-success {text-align: center; background: #e0a019; line-height: 36px; border-radius: 18px; padding: 0; min-width: 120px; border: 0;}
.videoedit .mt-2 {margin-bottom: 20px;}

.videoedit .upload-icon {display: inline-block; width: 40px; height: 40px; border-radius: 50%; background: url(../images/UploadIcon.png) center no-repeat; background-size: 100% auto; margin-top: 4px;}
.videoedit .left-col {padding: 0; padding-right: 4px; text-align: left;}
.videoedit .youtube-icon {display: inline-block; width: 40px; height: 40px; border-radius: 50%; background: url(../images/youtube-red.png) center no-repeat; background-size: 100% auto; margin-top: 4px;}

.videoedit .selectbtn .btn {background: #a7a7a7; padding: 6px 20px !important; border-radius: 20px; color: #fff; font-size: 16px; font-weight: 500; cursor: pointer; margin: 0 !important; margin-right: 8px !important;}
.videoedit .selectbtn .btn.active {background: #000 !important; box-shadow: 1px 3px #c1baba;}
.videoedit .selectbtn .btn.active:focus {box-shadow: 1px 3px #c1baba;}
.videoedit .uploader {padding: 32px 20px; background: #ededed; font-weight: bold; color: #000; cursor: pointer;}
.videoedit .uploader .uploader-text {max-width: 400px; cursor: pointer;}
.videoedit .uploader .uploader-text::before {content: ''; display: block; width: 50px; height: 50px; background: url(../images/UploadIcon.png) center no-repeat; background-size: auto 100%; margin: 0 auto 12px; cursor: pointer;}
.videoedit .selectbtn .upload-icon {width: 20px; height: 20px; margin: 0; vertical-align: middle;}
.videoedit .selectbtn .youtube-icon {width: 20px; height: 20px; margin: 0; vertical-align: middle;}

.photoedit .row {padding: 0 !important; margin: 0 0 20px !important;}
.photoedit .row .col-sm-12, .photoedit .row .col-sm-11, .photoedit .row .col-lg-12 {padding: 0;}
.photoedit .row .lefticon {padding: 0; padding-right: 8px;}
.photoedit .img-icon {display: inline-block; width: 40px; height: 40px; border-radius: 50%; background: url(../images/UploadIcon.png) center no-repeat; background-size: 100% auto; margin-top: 4px;}
.photoedit .h-100 {min-height: auto !important; height: auto !important;}
.photoedit .uploader {margin: 0; height: auto; cursor: pointer;}
.photoedit .form-control {margin-bottom: 20px; display: block; border: 0; padding: 0; border-bottom: 1px solid #000; border-radius: 0;}

.uploader {padding: 32px 20px; background: #ededed; font-weight: bold; color: #000; height: auto; cursor: pointer;}
.uploader .uploader-text {max-width: 400px; color: #000; cursor: pointer;}
.uploader .uploader-text::before {content: ''; display: block; width: 50px; height: 50px; background: url(../images/UploadIcon.png) center no-repeat; background-size: auto 100%; margin: 0 auto 12px;  cursor: pointer;}

i.icon {display: inline-block; width: 20px; height: 20px; vertical-align: middle; background-size: 100% auto !important;}
i.icon.img {background: url(../images/image-sm.png) center no-repeat;}
i.icon.aud {background: url(../images/speaker-sm.png) center no-repeat;}

.photoedit .cta {text-align: center; margin-bottom: 20px;}
.photoedit .cta .btn-success {text-align: center; background: #e0a019; line-height: 36px; border-radius: 18px; padding: 0; min-width: 120px; border: 0;}
.photoedit .mt-2 {margin-bottom: 20px;}

.pager .fa {margin-left: 5px; font-size: 20px;}

.orderList .table td, .orderList .table th {border: 0; padding: .50rem;}
.orderList .table th .clickable {color: #000 !important;}
.orderList .table .badge-dark {padding: 0; line-height: 28px; min-width: 28px; border-radius: 14px; background: #dddddd; color: #000; font-weight: 400;}
.orderList .table .actions .clickable {padding: 0; display: inline-block; height: 28px; width: 28px; border-radius: 14px; background: #dddddd; color: #000; font-weight: 400; background-size: 22px auto !important; margin: 0 2px;}
.orderList .table .actions .clickable:hover {background-color: #000 !important;}

.correctness  {padding: 8px;  color: #41ad49; border-radius: 24px;}


.slides-progress .progress-bar.bg-warning {color : black;}
.correctness {padding: 8px;  color: #41ad49; border-radius: 24px;}

.progress-bar.bg-warning {color : black;}
.addQuestion label {margin: 0;}
.addQuestion .input-group-text {border: 0; background: none; padding: 0; padding-right: 12px;}

.addQuestion .input-group-text input[type=checkbox], .addQuestion .input-group-text input[type=radio] {display: none;}
.addQuestion .input-group-text input[type=checkbox] ~ label, .addQuestion .input-group-text input[type=radio] ~ label {display: block; width: 36px; height: 36px; background: #d5d7d8; border-radius: 50%;}
.addQuestion .input-group-text input[type=checkbox]:checked ~ label, .addQuestion .input-group-text input[type=radio]:checked ~ label {background: #d5d7d8 url(../images/Tick.png) center no-repeat; background-size: 60% auto;}

.addQuestion .queans input.form-control {height: 36px; background: none; border: 0; font-size: 14px;}
.addQuestion .correctness input.form-control {height: 36px; background: none; border: 0; color: #4cad5c; font-size: 14px;}
.addQuestion .correctness input.form-control::placeholder {color: #454545;}
.addQuestion .correctness input.form-control::-webkit-input-placeholder { /* Chrome/Opera/Safari */color: #4cad5c;}
.addQuestion .correctness input.form-control::-moz-placeholder { /* Firefox 19+ */color: #4cad5c;}
.addQuestion .correctness input.form-control:-ms-input-placeholder { /* IE 10+ */color: #4cad5c;}
.addQuestion .correctness input.form-control:-moz-placeholder { /* Firefox 18- */color: #4cad5c;}

.addQuestion .col-sm-2 .correctness {margin-top:6px !important; display: block; font-weight: 700;}

.addQuestion .correctness .input-group-text input[type=checkbox] ~ label {background: #fff; border: 1px solid rgb(96, 100, 96);}
.addQuestion .correctness .input-group-text input[type=checkbox]:checked ~ label {background: #fff url(../images/Tick.png) center no-repeat; background-size: 60% auto;}

.logoContainer.mb-3 .scormLogo {max-width: 100%; width: auto; max-height: 120px; border: 0;}
.logoContainer.mb-3 .scormRemove {top: -4px;}

.logoheader .topNav {display: inline-block; vertical-align: middle; width: calc(100% - 100px); text-align: right;}
.logoheader .topNav ul {display: block;}
.logoheader .topNav ul li {display: inline-block; position: relative; cursor: pointer; text-align: left; margin-left: 20px;}
.logoheader .topNav ul li:first-child {margin-left: 0;}
.logoheader .topNav ul li .txt {display: block; width: 40px; height: 40px; padding: 0 8px; border-radius: 30px; font-size: 13px; background: #e9d4aa; color: #fff; line-height: 40px; overflow: hidden; transition: all ease-in-out .2s;}
.logoheader .topNav ul li .icon {position: absolute; top: 0; left: 0;}
.logoheader .topNav ul li:hover .txt {width: 180px; padding-left: 48px;}
.logoheader .topNav ul li.user .icon {display:inline-block; width: 40px; height: 40px; background: url(../images/profil.png) center no-repeat; background-size: 100% 100%; position: static;}
.logoheader .topNav ul li.user .user-name {font-size: 12px;}

.logoheader.logotxt .topNav ul li:hover span.sign-out::after {background: #e0a019 url(../images/Logout-Icon-wh.png) center no-repeat;}
.logoheader.logotxt .topNav ul li:hover span.list-ul::after {background: #e0a019 url(../images/Build-Scorm-Icon-wh.png) center no-repeat;}
.logoheader.logotxt .topNav ul li:hover span.shopping-cart::after {background: #e0a019 url(../images/Shopping-Cart-Icon-wh.png) center no-repeat;}
.logoheader.logotxt .topNav ul li:hover span.book::after {background: #e0a019 url(../images/Saved-List-Icon-wh.png) center no-repeat;}
.logoheader.logotxt .topNav ul li:hover span.key::after {background: #e0a019 url(../images/Change-Password-Icon-wh.png) center no-repeat;}

.publishcta button.px-4 {margin: 0 8px 12px;}
.ddacNoCursor {cursor: default !important;}
.logoheader .topNav ul li.user .ddac {display: none; box-shadow: 0 0 2px rgb(0,0,0,.2); background: #fff;
  position: absolute;
  top: 100%;
  width: 100%;
  min-width: 215px;
  right: -20px;
  border-radius: 6px;
  padding-top: 13px;}
.logoheader .topNav ul li.user.active .ddac {display: block; z-index: 1000;}
.logoheader .topNav ul li.user .ddac .logout {
  font-size: 13px;
  line-height: normal;
  display: block;
  padding: 4px 12px 10px!important;
}
.logoheader .topNav ul li.user .ddac::before {
  content: '';
  display: block;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid white;
  width: 0;
  height: 0;
  position: absolute;
  left: 50%;
  bottom: calc(100% - 1px);
  transform: translateX(-50%);
}
.menu-pkg{ font-size: 13px; line-height: normal;  padding: 4px 12px !important; }
.menu-pkg .label { color: #7c7676;; font-weight: bold;}
.menu-pkg .content{ color: #e0a019;}
.td-hr{border-bottom: 1px solid #d9d1d1;}

.msg-modal-ul{list-style-type: none;}
.msg-modal-ul li{margin-left: -37px; margin-right: 10px;}
.msg-modal-text{padding-bottom: 10px; font-size: 13px;}
.msg-modal-title{font-size: 19px; font-weight: bolder;}
.regBoxTest {
  color: #000;
  background-color: #ffbd59db;
  padding: 25px;
  border-radius: 20px;
  box-shadow: 10px 10px 10px 10px #00000033;
  margin: 30px 30px 0px 30px;
}
@media only screen and (max-width: 1279px) {
    .stepHead h1 {font-size: 32px;}
    .stepHead h1 span {font-size: 28px;}
    .container {max-width: 100%;}
    .videoedit .left-col, .videoedit .col-sm-11 {min-width: 100%;}
    .stepHead .steps ul li {font-size: 17px;}
    .regBoxTest { margin: 20px 10px 0px 10px; }
}
@media only screen and (max-width: 991px) {
    .cusTempListWrap .listtype .badge {font-size: 13px; padding: 8px 12px !important; margin-bottom: 4px;}
    .cusTempListWrap .col-sm-3 {padding: 0;}
    .uploadImageVideopage .p-5, .uploadImageVideopage .uploadVideo {padding: 1rem !important; margin-bottom: 20px;}
    .uploadImageVideopage h3 {font-size: 22px;}
    .uploadPPT {margin-bottom: 20px;}

    .modal-content .row {margin: 0;}
}
@media only screen and (max-width: 979px) {
    .heading.mb-4 {font-size: 32px;}
    .instructions h3 {font-size: 17px;}
    .changeCourseName .alert-warning {line-height: 44px;}
    .changeCourseName .alert-warning img {height: 34px; width: auto;}
    .changeCourseName .alert-warning span {font-size: 22px;}
    .changeCourseName .alert-warning .clickable {width: 50px; height: 50px; line-height: 50px;}
}
@media only screen and (max-width: 768px) {
    .home3step {margin-bottom: 32px;}
    .home3step .row {display: block;}
    .home3step .p-5 {padding: 2rem 2rem 0 !important;}
    .home3step .card-box {padding-bottom: 2rem !important; display: block; min-height: 0; width: 100%;}
    .card-body {margin-bottom: 32px;}
    .uploadImageVideopage h3 {margin-bottom: 1rem !important;}

    .setPropPopHeader .modal-title {font-size: 24px;}
}
@media only screen and (max-width: 680px) {
    .heading.mb-4 {font-size: 26px; line-height: normal;}
    .logoheader .topNav ul li {margin-left: 8px;}
    .logoheader.logotxt span.icon::after {width: 32px; height: 32px;}
    .logoheader .topNav ul li .txt {height: 32px; width: 32px;}
    .logoheader .topNav ul li:hover .txt {width: 32px; padding-left: 0;}
    .logoheader.logotxt {padding-top: 1rem !important;}
    .stepHead h1 {font-size: 24px;}
    .stepHead h1 span {font-size: 22px;}
    .stepHead .steps {background: none; padding: 12px 0; margin: 0;}
    .stepHead .steps ul li {background: #d1d3d4; margin-bottom: 8px; padding: 8px; font-size: 14px; border-radius: 17px; width: 100%;}
    .slInsPop .close {width: 28px; height: 22px; right: 2rem;}
    .slInsPop {padding: 2rem 1rem 1rem;}
    .videoedit, .popcotentpad {padding: 1rem;}
    .card-box {padding: 1rem !important;}
    .instructions {padding: 0;}
    .changeCourseName .alert-warning {line-height: 32px;}
    .changeCourseName .alert-warning img {height: 24px;}
    .changeCourseName .alert-warning span {font-size: 18px;}
    .changeCourseName .alert-warning .clickable { width: 40px; height: 40px; line-height: 40px;}
    .slInstruction {padding: 0 1rem 32px; font-size: 14px;}
    .slInstruction .row .col-sm-1 {width: 36px; height: 36px;}
    .slInstruction .row .col-sm-1 img {margin: 6px 0; width: 20px;}
    .slInstruction .row .col {margin-left: 4px; width: calc(100% - 20px - 8px - 20px);}
    .uploader .uploader-text {font-size: 14px; cursor: pointer;}
    progress {border-width: 2px !important; overflow: hidden;}
    .addQuestion .alert {font-size: 14px; padding: 8px;}
    .addQuestion .input-group-text input[type="checkbox"] ~ label, .addQuestion .input-group-text input[type="radio"] ~ label {width: 28px; height: 28px;}
    .addQuestion .queans input.form-control {height: 28px;}
    .addQuestion .queans .input-group .btn-danger {line-height: 28px; width: 28px;}
    .cusTempListWrap  .card-body {margin-bottom: 0;}
    .uploadImageVideopage.row {display: block;}
    .uploadImageVideopage .col {width: 100%; display: block;}
    .home3step .p-5 {padding: 1rem 1rem 0 !important;}
    .home3step .p-5 h3 {font-size: 20px;}
    .home3step .p-5 p {font-size: 15px;}

    .scromlist .table {display: block; width: 100%;}
    .scromlist .table tr {display: block; width: 100%; padding: 8px 0;}
    .scromlist .table tr:nth-child(1) {display: none;}
    .scromlist .table tr th, .scromlist .table tr td {display: block; text-align: left !important; padding: 2px;}
    .scromlist .table tr td::before {content: ''; display: inline-block; width: 200px; max-width: 50%; font-weight: bold;}
    .scromlist .table tr td:nth-child(1)::before {content: 'Sl.';}
    .scromlist .table tr td:nth-child(2)::before {content: 'Name';}
    .scromlist .table tr td:nth-child(3)::before {content: 'Slides';}
    .scromlist .table tr td:nth-child(4)::before {content: 'Created On';}
    .scromlist .table tr td:nth-child(5)::before {content: 'Published';}
    .scromlist .table tr td:nth-child(6)::before {content: 'Downloads';}
    .scromlist .table tr td:nth-child(7)::before {content: 'Action';}
    
    .instructions h3 {font-size: 16px;}
    .changeCourseName .alert-warning {font-size: 16px; line-height: 36px;}

    .instructions .head{font-size:17px;}
    .instructions {font-size: 14px;}
    .scromlist .table td, .scromlist .table th {font-size: 14px;}
}


.ftTnc {display: block; margin-bottom: 20px; text-align: center; margin-top:30px;}
.ftTnc ul {display: block;}
.ftTnc ul li {display: inline-block; margin: 0 12px;}
.ftTnc ul li a {color: inherit; text-decoration: none; font-size: 13px;}
.ftTnc ul li a:hover {text-decoration: underline;}



footer .copy {margin-left: 12px; margin-top: 4px; display: inline-block; line-height: 20px;}
footer .socialMedia {float: right; line-height: 20px; padding-right: 50px;}
footer .socialMedia ul {float: right;}
footer .socialMedia ul li {display: inline-block; margin-left: 8px; transition: all ease-in-out .2s; vertical-align: middle;}
footer .socialMedia ul li img {width: 20px;}
/*footer .socialMedia ul li:hover {transform: scale(1.2);}*/
footer .socialMedia ul li a {display: inline-block; text-decoration: none; font-size: 14px; color: inherit;}

@media only screen and (max-width: 680px) {
  img.logo {margin-top: 14px;}
  footer .socialMedia {padding-right: 0; width: 100%;}
  footer .socialMedia ul {float: none; display: block; padding: 0; text-align: center;}
  .ftTnc ul, .logoheader .topNav ul {padding: 0;}
}

.spCertificate {padding-bottom: 8px;}
.spCertificate .certificate, .spCertificate .copy {display: block;}
.spCertificate img {width:136px; height:auto;margin-left: 60px;}
@media only screen and (max-width: 680px) {
  .spCertificate{display: block; text-align: center;}
  .spCertificate img {margin: 0;}
  footer .copy{margin-left: 0;}
  
}
.progressbarWarp {width: 25vw; float: right; text-align: right; min-width: 180px;}
.progressbarWarp span {display: block; margin-top: 4px; font-weight: 700;}

.deletedraft {padding: 8px 0; text-align: right; color: #000;}

.pink-pie-bg .ftTnc ul li a, .flower-bg .ftTnc ul li a {color: #fff;}


.bylink {display: block; text-align: center;}
.bylink a { display: inline-block; color: #fff; padding: 1vw 1vw; border: 0 vw solid #e0a019;  border-radius: 1vw; text-decoration: none; text-transform: uppercase; font-weight: 500; font-size: 1.2vw; margin: 0 0px;}
@media only screen and (max-width: 979px) {
  .bylink {margin-bottom: 20px;}
  .bylink {font-size: 14px;}
  .bylink a {font-size: 16px;}
}
@media only screen and (max-width: 768px) {
  .bylink a {color: #242424;}
}
@media only screen and (max-width: 680px) {
  .bylink a {color: #e0a019;}
}
.currentpkg {
  background-color: #e0a019;
}
.vidPanelHeight {
  display: flex;
  gap: 30px;
}
.vidPanelHeight .mt-3 {
  background-color: hsla(0,0%,100%,.8666666666666667);
  border-radius: 22px !important;
}
.ourpkgs h2 {font-size: 5.2vw;font-weight: bold;font-family: 'Roboto', sans-serif; color: #231f20;}
