@charset "UTF-8";
body {
  font-family: "Roboto", sans-serif;
}

.hindi, :lang(hin) {
  font-family: "Laila", serif;
}

/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/
/*----------------------------------------------------*/
/*-----------------INDEX CSS*/
/*----------------------------------------------------*/
body {
  font-family: "Roboto", sans-serif;
  background-color: #ebe7e8;
  color: #72410a;
  font-size: 16px;
}

.fa {
  font-family: FontAwesome !important;
}

.hand {
  cursor: pointer;
  text-decoration: none !important;
}

.inline-block{display: inline-block;}

.flex{ display: flex; }

h1.main-title {
  margin-top: 0;
}

.dark-strip {
  background-color: #72410a;
  color: #ffffff;
}

.bluelight-strip {
  padding: 10px;
  margin: 30px 0;
  background-color: #3772ffe0;
  color: #ffffff;
}

.bluelight-strip h3 {
  margin: 0;
}

.margin-top-10{margin-top: 10px;}
.margin-top-20{margin-top: 20px;}
.margin-top-40{margin-top: 40px;}
.margin-left-10{margin-left: 10px;}
.margin-left-20{margin-left: 20px;}
.margin-bottom-10{margin-bottom: 10px;}
.margin-bottom-25{margin-bottom: 25px;}
.padding-0{padding: 0;}

.btn-primary,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:active:focus,
.btn-primary:active:hover,
.btn-primary.disabled.focus,
.btn-primary.disabled:focus,
.btn-primary[disabled].focus,
.btn-primary[disabled]:focus {
  background-color: #72410a;
  color: #ffffff;
  border: 0;
  font-size: 22px;
}

.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
.btn-primary:hover {
  background-color: #5b3408;
}

.radius {
  border-radius: 4px;
}

.thumbnail {
  background-color: #c69c6c;
  border-color: transparent;
}

a.thumbnail.active,
a.thumbnail:focus,
a.thumbnail:hover {
  border-color: #72410a;
}

.clear {
  clear: both;
}

a.link-primary {
  color: #72410a;
}

a.link-primary:hover {
  color: #c69c6c;
}

a.link-secondary {
  color: #c69c6c;
}

a.link-secondary:hover {
  color: #72410a;
}

.breadcrumb {
  background-color: transparent;
  margin: 0;
}

.breadcrumb a {
  color: #c69c6c;
}

.breadcrumb li:last-child a {
  color: #72410a;
}

.dark-strip {
  padding: 10px;
  margin: 30px 0;
}

.dark-strip h3 {
  margin: 0;
}

.animation {
  -moz-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.border {
  border: 1px solid #aeaeae;
}

/*Model*/
.modal-content {
  background-color: #ebe7e8;
}

.modal-content .border.title {
  border: 1px solid #aeaeae;
  border-width: 0 0 1px 0;
  padding-bottom: 15px;
  margin-top: 0;
}

.modal-content .brand-img {
  margin: 60px 0 30px;
}

.modal-content input {
  background-color: #ebe7e8;
  box-shadow: none;
  border: 1px solid #aeaeae;
  border-width: 0 0 1px 0;
  border-radius: 0;
}

.modal-content .input-group-lg > .form-control, .modal-content .input-group-lg > .input-group-addon, .modal-content .input-group-lg > .input-group-btn > .btn {
  border-radius: 0;
  border-width: 0 0 1px 0;
}

.modal-content .img-responsive.book-img {
  margin: auto;
}

.carousel-indicators li {
  border-color: #c69c6c;
}

.carousel-indicators .active {
  background-color: #72410a;
}

.carousel-control {
  width: 8%;
}

.carousel-control .icon-prev,
.carousel-control .icon-next {
  font-size: 60px;
}

.alert-toxic {
  background-color: #00ff00;
  border-color: green;
}

hr.style1 {
  border-top: 1px solid #8c8b8b;
}

/*----------------------------------------------------*/
/*-----------------HEADER CSS*/
/*----------------------------------------------------*/
.header {
  padding: 5px 0;
}

.header .header-contact {
  text-align: right;
  list-style: none;
  font-size: 18px;
}

.header .header-contact a {
  color: #72410a;
  text-decoration: none;
  padding-left: 10px;
}

.header .about-inshorts {
  text-align: right;
  text-transform: uppercase;
  font-family: "Roboto", sans-serif;
  font-size: 14px;
}

.navbar {
  background-color: #72410a;
  font-family: "Roboto", sans-serif;
  min-height: 0;
  border-radius: 0;
  border: 0;
}

.navbar ul.navbar-nav {
  float: right;
}

.navbar ul.navbar-nav > li > a,
.navbar ul.navbar-nav > li > a:visited,
.navbar ul.navbar-nav > li > a:hover,
.navbar ul.navbar-nav > li > a:active {
  text-transform: uppercase;
  color: #ffffff;
  padding: 7px 10px;
  font-weight: 500;
  
  	-webkit-transition: 	background-color 350ms ease-out;
	-moz-transition: 		background-color 350ms ease-out;
	-o-transition: 			background-color 350ms ease-out;
	transition: 			background-color 350ms ease-out;
  
}

.navbar ul.navbar-nav > li > a:hover {
  background-color: #5b3408;
}

.navbar ul.navbar-nav > li > a:focus,
.navbar ul.navbar-nav > li.active > a {
  background-color: #432606;
}

/*----------------------------------------------------*/
/*-----------------End: HEADER CSS*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/
/*----------------------------------------------------*/
/*-----------------CONTENT CSS*/
/*----------------------------------------------------*/
.content-section {
  padding: 15px 0;
}

.sp-section {
  padding-top: 20px;
}

.sp-section .displayThumb {
  display: inline-block;
}

.sp-section .displayThumb .displayPic {
  /*max-height: 150px;*/
}

.sp-section .logreg-box {
  padding: 5px 15px;
  background-color: #c69c6c;
}

.sp-section .logreg-box .btn {
  margin: 10px 0;
  display: inline-block;
}

.sp-section .logreg-box .welcomeLogoutBox {
  text-align: center; font-size: 20px; font-weight: 600
}

.carousel-section .carousel {
  border: 5px solid #72410a;
  border-width: 5px 0;
}

.carousel-section .carousel-indicators {
  bottom: 0px;
  margin-bottom: 0;
}

.carousel-inner>.item{
  text-align: center;
}
.carousel-inner>.item>a>img{
  display:inline-block;
}

.course-trailer-section {
  padding: 30px 0;
}

.visitors {
  /* WebKit and Opera browsers */
  /* all other browsers */
}

.visitors .counter {
  font-size: 42px;
}

.visitors .title, .visitors .icon {
  font-size: 36px;
}

.visitors .icon {
  -webkit-animation-name: spinner;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-duration: 2s;
  animation-name: spinner;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-duration: 2s;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

@-webkit-keyframes spinner {
  from {
    -webkit-transform: rotateY(0deg);
  }
  to {
    -webkit-transform: rotateY(-360deg);
  }
}

@keyframes spinner {
  from {
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    transform: rotateY(0deg);
  }
  to {
    -moz-transform: rotateY(-360deg);
    -ms-transform: rotateY(-360deg);
    transform: rotateY(-360deg);
  }
}

.subcribe-section {
  padding: 0px 0 50px 0;
}

.subcribe-section .btn {
  margin-top: 20px;
}

.subcribe-section .social-media {
  font-size: 32px;
}

.subcribe-section .social-media a {
  color: #c69c6c;
}

.subcribe-section .social-media a:hover {
  color: #72410a;
}

.purpose-section {
  padding: 30px 0;
  background-color: #72410a;
  color: #ffffff;
  font-family: "Roboto", sans-serif;
  font-size: 22px;
}

.purpose-section .purpose-text {
  padding: 30px 0;
}

.card {
  margin: 15px 0;
  text-align: center;
  padding-bottom: 5px;
  border-radius: 4px;
  min-height: 240px;
  background-color: #ffffff;
  -moz-box-shadow: 0 0 1px 0px #72410a;
  -webkit-box-shadow: 0 0 1px 0px #72410a;
  box-shadow: 0 0 1px 0px #72410a;
}

.cardPaddingBottom{
  padding-bottom: 0;
  border-radius: 3px !important;
}

.card .thumbnail {
  margin-bottom: 5px;
  position: relative;
}

.card .title {
  padding: 0 5px;
  margin-top: 5px;
}

.card .title span {
  font-size: 18px;
}

.card .title .btn {
  font-size: 14px;
}

.card p {
  padding-left: 5px;
  padding-right: 5px;
}

.card .thumb-cover {
  opacity: 0;
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 4px;
  top: 4px;
  background-color: rgba(198, 156, 108, 0.3);
  color: #72410a;
  padding-top: 50px;
  -moz-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.card .thumb-cover span {
  font-size: 36px;
}

.card:hover .thumb-cover {
  opacity: 1;
}

/*----------------------------------------------------*/
/*-----------------End: CONTENT CSS*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/
/*----------------------------------------------------*/
/*-----------------COURSES CSS*/
/*----------------------------------------------------*/
.course-listing .courses-section {
  font-family: "Roboto", sans-serif;
}

.course-listing .courses-section .notice {
  padding: 15px;
}

.course-detail .panel {
  background-color: #dbc1a3;
  margin-top: 20px;
}

.course-detail .panel .thumbnail {
  margin: 0;
}

.course-detail .course-detail-wrap {
  position: relative;
  display: inline-block;
  width:100%;
}

.course-detail .course-detail-wrap .course-info {
  position: absolute;
  right: 15px;
  top: auto;
  bottom: 0px;
  left: auto;
}

.course-detail .card .thumbnail {
  margin: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.course-detail .card .thumb-cover {
  opacity: 1;
}

.course-detail .card .toggle-view {
  opacity: 0;
  -moz-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.course-detail .card:hover .toggle-view {
  opacity: 1;
}

.course-video .course-info {
  font-size: 22px;
}

.para-wrap .note-para {
  padding-left: 80px;
  position: relative;
  text-align: left;
  font-size: 20px;
}

.para-wrap .note-para .para-title {
  position: absolute;
  margin-left: -70px;
}

/*----------------------------------------------------*/
/*-----------------End: COURSES CSS*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/
/*----------------------------------------------------*/
/*-----------------COURSES CSS*/
/*----------------------------------------------------*/
.quiz-wrap {
  font-size: 22px;
  padding: 30px 0;
}

.quiz-wrap .quiz-list {
  list-style-type: none;
  padding-left: 80px;
}

.quiz-wrap .quiz-list li {
  counter-increment: step-counter;
  position: relative;
}

.quiz-wrap .quiz-list li .status-icon {
  font-size: 24px;
}

.quiz-wrap .quiz-list li div {
  position: relative;
  padding: 8px 10px;
  cursor: pointer;
  margin-bottom: 8px;
  min-height: 40px;
  display: flex;
  align-items: center;
}

.quiz-wrap .quiz-list li div::before {
  min-width: 300px;
  visibility: visible;
  content: "";
  font: normal normal normal 14px/1 FontAwesome;
  position: absolute;
  left: -20px;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: -1;
  border-radius: 50px;
  font-size: 22px;
  background-color: #c1c1c1;
  opacity: .2;
  border: 2px solid transparent;
  transition: all 0.2s ease;
}

.quiz-wrap .quiz-list li div input {
  visibility: hidden;
  position: absolute;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}

.quiz-wrap .quiz-list li div.incorrect::after {
  content: "\f00d";
  font: normal normal normal 22px/1 FontAwesome;
  position: absolute;
  left: -5px;
  top: 10px;
  color: #a94442;
  z-index: 1;
  visibility: visible;
}

.quiz-wrap .quiz-list li div.correct::before {
  background-color: #59e022;
  border: 1px solid #3c763d;
  opacity: 1;
}

.quiz-wrap .quiz-list li div.correct::after {
  content: "\f00c";
  font: normal normal normal 22px/1 FontAwesome;
  position: absolute;
  left: -5px;
  top: 10px;
  color: #3c763d;
  z-index: 1;
  visibility: visible;
}

.quiz-wrap .quiz-list li div:has(input:checked)::before {
  background-color: #e89393 !important;
  opacity: 1 !important;
  border: 2px solid #d97373;
  transition: all 0.2s ease;
}

.quiz-wrap .quiz-list li div label {
  font-weight: 500;
  cursor: pointer;
  user-select: none;
  flex: 1;
  line-height: 1.6;
  margin: 0;
  padding: 0;
}

.quiz-wrap .quiz-list li:before {
  content: "प्रश्न " counter(step-counter) ".";
  margin: -2px 0 0 -70px;
  position: absolute;
  font-weight: 500;
}

/*----------------------------------------------------*/
/*-----------------End: COURSES CSS*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/
.live-broadcast .card {
  background-color: transparent;
  box-shadow: none;
}

.media-wrap audio {
  width: 100%;
}

/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/
/*----------------------------------------------------*/
/*-----------------Dashboard CSS*/
/*----------------------------------------------------*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/
/*----------------------------------------------------*/
/*-----------------Pi Chart CSS*/
/*----------------------------------------------------*/
/****************************************************************
 *
 * CSS Percentage Circle
 * Author: Andre Firchow
 *
*****************************************************************/
.rect-auto, .c100.p51 .slice, .c100.p52 .slice, .c100.p53 .slice, .c100.p54 .slice, .c100.p55 .slice, .c100.p56 .slice, .c100.p57 .slice, .c100.p58 .slice, .c100.p59 .slice, .c100.p60 .slice, .c100.p61 .slice, .c100.p62 .slice, .c100.p63 .slice, .c100.p64 .slice, .c100.p65 .slice, .c100.p66 .slice, .c100.p67 .slice, .c100.p68 .slice, .c100.p69 .slice, .c100.p70 .slice, .c100.p71 .slice, .c100.p72 .slice, .c100.p73 .slice, .c100.p74 .slice, .c100.p75 .slice, .c100.p76 .slice, .c100.p77 .slice, .c100.p78 .slice, .c100.p79 .slice, .c100.p80 .slice, .c100.p81 .slice, .c100.p82 .slice, .c100.p83 .slice, .c100.p84 .slice, .c100.p85 .slice, .c100.p86 .slice, .c100.p87 .slice, .c100.p88 .slice, .c100.p89 .slice, .c100.p90 .slice, .c100.p91 .slice, .c100.p92 .slice, .c100.p93 .slice, .c100.p94 .slice, .c100.p95 .slice, .c100.p96 .slice, .c100.p97 .slice, .c100.p98 .slice, .c100.p99 .slice, .c100.p100 .slice {
  clip: rect(auto, auto, auto, auto);
}

.pie, .c100 .bar, .c100.p51 .fill, .c100.p52 .fill, .c100.p53 .fill, .c100.p54 .fill, .c100.p55 .fill, .c100.p56 .fill, .c100.p57 .fill, .c100.p58 .fill, .c100.p59 .fill, .c100.p60 .fill, .c100.p61 .fill, .c100.p62 .fill, .c100.p63 .fill, .c100.p64 .fill, .c100.p65 .fill, .c100.p66 .fill, .c100.p67 .fill, .c100.p68 .fill, .c100.p69 .fill, .c100.p70 .fill, .c100.p71 .fill, .c100.p72 .fill, .c100.p73 .fill, .c100.p74 .fill, .c100.p75 .fill, .c100.p76 .fill, .c100.p77 .fill, .c100.p78 .fill, .c100.p79 .fill, .c100.p80 .fill, .c100.p81 .fill, .c100.p82 .fill, .c100.p83 .fill, .c100.p84 .fill, .c100.p85 .fill, .c100.p86 .fill, .c100.p87 .fill, .c100.p88 .fill, .c100.p89 .fill, .c100.p90 .fill, .c100.p91 .fill, .c100.p92 .fill, .c100.p93 .fill, .c100.p94 .fill, .c100.p95 .fill, .c100.p96 .fill, .c100.p97 .fill, .c100.p98 .fill, .c100.p99 .fill, .c100.p100 .fill {
  position: absolute;
  border: 0.08em solid #72410a;
  width: 0.84em;
  height: 0.84em;
  clip: rect(0em, 0.5em, 1em, 0em);
  border-radius: 50%;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}

.pie-fill, .c100.p51 .bar:after, .c100.p51 .fill, .c100.p52 .bar:after, .c100.p52 .fill, .c100.p53 .bar:after, .c100.p53 .fill, .c100.p54 .bar:after, .c100.p54 .fill, .c100.p55 .bar:after, .c100.p55 .fill, .c100.p56 .bar:after, .c100.p56 .fill, .c100.p57 .bar:after, .c100.p57 .fill, .c100.p58 .bar:after, .c100.p58 .fill, .c100.p59 .bar:after, .c100.p59 .fill, .c100.p60 .bar:after, .c100.p60 .fill, .c100.p61 .bar:after, .c100.p61 .fill, .c100.p62 .bar:after, .c100.p62 .fill, .c100.p63 .bar:after, .c100.p63 .fill, .c100.p64 .bar:after, .c100.p64 .fill, .c100.p65 .bar:after, .c100.p65 .fill, .c100.p66 .bar:after, .c100.p66 .fill, .c100.p67 .bar:after, .c100.p67 .fill, .c100.p68 .bar:after, .c100.p68 .fill, .c100.p69 .bar:after, .c100.p69 .fill, .c100.p70 .bar:after, .c100.p70 .fill, .c100.p71 .bar:after, .c100.p71 .fill, .c100.p72 .bar:after, .c100.p72 .fill, .c100.p73 .bar:after, .c100.p73 .fill, .c100.p74 .bar:after, .c100.p74 .fill, .c100.p75 .bar:after, .c100.p75 .fill, .c100.p76 .bar:after, .c100.p76 .fill, .c100.p77 .bar:after, .c100.p77 .fill, .c100.p78 .bar:after, .c100.p78 .fill, .c100.p79 .bar:after, .c100.p79 .fill, .c100.p80 .bar:after, .c100.p80 .fill, .c100.p81 .bar:after, .c100.p81 .fill, .c100.p82 .bar:after, .c100.p82 .fill, .c100.p83 .bar:after, .c100.p83 .fill, .c100.p84 .bar:after, .c100.p84 .fill, .c100.p85 .bar:after, .c100.p85 .fill, .c100.p86 .bar:after, .c100.p86 .fill, .c100.p87 .bar:after, .c100.p87 .fill, .c100.p88 .bar:after, .c100.p88 .fill, .c100.p89 .bar:after, .c100.p89 .fill, .c100.p90 .bar:after, .c100.p90 .fill, .c100.p91 .bar:after, .c100.p91 .fill, .c100.p92 .bar:after, .c100.p92 .fill, .c100.p93 .bar:after, .c100.p93 .fill, .c100.p94 .bar:after, .c100.p94 .fill, .c100.p95 .bar:after, .c100.p95 .fill, .c100.p96 .bar:after, .c100.p96 .fill, .c100.p97 .bar:after, .c100.p97 .fill, .c100.p98 .bar:after, .c100.p98 .fill, .c100.p99 .bar:after, .c100.p99 .fill, .c100.p100 .bar:after, .c100.p100 .fill {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.c100 {
  position: relative;
  font-size: 120px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  float: left;
  margin: 0 0.1em 0.1em 0;
  background-color: #b9a9a1;
}

.c100 *, .c100 *:before, .c100 *:after {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

.c100.center {
  float: none;
  margin: 0 auto;
}

.c100.big {
  font-size: 240px;
}

.c100.small {
  font-size: 80px;
}

.c100 > span {
  position: absolute;
  width: 100%;
  z-index: 1;
  left: 0;
  top: 0;
  width: 5em;
  line-height: 5em;
  font-size: 0.2em;
  color: #b9a9a1;
  display: block;
  text-align: center;
  white-space: nowrap;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.c100:after {
  position: absolute;
  top: 0.08em;
  left: 0.08em;
  display: block;
  content: " ";
  border-radius: 50%;
  background-color: #cfc4be;
  width: 0.84em;
  height: 0.84em;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}

.c100 .slice {
  position: absolute;
  width: 1em;
  height: 1em;
  clip: rect(0em, 1em, 1em, 0.5em);
}

.c100.p1 .bar {
  -webkit-transform: rotate(3.6deg);
  -moz-transform: rotate(3.6deg);
  -ms-transform: rotate(3.6deg);
  -o-transform: rotate(3.6deg);
  transform: rotate(3.6deg);
}

.c100.p2 .bar {
  -webkit-transform: rotate(7.2deg);
  -moz-transform: rotate(7.2deg);
  -ms-transform: rotate(7.2deg);
  -o-transform: rotate(7.2deg);
  transform: rotate(7.2deg);
}

.c100.p3 .bar {
  -webkit-transform: rotate(10.8deg);
  -moz-transform: rotate(10.8deg);
  -ms-transform: rotate(10.8deg);
  -o-transform: rotate(10.8deg);
  transform: rotate(10.8deg);
}

.c100.p4 .bar {
  -webkit-transform: rotate(14.4deg);
  -moz-transform: rotate(14.4deg);
  -ms-transform: rotate(14.4deg);
  -o-transform: rotate(14.4deg);
  transform: rotate(14.4deg);
}

.c100.p5 .bar {
  -webkit-transform: rotate(18deg);
  -moz-transform: rotate(18deg);
  -ms-transform: rotate(18deg);
  -o-transform: rotate(18deg);
  transform: rotate(18deg);
}

.c100.p6 .bar {
  -webkit-transform: rotate(21.6deg);
  -moz-transform: rotate(21.6deg);
  -ms-transform: rotate(21.6deg);
  -o-transform: rotate(21.6deg);
  transform: rotate(21.6deg);
}

.c100.p7 .bar {
  -webkit-transform: rotate(25.2deg);
  -moz-transform: rotate(25.2deg);
  -ms-transform: rotate(25.2deg);
  -o-transform: rotate(25.2deg);
  transform: rotate(25.2deg);
}

.c100.p8 .bar {
  -webkit-transform: rotate(28.8deg);
  -moz-transform: rotate(28.8deg);
  -ms-transform: rotate(28.8deg);
  -o-transform: rotate(28.8deg);
  transform: rotate(28.8deg);
}

.c100.p9 .bar {
  -webkit-transform: rotate(32.4deg);
  -moz-transform: rotate(32.4deg);
  -ms-transform: rotate(32.4deg);
  -o-transform: rotate(32.4deg);
  transform: rotate(32.4deg);
}

.c100.p10 .bar {
  -webkit-transform: rotate(36deg);
  -moz-transform: rotate(36deg);
  -ms-transform: rotate(36deg);
  -o-transform: rotate(36deg);
  transform: rotate(36deg);
}

.c100.p11 .bar {
  -webkit-transform: rotate(39.6deg);
  -moz-transform: rotate(39.6deg);
  -ms-transform: rotate(39.6deg);
  -o-transform: rotate(39.6deg);
  transform: rotate(39.6deg);
}

.c100.p12 .bar {
  -webkit-transform: rotate(43.2deg);
  -moz-transform: rotate(43.2deg);
  -ms-transform: rotate(43.2deg);
  -o-transform: rotate(43.2deg);
  transform: rotate(43.2deg);
}

.c100.p13 .bar {
  -webkit-transform: rotate(46.8deg);
  -moz-transform: rotate(46.8deg);
  -ms-transform: rotate(46.8deg);
  -o-transform: rotate(46.8deg);
  transform: rotate(46.8deg);
}

.c100.p14 .bar {
  -webkit-transform: rotate(50.4deg);
  -moz-transform: rotate(50.4deg);
  -ms-transform: rotate(50.4deg);
  -o-transform: rotate(50.4deg);
  transform: rotate(50.4deg);
}

.c100.p15 .bar {
  -webkit-transform: rotate(54deg);
  -moz-transform: rotate(54deg);
  -ms-transform: rotate(54deg);
  -o-transform: rotate(54deg);
  transform: rotate(54deg);
}

.c100.p16 .bar {
  -webkit-transform: rotate(57.6deg);
  -moz-transform: rotate(57.6deg);
  -ms-transform: rotate(57.6deg);
  -o-transform: rotate(57.6deg);
  transform: rotate(57.6deg);
}

.c100.p17 .bar {
  -webkit-transform: rotate(61.2deg);
  -moz-transform: rotate(61.2deg);
  -ms-transform: rotate(61.2deg);
  -o-transform: rotate(61.2deg);
  transform: rotate(61.2deg);
}

.c100.p18 .bar {
  -webkit-transform: rotate(64.8deg);
  -moz-transform: rotate(64.8deg);
  -ms-transform: rotate(64.8deg);
  -o-transform: rotate(64.8deg);
  transform: rotate(64.8deg);
}

.c100.p19 .bar {
  -webkit-transform: rotate(68.4deg);
  -moz-transform: rotate(68.4deg);
  -ms-transform: rotate(68.4deg);
  -o-transform: rotate(68.4deg);
  transform: rotate(68.4deg);
}

.c100.p20 .bar {
  -webkit-transform: rotate(72deg);
  -moz-transform: rotate(72deg);
  -ms-transform: rotate(72deg);
  -o-transform: rotate(72deg);
  transform: rotate(72deg);
}

.c100.p21 .bar {
  -webkit-transform: rotate(75.6deg);
  -moz-transform: rotate(75.6deg);
  -ms-transform: rotate(75.6deg);
  -o-transform: rotate(75.6deg);
  transform: rotate(75.6deg);
}

.c100.p22 .bar {
  -webkit-transform: rotate(79.2deg);
  -moz-transform: rotate(79.2deg);
  -ms-transform: rotate(79.2deg);
  -o-transform: rotate(79.2deg);
  transform: rotate(79.2deg);
}

.c100.p23 .bar {
  -webkit-transform: rotate(82.8deg);
  -moz-transform: rotate(82.8deg);
  -ms-transform: rotate(82.8deg);
  -o-transform: rotate(82.8deg);
  transform: rotate(82.8deg);
}

.c100.p24 .bar {
  -webkit-transform: rotate(86.4deg);
  -moz-transform: rotate(86.4deg);
  -ms-transform: rotate(86.4deg);
  -o-transform: rotate(86.4deg);
  transform: rotate(86.4deg);
}

.c100.p25 .bar {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.c100.p26 .bar {
  -webkit-transform: rotate(93.6deg);
  -moz-transform: rotate(93.6deg);
  -ms-transform: rotate(93.6deg);
  -o-transform: rotate(93.6deg);
  transform: rotate(93.6deg);
}

.c100.p27 .bar {
  -webkit-transform: rotate(97.2deg);
  -moz-transform: rotate(97.2deg);
  -ms-transform: rotate(97.2deg);
  -o-transform: rotate(97.2deg);
  transform: rotate(97.2deg);
}

.c100.p28 .bar {
  -webkit-transform: rotate(100.8deg);
  -moz-transform: rotate(100.8deg);
  -ms-transform: rotate(100.8deg);
  -o-transform: rotate(100.8deg);
  transform: rotate(100.8deg);
}

.c100.p29 .bar {
  -webkit-transform: rotate(104.4deg);
  -moz-transform: rotate(104.4deg);
  -ms-transform: rotate(104.4deg);
  -o-transform: rotate(104.4deg);
  transform: rotate(104.4deg);
}

.c100.p30 .bar {
  -webkit-transform: rotate(108deg);
  -moz-transform: rotate(108deg);
  -ms-transform: rotate(108deg);
  -o-transform: rotate(108deg);
  transform: rotate(108deg);
}

.c100.p31 .bar {
  -webkit-transform: rotate(111.6deg);
  -moz-transform: rotate(111.6deg);
  -ms-transform: rotate(111.6deg);
  -o-transform: rotate(111.6deg);
  transform: rotate(111.6deg);
}

.c100.p32 .bar {
  -webkit-transform: rotate(115.2deg);
  -moz-transform: rotate(115.2deg);
  -ms-transform: rotate(115.2deg);
  -o-transform: rotate(115.2deg);
  transform: rotate(115.2deg);
}

.c100.p33 .bar {
  -webkit-transform: rotate(118.8deg);
  -moz-transform: rotate(118.8deg);
  -ms-transform: rotate(118.8deg);
  -o-transform: rotate(118.8deg);
  transform: rotate(118.8deg);
}

.c100.p34 .bar {
  -webkit-transform: rotate(122.4deg);
  -moz-transform: rotate(122.4deg);
  -ms-transform: rotate(122.4deg);
  -o-transform: rotate(122.4deg);
  transform: rotate(122.4deg);
}

.c100.p35 .bar {
  -webkit-transform: rotate(126deg);
  -moz-transform: rotate(126deg);
  -ms-transform: rotate(126deg);
  -o-transform: rotate(126deg);
  transform: rotate(126deg);
}

.c100.p36 .bar {
  -webkit-transform: rotate(129.6deg);
  -moz-transform: rotate(129.6deg);
  -ms-transform: rotate(129.6deg);
  -o-transform: rotate(129.6deg);
  transform: rotate(129.6deg);
}

.c100.p37 .bar {
  -webkit-transform: rotate(133.2deg);
  -moz-transform: rotate(133.2deg);
  -ms-transform: rotate(133.2deg);
  -o-transform: rotate(133.2deg);
  transform: rotate(133.2deg);
}

.c100.p38 .bar {
  -webkit-transform: rotate(136.8deg);
  -moz-transform: rotate(136.8deg);
  -ms-transform: rotate(136.8deg);
  -o-transform: rotate(136.8deg);
  transform: rotate(136.8deg);
}

.c100.p39 .bar {
  -webkit-transform: rotate(140.4deg);
  -moz-transform: rotate(140.4deg);
  -ms-transform: rotate(140.4deg);
  -o-transform: rotate(140.4deg);
  transform: rotate(140.4deg);
}

.c100.p40 .bar {
  -webkit-transform: rotate(144deg);
  -moz-transform: rotate(144deg);
  -ms-transform: rotate(144deg);
  -o-transform: rotate(144deg);
  transform: rotate(144deg);
}

.c100.p41 .bar {
  -webkit-transform: rotate(147.6deg);
  -moz-transform: rotate(147.6deg);
  -ms-transform: rotate(147.6deg);
  -o-transform: rotate(147.6deg);
  transform: rotate(147.6deg);
}

.c100.p42 .bar {
  -webkit-transform: rotate(151.2deg);
  -moz-transform: rotate(151.2deg);
  -ms-transform: rotate(151.2deg);
  -o-transform: rotate(151.2deg);
  transform: rotate(151.2deg);
}

.c100.p43 .bar {
  -webkit-transform: rotate(154.8deg);
  -moz-transform: rotate(154.8deg);
  -ms-transform: rotate(154.8deg);
  -o-transform: rotate(154.8deg);
  transform: rotate(154.8deg);
}

.c100.p44 .bar {
  -webkit-transform: rotate(158.4deg);
  -moz-transform: rotate(158.4deg);
  -ms-transform: rotate(158.4deg);
  -o-transform: rotate(158.4deg);
  transform: rotate(158.4deg);
}

.c100.p45 .bar {
  -webkit-transform: rotate(162deg);
  -moz-transform: rotate(162deg);
  -ms-transform: rotate(162deg);
  -o-transform: rotate(162deg);
  transform: rotate(162deg);
}

.c100.p46 .bar {
  -webkit-transform: rotate(165.6deg);
  -moz-transform: rotate(165.6deg);
  -ms-transform: rotate(165.6deg);
  -o-transform: rotate(165.6deg);
  transform: rotate(165.6deg);
}

.c100.p47 .bar {
  -webkit-transform: rotate(169.2deg);
  -moz-transform: rotate(169.2deg);
  -ms-transform: rotate(169.2deg);
  -o-transform: rotate(169.2deg);
  transform: rotate(169.2deg);
}

.c100.p48 .bar {
  -webkit-transform: rotate(172.8deg);
  -moz-transform: rotate(172.8deg);
  -ms-transform: rotate(172.8deg);
  -o-transform: rotate(172.8deg);
  transform: rotate(172.8deg);
}

.c100.p49 .bar {
  -webkit-transform: rotate(176.4deg);
  -moz-transform: rotate(176.4deg);
  -ms-transform: rotate(176.4deg);
  -o-transform: rotate(176.4deg);
  transform: rotate(176.4deg);
}

.c100.p50 .bar {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.c100.p51 .bar {
  -webkit-transform: rotate(183.6deg);
  -moz-transform: rotate(183.6deg);
  -ms-transform: rotate(183.6deg);
  -o-transform: rotate(183.6deg);
  transform: rotate(183.6deg);
}

.c100.p52 .bar {
  -webkit-transform: rotate(187.2deg);
  -moz-transform: rotate(187.2deg);
  -ms-transform: rotate(187.2deg);
  -o-transform: rotate(187.2deg);
  transform: rotate(187.2deg);
}

.c100.p53 .bar {
  -webkit-transform: rotate(190.8deg);
  -moz-transform: rotate(190.8deg);
  -ms-transform: rotate(190.8deg);
  -o-transform: rotate(190.8deg);
  transform: rotate(190.8deg);
}

.c100.p54 .bar {
  -webkit-transform: rotate(194.4deg);
  -moz-transform: rotate(194.4deg);
  -ms-transform: rotate(194.4deg);
  -o-transform: rotate(194.4deg);
  transform: rotate(194.4deg);
}

.c100.p55 .bar {
  -webkit-transform: rotate(198deg);
  -moz-transform: rotate(198deg);
  -ms-transform: rotate(198deg);
  -o-transform: rotate(198deg);
  transform: rotate(198deg);
}

.c100.p56 .bar {
  -webkit-transform: rotate(201.6deg);
  -moz-transform: rotate(201.6deg);
  -ms-transform: rotate(201.6deg);
  -o-transform: rotate(201.6deg);
  transform: rotate(201.6deg);
}

.c100.p57 .bar {
  -webkit-transform: rotate(205.2deg);
  -moz-transform: rotate(205.2deg);
  -ms-transform: rotate(205.2deg);
  -o-transform: rotate(205.2deg);
  transform: rotate(205.2deg);
}

.c100.p58 .bar {
  -webkit-transform: rotate(208.8deg);
  -moz-transform: rotate(208.8deg);
  -ms-transform: rotate(208.8deg);
  -o-transform: rotate(208.8deg);
  transform: rotate(208.8deg);
}

.c100.p59 .bar {
  -webkit-transform: rotate(212.4deg);
  -moz-transform: rotate(212.4deg);
  -ms-transform: rotate(212.4deg);
  -o-transform: rotate(212.4deg);
  transform: rotate(212.4deg);
}

.c100.p60 .bar {
  -webkit-transform: rotate(216deg);
  -moz-transform: rotate(216deg);
  -ms-transform: rotate(216deg);
  -o-transform: rotate(216deg);
  transform: rotate(216deg);
}

.c100.p61 .bar {
  -webkit-transform: rotate(219.6deg);
  -moz-transform: rotate(219.6deg);
  -ms-transform: rotate(219.6deg);
  -o-transform: rotate(219.6deg);
  transform: rotate(219.6deg);
}

.c100.p62 .bar {
  -webkit-transform: rotate(223.2deg);
  -moz-transform: rotate(223.2deg);
  -ms-transform: rotate(223.2deg);
  -o-transform: rotate(223.2deg);
  transform: rotate(223.2deg);
}

.c100.p63 .bar {
  -webkit-transform: rotate(226.8deg);
  -moz-transform: rotate(226.8deg);
  -ms-transform: rotate(226.8deg);
  -o-transform: rotate(226.8deg);
  transform: rotate(226.8deg);
}

.c100.p64 .bar {
  -webkit-transform: rotate(230.4deg);
  -moz-transform: rotate(230.4deg);
  -ms-transform: rotate(230.4deg);
  -o-transform: rotate(230.4deg);
  transform: rotate(230.4deg);
}

.c100.p65 .bar {
  -webkit-transform: rotate(234deg);
  -moz-transform: rotate(234deg);
  -ms-transform: rotate(234deg);
  -o-transform: rotate(234deg);
  transform: rotate(234deg);
}

.c100.p66 .bar {
  -webkit-transform: rotate(237.6deg);
  -moz-transform: rotate(237.6deg);
  -ms-transform: rotate(237.6deg);
  -o-transform: rotate(237.6deg);
  transform: rotate(237.6deg);
}

.c100.p67 .bar {
  -webkit-transform: rotate(241.2deg);
  -moz-transform: rotate(241.2deg);
  -ms-transform: rotate(241.2deg);
  -o-transform: rotate(241.2deg);
  transform: rotate(241.2deg);
}

.c100.p68 .bar {
  -webkit-transform: rotate(244.8deg);
  -moz-transform: rotate(244.8deg);
  -ms-transform: rotate(244.8deg);
  -o-transform: rotate(244.8deg);
  transform: rotate(244.8deg);
}

.c100.p69 .bar {
  -webkit-transform: rotate(248.4deg);
  -moz-transform: rotate(248.4deg);
  -ms-transform: rotate(248.4deg);
  -o-transform: rotate(248.4deg);
  transform: rotate(248.4deg);
}

.c100.p70 .bar {
  -webkit-transform: rotate(252deg);
  -moz-transform: rotate(252deg);
  -ms-transform: rotate(252deg);
  -o-transform: rotate(252deg);
  transform: rotate(252deg);
}

.c100.p71 .bar {
  -webkit-transform: rotate(255.6deg);
  -moz-transform: rotate(255.6deg);
  -ms-transform: rotate(255.6deg);
  -o-transform: rotate(255.6deg);
  transform: rotate(255.6deg);
}

.c100.p72 .bar {
  -webkit-transform: rotate(259.2deg);
  -moz-transform: rotate(259.2deg);
  -ms-transform: rotate(259.2deg);
  -o-transform: rotate(259.2deg);
  transform: rotate(259.2deg);
}

.c100.p73 .bar {
  -webkit-transform: rotate(262.8deg);
  -moz-transform: rotate(262.8deg);
  -ms-transform: rotate(262.8deg);
  -o-transform: rotate(262.8deg);
  transform: rotate(262.8deg);
}

.c100.p74 .bar {
  -webkit-transform: rotate(266.4deg);
  -moz-transform: rotate(266.4deg);
  -ms-transform: rotate(266.4deg);
  -o-transform: rotate(266.4deg);
  transform: rotate(266.4deg);
}

.c100.p75 .bar {
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}

.c100.p76 .bar {
  -webkit-transform: rotate(273.6deg);
  -moz-transform: rotate(273.6deg);
  -ms-transform: rotate(273.6deg);
  -o-transform: rotate(273.6deg);
  transform: rotate(273.6deg);
}

.c100.p77 .bar {
  -webkit-transform: rotate(277.2deg);
  -moz-transform: rotate(277.2deg);
  -ms-transform: rotate(277.2deg);
  -o-transform: rotate(277.2deg);
  transform: rotate(277.2deg);
}

.c100.p78 .bar {
  -webkit-transform: rotate(280.8deg);
  -moz-transform: rotate(280.8deg);
  -ms-transform: rotate(280.8deg);
  -o-transform: rotate(280.8deg);
  transform: rotate(280.8deg);
}

.c100.p79 .bar {
  -webkit-transform: rotate(284.4deg);
  -moz-transform: rotate(284.4deg);
  -ms-transform: rotate(284.4deg);
  -o-transform: rotate(284.4deg);
  transform: rotate(284.4deg);
}

.c100.p80 .bar {
  -webkit-transform: rotate(288deg);
  -moz-transform: rotate(288deg);
  -ms-transform: rotate(288deg);
  -o-transform: rotate(288deg);
  transform: rotate(288deg);
}

.c100.p81 .bar {
  -webkit-transform: rotate(291.6deg);
  -moz-transform: rotate(291.6deg);
  -ms-transform: rotate(291.6deg);
  -o-transform: rotate(291.6deg);
  transform: rotate(291.6deg);
}

.c100.p82 .bar {
  -webkit-transform: rotate(295.2deg);
  -moz-transform: rotate(295.2deg);
  -ms-transform: rotate(295.2deg);
  -o-transform: rotate(295.2deg);
  transform: rotate(295.2deg);
}

.c100.p83 .bar {
  -webkit-transform: rotate(298.8deg);
  -moz-transform: rotate(298.8deg);
  -ms-transform: rotate(298.8deg);
  -o-transform: rotate(298.8deg);
  transform: rotate(298.8deg);
}

.c100.p84 .bar {
  -webkit-transform: rotate(302.4deg);
  -moz-transform: rotate(302.4deg);
  -ms-transform: rotate(302.4deg);
  -o-transform: rotate(302.4deg);
  transform: rotate(302.4deg);
}

.c100.p85 .bar {
  -webkit-transform: rotate(306deg);
  -moz-transform: rotate(306deg);
  -ms-transform: rotate(306deg);
  -o-transform: rotate(306deg);
  transform: rotate(306deg);
}

.c100.p86 .bar {
  -webkit-transform: rotate(309.6deg);
  -moz-transform: rotate(309.6deg);
  -ms-transform: rotate(309.6deg);
  -o-transform: rotate(309.6deg);
  transform: rotate(309.6deg);
}

.c100.p87 .bar {
  -webkit-transform: rotate(313.2deg);
  -moz-transform: rotate(313.2deg);
  -ms-transform: rotate(313.2deg);
  -o-transform: rotate(313.2deg);
  transform: rotate(313.2deg);
}

.c100.p88 .bar {
  -webkit-transform: rotate(316.8deg);
  -moz-transform: rotate(316.8deg);
  -ms-transform: rotate(316.8deg);
  -o-transform: rotate(316.8deg);
  transform: rotate(316.8deg);
}

.c100.p89 .bar {
  -webkit-transform: rotate(320.4deg);
  -moz-transform: rotate(320.4deg);
  -ms-transform: rotate(320.4deg);
  -o-transform: rotate(320.4deg);
  transform: rotate(320.4deg);
}

.c100.p90 .bar {
  -webkit-transform: rotate(324deg);
  -moz-transform: rotate(324deg);
  -ms-transform: rotate(324deg);
  -o-transform: rotate(324deg);
  transform: rotate(324deg);
}

.c100.p91 .bar {
  -webkit-transform: rotate(327.6deg);
  -moz-transform: rotate(327.6deg);
  -ms-transform: rotate(327.6deg);
  -o-transform: rotate(327.6deg);
  transform: rotate(327.6deg);
}

.c100.p92 .bar {
  -webkit-transform: rotate(331.2deg);
  -moz-transform: rotate(331.2deg);
  -ms-transform: rotate(331.2deg);
  -o-transform: rotate(331.2deg);
  transform: rotate(331.2deg);
}

.c100.p93 .bar {
  -webkit-transform: rotate(334.8deg);
  -moz-transform: rotate(334.8deg);
  -ms-transform: rotate(334.8deg);
  -o-transform: rotate(334.8deg);
  transform: rotate(334.8deg);
}

.c100.p94 .bar {
  -webkit-transform: rotate(338.4deg);
  -moz-transform: rotate(338.4deg);
  -ms-transform: rotate(338.4deg);
  -o-transform: rotate(338.4deg);
  transform: rotate(338.4deg);
}

.c100.p95 .bar {
  -webkit-transform: rotate(342deg);
  -moz-transform: rotate(342deg);
  -ms-transform: rotate(342deg);
  -o-transform: rotate(342deg);
  transform: rotate(342deg);
}

.c100.p96 .bar {
  -webkit-transform: rotate(345.6deg);
  -moz-transform: rotate(345.6deg);
  -ms-transform: rotate(345.6deg);
  -o-transform: rotate(345.6deg);
  transform: rotate(345.6deg);
}

.c100.p97 .bar {
  -webkit-transform: rotate(349.2deg);
  -moz-transform: rotate(349.2deg);
  -ms-transform: rotate(349.2deg);
  -o-transform: rotate(349.2deg);
  transform: rotate(349.2deg);
}

.c100.p98 .bar {
  -webkit-transform: rotate(352.8deg);
  -moz-transform: rotate(352.8deg);
  -ms-transform: rotate(352.8deg);
  -o-transform: rotate(352.8deg);
  transform: rotate(352.8deg);
}

.c100.p99 .bar {
  -webkit-transform: rotate(356.4deg);
  -moz-transform: rotate(356.4deg);
  -ms-transform: rotate(356.4deg);
  -o-transform: rotate(356.4deg);
  transform: rotate(356.4deg);
}

.c100.p100 .bar {
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  transform: rotate(360deg);
}

.c100:hover {
  cursor: default;
}

.c100:hover > span {
  width: 3.33em;
  line-height: 3.33em;
  font-size: 0.3em;
  color: #72410a;
}

.c100:hover:after {
  top: 0.04em;
  left: 0.04em;
  width: 0.92em;
  height: 0.92em;
}

.c100.dark {
  background-color: #777;
}

.c100.dark .bar,
.c100.dark .fill {
  border-color: #c6ff00 !important;
}

.c100.dark > span {
  color: #777;
}

.c100.dark:after {
  background-color: #666;
}

.c100.dark:hover > span {
  color: #c6ff00;
}

.c100.green .bar, .c100.green .fill {
  border-color: #4db53c !important;
}

.c100.green:hover > span {
  color: #4db53c;
}

.c100.green.dark .bar, .c100.green.dark .fill {
  border-color: #5fd400 !important;
}

.c100.green.dark:hover > span {
  color: #5fd400;
}

.c100.orange .bar, .c100.orange .fill {
  border-color: #dd9d22 !important;
}

.c100.orange:hover > span {
  color: #dd9d22;
}

.c100.orange.dark .bar, .c100.orange.dark .fill {
  border-color: #e08833 !important;
}

.c100.orange.dark:hover > span {
  color: #e08833;
}

/*----------------------------------------------------*/
/*-----------------End: Pi Chart CSS*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
.blocks {
  background-color: #cfc4be;
  padding: 15px;
  display: inline-block;
  width: 100%;
  margin: 15px 0;
}

.chart-wrap {
  display: inline-block;
}

.chart-wrap .c100 {
  margin: 0;
}

.chart-wrap .c100 > span {
  color: #72410a;
}

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

.level-wrap .level-box {
  position: relative;
  display: inline-block;
}

.level-wrap .v-bars-wrap {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

.level-wrap .v-bars-wrap .bar {
  background-color: #b9a9a1;
  height: 100%;
  width: 15%;
  margin: 0 3%;
  display: inline-block;
  position: relative;
  border-radius: 2px;
  overflow: hidden;
}

.level-wrap .v-bars-wrap .bar .progress-level1, .level-wrap .v-bars-wrap .bar .progress-level2, .level-wrap .v-bars-wrap .bar .progress-level3 {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  background-color: #72410a;
}

.level-wrap .v-bars-wrap .bar.level1 {
  height: 40%;
}

.level-wrap .v-bars-wrap .bar.level2 {
  height: 70%;
}

.courseTitle{ padding-bottom: 10px; border-bottom: 1px solid;}
/*----------------------------------------------------*/
/*-----------------End: Dashboard CSS*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
.footer {
  padding: 15px 0 0;
  background-color: #432606;
  color: #ffffff;
  font-family: "Roboto", sans-serif;
  font-weight: 200;
}

.footer .site-map {
  list-style: none;
  text-align: center;
  padding: 0;
}

.footer .site-map li {
  display: inline-block;
}

.footer .site-map a {
  color: #ffffff;
  padding: 15px 0;
  margin: 0 15px;
}

.footer .copyright {
  padding: 10px 0;
  font-size: 12px;
}

.cursor-auto {
  cursor: auto !important;
}

/*----------------------------------------------------*/
/*-----------------End: INDEX CSS*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/
/*----------------------------------------------------*/
/*-----------------MEDIA CSS*/
/*----------------------------------------------------*/
@media screen and (max-width: 767px) {
  .header .header-contact {
    font-size: 13px;
  }
  .header .about-inshorts {
    text-align: left;
  }
  .navbar-toggle {
    border-color: #ebe7e8;
  }
  .navbar-toggle .icon-bar {
    background-color: #ebe7e8;
  }
  .navbar-collapse {
    width: 100%;
  }
  .navbar ul.navbar-nav {
    float: none;
  }
  .sp-section {
    margin-bottom: 15px;
  }
  .sp-section h3 {
    margin: 0 0 15px 0;
    font-size: 16px;
  }
  .subcribe-section .btn {
    margin-top: 0px;
    margin-bottom: 20px;
  }
  .footer .site-map li {
    display: block;
  }
  /*Course Details page*/
  .course-detail .course-detail-wrap {
    padding-bottom: 80px;
  }
  .course-detail .course-detail-wrap .course-info {
    left: auto;
  }
}

/*flashmessage*/
.flashmessage {
  position: fixed;
  top: 62px;
  right: 0;
  z-index: 9999;
  width: 348px;
}

.flash-success {
  color: #3cc051;
  background-color: #dff0d8;
}

.flash-danger {
  color: #ea5154;
  background-color: #fceded;
}

.flash-check {
  font-size: 25px!important;
  color: #fff;
}

.flash-title {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 19px;
  margin: 1px 0 0 64px;
  padding: 5px 0 5px 16px;
}

.flash-content1 {
  width: 250px;
  font-size: 14px;
  font-weight: 300;
  letter-spacing: .02em;
  margin: 5px 0 0 64px;
  padding: 0 0 10px 16px;
  color: #333;
}

/*braintree header message*/
.headersubscription-alert{
  background-color: #f2dede;
}

.flash-content2 {
  font-size: 14px;
  font-weight: 300;
  letter-spacing: .02em;
  color: #333;
}

.flash-notify-success {
  background-color: #3cc051;
}

.flash-notify-danger {
  background-color: #ea5154;
}

.flash-notify {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 64px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.result-alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid #72410a;
  border-radius: 4px;
}

.alert-danger {
  border-color: #ebccd1 !important;
}

.alert-success {
  border-color: #d6e9c6 !important;
}

.alert {
  background-color: white;
  color: black;
  border: none !important;
  border-radius: 0 !important;
  padding: 0;
  margin-bottom: 0;
}

.alert-dismissable .close,
.alert-dismissible .close {
  color: black;
  top: 2px;
  right: 0 !important;
}

.closebtn:hover {
  color: white;
}

.loader {
  font-size: 50px;
  margin: 50px 50% 20px;
}

.noRecordFound {
  margin: 50px 0 25px 43%;
  font-size: 20px;
}

.max-height-260 {
  max-height: 260px !important;
}
.height-200 {
  height: 200px !important;
}
.height-88 {
  height: 88px !important;
}
.height-88 a{
  color: #72410a !important;
}
.max-width-470 {
  max-width: 470px !important;
}
.max-width-500 {
  max-width: 500px !important;
}
.mb-35 {
  margin-bottom: 35px !important;
}
.mt-25 {
  margin-top: 25px !important;
}
.mt-10 {
  margin-top: 10px !important;
}
.mt-75 {
  margin-top: 75px !important;
}
.font-size-70 {
  font-size: 70px !important;
}

.start-time {  font-size: 30px;  font-weight: 700;  margin-bottom: 10px;  }
/*----------------------------------------------------*/
/*-----------------End: MEDIA CSS*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/

/*-----------------Login & Register*/
/*----------------------------------------------------*/
#loginPopup a:hover, #signupPopup a:hover{ cursor: pointer; text-decoration: none !important;}
#loginPopup .redirectLink, #signupPopup .redirectLink{margin-top: 15px;}
.form-group .has-error{ color: #e73d4a!important;  }
.form-group .help-block{ color: #e73d4a!important;  font-size: 13px; }

/*----------------------------------------------------*/
/*-----------------End: Login & Register*/
/*----------------------------------------------------*/
/*////////////////////////////////////////////////////*/
/*----------------------------------------------------*/

.img-center {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.popup-title {
  padding: 20px 10px 15px !important;
}

.popup-btn {
  font-size: 16px;
  padding: 8px 16px !important;
}

#clockdiv {  font-weight: 700;  font-size: 20px;  margin-bottom: 20px;  }
/*-----------------Image Hover*/
/*----------------------------------------------------*/
.view-more {margin: -35px 15px 0 0 !important;  float: right;}
.course-video-eye{ background-color: unset !important; position: inherit !important; height: 0 !important;  padding: 0 !important;}
.outerDivHoverEffect:hover{ background-color: black !important;}
.outerDivHoverEffect{ background-color: black !important;}
.imgHoverEffect{  opacity: 1;  display: block;  width: 100%;  height: auto;  transition: .5s ease;  backface-visibility: hidden;  }
.imgHoverEffect:hover { opacity: 0.5; }
/*----------------------------------------------------*/
/*-----------------End: Image Hover*/
/*----------------------------------------------------*/
/*-----------------Course Description Popup*/
/*----------------------------------------------------*/
#courseDescriptionPopup .courseDescriptionTitle{ text-align: center; padding-bottom: 10px;}
#courseDescriptionPopup .courseDescriptionData{  margin-top: -30px; padding: 2% 5%; }
#courseDescriptionPopup {top: 20%;}
/*----------------------------------------------------*/
/*-----------------End: Course Description Popup*/
/*----------------------------------------------------*/

/*----------------------------------------------------*/
/*-----------------CSS changes 16 Nov:*/
/*----------------------------------------------------*/
.container{
	min-width:100%;
}

.btn-primary.btn-lg{padding: 6px 12px;}

.btn-primary,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:active:focus,
.btn-primary:active:hover,
.btn-primary.disabled.focus,
.btn-primary.disabled:focus,
.btn-primary[disabled].focus,
.btn-primary[disabled]:focus {
  background-color: #DF2935;
  color: #ffffff;
  border: 0;border: 2px solid transparent;
  font-size: 22px;
  
	-webkit-transition: 	border-color 350ms ease-out;
	-moz-transition: 		border-color 350ms ease-out;
	-o-transition: 			border-color 350ms ease-out;
	transition: 			border-color 350ms ease-out;
  
}

.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
.btn-primary:hover {
  background-color: #DF2935;
  color: #ffffff;
  border-color:#5F1217;
}

.btn-secondary.btn-lg{padding: 6px 12px;}
.btn-secondary,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary:active:focus,
.btn-secondary:active:hover,
.btn-secondary.disabled.focus,
.btn-secondary.disabled:focus,
.btn-secondary[disabled].focus,
.btn-secondary[disabled]:focus {
  background-color: #3772FF;
  color: #ffffff;
  border: 0;border: 2px solid transparent;
  font-size: 22px;
}

.btn-secondary.disabled:hover,
.btn-secondary[disabled]:hover,
.btn-secondary:hover {
  background-color: #3772FF;
  color: #ffffff;
  border-color:#1B397F;
  
	-webkit-transition: 	border-color 350ms ease-out;
	-moz-transition: 		border-color 350ms ease-out;
	-o-transition: 			border-color 350ms ease-out;
	transition: 			border-color 350ms ease-out;
  
}

.btn-watch-video{background-color: #3772FF;  color: #ffffff;  border: 2px solid transparent; font-size: 18px;}
.btn-message-popup{background-color: #3772FF;  color: #ffffff;  border: 2px solid transparent; font-size: 18px; width: 20%; margin-bottom: 20px;}
.btn-resendmessage-popup{background-color: #3772FF;  color: #ffffff;  border: 2px solid transparent; font-size: 18px; width: 130px; margin-bottom: 20px;}
.disabled {
  cursor: not-allowed !important;
  pointer-events: none;
}

.hightlight-class,a.hightlight-class,
.header .header-contact a.hightlight-class {
	color:#DF2935;
}

.card {margin: 15px 0 30px;display: inline-block;width: 100%;border-radius:1px;}
.thumbnail{border-radius:0;}

.sp-section .displayThumb{margin: 0 !important;}
.thumbnail.hightlight-thumb {background-color: #DF2935;}
.sp-section {padding-top: 0px;}

.font-20{font-size:20px;}


.quiz-wrap .quiz-list li:before,
.quiz-wrap .quiz-list li h3{font-weight:700;}

.quiz-wrap #quiz .quiz-list li div:hover::before {
  background-color: #f5d5d5 !important;
  opacity: 0.8 !important;
  transition: all 0.2s ease;
}

.quiz-wrap #quiz .quiz-list li div:has(input:checked):hover::before {
  background-color: #e89393 !important;
  opacity: 1 !important;
  border: 2px solid #d97373;
}

.card .thumb-cover .fa{text-shadow: 0px 0px 3px #000;}
.card .thumb-cover{color:#DF2935;}
.card:hover .thumbnail{
	background-color:#DF2935;
	-webkit-transition: 	all 350ms ease-out;
	-moz-transition: 		all 350ms ease-out;
	-o-transition: 			all 350ms ease-out;
	transition: 			all 350ms ease-out;
	
}

.navbar-fixed {
	top: 0;
	z-index: 100;
	position: fixed;
	width: 100%;
}
.sp-section {
    padding-bottom: 15px;
}

@media screen and (min-width: 767px) {
	.vcenter {
		/*display: inline-block;*/
		display: table-cell;
		vertical-align: middle;
		float: none;
	}
	.width-auto-sm{width:auto;}
}
/*----------------------------------------------------*/
/*-----------------END: CSS changes 16 Nov:*/
/*----------------------------------------------------*/

/*-----------------Scroller*/
/*----------------------------------------------------*/
#style-1::-webkit-scrollbar-track {  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  border-radius: 10px;  background-color: #dcd6d3;  }

#style-1::-webkit-scrollbar {  width: 10px;  background-color: #cfc4bf;  }

#style-1::-webkit-scrollbar-thumb {  border-radius: 10px;  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);  background-color: #cfc4be;  }
/*----------------------------------------------------*/
/*-----------------END: Scroller*/
/*----------------------------------------------------*/

/*-----------------Counter*/
/*----------------------------------------------------*/
.incremental-counter .num {
  background: #f8f8f8 none repeat scroll 0 0;
  border: 1px solid #fff;
  border-radius: 4px;
  color: #3772FF;
  display: inline-block;
  height: 64px;
  line-height: 62px;
  margin: 0 4.5px;
  position: relative;
  text-align: center;
  top: -1px;
  width: 50px;
  font-size: 45px;
  font-size: 3.72625em;
  font-weight: 700;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.45);
  font-family: "Open Sans",Arial,Helvetica,sans-serif;
}
.incremental-counter .num::before {
  background: #00aae6;
  content: "";
  display: block;
  height: 1px;
  left: -1px;
  margin: -0.5px 0 0;
  position: absolute;
  right: -1px;
  top: 50%;
  width: auto;
}
/*----------------------------------------------------*/
/*-----------------END: Counter*/
/*----------------------------------------------------*/

/*-----------------Forgot Password*/
/*----------------------------------------------------*/
.forgotpassword-heading{color: #ffffff; background-color: #72410a; border-color: #ddd; padding: 10px 15px; border-bottom: 1px solid transparent;}
/*----------------------------------------------------*/
/*-----------------END: Forgot Password*/


.website-use-popup{
	max-width: 260px;
    background-color: #fff;
    padding: 30px 10px 10px;
    border: 1px solid #DF2935;
	background-color:#FFEEEE;
	text-align:center;
	border-radius:4px;
}
.website-use-popup :lang(eng){
	font-family: "Roboto", sans-serif;
}
.website-use-popup .popup-content,
.website-use-popup .popup-footer{
	text-align:center;
}
.website-use-popup .close-btn{
	float:right;
	color:#DF2935;
	margin-top: -20px;
}
.website-use-popup .popup-footer .btn{
	font-size:14px;
	text-transform:uppercase;
	margin-top:15px;
}
@media (min-width: 768px){
  .website-use-popup{top: 396px !important;}
}
/*-----------------Admin Panel*/
/*----------------------------------------------------*/
.border{ border: 1px solid #72410a;}
.dark-strip-background{ background: #72410a; color: #ffffff;}
.caption{padding: 8px;}
.caption > i.fa-list-ul{margin-right: 10px;}
.dark-strip-body{padding: 15px;}
.table-toolbar { margin-bottom: 20px; }
.width80{width: 80px;}
.table-striped>tbody>tr:nth-of-type(odd),.table-striped>tbody>tr:nth-of-type(even){background-color: #f9f9f9 !important;}
#adminPanelSidebar .wrapper{border: 1px solid #72410a; min-height: 590px; padding: 15px; background-color: #e8cccc;}
#adminPanelSidebar ul li {color: #72410a;}
#adminPanelSidebar ul li a{color: #72410a !important; display: block; text-align: center; padding: 10px 15px;}
#adminPanelSidebar ul li.active a, #adminPanelSidebar  ul li :hover {color: #ffffff !important; background: #72410a;}
.btn-export{background-color: #3772FF;  color: #ffffff; border: 2px solid transparent; font-size: 18px;}
#usersTable .bottom a{ display: none; top: 53px; position: absolute; right: 30px; background-color: #3772FF;  color: #ffffff;  border: 1px solid transparent; }

/* Admin panel action buttons - brown theme */
.btn-admin,
.btn-admin:focus,
.btn-admin:active,
.btn-admin:active:focus {
  background-color: #72410a;
  color: #ffffff;
  border: 1px solid #72410a;
  font-size: 13px;
  padding: 6px 14px;
  border-radius: 3px;
  line-height: 1.42;
  outline: none;
  box-shadow: none;
}
.btn-admin:hover {
  background-color: #5b3408;
  color: #ffffff;
  border-color: #5b3408;
}
.btn-admin[disabled],
.btn-admin[disabled]:hover {
  background-color: #a08060;
  color: #ffffff;
  border-color: #a08060;
  cursor: not-allowed;
  opacity: 0.7;
}

/* Danger variant for delete actions */
.btn-admin-danger,
.btn-admin-danger:focus,
.btn-admin-danger:active,
.btn-admin-danger:active:focus {
  background-color: #DF2935;
  color: #ffffff;
  border: 1px solid #DF2935;
  font-size: 13px;
  padding: 6px 14px;
  border-radius: 3px;
  line-height: 1.42;
  outline: none;
  box-shadow: none;
}
.btn-admin-danger:hover {
  background-color: #b8222b;
  color: #ffffff;
  border-color: #b8222b;
}
.btn-admin-danger[disabled],
.btn-admin-danger[disabled]:hover {
  background-color: #e88a8f;
  color: #ffffff;
  border-color: #e88a8f;
  cursor: not-allowed;
  opacity: 0.7;
}

/* Outline variant for cancel/secondary actions */
.btn-admin-outline,
.btn-admin-outline:focus,
.btn-admin-outline:active,
.btn-admin-outline:active:focus {
  background-color: transparent;
  color: #72410a;
  border: 1px solid #72410a;
  font-size: 13px;
  padding: 6px 14px;
  border-radius: 3px;
  line-height: 1.42;
  outline: none;
  box-shadow: none;
}
.btn-admin-outline:hover {
  background-color: #72410a;
  color: #ffffff;
}

/* Icon-only buttons in tables (compact, fixed size to prevent shift) */
.btn-admin-icon {
  padding: 4px 8px;
  font-size: 12px;
  line-height: 1;
  border-radius: 3px;
  width: 30px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Admin panel nav-tabs - brown theme */
.dark-strip-body .nav-tabs { border-bottom-color: #c69c6c; margin-bottom: 20px; }
.dark-strip-body .nav-tabs > li > a {
  background-color: #dbc1a3;
  color: #72410a;
  border-radius: 0;
  border: 1px solid #c69c6c;
  margin-right: 2px;
  font-size: 13px;
  padding: 8px 16px;
}
.dark-strip-body .nav-tabs > li.active > a,
.dark-strip-body .nav-tabs > li.active > a:hover,
.dark-strip-body .nav-tabs > li.active > a:focus {
  background-color: #72410a;
  color: #ffffff;
  border-color: #72410a;
}
.dark-strip-body .nav-tabs > li > a:hover {
  background-color: #c69c6c;
  color: #ffffff;
}

/* Admin form controls (page + modals) */
.dark-strip-body .form-control,
.admin-modal .modal-content .form-control {
  background-color: #f5f2f3;
  box-shadow: none;
  border: 1px solid #ccc;
  border-width: 0 0 1px 0;
  border-radius: 0;
  font-size: 13px;
  height: 34px;
  padding: 6px 4px;
  color: #333;
  transition: border-color 0.2s, background-color 0.2s;
}
.dark-strip-body textarea.form-control,
.admin-modal .modal-content textarea.form-control { height: auto; }
.dark-strip-body .form-control:focus,
.admin-modal .modal-content .form-control:focus {
  border-color: #72410a;
  background-color: #ffffff;
  box-shadow: none;
}
.dark-strip-body .form-control[disabled] {
  background-color: #ebe7e8;
  color: #666;
  cursor: default;
  border-color: #ddd;
}
.dark-strip-body select.form-control {
  border-width: 1px;
  border-radius: 3px;
}
.dark-strip-body label {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 4px;
  color: #555;
}
.dark-strip-body .form-group { margin-bottom: 12px; }
.dark-strip-body .form-group small.text-muted {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  color: #888;
}
.dark-strip-body .form-control::placeholder { color: #aaa; font-style: italic; }
.dark-strip-body .radio-inline { font-weight: 400; font-size: 13px; color: #333; }

/* Video list panel */
.video-list-scroll { max-height: 500px; overflow-y: auto; margin-top: 10px; }
.video-list-scroll .table { margin-bottom: 0; font-size: 13px; }
.video-list-scroll .table > tbody > tr > td { padding: 8px 10px; vertical-align: middle; color: #333; }
.video-list-scroll .table > tbody > tr.hand:hover { background-color: #f0e6da !important; }

/* Active video row */
.active-row,
.active-row:hover,
.active-row > td,
.active-row:hover > td {
  background-color: #72410a !important;
  color: #ffffff !important;
}
.active-row .text-muted { color: #dbc1a3 !important; }

/* Questions tab header */
.questions-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.questions-header span { font-size: 13px; color: #555; }

/* Question table */
.dark-strip-body .table-condensed > thead > tr > th,
.dark-strip-body .table-condensed > tbody > tr > td { font-size: 13px; vertical-align: middle; color: #333; }
.dark-strip-body .table-condensed > thead > tr > th { border-bottom: 2px solid #c69c6c; color: #555; font-weight: 600; padding: 8px; }
.dark-strip-body .table-condensed > tbody > tr > td { padding: 8px; }

/* Action button group in tables */
.action-btns { white-space: nowrap; }
.action-btns .btn + .btn { margin-left: 4px; }

/* Button row for form actions */
.form-actions { margin-top: 16px; padding-top: 12px; border-top: 1px solid #dbc1a3; }
.form-actions .btn + .btn { margin-left: 8px; }

/* Input-group append button (e.g. preview eye icon) */
.btn-input-append { height: 34px; padding: 6px 10px; border-radius: 0 3px 3px 0; }

/* Admin modal shared styles */
.admin-modal .modal-content { background-color: #ebe7e8; border-radius: 4px; }
.admin-modal .modal-header { padding: 14px 20px; }
.admin-modal .modal-header .close { color: #999; opacity: 0.8; font-size: 20px; margin-top: 0; }
.admin-modal .modal-header .close:hover { color: #333; opacity: 1; }
.admin-modal .modal-header .modal-title { font-size: 15px; font-weight: 600; }
.admin-modal .modal-body { padding: 20px; }
.admin-modal .modal-footer { padding: 14px 20px; }
.admin-modal .modal-footer .btn { font-size: 13px; padding: 6px 14px; }
.admin-modal .modal-content label { font-size: 13px; font-weight: 600; color: #555; margin-bottom: 6px; }
.admin-modal .modal-content .form-group { margin-bottom: 16px; }
.admin-modal .modal-content small.text-muted { font-size: 11px; color: #999; }

/* Question modal */
.admin-modal.modal-question .modal-header { border-bottom: 2px solid #72410a; }
.admin-modal.modal-question .modal-header .modal-title { color: #72410a; }
.admin-modal.modal-question .modal-footer { border-top: 1px solid #c69c6c; }
.admin-modal.modal-question .modal-content .input-group { margin-bottom: 10px; }
.admin-modal.modal-question .modal-content .input-group .input-group-addon {
  background-color: #dbc1a3;
  border: 1px solid #c69c6c;
  color: #555;
  font-size: 13px;
  font-weight: 600;
  padding: 6px 10px;
  min-width: 40px;
  text-align: center;
}
.admin-modal.modal-question .modal-content .input-group .form-control {
  border-width: 1px;
  border-color: #c69c6c;
  border-radius: 0;
  height: 36px;
}
.admin-modal.modal-question .modal-content .input-group .input-group-btn .btn {
  border: 1px solid #c69c6c;
  background-color: #f5f0eb;
  color: #555;
  height: 36px;
  padding: 6px 10px;
  font-size: 13px;
}
.admin-modal.modal-question .modal-content .input-group .input-group-btn .btn:hover {
  background-color: #e8cccc;
  color: #333;
}

/* Delete confirmation modal */
.admin-modal.modal-delete .modal-header { border-bottom: 2px solid #DF2935; }
.admin-modal.modal-delete .modal-header .modal-title { color: #DF2935; }
.admin-modal.modal-delete .modal-header .modal-title .fa { margin-right: 6px; }
.admin-modal.modal-delete .modal-footer { border-top: 1px solid #c69c6c; }
.admin-modal.modal-delete .modal-body { text-align: center; padding: 24px 20px; }
.admin-modal.modal-delete .modal-body .delete-icon {
  display: inline-block;
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 50%;
  background-color: #fde8ea;
  color: #DF2935;
  font-size: 22px;
  margin-bottom: 14px;
}
.admin-modal.modal-delete .modal-body p { font-size: 13px; color: #333; margin: 0; }

/* Empty state placeholder */
.empty-state { padding: 60px 20px; text-align: center; color: #c69c6c; }
.empty-state i { font-size: 48px; }
.empty-state p { margin-top: 12px; font-size: 14px; }

/* Alert banner for admin */
.video-alert {
  margin-bottom: 15px;
  font-size: 13px;
  padding: 12px 35px 12px 14px;
  border-radius: 4px;
  border-left: 4px solid;
  position: relative;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
.video-alert.alert-success {
  background-color: #f0f9eb;
  border-left-color: #5a9a32;
  color: #3c6e1f;
}
.video-alert.alert-success .close,
.video-alert.alert-success .fa { color: #5a9a32; }
.video-alert.alert-danger {
  background-color: #fef0f0;
  border-left-color: #c53929;
  color: #a31515;
}
.video-alert.alert-danger .close,
.video-alert.alert-danger .fa { color: #c53929; }
.video-alert .fa {
  margin-right: 8px;
  font-size: 15px;
}
.video-alert .close {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.7;
  font-size: 18px;
  font-weight: normal;
  text-shadow: none;
}
.video-alert .close:hover { opacity: 1; }
.video-alert {
  animation: alertSlideIn 0.3s ease-out;
}
@keyframes alertSlideIn {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Loading indicators */
.loading-panel { text-align: center; padding: 30px 20px; color: #999; }
.loading-panel i { color: #72410a; }
.loading-panel span { display: block; margin-top: 8px; font-size: 12px; }

@media (max-width: 767px){
    #adminPanelSidebar{display: none;}
}
/*----------------------------------------------------*/
/*-----------------END: Admin Panel*/

/*-----------------Books*/
/*----------------------------------------------------*/
#allBooks .btn-primary {font-size: 18px;}
#allBooks .booksImg {width: 100%; height: 350px;}
#allBooks .searchBook{width: 250px;}
#allBooks .dropdownLanguage{width: 150px;}
#allBooks .noRecordFound {margin: 0; margin-top: 5%; font-size: 30px; min-height: 200px;}
/*----------------------------------------------------*/
/*-----------------END: Books*/

.form-content input { background-color: #ebe7e8; box-shadow: none; border: 1px solid #aeaeae; border-width: 0 0 1px 0; border-radius: 0;}
.form-content .form-control:focus { box-shadow: none;}

/*-----------------Sign in Google Button*/
/*----------------------------------------------------*/
#registerForm .g-signin2 .abcRioButton, #loginForm .g-signin2 .abcRioButton { width: 100% !important;height: 30px !important;background-color: transparent;box-shadow: unset!important;}
#registerForm .g-signin2 .abcRioButtonLightBlue, #loginForm .g-signin2 .abcRioButtonLightBlue { background-color: transparent;color: #fff;}
#registerForm .g-signin2 .abcRioButtonIcon, #loginForm .g-signin2 .abcRioButtonIcon { display: none;}
#registerForm .g-signin2 .abcRioButtonContents span, #loginForm .g-signin2 .abcRioButtonContents span{display: none;}
#registerForm .g-signin2 .abcRioButtonContents:before {content: "Sign up with Google"; font-size: 20px; float: left; }
#loginForm .g-signin2 .abcRioButtonContents:before {content: "Sign in with Google"; font-size: 20px; float: left; }
#addGoogle {float: left;}
/*----------------------------------------------------*/
/*-----------------END: Sign in Google Button*/

/*-----------------Share Icon*/
/*----------------------------------------------------*/
.viewInlineShareIcon a {margin-right: 5px;}
.viewInlineShareIcon a:hover, .viewInlineShareIcon a:focus {text-decoration: none !important;}
.shareFacebook{height: 32px; width: 33px; border-radius: 6px;}
.shareTweet{height: 34px; width: 33px;}
.shareEmail{height: 33px; width: 33px; border-radius: 6px;}
/*----------------------------------------------------*/
/*-----------------END: Share Icon*/

/*-----------------Media Page*/
/*----------------------------------------------------*/
#media .mediaPageTabs .nav-tabs li {width: 50%}
#media .mediaPageTabs .nav-tabs li a { background-color: #dbc1a3; color: #72410a;}
#media .mediaPageTabs .nav-tabs li.active a { background-color: #72410a; color: #fff;}
#media .mediaTable table thead tr th {text-align: center;}
#media .mediaTable table tbody tr td {text-align: center;}
/*----------------------------------------------------*/
/*-----------------END: Media Page*/