@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,400italic,600italic,700,700italic,300italic,300&subset=latin,cyrillic);

@media print {
  html,
  body {
    display: none; /* hide whole page */
  }
}

[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
  display: none !important;
}

html {
  position: relative;
  min-height: 100%;
}

html,
body {
  min-width: 480px;
  font-size: 16px;
  font-family: 'Open Sans', Arial, sans-serif;
  color: #2e2e2e;
}
body {
  display: flex;
  flex-direction: column;
  background: #faf1ec;
  min-width: 320px;
  min-height: 100vh;
}

a:focus,
a:active,
a:hover {
  outline: 0;
  text-decoration: none;
}

a {
  color: #2a2a68;
  font-size: 16px;
  font-family: 'Open Sans', Arial, sans-serif;
}

a:hover {
  color: #53539f;
}

a.underline {
  border-bottom: 1px solid #b9b9e6;
}

a.dashed,
glossary {
  border-bottom: 1px dashed #53539f;
  font-weight: 600;
}

img {
  max-width: 100%;
  height: auto;
}

iframe {
  max-width: 100%;
}

glossary {
  color: #2a2a68;
}

.glossary .glyphicon {
  font-size: 80%;
  margin-left: 5px;
}

.top-10 {
  margin-top: 10px;
}
.top-15 {
  margin-top: 15px;
}
.top-30 {
  margin-top: 30px;
}
.top-40 {
  margin-top: 40px;
}
.top-50 {
  margin-top: 50px;
}

.bottom-15 {
  margin-bottom: 15px;
}
.bottom-30 {
  margin-bottom: 30px;
}
.bottom-40 {
  margin-bottom: 40px;
}
.bottom-50 {
  margin-bottom: 40px;
}

.row.small-padding {
  margin-left: -10px;
  margin-right: -10px;
}

.row.small-padding [class*='col-'] {
  padding: 10px;
}

input,
textarea {
  background: #fff;
  padding: 10px;
  border: 1px #ecd5c7 solid;
  color: #53539f;
}

textarea {
  width: 100%;
  height: 200px;
}

select {
  border: none;
  padding: 10px;
  padding-right: 25px;
  color: #53539f;
  -webkit-appearance: none; /*Removes default chrome and safari style*/
  -moz-appearance: none; /*Removes default style Firefox*/
  background: url('../img/caret.png') no-repeat right;
  border: #9595dc 1px transparent;
}

select::-ms-expand {
  display: none;
}

select:disabled {
  opacity: 0.4;
}

select option {
  padding-left: 10px;
  border: none;
}

select:focus,
input:focus,
textarea:focus {
  outline: none;
}

label {
  font-weight: 500;
}

input[type='file'] {
  background: #faf1ec;
}

input[type='checkbox'],
input[type='radio'] {
  width: 15px;
  height: 15px;
}

input.wide {
  width: 100%;
}

fieldset {
  padding: 20px;
  border: 1px solid #ecd5c7;
}

legend {
  font-size: 16px;
  width: auto;
  font-weight: 600;
  margin-bottom: 0;
  border-bottom: 0;
  padding: 5px;
}

.text-danger {
  color: #ff2a2a;
  font-size: 14px;
}

.navbar-collapse {
  padding: 0;
}

.white-block select,
.white-block input,
.white-block textarea,
.white-block .ui-select-container {
  background-color: #faf1ec;
}

.btn {
  font-weight: 600;
  background-color: #ed5e61;
  color: #fff;
  padding: 15px;
  text-transform: uppercase;
  font-size: 16px;
  border: none;
  transition: 0.25s ease-in-out;
}

.btn-sm {
  padding: 5px 10px;
  font-size: 12px;
}

.btn.btn-light {
  background: #f18c93;
}

.btn.btn-light:hover {
  background-color: #ed5e61;
}

.btn[disabled] {
  cursor: default;
  opacity: 0.5;
  -webkit-box-shadow: inherit;
  box-shadow: inherit;
}

/* .btn[disabled]:hover {
  background: inherit;
} */

.btn.pale {
  background: #ecd5c7;
}

.btn.pale:hover,
.btn.pale:focus {
  background: #e1c3b1;
}

.btn.pale .tools {
  display: inline;
  margin-right: -5px;
}

.btn.pale .tools > .edit,
.btn.pale .tools > .delete,
.btn.pale .tools > .accept {
  margin-bottom: -5px;
  opacity: 0.4;
}

.btn.pale:hover .tools > .edit,
.btn.pale:hover .tools > .delete,
.btn.pale:hover .tools > .accept {
  opacity: 0.8;
}

.btn.pale:hover .tools > .edit:hover,
.btn.pale:hover .tools > .delete:hover,
.btn.pale:hover .tools > .accept:hover {
  opacity: 1;
}

.btn.pale.input {
  padding: 6px 15px;
  cursor: auto;
  margin-top: -10px;
}

.btn.pale.input input {
  height: 30px;
  margin-bottom: 0;
}

.btn:hover,
.btn:focus {
  background: #f18c93;
  color: #fff;
  border: none;
}

.btn:disabled:hover,
.btn:disabled:focus {
  pointer-events: none;
}

.btn.active {
  position: relative;
  box-shadow: none;
}

.btn.active:hover:after {
  border-color: #f18c93 transparent transparent transparent;
}

h1 {
  font-size: 28px;
  margin: 50px 0 40px;
  font-weight: 400;
}

h2 {
  font-weight: 600;
  font-size: 26px;
}

h3 {
  font-weight: 600;
  font-size: 22px;
}

h4 {
  font-weight: 600;
  font-size: 18px;
  margin: 6px 0;
}

.lead {
  color: #24266a;
  font-weight: 400;
}

.light,
.light a {
  font-size: 14px;
  color: #919191;
  text-transform: none !important;
  font-weight: 500;
  line-height: 18px;
}

.light a {
  color: #53539f;
}

.container {
  padding: 0;
}

.container.white {
  background: #fff;
  padding: 30px;
}

.container.main {
  margin-bottom: 24px;
}

.btn .caret {
  margin-left: 5px;
}

.top-filters-hr {
  margin: 10px 0;
}

.top-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.top-filters button {
  margin: 0 !important;
}

.top-filter input,
.top-filter select {
  height: 50px;
  border: none;
  max-width: 210px;
  background-color: #fff;
  margin-bottom: 10px;
}

.top-filter input + input,
.top-filter select + select {
  margin-left: 3px;
}

.top-filter h1 button {
  margin-left: 10px;
}

.top-filter .search input {
  background: #ecd5c7;
}

.top-filter .btn + .btn {
  margin-left: 10px;
}

.top-filter .btn + .dropdown {
  display: inline-block;
  margin-left: 10px;
}

.top-filter .dropdown-menu {
  width: 100%;
}

.top-filter .dropdown-menu > li > a {
  text-align: left;
}

.breadcrumb + .top-filter h1 {
  margin-top: 15px;
}

.tooltip-inner {
  background: #53539f;
  width: 300px;
  text-align: left;
}

.tooltip.top .tooltip-arrow {
  border-top-color: #53539f;
}

.tooltip.bottom .tooltip-arrow {
  border-bottom-color: #53539f;
}

.no-content {
  text-align: center;
  opacity: 0.5;
  margin: 100px 0;
  font-size: 24px;
  line-height: 40px;
}

.no-content .glyphicon {
  font-size: 66px;
  opacity: 0.4;
  display: block;
  margin-bottom: 10px;
}

.no-content a {
  font-size: 24px;
  border-bottom: 1px solid #2a2a68;
}

.devider {
  width: 100%;
  height: 1px;
  background: #ecd5c7;
  margin-top: 30px;
}

.break-word {
  word-break: break-word;
}

/* ================= modal ================= */

.modal-content {
  background: #faf1ec;
  border-radius: 0;
}

.modal-content img {
  max-width: 100%;
  margin: 0 auto 30px;
}

.modal-footer,
.modal-header {
  text-align: center;
  border: none;
}

.modal-title {
  font-size: 24px;
  color: #53539f;
  margin: 15px 0 0;
}

.modal-body {
  padding: 15px 40px;
}

.modal-body label {
  width: 140px;
  vertical-align: top;
  margin-right: 15px;
  margin-top: 7px;
}

.modal-body form div {
  margin-bottom: 20px;
}

.modal-dialog button.close {
  margin: -5px 0 20px 0;
  font-size: 34px;
  color: #53539f;
  font-weight: 400;
  opacity: 0.5;
}

.modal-dialog button.close:hover {
  color: #ed5e61;
}

.modal-dialog button.close:hover {
  outline: none;
}

.modal-dialog.add-user img {
  max-width: 300px;
  display: inline-block;
}

.modal-dialog.add-user form {
  margin: 0 auto;
  width: 460px;
}

.modal-dialog.add-user input,
.modal-dialog.add-user textarea,
.modal-dialog.add-user select {
  width: 300px;
  background-color: #fff;
  border: 1px #ecd5c7 solid;
}

.modal-dialog.add-user input[type='radio'],
.modal-dialog.add-user input[type='checkbox'] {
  width: auto;
}

.modal-dialog.add-user textarea {
  height: 150px;
  resize: vertical;
}

.modal-dialog.add-user button {
  margin-bottom: 20px;
}

.modal-dialog.add-user .class-group select {
  width: 80px;
  margin-right: 3px;
}

.modal-dialog.add-user .class-group select + select {
  width: 210px;
}

.modal-dialog.add-user input[type='checkbox'] {
  width: 15px;
  height: 15px;
}

.modal-dialog .select button {
  border: 1px #ecd5c7 solid;
  width: 100%;
}

#user-modal .modal-body {
  padding: 30px 30px 40px 30px;
}

.modal-lg .modal-body label,
.modal-dialog.modal-lg.add-user textarea,
.modal-dialog.modal-lg.add-user select,
.modal-dialog.modal-lg.add-user input[type='text'] {
  width: 100%;
}

.modal-dialog.modal-lg.add-user form {
  width: 90%;
}

.modal-dialog.modal-lg.add-user .answer textarea {
  height: 100px;
}

.modal-lg .answer input[type='radio'],
.modal-lg .answer input[type='checkbox'] {
  left: -20px;
  top: 10px;
}

.modal-lg .answer.row input[type='radio'],
.modal-lg .answer.row input[type='checkbox'],
.modal-lg .answers .list .answer:before {
  left: -10px;
}

.modal-lg .modal-body form .answer {
  margin-bottom: 10px;
}

/* ================= modal add-subject ================= */

.modal-dialog.add-subject {
  width: 600px;
}

.modal-dialog.add-subject form {
  margin: 0 auto;
  width: 350px;
}

.modal-dialog.add-subject button:not(.close) {
  margin: 20px 0;
}

.modal-dialog.add-subject button.pale {
  margin: 10px 0 0;
}

.scroll-pane {
  width: 100%;
  height: 250px;
  overflow: auto;
}

.scroll-pane:focus {
  outline-color: #fff;
}

.scroll-pane.white-block {
  margin: 20px auto;
}
.scroll-pane .pics > div {
  padding: 15px;
}

.scroll-pane .pics a {
  padding: 10px 0;
  display: block;
  height: 50px;
}

.scroll-pane .pics a:hover {
  background: #e7e7f1;
}

.scroll-pane .pics a.active {
  background: #ed5e61;
}

.scroll-pane .pics {
  padding: 0 15px;
  max-width: 570px;
}

.picked {
  width: 220px;
  height: auto !important;
  margin: 0 auto 30px;
  padding-bottom: 20px;
}

.picked p.img {
  height: 120px;
}

/* ================= table ================= */

table {
  width: 100%;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > th,
td {
  padding: 15px 10px;
}

tr {
  border-bottom: #ecd5c7 1px solid;
}

thead {
  background: #ecd5c7;
  font-weight: 600;
}

thead td {
  padding: 10px 20px;
}

tbody {
  background: #fff;
}

/* ================= header ================= */

header {
  margin-top: 20px;
}

.logo {
  display: block;
  width: auto;
  max-width: 100%;
  height: 100px;
  max-height: 100%;
  background-repeat: no-repeat;
  background-position: left;
  background-size: contain;
}

.footer-logo,
.logo {
  background: url('../img/logo.png') no-repeat left;
  background-size: contain;
}

nav {
  background-color: #53539f;
  margin-top: 30px;
}

.nav > li > a {
  font-weight: 600;
  color: #fff;
  font-size: 18px;
  text-transform: uppercase;
  padding: 18px 20px;
  white-space: nowrap;
}

.nav > li > a:focus,
.nav > li > a:hover,
.nav > li > a.active {
  background: #ed5e61;
  position: relative;
}

.nav > li > a.active:after,
.btn.active:after {
  content: '';
  position: absolute;
  bottom: -15px;
  left: 50%;
  margin-left: -20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 20px 0 20px;
  border-color: #ed5e61 transparent transparent transparent;
}

/* =========== user ============= */

.user-info {
  position: relative;
  padding-left: 120px;
  margin-top: 10px;
}

.user-info h4 {
  margin-bottom: 10px;
}

.user-info a,
.user-image a {
  font-size: 14px;
  display: block;
}

.user-info sup {
  background: #ecd5c7;
  color: #2a2a68;
  padding: 2px 5px;
}

.user-info .glyphicon-ruble {
  opacity: 0.8;
  font-size: 11px;
  margin-left: 1px;
}

.user-info a.messages span {
  background: #ed5e61;
  color: #fff;
  padding: 2px 5px 3px;
  font-size: 14px;
}

.user-info a {
  margin-left: 18px;
  position: relative;
}

.user-image a {
  margin-left: 25px;
}

.user-info a:before {
  content: '';
  position: absolute;
  height: 14px;
  width: 14px;
  background-image: url('../img/icons.png');
  background-repeat: no-repeat;
  left: -18px;
  top: 0;
}

.user-image a.pic:before {
  left: -25px;
  height: 16px;
  width: 19px;
}

.user-info a.profile:before {
  background-position: 0 0;
}
.user-info a.out:before {
  background-position: 0 -15px;
}
.user-info a.messages:before {
  background-position: 0 -30px;
}
.user-info a.administrator:before {
  background-position: 0 -45px;
}
.user-info a.site:before {
  background-position: 0 -60px;
}
.user-info a.sender:before {
  background-position: 0 -75px;
}
.user-info a.certificate:before {
  background-position: 0 -90px;
}
.user-info a.request:before {
  background-position: 0 -105px;
}

.user-image a.pic:before {
  background-position: -85px -25px;
}

.user-info .user-img {
  width: 100px;
  height: 100px;
  background: url('../img/user.svg') no-repeat center / cover;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 100%;
  border: 3px #fff solid;
}

/* ================= footer ================= */

footer {
  background: #ecd5c7;
  font-size: 14px;
  /* position: absolute; */
  bottom: 0;
  width: 100%;
  /* height:140px; */
  padding: 30px 0;
  margin-top: auto;
}

footer a {
  font-size: 14px;
}

footer .phone {
  font-size: 24px;
}

footer .glyphicon-envelope {
  margin-right: 5px;
}

.footer-logo {
  width: 90%;
  min-height: 60px;
}

footer .payments img {
  margin-right: 10px;
  margin-bottom: 10px;
  height: 25px;
}

#mail .modal-body {
  padding: 10px 30px 30px;
}

#mail .modal-body textarea {
  margin-bottom: 20px;
  resize: vertical;
}

address {
  margin-bottom: 3px;
}

/* ================= index ================= */

/* ========= info-blocks ===== */

.info-block {
  background: #ecd5c7;
  padding: 25px 25px 25px 100px;
  margin: 40px 0;
  position: relative;
}

.info-block:hover {
  background: #ecd5c7;
}

.info-block .icon {
  position: absolute;
  top: 25px;
  left: 25px;
}

.info-block .icon.schedule {
  background: url('../img/sched.png') no-repeat center;
  height: 55px;
  width: 55px;
}

.icon.date {
  background: #fff;
  border-radius: 3px;
  font-size: 28px;
  text-align: center;
  height: 60px;
  width: 100%;
  max-width: 70px;
  -webkit-box-shadow: 1px 2px 0px 0px rgba(232, 217, 217, 1);
  -moz-box-shadow: 1px 2px 0px 0px rgba(232, 217, 217, 1);
  box-shadow: 1px 2px 0px 0px rgba(232, 217, 217, 1);
}

.icon.date .month {
  background: #ed5e61;
  color: #fff;
  font-size: 14px;
  width: 100%;
  border-radius: 3px 3px 0 0;
}

.info-block h3 {
  margin-top: 0;
}

.info-block .time {
  width: 40px;
  display: inline-block;
}

.info-block ul {
  padding: 0;
  height: 150px;
  overflow: hidden;
}

.info-block li {
  margin-bottom: 3px;
  list-style: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.info-block a {
  border-bottom: 1px solid #53539f;
}

.info-block .light {
  margin-right: 5px;
}

/* ========= subjects ===== */

.subject {
  background: #fff;
  font-weight: 600;
  color: #2e2e66;
  padding: 20px 15px 15px;
  text-transform: uppercase;
  font-size: 16px;
  height: 340px;
  margin-bottom: 30px;
  text-align: left;
  overflow: hidden;
  position: relative;
}

.subject:hover {
  background: #ed5e61;
  color: #fff;
  transition: 0.5s;
}

.subject .img {
  height: 110px;
  margin-bottom: 20px;
  display: block;
}

.subject img {
  margin: 0 auto;
  max-height: 110px;
  max-width: 110px;
}

.subject .text {
  display: block !important;
  margin-bottom: 15px;
}

.subject .row {
  margin: 0;
}

.subject .subject-lector {
  font-size: 14px;
  font-weight: 400;
  margin-top: 5px;
  padding-left: 35px !important;
  padding-right: 0 !important;
  position: relative;
}

.subject .subject-lector .glyphicon {
  margin-right: 5px;
  position: absolute;
  left: 15px;
  top: 3px;
}

.subject .subject-price {
  display: inline-block;
  background: #e8d9cd;
  font-size: 14px;
  padding: 5px 7px;
  margin-top: 3px;
  margin-right: 5px;
  text-align: right;
}

.subject:hover .subject-price {
  background: #ed5e61;
}

.subject.event {
  height: 360px;
}

.subject .subject-about {
  padding: 30px;
}

.subject .subject-about .text {
  padding: 0;
  height: 70px;
}

/* ================= schedule ================= */

form.schedule select:focus {
  outline-color: #9595dc;
}

.weeks {
  text-transform: uppercase;
  font-size: 16px;
  margin: 0 0 40px;
  text-align: center;
  background: #e8d9cd;
  font-weight: 600;
  color: #2e2e66;
}

.weeks a {
  font-weight: 600;
}

.weeks .present {
  padding: 15px;
  position: relative;
}
.weeks .present:after {
  content: '';
  position: absolute;
  bottom: -15px;
  left: 50%;
  margin-left: -20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 20px 0 20px;
  border-color: #e8d9cd transparent transparent transparent;
}

.weeks .previous,
.weeks .next {
  background: #ed5e61;
  color: #fff;
  padding: 15px;
  position: relative;
}

.weeks .previous:before,
.weeks .next:after {
  content: '';
  position: absolute;
  width: 11px;
  height: 17px;
}

.weeks .previous:before {
  background: url('../img/icons.png') no-repeat -30px 0;
  left: 15px;
  top: 16px;
}

.weeks .next:after {
  background: url('../img/icons.png') no-repeat -30px -20px;
  right: 15px;
  top: 16px;
}

.weeks .previous:hover,
.weeks .next:hover {
  background: #f18c93;
}

.table-responsive {
  overflow: visible;
}

.schedule .popover {
  width: 300px;
}

.table-responsive.schedule {
  margin-bottom: 40px;
}

table.schedule {
  width: 100%;
  max-width: 100%;
  border-spacing: 10px;
  border-collapse: separate;
}

.schedule thead,
.schedule tbody {
  background-color: transparent;
}

.schedule thead td,
thead.schedule td,
thead.schedule {
  color: #53539f;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 16px;
  text-align: center;
  background-color: transparent;
}

.schedule tbody td {
  background: #fff;
  margin: 10px;
  padding: 15px;
  vertical-align: top;
  width: 170px;
  max-width: 170px;
  min-height: 140px;
  border: 2px solid transparent;
  position: relative;
  transition: 0.3s;
}

.schedule tbody td div.lesson-info {
  border-top: #d5d5d5 1px solid;
  padding: 10px 0;
}

.schedule tbody td .lesson-info > a {
  font-weight: 600;
  display: block;
  margin-bottom: 10px;
}

.schedule tbody td:hover {
  border: 2px solid #f18c93;
}

.schedule tbody td:empty {
  border: none;
  opacity: 0.8;
}

.schedule tbody td a.add-subject {
  display: none;
  transition: 0.3s;
}

.schedule tbody td:hover a.add-subject {
  position: absolute;
  display: block;
  font-weight: 600;
  color: #f18c93;
  right: 10px;
  top: 10px;
  line-height: 24px;
  font-size: 24px;
  border-bottom: none;
  transition: 0.3s;
  background: #fff;
  opacity: 0.6;
}

.schedule tbody td:hover a.add-subject:hover {
  opacity: 1;
}

.schedule .class {
  background: #ecd5c7;
  padding: 3px 6px;
  font-size: 14px;
  border-radius: 5px;
  color: #2a2a68;
  display: inline-block;
  margin-bottom: 3px;
}

.add a {
  padding-left: 15px;
  color: #f18c93 !important;
  border-bottom: 1px dashed #f18c93 !important;
  position: relative;
  font-weight: 600;
  text-transform: none !important;
}

.add a:before {
  content: '+';
  position: absolute;
  color: #f18c93;
  font-size: 24px;
  left: 0;
  top: -4px;
}

.add a:hover {
  color: #ed5e61;
}

.lesson-number {
  font-size: 60px;
  font-weight: 600;
  color: #53539f;
  opacity: 0.5;
  display: block;
}

.schedule tbody td > a {
  border-bottom: #9595dc 1px solid;
  font-weight: 600;
}

.schedule .subject-info:nth-child(2) {
  margin-top: 10px;
  font-size: 14px;
  padding-left: 18px;
}

.schedule .subject-info {
  margin-top: 10px;
  font-size: 14px;
  padding-left: 18px;
}

.schedule .subject-info a {
  font-size: 14px;
  display: block;
  margin-bottom: 2px;
}

.subject-info .teacher,
.schedule .subject-info .cabinet {
  position: relative;
}

.subject-info .teacher:before,
.subject-info .cabinet:before {
  content: '';
  position: absolute;
  height: 15px;
  width: 12px;
  background-image: url('../img/icons.png');
  background-repeat: no-repeat;
  left: -18px;
  top: 0;
  opacity: 0.8;
}

.subject-info .teacher:before {
  background-position: -15px 0;
}

.subject-info .cabinet:before {
  background-position: -15px -15px;
}

.schedule.business .lesson-number {
  font-size: 32px;
  text-align: center;
  position: relative;
}

.schedule.business .lesson-number:after {
  content: '';
  border-right: #9595dc 2px dashed;
  position: absolute;
  width: 1px;
  height: 200px;
  left: 20px;
  top: 60px;
}

.schedule.business .lesson-number sup {
  font-size: 18px;
}

.schedule.business tbody td:empty {
  opacity: 0.7;
}

.schedule .popover {
  width: 300px;
}

/* ================= tabs ================= */

.nav-pills {
  background: #e8d9cd;
}

.nav-pills > li {
  vertical-align: middle;
}

.nav-pills > li > a {
  padding: 15px 26px;
  color: #53539f;
  font-size: 16px;
  border-radius: 0;
}

.nav-pills > li > a:hover {
  color: #fff;
  background: #f18c93;
}

.nav-pills > li.active > a,
.nav-pills > li > a.active {
  background: #ed5e61;
  color: #fff;
  position: relative;
}

.nav-pills > li.active > a:hover {
  background: #f18c93;
  position: relative;
}

.nav-pills > li.active > a:after {
  content: '';
  position: absolute;
  bottom: -15px;
  left: 50%;
  margin-left: -20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 20px 0 20px;
  border-color: #ed5e61 transparent transparent transparent;
}

.nav-pills > li.active > a:hover:after,
.nav-pills > li > a.active:hover:after {
  border-color: #f18c93 transparent transparent transparent;
}

.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
  color: #fff;
  background: #ed5e61;
}

.dropdown-menu {
  border-radius: 0;
  margin: 0;
}

/* ================= homework ================= */

.homework {
  margin-bottom: 170px;
}

.homework-day {
  margin-bottom: 30px;
  border-bottom: 1px solid #e8d9cd;
}

.homework-day:last-child {
  margin-bottom: 0;
  border-bottom: 0;
}

.homework-day .row {
  margin: 30px 0;
}

.homework-day .row > div > a {
  font-weight: 600;
  display: block;
  margin-bottom: 3px;
}

/* ================= datepicker ================= */

.ui-datepicker {
  width: 288px;
  font-family: 'Open Sans';
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}

.ui-datepicker-title {
  color: #fff;
}

.ui-widget-content {
  background: #fff;
  border: 0 solid #fff;
}

.ui-widget-header {
  background: #f18c93;
  border: 0;
  border-radius: 0;
}

.ui-state-default,
.ui-widget-content .ui-state-default {
  color: #53539f;
  background: #fff;
  border: 0 solid #fff;
}

.ui-state-default:hover,
.ui-widget-content .ui-state-default:hover {
  background: #cdcdf6;
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight {
  border: 0px solid #f18c93;
  background: #f18c93;
  color: #fff;
}

.ui-datepicker-calendar tbody tr {
  border-bottom: none;
}

.ui-datepicker-calendar tr:hover .ui-state-default,
.ui-datepicker-calendar tr:hover .ui-widget-content .ui-state-default {
  background: #cdcdf6;
  color: #53539f;
}

.ui-datepicker-next,
.ui-datepicker-prev {
  cursor: pointer;
}

.ui-datepicker-next:hover,
.ui-datepicker-prev:hover {
  background: #ed5e61;
  border: 0;
  border-radius: 0;
}

.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
  background-image: url('../img/ui-icons_ffffff_256x240.png');
}
.ui-widget-header .ui-icon {
  background-image: url('../img/ui-icons_ffffff_256x240.png');
}
.datepicker-day {
  width: 300px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}

.ui-state-disabled,
.ui-widget-content .ui-state-disabled {
  opacity: 0.6;
  font-size: 16px;
}

.datepicker-day .ui-datepicker-calendar tbody tr:hover td,
.datepicker-day .ui-datepicker-calendar tbody tr:hover td a {
  background: #fff;
}

.datepicker-day .ui-datepicker-calendar tbody tr .ui-state-hover {
  background: #cdcdf6 !important;
}

.datepicker {
  position: relative;
}

.datepicker .calendar-icon {
  right: 15px;
  top: 10px;
  opacity: 0.5;
}

.calendar-icon {
  background-image: url('../img/icons.png');
  background-position: -113px 0;
  height: 20px;
  width: 20px;
  position: absolute;
}

span.datepicker .calendar-icon {
  top: 0;
}

.ui-datepicker select {
  height: 30px;
  padding: 5px;
  text-size: 14px;
}

/* ========= users ===== */

.users {
  background: #fff;
  font-weight: 600;
  color: #2e2e66;
  padding: 15px;
  text-transform: uppercase;
  font-size: 16px;
  text-align: center;
  height: 250px;
  margin-bottom: 30px;
  border: 2px solid #fff;
}

.users:hover {
  border: 2px solid #f18c93;
  cursor: pointer;
}

.users img {
  object-fit: cover;
  width: 125px;
  height: 125px;
  border-radius: 50%;
  display: block;
  margin: 0 auto 15px;
}

/* ========= search input ===== */

.search {
  position: relative;
}

.search input[type='text'] {
  width: 100%;
  transition: 0.5s;
  max-width: none;
}

.search input[type='text']:focus {
  outline-color: transparent;
}

.search button {
  position: absolute;
  right: 10px;
  top: 12px;
  width: 20px;
  height: 20px;
  background-image: url('../img/icons.png');
  background-position: -45px 0;
  border: none;
  background-color: transparent;
}

[class*='col-'].search button {
  right: 25px;
  top: 13px;
}

.search button:hover {
  background-position: -45px -20px;
}

.search button.solo {
  background-color: transparent;
  background-position: -45px -20px;
}

.search.white input {
  background-color: #faf1ec;
}

.search.white button {
  background-color: transparent;
}

.search.hide-search input[type='text'] {
  width: 200px;
}

/* ========= admin time days ===== */

.admin.filter input[type='checkbox'] {
  width: 20px;
  height: 20px;
  margin-right: 5px;
}

.check {
  position: relative;
}

.check label {
  position: absolute;
  top: 3px;
  left: 30px;
}

.admin.time-days {
  width: 1050px;
  margin-left: 60px;
  position: relative;
  margin-bottom: 0;
}

.admin.time-days .col-lg-2 {
  padding: 0 5px;
}

.admin.time-days.days-names {
  margin-bottom: 20px;
}

.admin.time-days .item {
  padding: 15px 40px 15px 15px;
  margin-right: 0;
}

.admin.time-days .lesson-number {
  position: absolute;
  left: -60px;
  top: 10px;
  font-size: 24px;
}

.admin.time-days .lesson-number .tools {
  float: right;
  margin-top: 5px;
  margin-left: 5px;
}

.days-names,
.admin.time-days .lesson-number {
  font-weight: 600;
  color: #53539f;
}

.admin.time .item.active input {
  margin-right: 0px;
  width: 50px;
}

.admin.time .item.active input:first-child {
  margin-right: 5px;
  width: 30px;
}

.days-names.mobile {
  display: none;
}

@media (min-width: 0) and (max-width: 1200px) {
  .admin.time-days {
    width: auto;
  }
  .days-names.mobile {
    width: 125px;
    display: inline-block;
  }
  .time-days.days-names {
    display: none;
  }
  .admin.time-days {
    margin-bottom: 20px;
  }
}

.admin.time-days .item .tools.column {
  top: 0;
}

/* ========= admin time days end ===== */

/* ========= messages ===== */

.message-sender {
  padding-bottom: 30px;
  border-bottom: 1px solid #e8d9cd;
}

.profile-edit .message-sender .title {
  margin-bottom: 10px;
}

.profile-edit .message-sender .btn,
.profile-edit .message-sender input {
  height: 52px;
  width: 100%;
}

.message-sender .add {
  margin-top: 15px;
}

.profile-edit .message-sender input {
  margin-bottom: 10px;
}

.profile-edit input[type='radio'] + label {
  margin-left: 5px;
}

.title a {
  color: #53539f;
}

.message {
  padding: 15px 15px 15px 110px;
  margin: 15px 0;
  position: relative;
}

.message:last-of-type {
  border-bottom: none;
}

.message .user-pic {
  float: left;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  background-image: url(../img/user.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  margin-right: 15px;
  position: absolute;
  left: 15px;
  top: 15px;
  overflow: hidden;
}

.message .user-pic .row {
  margin: 0;
}

.message-list .message .tools {
  position: absolute;
  top: 20px;
  right: 10px;
  opacity: 0;
}
.message-list .message:hover .tools {
  opacity: 0.7;
}
.message-list .message:hover .tools:hover {
  opacity: 1;
}

.message-list .message.active .tools .delete {
  background-position: -45px -40px;
}

.user-pic img {
  float: left;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  left: 0px;
  top: 0px;
}

.message .user-name {
  font-weight: 600;
  margin-bottom: 5px;
  display: block;
}

.message .date {
  float: right;
}

.profile-edit .message textarea {
  margin-bottom: 15px;
}

.message-list {
  background: #fff;
  margin-bottom: 30px;
}

.message-list .title {
  display: block;
  margin: 0 30px;
  padding: 30px 0 15px;
  border-bottom: 1px solid #e8d9cd;
}

.message-list .message {
  padding: 15px 15px 20px 120px;
  margin: 0;
  min-height: 100px;
  display: block;
}

.message-list .message .message-short {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #2e2e2e;
}

.message-list .message .message-short.unread {
  color: #53539f;
  padding: 5px 10px;
  background: #e7e7f1;
  border-radius: 5px;
}

.message-list .message .user-pic {
  left: 30px;
}

.message-list .message .user-name {
  margin-top: 10px;
  display: block;
}

.message-list .message:hover {
  background-color: #e7e7f1;
}

.message-list .message.active,
.message-list .message.active .message-short {
  background-color: #ed5e61;
  color: #fff !important;
}

.message-list .message.active .user-name {
  color: #fff;
}

.message-list .message.active:after {
  content: '';
  position: absolute;
  right: -15px;
  top: 50%;
  margin-top: -20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 0 20px 15px;
  border-color: transparent transparent transparent #ed5e61;
}

.message.no-message {
  padding: 30px;
}

.message.no-message h3 {
  color: #9595dc;
}

.message .add-file a {
  display: block;
  margin-bottom: 5px;
  font-size: 16px;
}

.message .add-file p a:not(.delete) {
  display: inline-block;
  font-size: 14px;
  margin-bottom: 5px;
}

.message .add-file p {
  margin-bottom: 0;
  display: block;
}

.message .tools {
  display: inline-block;
  height: 13px;
  opacity: 0;
}

.message .add-file p:hover .tools {
  opacity: 0.7;
}
.message .add-file p:hover .tools:hover {
  opacity: 1;
}

.message .add-file.added a {
  margin-bottom: 5px;
  font-size: 14px;
}
.message .add-file.added p {
  font-size: 16px;
  margin-bottom: 10px;
}

/*.brown-block .added a {*/
/*display:block;*/
/*margin-bottom: 5px;*/
/*}*/

.brown-block .added a {
  display: inline-block;
  margin-bottom: 10px;
}

.brown-block .added a:last-of-type {
  margin-bottom: 0;
}

.brown-block .added a:not(:first-of-type) .glyphicon-paperclip {
  /*margin-left: 25px;*/
  opacity: 0.8;
}

.brown-block .light {
  margin-bottom: 10px;
}

/* ========= messages end===== */

.products .subject {
  padding: 20px 15px 15px;
  height: 300px;
}

.products .subject .btn {
  display: block;
  margin: 15px auto;
}

/* ========= subject page ===== */

/* ========= subject page ===== */

.homework-block {
  background-color: #ecd5c7;
  padding: 30px;
  position: relative;
}

.homework-block:after {
  content: '';
  position: absolute;
  bottom: -15px;
  right: 0;
  left: 0;
  z-index: 10;
  display: block;
  height: 15px;
  background-image: -webkit-gradient(linear, 0 0, 300% 100%, color-stop(0.25, #fff), color-stop(0.25, #fff));
  background-image: linear-gradient(135deg, #ecd5c7 25%, rgba(0, 0, 0, 0) 25%), linear-gradient(225deg, #ecd5c7 25%, rgba(0, 0, 0, 0) 25%);
  background-position: 50%;
  background-size: 15px 100%;
}

.homework-block h3 {
  margin: 0 0 20px 0;
}

.homework-info span {
  margin-right: 10px;
}

.homework-block .icon.date,
.homework-text {
  display: inline-block;
  margin-bottom: 20px;
}

.homework-text {
  width: calc(100% - 90px);
  vertical-align: top;
  margin-left: 15px;
}

.lesson {
  background: #fff;
  padding: 18px 20px 25px;
  margin-bottom: 30px;
  border: 2px solid #fff;
  position: relative;
  display: block;
}

.lesson .tools {
  position: absolute;
  top: 15px;
  right: 10px;
  opacity: 0.5;
}

.lesson .tools a {
  border-bottom: none;
}

.title {
  font-weight: 600;
  color: #2e2e66;
  text-transform: uppercase;
  display: block;
}

.lesson .text {
  display: block;
  max-height: 45px;
  overflow: hidden;
}

.lesson .title {
  text-transform: none;
  padding-right: 40px;
  margin-bottom: 5px;
  max-height: 45px;
  overflow: hidden;
}

.lesson a,
ul.pink li a {
  color: #2e2e2e;
  border-bottom: #d1d1d1 1px solid;
}

.lesson a:hover,
ul.pink li a:hover {
  color: #2e2e66;
  border-bottom: 1px solid transparent;
}

.lesson:hover {
  border: 2px solid #f18c93;
}

.lesson:hover .tools {
  opacity: 1;
}

.white-block {
  background: #fff;
  padding: 20px;
}

.white-block .white-block,
.white-block .test-list .white-block {
  -webkit-box-shadow: 1px 1px 1px 1px #eaded4;
  -moz-box-shadow: 1px 1px 1px 1px #eaded4;
  box-shadow: 1px 1px 1px 1px #eaded4;
}

.brown-block {
  background: #ecd5c7;
  padding: 20px;
}

.webinar {
  margin: 40px 0;
}

.webinar img {
  width: 100%;
  opacity: 0.8;
  position: relative;
}

.webinar img:hover {
  opacity: 1;
}

.webinar .img .play {
  position: absolute;
  width: 100px;
  height: 100px;
  background: url('../img/play.png');
  left: 50%;
  top: 50%;
  margin-left: -50px;
  margin-top: -50px;
  opacity: 0.6;
}

.webinar .img .play:hover.webinar .img img {
  opacity: 1;
}

.webinar .img {
  padding-left: 0;
}

/* ========= li ===== */

ul.pink {
  padding-left: 20px;
}

ul.pink li {
  list-style-type: none;
  margin-bottom: 10px;
  position: relative;
}

ul.pink li:before {
  content: '';
  position: absolute;
  left: -20px;
  top: 3px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #ed5e60;
}

/* ========= admin page ===== */

.container.admin-block {
  margin-bottom: 160px;
}

.admin {
  margin-bottom: 20px;
}

.admin h3 {
  padding-left: 15px;
  color: #e8d9cd;
  margin-bottom: 20px;
  margin-top: 30px;
  border-top: 1px solid #e7e7f1;
  padding-top: 15px;
}

.admin .row:first-of-type h3 {
  margin-top: 0;
  border-top: none;
  padding-top: 0;
}

.admin:last-child {
  border-bottom: 1px solid transparent;
  margin-bottom: 0;
}

.admin.filter {
  margin: 15px 0 30px;
  border-bottom: 1px solid #e7e7f1;
  min-height: 52px;
}

.admin.filter > div {
  padding: 0;
}

.admin.filter a {
  color: #53539f;
  font-size: 16px;
  margin-top: 5px;
  margin-left: 20px;
  display: inline-block;
}

.admin.filter a.delete-text {
  margin-left: 23px;
}

.admin.filter a .glyphicon {
  margin-right: 5px;
}

.admin.filter select,
.admin.filter .select .btn {
  background-color: #faf1ec;
  border: 1px #ecd5c7 solid;
}

.teacher .admin.filter input[type='checkbox'] {
  margin-right: 5px;
  width: 15px;
  height: 15px;
}

.admin.filter .dropdown-menu {
  top: -15px;
  left: 10px;
  padding: 10px;
  width: 260px;
}
.admin.filter .dropdown-menu a {
  margin-left: 0;
}

.admin.filter .select {
  margin-top: -10px;
}

.dropdown-menu .classes li {
  display: inline-block;
}

.dropdown-menu .classes a {
  display: inline-block;
  margin: 3px;
  padding: 5px;
}

.dropdown-menu .classes a:not(.disabled):hover {
  background: #e7e7f1;
  color: #53539f;
}

.dropdown-menu .classes a.disabled {
  color: #bbb;
}

.select {
  display: inline-block;
}

.select .btn {
  background-color: #fff;
  color: #53539f;
  text-transform: none;
  font-weight: 400;
  min-width: 140px;
  text-align: left;
  position: relative;
  box-shadow: none;
  padding-right: 30px;
}
.select .btn .caret {
  position: absolute;
  right: 10px;
  top: 50%;
}

.select .dropdown-menu {
  padding: 0;
  left: 0 !important;
  min-width: 100%;
  max-height: 400px;
  overflow-y: scroll;
  overflow-x: hidden;
}

.select .dropdown-menu .classes {
  margin-top: 0 !important;
  padding: 5px !important;
}

.select .dropdown-menu a {
  position: relative;
}

.select .dropdown-menu a .tools {
  position: absolute;
  right: 15px;
  top: 20px;
  opacity: 0.5;
}

.select .dropdown-menu a:hover .tools {
  opacity: 1;
}

.select ul > li > a {
  text-align: left;
  font-weight: 400;
}

.select.large,
.select.large .btn {
  width: 100%;
}

.select.large .btn {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.white-block .select.large .btn {
  background-color: #faf1ec;
}

.select.large.active .btn {
  background: #ed5e60;
  color: #fff;
}

.admin .item {
  display: block;
  padding: 15px 80px 15px 15px;
  margin-right: 15px;
  margin-bottom: 10px;
  position: relative;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 54px;
  border-bottom: 1px solid #e7e7f1;
}

.admin .item::first-letter {
  text-transform: capitalize;
}

.admin.discipline .item,
.admin.discipline .item.active {
  padding: 15px 80px 15px 50px;
}

.item .tools {
  float: right;
  opacity: 0.4;
  position: absolute;
  right: 15px;
  top: 16px;
}

.tools > a,
.tools > span,
a.delete-text:before {
  background-image: url('../img/icons.png');
  width: 20px;
  height: 20px;
  display: inline-block;
  margin-left: 5px;
}

.tools > .delete,
a.delete-text:before {
  background-position: -65px 0;
  cursor: pointer;
}

.tools > a.accept {
  background-position: -65px -20px;
}

.tools > .edit {
  background-position: -65px -40px;
  cursor: pointer;
}

.tools > .up {
  background-position: -65px -60px;
  cursor: pointer;
}

.tools > .down {
  background-position: -65px -80px;
  cursor: pointer;
  margin-right: 10px;
}

.admin .item:hover {
  background: #e7e7f1;
  border-bottom: 1px dashed transparent;
}

.admin .item:hover .tools {
  opacity: 1;
}

.admin .item.active {
  background: #e7e7f1;
  padding: 11px 70px 11px 11px;
  border-bottom: 1px dashed transparent;
  transition: 0.5s;
}

.admin .item.button {
  padding: 0;
  border-bottom: 1px solid transparent;
}

.admin .item.button:hover {
  background: transparent;
}

.item.active .tools {
  opacity: 1;
}

.item.active input[type='text'],
.item.active select {
  width: 30px;
  height: 30px;
  background-color: #fff;
  margin-right: 5px;
  padding: 5px;
  font-weight: 400;
  border: none;
}

.teacher .admin .item.active {
  padding: 15px 80px 15px 15px;
}

.teacher .admin .item.active .tools {
  padding-top: 0;
}

.discipline .item.active input {
  width: 200px;
}

.cabinet .item.active input {
  width: 130px;
}
.subj .item.active select {
  width: 140px;
}
.subj .item.active select + select {
  width: 60px;
}
.subj .item.active select + select + select {
  width: 120px;
}

.item .picture {
  position: absolute;
  left: 15px;
  top: 15px;
  width: 25px;
  height: 22px;
  background: url('../img/icons.png') -85px 0;
  opacity: 0.3;
}

.item .picture:hover,
.item.active .picture {
  opacity: 0.7;
}

.item.active .picture:hover {
  opacity: 1;
}

.item.active span {
  margin-right: 5px;
  color: #2e2e66;
}

.item.active .tools {
  padding-top: 5px;
}

button.plus,
a.plus {
  position: relative;
  padding-left: 40px;
  height: 52px;
  transition: 0.5s;
}

button.plus:before,
a.plus:before {
  content: '+';
  position: absolute;
  font-size: 40px;
  font-weight: 300;
  line-height: 0;
  left: 12px;
  top: 23px;
}

button.plus:focus,
a.plus:focus {
  outline: none;
}

.discipline .icon {
  position: absolute;
  width: 42px;
  height: 42px;
  left: 10px;
  top: 5px;
  padding: 7px;
}

.discipline .icon img {
  max-width: 100%;
}

.discipline .icon.noicon {
  background: url('../img/icons.png') -85px 0;
  opacity: 0.7;
}

.discipline .item,
.cabinet .item,
.teacher .item {
  font-weight: 600;
}

.admin.row > .item {
  min-height: 52px;
}

.admin .add {
  border-top: 1px solid #d5d5d5;
  margin-top: 15px;
  padding-top: 15px;
}

.admin.class .item.active select {
  width: 180px;
}
.admin.class [class*='col-'] {
  padding: 0 5px;
}

/* ================= enter-page ================= */

body.enter {
  background: #2e2e66;
  min-height: 880px;
}

.enter:after {
  content: '';
  position: absolute;
  background: url('../img/right-bg.png') no-repeat right;
  width: 411px;
  height: 686px;
  right: 0;
  top: 30px;
}

.enter:before {
  content: '';
  position: absolute;
  background: url('../img/left-bg.png') no-repeat left;
  width: 411px;
  height: 686px;
  left: 0;
  top: 30px;
}

.enter .logo {
  height: 300px;
  width: 505px;
  background: url('../img/logo-center.png') no-repeat top;
  margin: 60px auto 30px;
  padding: 320px 0 0;
  color: #fff;
  font-size: 18px;
  text-align: center;
  background-size: contain;
}

.enter form {
  margin-bottom: 30px;
  text-align: center;
  color: #fff;
}

.enter form h2 {
  color: #fff;
  text-align: center;
  margin-bottom: 20px;
  margin-top: 0;
}

.enter form p {
  margin-top: 20px;
}

.enter form a {
  color: #fff;
  border-bottom: 1px solid #fff;
}

.enter form .error {
  color: red;
  font-size: 14px;
  display: block;
  margin-bottom: 10px;
}

.enter .warning {
  background: #53539f;
  padding: 15px;
  color: #fff;
  text-align: center;
}

.enter .warning h3 {
  margin-top: 0;
}

.enter .warning p {
  margin-top: 5px;
}

.enter form input,
.enter form select {
  width: 100%;
  display: block;
  text-align: left;
  background-color: #fff;
}

.enter form input:focus {
  background: #fff;
}

.enter form button {
  margin: 5px auto;
  width: 100%;
}

.form-group.hints {
  position: relative;
}

.form-group.hints .glyphicon {
  position: absolute;
  right: 145px;
  top: 10px;
  font-size: 18px;
  color: #53539f;
  opacity: 0.5;
}

.form-group.hints .glyphicon:hover {
  opacity: 0.8;
}

.tooltip-inner {
  background: #53539f;
  padding: 10px;
  font-size: 15px;
  line-height: 18px;
  width: 320px;
  text-align: left;
}

.tooltip.top .tooltip-arrow {
  border-top-color: #53539f;
}

.input-group-addon {
  border: 0;
  border-radius: 0;
  background-color: #f4e4db;
  font-size: 16px;
  color: #53539f;
  height: 44px;
}

.form-group.col-md-4 {
  padding: 0;
}
.form-group.col-md-4:first-child {
  padding-left: 15px;
}
.form-group.col-md-4:last-child {
  padding-right: 15px;
}

/* ================= edit profile page ================= */

.user-image {
  margin: 0 0 30px 0;
}

.user-image img {
  width: 100%;
}

.user-image h4 {
  margin: 0 0 15px;
}

.user-image .user-info {
  padding: 30px;
  background: #fff;
  margin-top: 0;
}

.profile-edit {
  margin-bottom: 30px;
  padding: 30px;
}

.profile-edit .title {
  margin-bottom: 30px;
}

.profile-edit .line {
  background-color: #ecd5c7;
  height: 1px;
  width: 100%;
  margin: 15px 0 30px;
}

.profile-edit label {
  display: block;
}

.profile-edit input,
.profile-edit textarea {
  width: 100%;
  /* margin-bottom: 30px; */
  resize: vertical;
}

.profile-edit textarea {
  height: 150px;
}

.profile-edit input[type='radio'],
.profile-edit input[type='checkbox'] {
  width: 15px;
  height: 15px;
  margin-bottom: 10px;
  display: inline-block;
}

.profile-edit input[type='radio'] + label,
.profile-edit input[type='checkbox'] + label {
  display: inline-block;
  margin-left: 10px;
}

.students.grades td:first-child {
  width: 80%;
}

.students.grades td:last-child {
  padding-right: 40px;
}

/* ================= task grades table ================= */

.grades-edit .edit {
  opacity: 0.5;
  display: none;
  margin-left: 5px;
}

.grades-edit:hover .edit {
  display: inline-block;
}

.grades-edit .edit:hover {
  opacity: 1;
  position: relative;
}

.grades-edit .plus {
  position: absolute;
  right: -5px;
  top: 50%;
  margin-top: -20px;
}
.grades-edit .plus > a {
  color: #ed5e61;
  font-size: 36px;
  font-weight: 400;
  opacity: 0.5;
}

.grades-edit:hover .plus > a {
  opacity: 0.9;
}
.grades-edit:hover .plus:hover > a {
  opacity: 1;
}

.grades.students .grades-edit .plus {
  position: static;
}

.grades-edit .grade {
  cursor: pointer;
}

.grade {
  padding: 4px 8px;
  border-radius: 5px;
  margin: 0 3px 2px 0;
  line-height: 18px;
}

.grade.three {
  background: #ffd9cc;
}
.grade.three:hover {
  background: #f9c6b5;
}

.grade.five {
  background: #aef2a3;
}
.grade.five:hover {
  background: #9fed93;
}

.grade.four {
  background: #ffec93;
}
.grade.four:hover {
  background: #ffe87e;
}

.grade.two {
  background: #ddd;
}
.grade.two:hover {
  background: #d3d3d3;
}

table.students select {
  width: 42px;
  line-height: 20px;
}

.grades-edit .dropdown-menu {
  width: 50px;
  min-width: 50px;
  top: 35px;
  left: -12px;
}

.grades-edit .dropdown-menu > li > a {
  padding: 3px 10px;
  display: inline-block;
  margin: 0 10px;
}

.dropdown-menu .arrow,
.dropdown-menu .arrow:after {
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 8px 8px;
}

.dropdown-menu .arrow {
  top: -8px;
  left: 16px;
  border-color: transparent transparent #bbb transparent;
}

.dropdown-menu .arrow:after {
  content: '';
  top: 1px;
  right: -8px;
  border-color: transparent transparent #fff transparent;
}

.grades-edit .dropdown-menu > li > a.delete {
  margin-left: 16px;
}
.grades-edit .dropdown-menu > li > a.glyphicon {
  margin-left: 5px;
}

.grades-edit .plus .dropdown-menu {
  top: 40px;
  left: -15px;
}

/* ================= journal ================= */

table.diary {
  margin-bottom: 30px;
  border-spacing: 5px;
  border-collapse: separate;
  margin-bottom: 60px;
}

table.diary td:not(:first-child) {
  width: 13%;
}

.present .calendar-icon {
  right: 15px;
  top: 15px;
}

.present .dropdown-menu {
  right: 0;
  left: auto;
}

.diary td {
  max-width: 400px;
  position: relative;
  background: #fff;
  border: none;
  margin: 10px;
  padding: 15px;
}

.diary tbody {
  background: transparent;
}

.diary tbody td.disabled {
  opacity: 0.5;
}

.diary tbody td.disabled:hover {
  background: #fff;
}

.diary tbody td:first-child {
  background: transparent;
}

.grades-edit {
  min-height: 30px;
  line-height: 40px;
  padding-right: 20px;
  position: relative;
}

.diary .edit {
  display: none;
}

.diary td:hover .edit {
  display: inline-block;
  opacity: 0.5;
}

.diary td:hover .edit:hover {
  display: inline-block;
  opacity: 1;
}

.diary input[type='text'] {
  width: 100%;
}

.journal-final td:last-child {
  width: 200px;
}

.journal-final td:first-child {
  width: 200px;
}

.student-diary td {
  padding: 15px;
  vertical-align: top;
}

.student-diary td:first-child {
  width: 150px;
}

.student-diary td:last-child {
  width: 90px;
}

.student-diary a {
  font-weight: 600;
}

.student-diary td:last-child {
  width: 95px;
}

.student-diary ul.task {
  padding-left: 0;
  margin-bottom: 0;
}

.student-diary .task li {
  list-style-type: none;
  margin-bottom: 8px;
}

.student-diary .task li {
  font-size: 14px;
}

.student-diary .task a,
.student-diary .task li a {
  font-weight: 400;
  font-size: 14px;
  border-bottom: 1px #cdcdf6 solid;
  color: #2e2e66;
}

.popover.mark-editor {
  width: 400px !important;
  height: 130px !important;
}

/* ================= breadcrumb ================= */

.breadcrumb {
  color: #53539f;
  opacity: 0.7;
  margin: 30px 0;
  padding: 0;
  background: transparent;
  font-size: 14px;
}

.breadcrumb a {
  color: #53539f;
  font-size: 14px;
  border-bottom: 1px #53539f dotted;
}

.breadcrumb a:hover {
  color: #2a2a68;
}

.breadcrumb + h1 {
  margin-top: 30px;
}

.breadcrumb + .row > [class^='col-'] > h1 {
  margin-top: 0;
}

h1 + p {
  margin-top: -10px;
}

/* ================= test ================= */

.test {
  counter-reset: li;
  padding: 0;
  list-style: none;
  margin-bottom: 30px;
}

.test li {
  margin: 0 0 8px 30px;
  padding: 4px 8px;
  position: relative;
}

.test li:before {
  color: #53539f;
  width: 2em;
  padding: 4px 0;
  text-align: center;
  font-size: 40px;
  opacity: 0.3;
  font-weight: 600;
  letter-spacing: -4px;
  content: counter(li);
  counter-increment: li;
  position: absolute;
  top: -15px;
  left: -65px;
}

.test li li {
  margin: 0;
  list-style-type: none;
  height: 70px;
  padding: 10px;
  background: #fff;
  margin-bottom: 10px;
  opacity: 0.8;
}

.test li li:before {
  display: none;
}

.test li.order input {
  width: 40px;
}

.test li.order div {
  display: inline-block;
  margin-right: 20px;
}

.test > li > p {
  color: #2a2a68;
  font-weight: 600;
}

.test > li > div {
  position: relative;
  margin-bottom: 5px;
}

.test div > label {
  margin-left: 20px;
}

.test div > label img {
  display: inline-block;
  max-height: 200px;
}

.test input[type='text'] {
  height: 40px;
  width: 50%;
  padding: 8px;
  background: #fff;
}

.white-block .test input[type='text'] {
  background-color: #faf1ec;
}

.test li > div > input[type='checkbox'],
.test li > div > input[type='radio'] {
  position: absolute;
}
.modal-body .test li > div > input[type='checkbox'],
.modal-body .test li > div > input[type='radio'] {
  top: 8px;
}

.attach {
  display: block;
  margin-top: 15px;
}

.attach .glyphicon-paperclip {
  margin-right: 3px;
}

.test table td.tool {
  min-width: 180px;
}

.test table .glyphicon-paperclip {
  opacity: 0.7;
}

.ui-state-default .ui-icon {
  display: none;
}

.ui-sortable .ui-state-default {
  background: #fff;
  opacity: 1;
  cursor: move;
  border: none;
  overflow: hidden;
  transition: background 0.5s;
}

.ui-sortable .ui-state-default:hover {
  background: #cdcdf6;
}

.test.test-result > li div.correct {
  background: #d7e4d7;
}
.test.test-result > li div.wrong {
  background: #f7d4d0;
  position: relative;
}

.test.test-result > li > div.correct.right {
  background: transparent;
}

.test.test-result > li div.correct:before,
.test.test-result > li div.wrong:before {
  position: absolute;
  content: '';
  background-image: url('../img/icons.png');
  width: 20px;
  height: 20px;
  display: inline-block;
  left: 12px;
  top: 15px;
}

.test.test-result > li div.correct:before,
.test.test-result > li div.wrong-vi:before {
  position: absolute;
  content: '';
  background-image: url('../img/icons.png');
  width: 20px;
  height: 20px;
  display: inline-block;
  left: 12px;
  top: 15px;
}

.test.test-result > li > div.wrong .text-danger {
  margin-top: 5px;
}

.test.test-result > li div.correct:before {
  background-position: -65px -20px;
}
.test.test-result > li div.wrong:before {
  background-position: -65px 0;
}

.test.test-result div > label {
  margin-left: 30px;
  width: auto;
  padding: 10px 5px;
}

.test-filters .item {
  margin-top: 6px;
  display: inline-block;
  margin-left: 30px;
  color: #2a2a68;
}

.test-filters .item label {
  color: #2e2e2e;
}

.form-test input[type='text'],
.form-test input[type='number'],
.form-test select {
  width: 100%;
  margin-bottom: 15px;
}

.form-test .grades > div {
  position: relative;
  min-height: 60px;
}

.form-test .grades input[type='number'] {
  position: absolute;
  width: 240px;
  right: 15px;
  top: -10px;
}

.form-test fieldset {
  margin-top: 20px;
  height: 190px;
}

.form-test .grade {
  display: inline-block;
  margin-bottom: 5px;
}

.form-test h4 {
  margin-top: 35px;
  margin-bottom: 20px;
}
.form-test .form-section {
  border-bottom: 1px solid #e7e7f1;
  padding-bottom: 30px;
}

.test .modul {
  position: relative;
  margin-top: 50px;
}

.test .modul .modul-line {
  border-bottom: 1px dotted rgb(136, 136, 136);
  height: 20px;
  width: 100%;
  margin-bottom: 20px;
}

.test .modul .modul-text {
  font-size: 14px;
  text-align: center;
  margin-top: -32px;
  margin-bottom: 20px;
}

.test .modul .modul-text span {
  background: #faf1ec;
  padding: 10px;
  text-transform: uppercase;
  margin: 0 10px;
}

.white-block .test .modul .modul-text span,
.white-block .test .modul .tools {
  background: #fff;
}

.test .modul .tools {
  position: absolute;
  right: 0;
  top: 10px;
  background: #faf1ec;
  padding-left: 10px;
}

.test .modul .tools .edit,
.test .modul .tools .delete,
.test .modul .tools .accept {
  opacity: 0.5;
}

.test .modul:hover .tools .edit,
.test .modul:hover .tools .delete,
.test .modul:hover .tools .accept {
  opacity: 0.8;
}

.test .modul:hover .tools .edit:hover,
.test .modul:hover .tools .accept:hover,
.test .modul:hover .tools .delete:hover {
  opacity: 1;
}

.test .modul input {
  margin-top: -10px;
}

/* ================= test edit================= */

.test .tools > a.up,
.test .tools > a.down {
  opacity: 0.5;
}

.test tr:hover .tools > a.up,
.test tr:hover .tools > a.down {
  opacity: 1;
}

table.test tbody tr td:not(:first-child) {
  width: 25px;
}

table.test tbody tr td:first-child {
  padding-left: 20px;
}

.test tbody tr td:first-child a {
  font-weight: 600;
}

.test table {
  margin-bottom: 30px;
}

.test td li {
  margin-bottom: 0;
}

.test-subject td:first-of-type {
  width: 80%;
}

a.dotted {
  border-bottom: 2px dotted #aaaacf !important;
}

h1 a.dotted {
  font-size: 30px;
}

h1 a.dotted:hover {
  border-bottom: 2px dotted #53539f;
}

h1 .edit {
  margin-left: 10px;
  opacity: 0;
}

.edit-admin {
  line-height: 26px;
}

.edit-admin .edit {
  margin-left: 10px;
  height: 15px;
  opacity: 0;
}

.edit-admin textarea {
  margin-bottom: 10px;
  height: auto;
}

.edit-admin-block {
  border: 2px dotted transparent;
  padding: 5px 10px;
  cursor: pointer;
  color: #53539f;
}

.edit-admin-block:hover {
  border: 2px dotted #888;
  border-radius: 5px;
}

h1:hover .edit,
p.edit-admin:hover .edit {
  margin-left: 10px;
  opacity: 0.5;
}

h1 input {
  width: 80%;
  margin-right: 10px;
}

.answers label {
  float: left;
}

.modal-body form .answers div {
  float: left;
  width: 300px;
  margin-left: 1px;
}

.answer {
  position: relative;
}

.answers select + select {
  margin: 15px 0;
}

.answers .list {
  counter-reset: div;
}

.answer.light a {
  border-bottom: 1px dotted;
}

.answer input[type='radio'],
.answer input[type='checkbox'],
.answers .list .answer:before {
  width: 15px;
  position: absolute;
  left: -20px;
  top: 15px;
}

.answer a.plus {
  position: absolute;
  top: -2px;
  right: -40px;
  color: #ed5e61;
  opacity: 0.5;
}

.answer a.plus:hover {
  opacity: 1;
}

.answer .add-pic {
  content: '';
  position: absolute;
  background: url('../img/icons.png') -85px -25px;
  opacity: 0;
  right: 15px;
  top: 17px;
  width: 22px;
  height: 20px;
  cursor: pointer;
}

.modal-body form .answers .question textarea {
  height: 130px;
}

.answer:hover .add-pic {
  opacity: 0.3;
}

.answer:hover .add-pic:hover {
  opacity: 0.6;
}

.answers .answer-img {
  margin-top: 5px;
  position: relative;
  display: inline-block;
}

.answers .answer-img img {
  max-height: 100px;
  margin-bottom: 0;
}
.answers .answer-img .tools {
  position: absolute;
}

.modal-dialog.add-user .answer textarea {
  height: 50px;
  padding: 10px;
  padding-right: 40px;
}

.modal-dialog.add-user .grade + input {
  width: 54px;
  margin-top: -10px;
  margin-bottom: 10px;
  margin-right: 16px;
}

.modal-dialog.add-user .grade + input:last-of-type {
  margin-right: 0;
}

.answers .list .answer:before {
  color: #53539f;
  content: counter(div);
  counter-increment: div;
}

.answers .compare textarea {
  width: 50%;
}

.answers .tools {
  position: absolute;
  right: -30px;
  top: 15px;
  opacity: 0.5;
}

.answers .tools:hover {
  opacity: 1;
}

.modal-header.switch a {
  margin-right: 10px;
  font-size: 14px;
  color: #53539f;
  border-bottom: 1px #9595dc solid;
  opacity: 0.6;
}

.modal-header.switch a:hover {
  opacity: 1;
}

.test-list .white-block {
  margin: 0 0 15px 0;
  border: 2px transparent solid;
}

.test-list .white-block a {
  font-weight: 600;
  display: block;
  margin-bottom: 3px;
}

.test-list .white-block a.text-subject {
  font-weight: 400;
  margin-bottom: 10px;
}

.test-list .white-block a.text-subject:hover {
  color: #53539f;
}

.test-list .white-block [class^='col-']:first-of-type {
  padding-left: 0;
}

.test-list .white-block [class^='col-']:last-of-type {
  padding-right: 0;
}

a.delete-text {
  color: #ed5e61;
  position: relative;
  font-weight: 500 !important;
  margin-left: 20px;
}

a.delete-text:hover {
  color: #f18c93;
}

a.delete-text:before {
  position: absolute;
  content: '';
  left: -25px;
  top: 3px;
}

.test-generate {
  margin-bottom: 30px;
}

.variants {
  padding: 0;
}

.variants a:not(.dropdown-toggle) {
  display: inline-block;
  padding: 7px 12px;
  font-size: 18px;
  color: #53539f;
  background: #e8d9cd;
  margin-right: 6px;
  margin-bottom: 10px;
  font-weight: 600;
}

.variants a:hover:not(.dropdown-toggle) {
  color: #fff;
  background: #ed5e61;
}

.test-generate .row {
  margin: 30px 0;
}

.test-block:not(:last-child) {
  margin-bottom: 30px;
  border-bottom: #e8d9cd 1px solid;
}

.test-block .row [class^='col-'],
.test-block.row [class^='col-'] {
  padding: 0;
}

.test-block .glyphicon-random,
.students .glyphicon-random {
  color: #53539f;
  margin-right: 5px;
}

.test-block [class^='col-']:first-child a,
.test-generate label {
  font-size: 18px;
  font-weight: 600;
  color: #2a2a68;
}

.test-generate input {
  width: 120px;
}

.test-generate label {
  margin-right: 10px;
}

.test-generate [class^='col-']:last-child {
  text-align: right;
}

.test-block .dropdown-menu {
  top: -11px;
  left: -11px;
  width: 250px;
  padding: 10px;
}

.variants .dropdown a {
  display: inline-block;
}

.test-block .dropdown-menu select,
.dropdown-menu select {
  width: 100%;
  margin-top: 20px;
  background: #faf1ec;
}

table.students select,
table.students input[type='text'] {
  height: 30px;
  padding: 5px;
  background-color: #faf1ec;
  border: none;
}

.students tr > td:first-child {
  width: 400px;
}

/* ================= class ================= */

.students.class tr > td:first-child {
  width: 20px;
}

.students.class tr > td:nth-child(2) {
  width: 60%;
  font-weight: 600;
}

.students.class input[type='checkbox'] {
  width: 18px;
  height: 18px;
}

.students.class tbody tr.active td {
  background: #e7e7f1;
}

.action {
  position: relative;
}

.actions {
  /*display:none;*/
}

.chose {
  width: 100%;
  top: 40px;
  padding: 10px;
}

.dropdown-menu.chose select {
  margin-top: 0;
}

/* ================= books ================= */

.price {
  float: right;
  margin-bottom: 15px;
}

.price a.dotted {
  font-size: 24px;
  font-weight: 600;
  cursor: pointer;
}

.price .edit {
  opacity: 0.3;
  margin-left: 0;
}
.price:hover .edit {
  opacity: 0.8;
}

/* ================= books ================= */

.books .subject img {
  -webkit-box-shadow: 5px 5px 0px 0px rgba(232, 217, 205, 1);
  -moz-box-shadow: 5px 5px 0px 0px rgba(232, 217, 205, 1);
  box-shadow: 5px 5px 0px 0px rgba(232, 217, 205, 1);
  max-height: 130px;
}

.books .subject .img {
  height: 130px;
  margin-bottom: 15px;
}

.books .subject .img .glyphicon-book {
  font-size: 100px;
  opacity: 0.2;
  margin-top: 15px;
}

.books .subject {
  height: 260px;
  padding: 20px 15px 15px;
}

.books .subject .light {
  margin-top: 5px;
}

.books .subject:hover .light,
.books .subject:hover > a {
  color: #fff;
}

.books .subject .text {
  max-height: 42px;
  overflow: hidden;
  display: block;
}

.book {
  font-size: 14px;
  display: flex;
  align-items: center;
  padding: 8px;
  gap: 16px;
  transition: 0.25s ease-in-out;
}

.book img {
  max-width: 100%;
  max-height: 120px;
}

.book .glyphicon-book {
  font-size: 32px;
}

/* ================= edit-site================= */

.dropdown-menu > li > a {
  padding: 10px 15px;
  font-weight: 600;
  color: #4a4b8e;
  text-align: center;
  text-transform: none;
  white-space: normal;
}
.dropdown-menu > li > a:hover {
  color: #4a4b8e;
}

.edit-site {
  top: 10px;
  right: 10px;
  position: absolute;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background: #fff;
  z-index: 2;
  opacity: 0.7;
  cursor: pointer;
  text-align: center;
}

.edit-site .edit {
  margin: 10px auto;
}
.edit-site .delete,
.edit-site .glyphicon-trash {
  margin-top: 8px;
  color: #2e2e66;
  font-size: 18px;
}

.edit-site .dropdown-menu {
  display: none;
  top: 46px;
  right: 0;
  left: auto;
}

.edit-site .dropdown-menu:after {
  content: '';
  position: absolute;
  top: -8px;
  right: 10px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 8px 8px;
  border-color: transparent transparent #ffffff transparent;
}

.edit-site .dropdown-menu:before {
  content: '';
  position: absolute;
  width: 80%;
  height: 50px;
  top: -50px;
  right: 0;
}

.edit-site .dropdown-menu > li > a {
  padding: 10px 20px;
}

.edit-site:hover .dropdown-menu {
  display: block;
}

.subject:hover .edit-site {
  opacity: 1;
}

.subject:hover .edit-site:hover .glyphicon-trash {
  color: #2a2a68;
}

/* ================= stat ================= */

.table.stat > tbody > tr > td {
  padding: 15px;
  max-width: 300px;
}

.table.stat > tbody > tr:hover {
  background: #f0f0f9;
  cursor: pointer;
}

.table.stat > tbody > tr > td:last-of-type {
  position: relative;
}

.table.stat > tbody > tr:not(.inner) > td:last-of-type:after {
  position: absolute;
  right: 20px;
  top: 15px;
  content: '\e114';
  font-family: 'Glyphicons Halflings';
  color: #53539f;
  opacity: 0;
}

.table.stat > tbody > tr:not(.inner):hover > td:last-of-type:after {
  opacity: 0.4;
}

.table.stat > tbody > tr.inner:hover {
  cursor: default;
}

.table > tbody > tr > td.scale-td {
  vertical-align: bottom;
  padding: 0 10px;
  width: 300px;
}

.scale-td .light {
  margin-bottom: 5px;
}

.scale {
  background: #e0e0ed;
  height: 6px;
  width: 90%;
}

.scale-percent {
  background: #ed5e61;
  height: 6px;
}

.scale-text {
  margin-bottom: 8px;
}

.table.stat > tbody > tr.inner .scale-text {
  margin-bottom: 5px;
  font-size: 14px;
}

.stat tr td:first-of-type {
  padding-left: 15px;
}

.table.stat > tbody > tr.inner {
  border-bottom: none;
  border-top: none;
  display: none;
}

.table.stat > tbody > tr.inner.inner-first > td {
  padding-top: 40px;
}

.table.stat > tbody > tr.inner.inner-last > td {
  padding-bottom: 40px;
}

.table.stat > tbody > tr.inner > td {
  background: #fdfaf9;
  border-top: none;
  padding-top: 6px;
  padding-bottom: 6px;
}

.table.stat > tbody > tr.inner > td:first-of-type {
  text-align: right;
}

.table > tbody > tr.inner > td.scale-td {
  vertical-align: middle;
}

.table.stat > tbody > tr.inner > td .title {
  opacity: 0.7;
}

.table.stat > tbody > tr.inner > td {
  overflow: hidden;
  white-space: nowrap;
}

.dots:after {
  content: '...................................................';
  opacity: 0.5;
}

.table.stat > tbody > tr.final > td {
  border-top-width: 3px;
  font-weight: 600;
  cursor: default;
}

.table.stat > tbody > tr.final:hover > td {
  background: #fff;
}

.table.stat > tbody > tr.final:hover > td:after {
  display: none;
}

.title {
  text-transform: initial;
  line-height: 1.2;
  display: inline-block;
}

.news-item .title span {
  display: inline;
  border-bottom: 1px solid #c4bdca;
  line-height: 22px;
}

.news-item .content {
  padding-left: 0 !important;
}

.news-item .message {
  margin-top: 8px;
  padding: 0 0 10px 0;
}

.news-text {
  margin-bottom: 40px;
  padding-bottom: 30px;
  border-bottom: 1px solid #e8d9cd;
}

.news-text h3 {
  margin-top: 0;
  margin-bottom: 15px;
}

.news-text h3 a {
  border-bottom: 1px #53539f solid;
  font-size: 22px;
}

.icon.date,
.icon.date .month {
  border-radius: 0;
}

.icon.date .month {
  background: #53539f;
}

/* ================= chapter ================= */

.chapter-access select {
  margin: 0 5px;
}

.chapter-access .chapter-demo {
  border-bottom: 1px solid #e7c0a8;
  padding-bottom: 15px;
}

/*  */

.chapters {
  list-style: none;
  display: flex;
  flex-direction: column;
  padding: 0;
  gap: 4px;
  margin: 24px 0;
}

.module_item {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 14px;
  color: #333 !important;
  background-color: rgba(255, 255, 255, 0.5);
  padding: 12px 12px 12px 18px;
  gap: 12px;
  transition: 0.25s ease-in-out;
}

.module_item:hover,
.module_item:focus-visible {
  background-color: rgba(255, 255, 255, 0.75);
}

.module_item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 6px;
  height: 100%;
}

.module_item__status {
  width: 40px;
  aspect-ratio: 1;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
  border: 1px solid #e0e0e0;
  border-radius: 50%;
  flex-shrink: 0;
}

.module_item--chapter::before {
  background-color: #54a1e6;
}

.module_item--test::before {
  background-color: #54a864;
}

.module_item.is_active {
  background-color: white;
}

.module_item.is_finished .module_item__status {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='18' viewBox='0 0 24 18' fill='none'%3E%3Cpath d='M23.7469 1.10844C24.0844 1.44056 24.0844 1.98696 23.7469 2.31908L9.17627 16.8897C8.84415 17.2272 8.29775 17.2272 7.96563 16.8897L0.251022 9.17585C-0.0836739 8.84372 -0.0836739 8.29732 0.251022 7.9652C0.585503 7.62772 1.12815 7.62772 1.46295 7.9652L8.57095 15.0737L22.5362 1.10844C22.8684 0.773099 23.4148 0.773099 23.7469 1.10844Z' fill='white'/%3E%3C/svg%3E");
  background-color: #54a864;
  border-color: #54a864;
}

/* ================= glossary ================= */

.glossary tbody {
  font-size: 14px;
}

.glossary .term {
  width: 200px;
  font-weight: 500;
}

.glossary .lesson-number {
  font-size: 24px;
  margin-left: 20px;
  padding-top: 10px;
}

.glossary .tools {
  width: 80px;
  opacity: 0.5;
}

.glossary tr:hover .tools {
  opacity: 1;
}

.course-form input[type='text'] {
  width: 100%;
}

.course-form .form-group {
  position: relative;
}

.course-form .form-group .glyphicon {
  position: absolute;
  right: 10px;
  top: 12px;
  color: #53539f;
}

/* For ui-select (select users for chat) */
.form-control.ui-select-toggle {
  height: 100%;
}

.form-control.ui-select-search {
  height: 100%;
  width: 100% !important;
  font-size: inherit;
  padding: 15px;
  border: 1px #ecd5c7 solid;
  border-radius: 0px;
}

.form-control.ui-select-search,
.form-control.ui-select-search:focus,
.form-control:focus,
.form-control:focus,
.ui-select-bootstrap > .ui-select-match > .btn:focus {
  box-shadow: none;
  border: none;
  outline: none;
}

.ui-select-bootstrap > .ui-select-match > .btn {
  height: 50px;
  border: none;
  color: #53539f;
  outline: 0;
  background: #fff;
  text-transform: none;
  font-weight: 400;
  -webkit-box-shadow: inset 1px 1px 1px 1px #eee2d8;
  -moz-box-shadow: inset 1px 1px 1px 1px #eee2d8;
  box-shadow: inset 1px 1px 1px 1px #eee2d8;
}
.ui-select-placeholder.text-muted {
  color: #999;
  text-transform: none;
  font-weight: 400;
}

div.ui-select-choices-row {
  margin-bottom: 0 !important;
}

/* ==========================  social icons ========================= */

@font-face {
  font-family: 'si';
  src: url('../fonts/socicon.eot');
  src: url('../fonts/socicon.eot?#iefix') format('embedded-opentype'), url('../fonts/socicon.woff') format('woff'),
    url('../fonts/socicon.ttf') format('truetype'), url('../fonts/socicon.svg#icomoonregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: si;
    src: url(../fonts/socicon.svg) format(svg);
  }
}
.soc {
  overflow: hidden;
  margin: 0;
  padding: 0;
  list-style: none;
}

.soc li {
  display: inline-block;
  *display: inline;
  zoom: 1;
}

.soc li a {
  font-family: si !important;
  font-style: normal;
  font-weight: 400;
  overflow: hidden;
  text-decoration: none;
  text-align: center;
  display: block;
  position: relative;
  width: 35px;
  height: 35px;
  line-height: 35px;
  font-size: 19px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  margin-right: 8px;
  color: #ffffff;
  background-color: none;
}

.soc li a:hover {
  opacity: 1;
}

.soc-icon-last {
  margin: 0 !important;
}

.soc-twitter {
  background-color: #4da7de;
}
.soc-twitter:before {
  content: 'a';
}
.soc-facebook {
  background-color: #3e5b98;
}
.soc-facebook:before {
  content: 'b';
}
.soc-vkontakte {
  background-color: #5a7fa6;
}
.soc-vkontakte:before {
  content: ';';
}

/* ==========================  social icons end========================= */

#slideout {
  z-index: 5;
  position: fixed;
  top: 40%;
  right: 0;
  height: 200px;
  width: 50px;
  text-align: center;
  background: #ed5e61;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}

#slideout a {
  -moz-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  display: block;
  color: #fff;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 18px;
  margin-top: 75px;
  margin-left: -96px;
  width: 240px;
  padding: 10px;
}

#slideout_inner {
  position: fixed;
  top: 40%;
  right: -320px;
  background: #fff;
  padding: 25px;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  text-align: left;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}

#slideout.active {
  right: 300px;
  background: #fff;
}

#slideout:not(.active):hover {
  background: #f18c93;
}

#slideout.active #slideout_inner {
  right: 0;
}
#slideout.active a {
  color: #53539f;
}

#slideout_inner textarea {
  width: 250px;
  height: 190px;
  margin-bottom: 10px;
  display: block;
  background: #faf1ec;
  resize: vertical;
}

#slideout .glyphicon {
  margin-right: 5px;
}

.form-group.required label:after {
  content: '*';
  color: red;
}

/* ================= adaptive ================= */

@media (min-width: 320px) and (max-width: 766px) {
  .container {
    padding: 0 20px;
  }
  body {
    /* margin-bottom: 250px; */
  }
  footer {
    /* height:280px; */
  }
  footer .text-right {
    text-align: left !important;
  }
  h1 {
    margin: 30px 0;
  }
  .container.white {
    margin: 0 20px;
  }
  /* .container.main {
        margin-bottom: 300px;
    } */
  .logo {
    margin-top: 50px;
    margin-bottom: 10px;
    font-size: 14px;
  }
  address {
    margin-top: 20px;
  }
  .info-blocks .info-block {
    margin: 20px 0;
    height: 300px;
  }
  .admin .item.active {
    height: inherit;
    white-space: normal;
    overflow: auto;
  }

  body.enter .logo {
    width: 320px;
    height: 180px;
    background-size: 80%;
    margin-bottom: 30px;
    padding: 130px 0 0;
  }
  body.enter {
    min-height: 320px;
  }
  .admin .item {
    margin-right: 0;
  }
  .modal-dialog.add-subject {
    max-width: 100%;
  }
  .mobile-menu .nav > li > a {
    text-align: left;
  }
  .mobile-menu .nav-pills > li.active > a:after {
    display: none;
  }
  .mobile-menu,
  #menu-collapse-user {
    position: fixed;
    z-index: 10;
    top: 10px;
    left: 0;
    width: 100%;
    background: #ed5e61;
  }

  .mobile-menu ul {
    padding: 10px 0;
  }

  #menu-collapse-user {
    top: 40px;
    padding-left: 140px;
    padding-bottom: 20px;
    padding-top: 20px;
  }
  #menu-collapse-user .user-img {
    left: 20px;
    top: 30px;
  }
  #menu-collapse-user .light,
  #menu-collapse-user h4 {
    display: none;
  }

  #menu-collapse-user a {
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
    font-size: 18px;
    margin: 20px;
  }

  #menu-collapse-user a:hover {
    color: #53539f;
  }

  #menu-collapse-user a:before {
    display: none;
  }

  .navbar-collapse {
    box-shadow: none;
  }
  .navbar-toggle {
    margin: 5px 0;
  }
  .navbar-toggle.menu-user {
    float: left;
    font-weight: 600;
    font-size: 18px;
    color: #fff;
    padding: 12px;
  }

  .mobile-header {
    background: #53539f;
    position: fixed;
    top: 0;
    z-index: 10;
    width: 100%;
  }

  .mobile-header .container {
    padding: 0;
  }

  .navbar-toggle {
    background: #ed5e61;
    margin: 0;
    padding: 9px 20px;
    border-radius: 0;
  }
  .navbar-toggle.collapsed {
    background: transparent;
  }

  .navbar-toggle .icon-bar {
    background: #fff;
  }

  .navbar-toggle .icon-bar {
    height: 3px;
    margin-top: 5px;
  }

  .navbar-toggle .icon-bar + .icon-bar + .icon-bar {
    margin-bottom: 8px;
  }
  .nav > li > a:focus,
  .nav > li > a:hover,
  .nav > li > a.active {
    color: #53539f;
    max-width: 100%;
  }

  .user-type {
    margin-bottom: 30px;
  }
  .user-type a {
    width: 49.5%;
  }

  .nav-pills > li.active > a:after {
    display: none;
  }
  .test-generate .btn {
    width: 100%;
  }
  .test-generate input {
    width: 95%;
  }

  .test-list .white-block div:first-child {
    margin-bottom: 10px;
  }
  .search.hide-search input[type='text'] {
    width: 100%;
    margin-bottom: 30px;
  }
  .enter form {
    margin-bottom: 120px;
    padding: 20px;
  }
}

@media (min-width: 767px) and (max-width: 1200px) {
  .enter:after,
  .enter:before {
    background-size: 50% 50%;
  }
  body.enter {
    min-height: 800px;
  }
  .navbar-nav > li > a {
    padding: 20px 15px;
  }
  .nav-pills > li > a:after {
    visibility: hidden;
  }
  .mobile-menu .nav-justified > li {
    display: inline-block;
    width: auto;
  }
  .nav > li > a:focus,
  .nav > li > a:hover,
  .nav > li > a.active {
    position: static;
    background: none;
    color: #f18c93;
  }
  /* .container.main {
        margin-bottom: 240px;
    } */
  footer {
    /* height:220px; */
  }
}

@media (min-width: 0) and (max-width: 1200px) {
  .info-blocks {
    margin: 20px 0;
    height: auto;
  }
  .info-blocks > div {
    padding: 0;
  }
  .info-blocks .info-block {
    margin: 10px 0;
  }
  .nav > li > a {
    white-space: normal;
    max-width: 100%;
  }
  .nav > li > a.active:after {
    visibility: hidden;
  }
  .admin.filter > form.search {
    display: block;
    display: inline-block;
    width: 100%;
    margin-top: 20px;
  }
  .search button.solo {
    display: none;
  }
  .nav-pills > li > a {
    padding: 15px 5px;
  }
  .table-responsive.schedule {
    margin-bottom: 40px;
    overflow-x: scroll;
  }
  .soc {
    margin-top: 15px;
  }
}

@media (min-width: 0) and (max-width: 1024px) {
  .enter:after,
  .enter:before {
    visibility: hidden;
  }
  .user-image {
    background: #fff;
    margin-right: 15px;
    margin-left: 15px;
  }
  .user-image .row div:first-child {
    padding-left: 0;
  }
  .test-block [class^='col-']:first-child {
    margin-bottom: 20px;
  }
  .test-generate div {
    margin-bottom: 10px;
  }
  .message-list .message.active:after {
    display: none;
  }
  .top-filter .text-right,
  .top-filter.text-right,
  .top-filter .pull-right {
    text-align: left !important;
  }
  .form-group.col-md-4 {
    padding: 0 15px;
  }
  .search.hide-search input[type='text'] {
    width: 100%;
  }

  .subject-lector,
  .subject-price {
    margin-bottom: 15px;
  }
}

@media (min-width: 1200px) and (max-width: 1600px) {
  .enter:after,
  .enter:before {
    background-size: 80% 80%;
  }
}

.modal-body .answer-label {
  width: calc(100% - 40px);
  margin-left: 15px;
  margin: 0 0 10px 15px;
}

/*  */

.btn.btn_padding {
  width: 89px;
  padding-right: 10px !important;
  padding-left: 10px !important;
  padding-bottom: 2px !important;
  padding-top: 2px !important;
}

.btn.btn_chapter {
  background-color: #5eabed;
  box-shadow: 1px 2px 0px 0px #566ec5;
}

.btn.btn_chapter:hover {
  background-color: #5e91ed;
  box-shadow: 1px 2px 0px 0px #566ec5;
}

.btn.btn_test {
  background-color: rgba(0, 144, 24, 0.71);
  box-shadow: 1px 2px 0px 0px #02880d;
}

.btn.btn_test:hover {
  background-color: rgba(0, 144, 24, 0.92);
  box-shadow: 1px 2px 0px 0px #02880d;
}

.btn.btn_homework {
  background-color: rgb(83, 83, 159);
  box-shadow: 1px 2px 0px 0px rgb(30, 30, 121);
}

.btn.btn_homework:hover {
  background-color: rgba(83, 83, 159, 0.90);
  box-shadow: 1px 2px 0px 0px rgb(30, 30, 121);
}

.btn.btn_files {
  background-color: rgb(255, 149, 5);
}

.btn.btn_files:hover {
  background-color: rgba(255, 149, 5, 0.75);
}

/*  */

.pagination_wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
}

.po_pagination {
  display: flex;
  align-items: center;
  user-select: none;
  list-style: none;
  padding: 0;
  gap: 12px;
}

.po_pagination__item--prev > * {
  background-image: url("data:image/svg+xml,%3Csvg width='6' height='12' viewBox='0 0 6 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.8673 11.0868C6.06813 11.3121 6.0505 11.6571 5.8267 11.8598C5.60246 12.0616 5.25635 12.0434 5.05473 11.8192L0.133088 6.3504C-0.0538029 6.14109 -0.0538029 5.82722 0.133088 5.61774L5.05398 0.180834C5.25581 -0.0434087 5.60177 -0.0615888 5.82595 0.140236C6.06235 0.354534 6.05774 0.700329 5.86654 0.913226L1.27549 5.98475L5.8673 11.0868Z' fill='%2316181E'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto;
  border: none !important;
  font-size: 0;
}

.po_pagination__item--next > * {
  background-image: url("data:image/svg+xml,%3Csvg width='6' height='12' viewBox='0 0 6 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.132706 0.913238C-0.0681286 0.687902 -0.0504956 0.342892 0.173303 0.140247C0.397545 -0.0615773 0.743648 -0.0434317 0.945268 0.180845L5.86691 5.6496C6.0538 5.85891 6.0538 6.17278 5.86691 6.38226L0.946018 11.8192C0.744194 12.0434 0.398227 12.0616 0.174054 11.8598C-0.0623545 11.6455 -0.0577411 11.2997 0.133456 11.0868L4.72451 6.01525L0.132706 0.913238Z' fill='%2316181E'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto;
  border: none !important;
  font-size: 0;
}

.po_pagination__item > * {
  width: 32px;
  height: 32px;
  background-color: transparent;
  border: 1px solid #26a298;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 4px;
}

.po_pagination__item:not(.po_pagination__item--prev):not(.po_pagination__item--next):hover > * {
  background-color: #26a298;
  color: white;
  transition: 0.2s ease-in-out;
}

.po_pagination__item.active > * {
  background-color: #26a298;
  color: white;
}

.po_pagination__item.disabled {
  background-color: transparent !important;
}

.po_pagination__item.disabled > * {
  pointer-events: none;
  opacity: 0.25;
}

/*  */

.btn-small {
  font-size: 0.75rem;
}

/*  */

.drop-area {
  border: 2px dashed #ccc;
  border-radius: 5px;
  padding: 20px;
  text-align: center;
  transition: all 0.3s;
  margin: 20px 0;
}

.drop-area.dragover {
  border-color: #666;
  background-color: #f0f0f0;
}

.drop-area.has-files {
  border-color: #02880d;
}

.drop-area .files {
  display: flex;
  flex-direction: column;
  margin: 16px 0;
  gap: 4px;
}

.drop-area .file {
  font-size: 14px;
  display: flex;
  justify-content: space-between;
  background-color: #f9f9f9;
  text-align: left;
  margin-bottom: 0;
  gap: 12px;
}

.drop-area .file::before {
  font-size: 18px;
  top: 0;
  left: -50px;
}

.drop-area .error {
  color: #f44336;
  margin-top: 10px;
}

.drop-area .progress {
  margin-top: 10px;
  height: 4px;
  background: #e0e0e0;
}

.drop-area .progress-bar {
  height: 100%;
  background: #02880d;
  transition: width 0.3s;
}

.drop-area ul {
  list-style-type: none;
  padding: 0;
}

/*  */

.text-small {
  font-size: 12px;
}

.attachment {
  display: flex;
  align-items: center;
  gap: 8px;
}

.attachment .tools {
  display: flex;
}

.attachment .tools a {
  width: 16px;
  height: 16px;
  margin: 0;
}

/*  */

.nav_chapters {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.nav_chapters > * {
  width: 50%;
}

.nav_chapters > *:first-child {
  margin-right: auto;
}

.nav_chapters > *:last-child {
  margin-left: auto;
}
