:root {
  --tutor-text-size:16px;
  --tutor-color-white:#ffffff;
  --tutor-color-success:#24A148;
  --tutor-color-success-rgb:36,161,72;
  --tutor-color-warning:#ED9700;
  --tutor-color-warning-rgb:237,151,0;
  --tutor-color-danger:#F44337;
  --tutor-color-danger-rgb:244,67,55;
  --tutor-color-secondary:#41454F;
  --tutor-color-subdued:#5B616F;
  --tutor-color-hints:#767C8E;
  --tutor-color-muted:#757c8e;
  --tutor-color-gray:#e3e5eb;
  --tutor-color-gray-10:#eff1f6
}
.tutor-color-black {
  color:var(--tutor-body-color)
}
.tutor-color-white {
  color:#ffffff
}
.tutor-color-primary {
  color:var(--tutor-color-primary)
}
.tutor-color-success {
  color:#24A148
}
.tutor-color-warning {
  color:#ED9700
}
.tutor-color-danger {
  color:#F44337
}
.tutor-color-secondary {
/*   color:#41454F */
  color:#fff;
}
.tutor-color-muted {
  color:#757c8e
}
.tutor-color-subdued {
  color:#5B616F
}
.tutor-color-hints {
  color:#767C8E
}
.tutor-color-gray-20 {
  color:#e3e5eb
}
.tutor-color-gray-10 {
  color:#eff1f6
}
.tutor-bg-black {
  background-color:var(--tutor-body-color)
}
.tutor-bg-white {
  background-color:#1b1b1b
}
.tutor-bg-primary {
  background-color:var(--tutor-color-primary)
}
.tutor-bg-success {
  background-color:#24A148
}
.tutor-bg-warning {
  background-color:#ED9700
}
.tutor-bg-danger {
  background-color:#F44337
}
.tutor-bg-secondary {
  background-color:#41454F
}
.tutor-bg-muted {
  background-color:#757c8e
}
.tutor-bg-subdued {
  background-color:#5B616F
}
.tutor-bg-hints {
  background-color:#767C8E
}
.tutor-bg-gray-20 {
  background-color:#e3e5eb
}
.tutor-bg-gray-10 {
  background-color:#eff1f6
}
.text-regular-body {
  font-weight:400;
  font-size:16px;
  line-height:162%
}
.tutor-text-regular-body {
  font-weight:400;
  font-size:16px;
  line-height:162%
}
.text-regular-caption {
  font-weight:400;
  font-size:15px;
  line-height:160%
}
.tutor-text-regular-caption {
  font-weight:400;
  font-size:15px;
  line-height:160%
}
.text-regular-small,.text-body {
  font-weight:400;
  font-size:13px;
  line-height:138%
}
.tutor-text-regular-small {
  font-weight:400;
  font-size:13px;
  line-height:138%
}
.text-regular-tiny {
  font-weight:400;
  font-size:11px;
  line-height:145%
}
.tutor-text-regular-tiny {
  font-weight:400;
  font-size:11px;
  line-height:145%
}
.text-medium-h1 {
  font-weight:500;
  font-size:80px;
  line-height:101%
}
.tutor-text-medium-h1 {
  font-weight:500;
  font-size:80px;
  line-height:101%
}
.text-medium-h2 {
  font-weight:500;
  font-size:60px;
  line-height:117%
}
.tutor-text-medium-h2 {
  font-weight:500;
  font-size:60px;
  line-height:117%
}
.text-medium-h3 {
  font-weight:500;
  font-size:40px;
  line-height:120%
}
.tutor-text-medium-h3 {
  font-weight:500;
  font-size:40px;
  line-height:120%
}
.text-medium-h4 {
  font-weight:500;
  font-size:30px;
  line-height:123%
}
.tutor-text-medium-h4 {
  font-weight:500;
  font-size:30px;
  line-height:123%
}
.text-medium-h5 {
  font-weight:500;
  font-size:24px;
  line-height:142%
}
.tutor-text-medium-h5 {
  font-weight:500;
  font-size:24px;
  line-height:142%
}
.text-medium-h6 {
  font-weight:500;
  font-size:20px;
  line-height:140%
}
.tutor-text-medium-h6 {
  font-weight:500;
  font-size:20px;
  line-height:140%
}
.text-medium-body {
  font-weight:500;
  font-size:16px;
  line-height:162%
}
.tutor-text-medium-body {
  font-weight:500;
  font-size:16px;
  line-height:162%
}
.text-medium-caption {
  font-weight:500;
  font-size:15px;
  line-height:160%
}
.tutor-text-medium-caption {
  font-weight:500;
  font-size:15px;
  line-height:160%
}
.text-medium-small {
  font-weight:500;
  font-size:13px;
  line-height:162%
}
.tutor-text-medium-small {
  font-weight:500;
  font-size:13px;
  line-height:162%
}
.text-medium-tiny {
  font-weight:500;
  font-size:11px;
  line-height:145%
}
.tutor-text-medium-tiny {
  font-weight:500;
  font-size:11px;
  line-height:145%
}
.text-semi-h1 {
  font-weight:600;
  font-size:80px;
  line-height:101%
}
.tutor-text-semi-h1 {
  font-weight:600;
  font-size:80px;
  line-height:101%
}
.text-semi-h2 {
  font-weight:600;
  font-size:60px;
  line-height:117%
}
.tutor-text-semi-h2 {
  font-weight:600;
  font-size:60px;
  line-height:117%
}
.text-semi-h3 {
  font-weight:600;
  font-size:40px;
  line-height:120%
}
.tutor-text-semi-h3 {
  font-weight:600;
  font-size:40px;
  line-height:120%
}
.text-semi-h4 {
  font-weight:600;
  font-size:30px;
  line-height:123%
}
.tutor-text-semi-h4 {
  font-weight:600;
  font-size:30px;
  line-height:123%
}
.text-semi-h5 {
  font-weight:600;
  font-size:24px;
  line-height:142%
}
.tutor-text-semi-h5 {
  font-weight:600;
  font-size:24px;
  line-height:142%
}
.text-semi-h6 {
  font-weight:600;
  font-size:20px;
  line-height:150%
}
.tutor-text-semi-h6 {
  font-weight:600;
  font-size:20px;
  line-height:150%
}
.text-semi-caption {
  font-weight:600;
  font-size:15px;
  line-height:165%
}
.tutor-text-semi-caption {
  font-weight:600;
  font-size:15px;
  line-height:165%
}
.text-semi-small {
  font-weight:600;
  font-size:13px;
  line-height:128%
}
.tutor-text-semi-small {
  font-weight:600;
  font-size:13px;
  line-height:128%
}
.text-bold-h1 {
  font-weight:700;
  font-size:80px;
  line-height:101%
}
.tutor-text-bold-h1 {
  font-weight:700;
  font-size:80px;
  line-height:101%
}
.text-bold-h2 {
  font-weight:700;
  font-size:60px;
  line-height:117%
}
.tutor-text-bold-h2 {
  font-weight:700;
  font-size:60px;
  line-height:117%
}
.text-bold-h3 {
  font-weight:700;
  font-size:40px;
  line-height:120%
}
.tutor-text-bold-h3 {
  font-weight:700;
  font-size:40px;
  line-height:120%
}
.text-bold-h4 {
  font-weight:700;
  font-size:30px;
  line-height:123%
}
.tutor-text-bold-h4 {
  font-weight:700;
  font-size:30px;
  line-height:123%
}
.text-bold-h5 {
  font-weight:700;
  font-size:24px;
  line-height:142%
}
.tutor-text-bold-h5 {
  font-weight:700;
  font-size:24px;
  line-height:142%
}
.text-bold-h6 {
  font-weight:700;
  font-size:20px;
  line-height:150%
}
.tutor-text-bold-h6 {
  font-weight:700;
  font-size:20px;
  line-height:150%
}
.text-bold-body {
  font-weight:700;
  font-size:16px;
  line-height:162%
}
.tutor-text-bold-body {
  font-weight:700;
  font-size:16px;
  line-height:162%
}
.text-bold-caption {
  font-weight:700;
  font-size:15px;
  line-height:160%
}
.tutor-text-bold-caption {
  font-weight:700;
  font-size:15px;
  line-height:160%
}
.text-bold-small {
  font-weight:700;
  font-size:13px;
  line-height:162%
}
.tutor-text-bold-small {
  font-weight:700;
  font-size:13px;
  line-height:162%
}
.text-bold-tiny {
  font-weight:700;
  font-size:11px;
  line-height:145%
}
.tutor-text-bold-tiny {
  font-weight:700;
  font-size:11px;
  line-height:145%
}
.text-btn-xlarge {
  font-weight:500;
  font-size:18px;
  line-height:178%
}
.tutor-text-btn-xlarge {
  font-weight:500;
  font-size:18px;
  line-height:178%
}
.text-btn-large {
  font-weight:500;
  font-size:16px;
  line-height:200%
}
.tutor-text-btn-large {
  font-weight:500;
  font-size:16px;
  line-height:200%
}
.text-btn-medium {
  font-weight:500;
  font-size:15px;
  line-height:160%
}
.tutor-text-btn-medium {
  font-weight:500;
  font-size:15px;
  line-height:160%
}
.text-btn-small {
  font-weight:500;
  font-size:13px;
  line-height:123%
}
.tutor-text-btn-small {
  font-weight:500;
  font-size:13px;
  line-height:123%
}
#tutor-certificate-showcase {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  gap:70px
}
@media(max-width:575.98px) {
  #tutor-certificate-showcase {
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
  -ms-flex-direction:column;
  flex-direction:column;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  border:1px solid var(--tutor-border-color);
  padding:40px 0px;
  border-radius:5px;
  gap:50px
}
}#tutor-certificate-showcase .tutor-cs-text {
  width:calc(60% - 35px);
  background:-webkit-gradient(linear,left top,right top,from(#e0e2ea),to(#ffffff));
  background:linear-gradient(to right,#e0e2ea,#ffffff);
  padding:1px;
  border-radius:4px
}
#tutor-certificate-showcase .tutor-cs-text>div {
  padding:23px 0px 25px 23px;
  background-color:#fff;
  border-radius:3px
}
@media(max-width:575.98px) {
  #tutor-certificate-showcase .tutor-cs-text {
  width:100%;
  text-align:center;
  padding:0px 20px;
  background:none
}
#tutor-certificate-showcase .tutor-cs-text>div {
  padding:0px
}
}#tutor-certificate-showcase .tutor-cs-text h3 {
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
@media(max-width:575.98px) {
  #tutor-certificate-showcase .tutor-cs-text h3 {
  white-space:unset;
  overflow:unset;
  text-overflow:unset
}
}#tutor-certificate-showcase .tutor-cs-wrapper {
  width:40%;
  position:relative
}
@media(max-width:575.98px) {
  #tutor-certificate-showcase .tutor-cs-wrapper {
  width:100%
}
}#tutor-certificate-showcase .tutor-cs-wrapper::before {
  content:url(../../addons/tutor-certificate/assets/images/certificate-frame.png);
  position:absolute;
  height:219px;
  left:-44px;
  bottom:-46px
}
@media(max-width:575.98px) {
  #tutor-certificate-showcase .tutor-cs-wrapper::before {
  left:50%;
  -webkit-transform:translateX(-50%);
  transform:translateX(-50%)
}
}#tutor-certificate-showcase .tutor-cs-wrapper .tutor-cs-image-wrapper {
  position:relative;
  z-index:1
}
@media(max-width:575.98px) {
  #tutor-certificate-showcase .tutor-cs-wrapper .tutor-cs-image-wrapper {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center
}
}#tutor-certificate-showcase .tutor-cs-wrapper .tutor-cs-image-wrapper img {
  max-width:252px;
  border-radius:4px;
  -webkit-box-shadow:0px 4px 8px 0px rgba(0,30,43,.12);
  box-shadow:0px 4px 8px 0px rgba(0,30,43,.12)
}