@charset "UTF-8";
/*
 0 - 600px:         Phone
 600 - 900px:       Tablet portrait
 900 - 1200px:      Tablet landscape
 1200 - 1800px:     Desktop
1800px + :          Big Desktop
 /*

  &breakpoint arguement choices
     - phone
     - tab-portrait
     - tab-land
     - big-desktop

     1em = 16px 
 */
/*
@mixin grid-template-columns-all-full-start-end {
     grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(10, [col-start] minmax(min-content, 13rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];

   
    //  @include respond(tab-between-port-land){
    //     grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(10, [col-start] minmax(min-content, 13rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end]; 
    //     background-color: gray;
    //  }
}
*/
:root {
  --color-primary: #29abe2;
  --color-primary-dark: #0066a4;
  --color-primary-dark-2: #2f2e41;
  --color-green: #2ecc71;
  --color-red: #f24e43;
  --color-grey-light-1: #faf9f9;
  --color-grey-light-2: #f4f2f2;
  --color-grey-light-3: #f0eeee;
  --color-grey-light-4: #ccc;
  --color-grey-dark-1: #414141;
  --color-grey-dark-2: #777777;
  --color-grey-dark-3: #999;
  --color-gradient-primary: linear-gradient(135deg, rgba(41,170,226,1) 0%, rgba(0,101,164,1) 100%);
  --shadow-dark: 0 2rem 6rem rgba(0,0,0,.3);
  --shadow-light: 0 2rem 5rem rgba(0,0,0,.06);
  --bg-color-overlay: rgba(0, 0, 0, 0.7);
  --box-shadow-box: 0px 4px 17px rgba(0, 0, 0, .161);
  --border-radius: 5px;
  --border-radius-1: 12px;
  --border-line-gray: 1px solid var(--color-grey-light-4);
  --line: 1px solid #d4d4d4;
  --line--2: 1px solid #eaeaea;
  --margin-tob-bottom: 2rem;
}

.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}

.lds-ellipsis div {
  position: absolute;
  top: 33px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--color-primary);
  -webkit-animation-timing-function: cubic-bezier(0, 1, 1, 0);
          animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
  left: 8px;
  -webkit-animation: lds-ellipsis1 0.6s infinite;
          animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
  left: 8px;
  -webkit-animation: lds-ellipsis2 0.6s infinite;
          animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
  left: 32px;
  -webkit-animation: lds-ellipsis2 0.6s infinite;
          animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
  left: 56px;
  -webkit-animation: lds-ellipsis3 0.6s infinite;
          animation: lds-ellipsis3 0.6s infinite;
}

@-webkit-keyframes lds-ellipsis1 {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes lds-ellipsis1 {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@-webkit-keyframes lds-ellipsis3 {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
}

@keyframes lds-ellipsis3 {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
}

@-webkit-keyframes lds-ellipsis2 {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(24px, 0);
            transform: translate(24px, 0);
  }
}

@keyframes lds-ellipsis2 {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(24px, 0);
            transform: translate(24px, 0);
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-duration: 0.6s;
  animation-duration: 0.6s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes progressBarAnimation {
  0% {
    width: 2%;
  }
  100% {
    width: 50%;
  }
}

@keyframes progressBarAnimation {
  0% {
    width: 2%;
  }
  100% {
    width: 50%;
  }
}

@-webkit-keyframes scale-down {
  0% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
  }
  100% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
}

@keyframes scale-down {
  0% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
  }
  100% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
}

/* end animation */
/* star ANIMATIONS input--1 ================ */
@-webkit-keyframes inputHighlighter {
  from {
    background: var(--color-primary);
  }
  to {
    width: 0;
    background: transparent;
  }
}

@keyframes inputHighlighter {
  from {
    background: var(--color-primary);
  }
  to {
    width: 0;
    background: transparent;
  }
}

/* end ANIMATIONS input--1 ================ */
/**
 * ----------------------------------------
 * animation slide-bottom-status-popup
 * ----------------------------------------
 */
@-webkit-keyframes slide-bottom-status-popup {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(33px);
    transform: translateY(33px);
  }
}

@keyframes slide-bottom-status-popup {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(33px);
    transform: translateY(33px);
  }
}

.slide-bottom-status-popup {
  -webkit-animation: slide-bottom-status-popup 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  animation: slide-bottom-status-popup 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

/**
 * ----------------------------------------
 * animation slide-right-sidebar
 * ----------------------------------------
 */
@-webkit-keyframes slide-right-sidebar {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(250px);
    transform: translateX(250px);
  }
}

@keyframes slide-right-sidebar {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(250px);
    transform: translateX(250px);
  }
}

.slide-right-sidebar {
  -webkit-animation: slide-right-sidebar 0.3s ease-in-out both;
  animation: slide-right-sidebar 0.3s ease-in-out both;
}

/**
 * ----------------------------------------
 * animation slide-left
 * ----------------------------------------
 */
@-webkit-keyframes slide-left-sidebar {
  0% {
    -webkit-transform: translateX(250px);
    transform: translateX(250px);
  }
  100% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }
}

@keyframes slide-left-sidebar {
  0% {
    -webkit-transform: translateX(250px);
    transform: translateX(250px);
  }
  100% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }
}

.slide-left-sidebar {
  -webkit-animation: slide-left-sidebar 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  animation: slide-left-sidebar 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

/**
 * ----------------------------------------
 * animation slide-top - star - popup__doc-box-dowload__items
 * ----------------------------------------
 */
.slide-top {
  -webkit-animation: slide-top 0.2s ease-in-out both;
  animation: slide-top 0.2s ease-in-out both;
}

@-webkit-keyframes slide-top {
  0% {
    opacity: 0;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
  }
  50% {
    opacity: 0.5;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  80% {
    opacity: 0.7;
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

@keyframes slide-top {
  0% {
    opacity: 0;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
  }
  50% {
    opacity: 0.5;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  80% {
    opacity: 0.7;
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

.slide-top-2 {
  -webkit-animation: slide-top-2 1.2s ease-in-out 400ms both;
  animation: slide-top-2 1.2s ease-in-out 400ms both;
}

.slide-top-2--100 {
  -webkit-animation: slide-top-2 1.2s ease-in-out 100ms both;
  animation: slide-top-2 1.2s ease-in-out 100ms both;
}

.slide-top-2--200 {
  -webkit-animation: slide-top-2 1.2s ease-in-out 200ms both;
  animation: slide-top-2 1.2s ease-in-out 200ms both;
}

.slide-top-2--500 {
  -webkit-animation: slide-top-2 1.2s ease-in-out 500ms both;
  animation: slide-top-2 1.2s ease-in-out 500ms both;
}

.slide-top-2--800 {
  -webkit-animation: slide-top-2 1.2s ease-in-out 800ms both;
  animation: slide-top-2 1.2s ease-in-out 800ms both;
}

@-webkit-keyframes slide-top-2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slide-top-2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

/**
 * ----------------------------------------
 * star - animation scale-up-center-loop circle icon btn
 * ----------------------------------------
 */
.scale-up-center-loop {
  -webkit-animation: scale-up-center-loop 0.6s ease-in-out infinite
 alternate-reverse both;
  animation: scale-up-center-loop 0.6s ease-in-out infinite alternate-reverse
 both;
}

@-webkit-keyframes scale-up-center-loop {
  0% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes scale-up-center-loop {
  0% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/**
 * ----------------------------------------
 * end - animation scale-up-center-loop lop
 * ----------------------------------------
 */
/**
 * ----------------------------------------
 * star - animation bounce-slide-top-loop
 * ----------------------------------------
 */
.bounce-slide-top-loop {
  -webkit-animation: bounce-slide-top-loop 0.8s ease-in-out infinite
 alternate-reverse both;
  animation: bounce-slide-top-loop 0.8s ease-in-out infinite alternate-reverse
 both;
}

@-webkit-keyframes bounce-slide-top-loop {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }
}

@keyframes bounce-slide-top-loop {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }
}

/**
 * ----------------------------------------
 * end - animation bounce-slide-top-loop
 * ----------------------------------------
 */
.rotate-from-0-to-180deg {
  -webkit-animation: rotate-from-0-to-180deg 0.5s ease-in-out both;
  animation: rotate-from-0-to-180deg 0.5s ease-in-out both;
  -webkit-transform-origin: center center;
          transform-origin: center center;
}

@-webkit-keyframes rotate-from-0-to-180deg {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
}

@keyframes rotate-from-0-to-180deg {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
}

.rotate-from-180-to-360deg {
  -webkit-animation: rotate-from-180-to-360deg 0.5s ease-in-out both;
  animation: rotate-from-180-to-360deg 0.5s ease-in-out both;
  -webkit-transform-origin: center center;
          transform-origin: center center;
}

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

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

.wiper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -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;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: var(--color-primary-dark-2);
  -webkit-transform: translate(-100%, 0);
          transform: translate(-100%, 0);
}

.wiper__img {
  height: 7.4rem;
}

@media only screen and (max-width: 37.5em) {
  .wiper__img {
    height: 5.4rem;
  }
}

.wiper div {
  height: 9rem;
  overflow: hidden;
  margin-top: 1rem;
}

.wiper__text {
  width: 100%;
  font-family: "Montserrat", sans-serif;
  font-weight: 900;
  font-size: 3.5rem;
  line-height: 1;
  color: #ccc;
  margin: 0;
  padding: 0;
}

@media only screen and (max-width: 80em) {
  .scale-width-right-40vw {
    z-index: 100;
  }
}

@media only screen and (max-width: 56.25em) {
  .scale-width-right-40vw {
    z-index: 100;
    -webkit-animation: initial;
    animation: initial;
  }
}

@-webkit-keyframes scale-width-right-40vw {
  0% {
    width: 100%;
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
  100% {
    width: 40vw;
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
}

@keyframes scale-width-right-40vw {
  0% {
    width: 100%;
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
  100% {
    width: 40vw;
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
}

* {
  margin: 0;
  padding: 0;
}

*,
*::before,
*::after {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
}

html {
  scroll-behavior: smooth;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 62.5%;
}

@media only screen and (max-width: 37.5em) {
  html {
    font-size: 60%;
  }
}

body {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-grey-dark-2);
  background-color: var(--color-grey-light-3);
  min-height: 95vh;
}

a, a:link, a:visited {
  font-family: 'Roboto', sans-serif;
  text-decoration: none;
  /* no underline */
  color: inherit;
  /* blue colors for links too */
  outline: none;
  background-color: transparent;
}

a a:active, a:link a:active, a:visited a:active {
  color: inherit;
  text-decoration: none;
  outline: none;
  background-color: transparent;
}

nav ul {
  list-style: none;
}

button {
  font-family: 'Roboto', sans-serif;
  width: auto;
  background: transparent;
  border: none;
  cursor: pointer;
  outline: none;
}

b {
  font-weight: 700;
}

::-moz-selection {
  color: #002338;
  background-color: #6bd2ff;
}

::selection {
  color: #002338;
  background-color: #6bd2ff;
}

::-webkit-scrollbar {
  width: 1rem;
}

::-webkit-scrollbar-track {
  background-color: #ebebeb;
  border-radius: 1rem;
}

::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background: rgba(0, 0, 0, 0.144);
}

.sidebar::-webkit-scrollbar,
.sidebar--phone::-webkit-scrollbar-thumb {
  width: .5rem;
}

.sidebar::-webkit-scrollbar-thumb,
.sidebar--phone::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background: rgba(0, 0, 0, 0.041);
}

.heading-secundary {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  width: 100%;
  color: var(--color-grey-dark-1);
  font-weight: 800;
  font-size: 2.2rem;
  letter-spacing: .057rem;
}

@media only screen and (max-width: 56.25em) {
  .heading-secundary {
    line-height: 24px;
  }
}

@media only screen and (max-width: 37.5em) {
  .heading-secundary {
    display: block;
    line-height: 22px;
  }
}

.heading-secundary--1 {
  margin-bottom: 1rem;
  padding: 0;
}

.heading-secundary--2 {
  line-height: 26px;
}

.heading-tertiary {
  display: block;
  width: 100%;
  color: var(--color-grey-dark-1);
  font-weight: 600;
  font-size: 1.6rem;
}

@media only screen and (max-width: 37.5em) {
  .heading-tertiary {
    font-size: 1.5rem;
    line-height: 18px;
  }
}

.heading-tertiary--1 {
  line-height: 25px;
  margin: 0 0 1rem 0;
  padding: 0;
}

@media only screen and (max-width: 37.5em) {
  .heading-tertiary--1 {
    line-height: 16px;
  }
}

.heading-tertiary--2 {
  margin-top: 1rem;
  padding-left: 1rem;
}

.heading-tertiary--3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0;
  padding: 0;
}

.heading-channel-list {
  display: block;
  width: 100%;
  color: var(--color-grey-dark-1);
  font-weight: 600;
  font-size: 1.8rem;
  text-decoration: none;
  padding: 0;
}

@media only screen and (max-width: 37.5em) {
  .heading-channel-list {
    line-height: 18px;
  }
}

.heading-channel-list h2 {
  font-weight: 600;
  font-size: 1.6rem;
}

.heading-channel-list:hover {
  color: var(--color-grey-dark-1);
}

.heading-channel-list:active {
  color: var(--color-grey-dark-1);
}

.heading-channel-list:link, .heading-channel-list:visited {
  color: var(--color-grey-dark-1);
}

.heading-channel-list--1 {
  display: inline-block;
  width: auto;
}

.heading-channel-list--2 {
  margin: 0 0 1.5rem 0;
}

.subtittle-steps {
  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;
  font-size: 1.3rem;
  font-weight: 300;
  color: var(--color-grey-dark-3);
  margin-left: 1rem;
}

@media only screen and (max-width: 56.25em) {
  .subtittle-steps {
    line-height: 17px;
    margin: 0;
  }
}

@media only screen and (max-width: 37.5em) {
  .subtittle-steps {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    line-height: 15px;
    margin: .5rem 0 0 0;
  }
}

.tittle-video-primary {
  color: var(--color-grey-dark-1);
  display: block;
  font-size: 2.2rem;
  font-weight: 500;
  margin-bottom: 1rem;
  padding: 0;
  line-height: 1.2;
  letter-spacing: .1px;
}

.title-5-2-rem {
  width: 100%;
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 5.2rem;
  font-weight: 800;
  line-height: 48px;
  letter-spacing: .057rem;
  color: var(--color-grey-dark-1);
}

.title-3-5-rem {
  width: 100%;
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 3.5rem;
  font-weight: 800;
  line-height: 40px;
  letter-spacing: .057rem;
  color: var(--color-grey-dark-1);
}

.title-2-9-rem {
  width: 100%;
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 2.9rem;
  font-weight: 200;
  line-height: 38px;
  margin-top: 4rem;
}

.paragraph-primary {
  font-size: 1.4rem;
  line-height: 19px;
  font-weight: 300;
}

.paragraph__404 {
  font-size: 1.5rem;
  font-weight: 400;
  width: calc(100vw - 5rem);
  margin: 0 auto;
}

.heading-big-primary {
  display: block;
  width: 100%;
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  font-size: 6.6rem;
  line-height: 1;
  color: var(--color-primary-dark-2);
  margin-bottom: .5rem;
}

@media only screen and (max-width: 80em) {
  .heading-big-primary {
    font-size: 5.6rem;
  }
}

.heading-big-primary--blue {
  color: var(--color-primary-dark);
}

.heading {
  display: block;
  width: 100%;
  font-family: 'Montserrat', sans-serif;
  font-weight: 900;
  font-size: 2.5rem;
  line-height: 1;
  color: var(--color-primary-dark-2);
  margin: 0;
  padding: 0;
}

.heading--big {
  font-size: 6.4rem;
}

@media only screen and (max-width: 80em) {
  .heading--big {
    font-size: 5.6rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .heading--big {
    font-size: 3.2rem;
  }
}

.heading--big--blue {
  color: var(--color-primary-dark);
}

.heading--small {
  font-weight: 500;
  font-size: 2.4rem;
}

.heading--white {
  color: white;
}

.visibility-hidden {
  visibility: hidden;
}

.visibility-visible-opacity-1 {
  visibility: visible !important;
  opacity: 1 !important;
}

.display-none-important {
  display: none !important;
}

.display__none {
  display: none;
}

.display__block {
  display: block;
}

.display__flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.flex-1 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.display__inline {
  display: inline;
}

.display__inline__flex {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.justify-between {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.justify-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.justify-end {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.position__relative {
  position: relative;
}

.position__static {
  position: static !important;
}

.position__initial {
  position: initial !important;
}

.position_absolute {
  position: absolute;
}

.add-fixed-flex {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  position: fixed !important;
}

.flex-direction-column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.align-items {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.width-100 {
  width: 100%;
}

.align-items-end {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-auto {
  overflow: auto;
}

.cursor-pointer {
  cursor: pointer;
}

.non-cursor-pointer {
  cursor: default;
}

.user-s-pointer-e-none {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none;
}

.pointer-events {
  pointer-events: none !important;
}

.color-primary {
  color: var(--color-primary) !important;
}

.margin-top-11rem {
  margin-top: 11rem;
}

.margin-top-6rem {
  margin-top: 6rem;
}

.margin-top-5rem {
  margin-top: 5rem;
}

.margin-top-4rem {
  margin-top: 4rem;
}

.margin-top-3rem {
  margin-top: 3rem;
}

.margin-top-2-5rem {
  margin-top: 2.5rem;
}

.margin-top-2rem {
  margin-top: 2rem;
}

.margin-top-1-5rem {
  margin-top: 1.5rem;
}

.margin-top-1rem {
  margin-top: 1rem;
}

.margin-top-0-5rem {
  margin-top: 0.5rem;
}

.margin-right-1rem {
  margin-right: 1rem;
}

.margin-right-2rem {
  margin-right: 2rem;
}

.margin-right-3rem {
  margin-right: 3rem;
}

.margin-right-6rem {
  margin-right: 6rem;
}

.margin-bottom-1rem {
  margin-bottom: 1rem;
}

.margin-bottom-2rem {
  margin-bottom: 2rem;
}

.margin-bottom-3rem {
  margin-bottom: 3rem;
}

.margin-bottom-4rem {
  margin-bottom: 4rem;
}

.margin-bottom-1-5rem {
  margin-bottom: 1.5rem;
}

.margin-bottom-0-5rem {
  margin-bottom: 0.5rem;
}

.margin-left-4rem {
  margin-left: 4rem;
}

.margin-left-3rem {
  margin-left: 3rem;
}

.margin-left-2-5rem {
  margin-left: 2.5rem;
}

.margin-left-2-4rem {
  margin-left: 2.4rem;
}

.margin-left-2rem {
  margin-left: 2rem;
}

.margin-left-1rem {
  margin-left: 1rem;
}

.margin-left-0-5rem {
  margin-left: 0.5rem;
}

.margin_1 {
  margin: 1rem !important;
}

.margin-0 {
  margin: 0 !important;
}

.margin-auto {
  margin: auto;
}

.padding-0 {
  padding: 0 !important;
}

.padding-top-1rem {
  padding-top: 2rem;
}

.padding-bottom-5px {
  padding-bottom: 5px;
}

.padding-right-left-4rem {
  padding: 0 4rem;
}

.padding-left-1rem {
  padding-left: 1rem;
}

.padding-left-5rem {
  padding-left: 5rem;
}

.padding-5rem {
  padding: 5rem;
}

.padding-0__3-rem {
  padding: 0.3rem;
}

.text-center {
  text-align: center;
  display: block;
}

.text-nowrap {
  text-wrap: nowrap;
}

.text-center_center {
  text-align: center;
}

.text-right {
  text-align: right;
  display: block;
}

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

.line-height-15px {
  line-height: 15px;
}

.table thead th {
  vertical-align: bottom;
  border-bottom: 2px solid #dee2e6;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  /* z-index: 9999999; */
  background: #e5e5e5;
}

@media (max-width: 1200px) {
  .edittest_righttop {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}

.fixed-box-bar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-item-align: center;
      align-self: center;
  margin-bottom: 2rem;
}

.fixed-box-bar--tabs {
  margin-bottom: 0;
}

@media only screen and (max-width: 75em) {
  .fixed-box-bar--flex-wrap {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

@media only screen and (max-width: 56.25em) {
  .fixed-box-bar {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

.fixed-box-bar__title-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-item-align: center;
      align-self: center;
}

.fixed-box-bar__title-btn .btn {
  margin-right: 1rem;
}

.fixed-box-bar__title-btn a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-decoration: none;
  list-style: none;
}

.fixed-box-bar__title-btn .btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-decoration: none;
  list-style: none;
}

.fixed-box-bar__scroll {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: var(--color-grey-light-3);
  padding: 1.2rem 2rem 1rem 27rem;
  border-bottom: var(--line);
  position: fixed;
  top: 58px;
  left: 0;
  z-index: 200;
}

@media only screen and (max-width: 75em) {
  .fixed-box-bar__scroll {
    padding: 1.2rem 2rem 1rem 24rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .fixed-box-bar__scroll {
    padding: 1.2rem 2rem 1rem 9rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .fixed-box-bar__scroll {
    padding: 0.5rem 2rem 1rem 1rem;
    top: 48px;
  }
}

.margin-box-scroll {
  margin-top: 6rem;
}

.activity__resume {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(min-content, 22rem))[4];
      grid-template-columns: repeat(4, minmax(-webkit-min-content, 22rem));
      grid-template-columns: repeat(4, minmax(min-content, 22rem));
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  grid-gap: 1.5rem 2rem;
}

@media only screen and (max-width: 56.25em) {
  .activity__resume {
    -ms-grid-columns: (minmax(min-content, 22rem))[2];
        grid-template-columns: repeat(2, minmax(-webkit-min-content, 22rem));
        grid-template-columns: repeat(2, minmax(min-content, 22rem));
  }
}

@media only screen and (max-width: 37.5em) {
  .activity__resume {
    -ms-grid-columns: min-content;
        grid-template-columns: -webkit-min-content;
        grid-template-columns: min-content;
  }
}

.activity__resume-box {
  background-color: white;
  border-radius: var(--border-radius-1);
  padding: 2rem;
  line-height: 1;
}

.activity__resume-title {
  font-size: 1.7rem;
  letter-spacing: .600px;
  margin-bottom: .9rem;
  font-weight: 500;
}

.activity__resume-subtitle {
  font-size: 3.2rem;
  color: #3e3e3e;
}

.activity__resume-subtitle-2 {
  display: block;
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 1.8rem;
}

.activity__resume-element {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 1.3rem;
  font-weight: 400;
  margin-bottom: .8rem;
}

.activity__resume-element-2 {
  font-size: 1.4rem;
  font-weight: 600;
  color: #3e3e3e;
}

.box-related {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  -ms-grid-columns: (minmax(19rem, 19.5rem))[auto-fit];
      grid-template-columns: repeat(auto-fit, minmax(19rem, 19.5rem));
  grid-gap: 3rem 2rem;
}

.box-channel {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  -ms-grid-columns: minmax(min-content, max-content);
      grid-template-columns: minmax(-webkit-min-content, -webkit-max-content);
      grid-template-columns: minmax(min-content, max-content);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  list-style: none;
}

.box-channel__form {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr auto;
      grid-template-rows: 1fr auto;
  -ms-grid-columns: minmax(min-content, max-content);
      grid-template-columns: minmax(-webkit-min-content, -webkit-max-content);
      grid-template-columns: minmax(min-content, max-content);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.box-channel > .box-channel__items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: var(--border-radius);
}

.box-channel__items-photo {
  width: 11rem;
  height: 11rem;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: var(--border-radius);
  background-color: white;
}

.box-channel__items-name {
  max-width: 19rem;
  height: 21px;
  color: var(--color-grey-dark-1);
  font-size: 1.6rem;
  line-height: 18px;
  letter-spacing: .16px;
  font-weight: 600;
  white-space: nowrap;
  margin-top: .7rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

.all-channels-box {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  -ms-grid-columns: 2fr min-content;
      grid-template-columns: 2fr -webkit-min-content;
      grid-template-columns: 2fr min-content;
  grid-gap: 3rem;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: var(--line);
}

.all-channels-box__user, .all-channels-box__user p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--color-grey-dark-1);
  line-height: 1.1;
  letter-spacing: .16px;
}

.btn {
  display: inline-block;
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  font-family: "Roboto", sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: 0.1rem;
  color: var(--color-primary);
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: none;
  background-color: transparent;
  outline: none;
  cursor: pointer;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

@media only screen and (max-width: 37.5em) {
  .btn {
    font-size: 1.2rem;
  }
}

.btn:focus {
  outline: none;
}

.btn-primary {
  color: #fff;
  font-weight: 500;
  background-color: var(--color-primary);
  padding: 1rem 1.5rem;
  border-radius: 5rem;
}

.btn-primary:hover {
  background-color: var(--color-primary-dark);
}

.btn-primary--delete {
  color: white;
  background-color: var(--color-red);
}

.btn-primary--delete:hover {
  background-color: #c4433b;
}

.btn-secundary:hover {
  color: var(--color-primary-dark);
}

.btn-secundary--delete {
  color: white;
  background-color: var(--color-red);
}

.btn-secundary--delete:hover {
  background-color: #c4433b;
}

.btn-blue {
  color: var(--color-grey-dark-2);
  padding: 0.9rem 1.2rem;
  z-index: 40;
}

.btn-blue:hover {
  color: var(--color-primary);
}

.btn-rounded {
  color: var(--color-grey-light-1);
  padding: 1.5rem 2rem;
  border-radius: 5rem;
  background: var(--color-gradient-primary);
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

@media only screen and (max-width: 37.5em) {
  .btn-rounded {
    padding: 1.3rem 1.4rem;
  }
}

.btn-rounded:hover {
  color: #ebebeb;
  -webkit-transform: translateY(-3px);
          transform: translateY(-3px);
  background: linear-gradient(135deg, #289cce 0%, #055c92 100%);
}

.btn-rounded:focus {
  color: #ebebeb;
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
  background: linear-gradient(135deg, #289cce 0%, #055c92 100%);
}

.btn-rounded--line {
  color: var(--color-primary-dark);
  border: 2px solid var(--color-primary-dark);
  background: transparent;
}

.btn-rounded--line:hover {
  color: var(--color-primary-dark);
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  background: transparent;
}

.btn-rounded--line:focus {
  color: var(--color-primary-dark);
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
  background: transparent;
}

.btn-rounded--line--white {
  border: 2px solid white;
  color: white;
}

.btn-green {
  color: #fff;
  font-weight: 500;
  background-color: var(--color-green);
  padding: 0.9rem 1.2rem;
  border-radius: 5rem;
}

.btn-green:hover {
  background-color: #29a85f;
}

.btn-green--2 {
  color: var(--color-green);
  padding: 0;
  z-index: 40;
}

.btn-green--2:hover {
  color: #29a85f;
}

.btn-line {
  border-radius: 5rem;
  border: 1px solid #d4d4d4;
  color: var(--color-grey-dark-2);
  padding: 0.9rem 1.2rem;
  z-index: 40;
}

.btn-line:hover {
  color: var(--color-primary);
  background-color: #e9e9e9;
}

.btn-line:active {
  background-color: #dfdfdf;
}

.btn-disable[disabled] {
  color: #a6c9d9;
  cursor: not-allowed;
  font-weight: 500;
  background-color: #c7eafb;
  padding: 0.9rem 1.2rem;
  border-radius: 5rem;
}

.btn-disable--non-bg[disabled] {
  color: #b3b3b3;
  font-weight: 700;
  cursor: not-allowed;
  border-radius: 5rem;
}

.btn-disable--bg-gray[disabled] {
  color: #b3b3b3;
  font-weight: 500;
  cursor: not-allowed;
  background-color: #d2d2d2;
  padding: 0.9rem 1.2rem;
  border-radius: 5rem;
}

.btn-gray {
  color: var(--color-grey-dark-2);
  padding: 0.9rem 1.2rem;
}

.btn-gray:hover {
  color: var(--color-grey-dark-1);
}

.btn-gray--background {
  color: #b3b3b3;
  font-weight: 500;
  background-color: #d2d2d2;
  padding: 0.9rem 1.2rem;
  border-radius: var(--border-radius);
}

.btn-gray--background:hover {
  background-color: var(--color-grey-dark-1);
}

.btn-save {
  color: var(--color-green);
  padding: 0.9rem 1.2rem;
  cursor: default;
}

.btn-copy-link {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.btn-copy-link:hover {
  -webkit-transform: translateY(-0.22rem);
          transform: translateY(-0.22rem);
}

.btn-copy-link:active {
  -webkit-transform: translateY(-0.1rem);
          transform: translateY(-0.1rem);
}

.btn-icon-eliminate {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.btn-icon-eliminate:hover {
  -webkit-transform: translateY(-0.22rem);
          transform: translateY(-0.22rem);
}

.btn-icon-eliminate:active {
  -webkit-transform: translateY(-0.1rem);
          transform: translateY(-0.1rem);
}

.btn-publish {
  font-size: 1.3rem;
  margin-right: 1rem;
  color: var(--color-green);
  cursor: default;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.btn-red {
  color: var(--color-grey-dark-2);
  padding: 0.9rem 1.2rem;
}

.btn-red:hover {
  color: var(--color-red);
}

.btn-red--1 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--color-red);
  padding: 0;
  cursor: default;
}

.btn-report {
  font-weight: 500;
  font-size: 1.2rem;
}

.btn-scroll-down {
  position: relative;
  cursor: pointer;
  z-index: 999;
}

.btn-scroll-down__circle {
  width: 5rem;
  height: 5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-right: 0;
  border-radius: 50%;
  background: var(--color-primary);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-shadow: 0 8px 10px rgba(0, 0, 0, 0.22);
          box-shadow: 0 8px 10px rgba(0, 0, 0, 0.22);
  position: fixed;
  right: 19px;
  bottom: 36px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.btn-scroll-down__circle:hover {
  -webkit-transform: translateY(-0.22rem);
          transform: translateY(-0.22rem);
  -webkit-box-shadow: 0 12px 17px rgba(0, 0, 0, 0.22);
          box-shadow: 0 12px 17px rgba(0, 0, 0, 0.22);
  background: var(--color-primary-dark);
}

.btn-scroll-down__circle:active {
  -webkit-transform: translateY(-0.1rem);
          transform: translateY(-0.1rem);
  -webkit-box-shadow: 0 8px 10px rgba(0, 0, 0, 0.22);
          box-shadow: 0 8px 10px rgba(0, 0, 0, 0.22);
  background-color: #00456f;
}

@media only screen and (max-width: 37.5em) {
  .btn-scroll-down__circle {
    right: 12px;
    bottom: 64px;
    z-index: 901;
  }
}

.btn-scroll-down__button {
  height: 1.6rem;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
}

.btn-small {
  font-size: 1rem;
  padding: 0.8rem 0.5rem;
}

.btn-previous-next {
  position: absolute;
  top: 44%;
  left: 0;
  z-index: 800;
}

@media only screen and (max-width: 37.5em) {
  .btn-previous-next {
    top: 40%;
    left: -6px;
  }
}

.btn-previous-next--inactive {
  display: none;
}

.btn-previous-next__right {
  top: 44%;
  right: 0;
  left: initial;
}

@media only screen and (max-width: 37.5em) {
  .btn-previous-next__right {
    top: 40%;
    right: -6px;
  }
}

.btn-previous-next__box {
  width: 3rem;
  height: 4rem;
  margin-right: 0;
  border-radius: 0;
  border-top-right-radius: 7%;
  border-bottom-right-radius: 7%;
  background-color: rgba(41, 171, 226, 0.851);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 100;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.btn-previous-next__box:hover {
  background: rgba(0, 102, 164, 0.769);
}

.btn-previous-next__box:active {
  -webkit-box-shadow: 0 8px 10px rgba(0, 0, 0, 0.22);
          box-shadow: 0 8px 10px rgba(0, 0, 0, 0.22);
  background-color: rgba(0, 68, 111, 0.847);
}

@media only screen and (max-width: 37.5em) {
  .btn-previous-next__box {
    width: 2.5rem;
    height: 3rem;
  }
}

.btn-previous-next__box::before {
  content: "Video anterior";
  width: 8.1rem;
  height: 1.3rem;
  font-size: 1.1rem;
  color: var(--color-primary-dark);
  background-color: rgba(255, 255, 255, 0.859);
  opacity: 0;
  visibility: hidden;
  border-radius: 2px;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  position: absolute;
  right: -59px;
  z-index: -1;
}

.btn-previous-next__box__right::before {
  content: "Siguiente video";
  position: absolute;
  right: 7px;
  z-index: -1;
}

.btn-previous-next:hover > .btn-previous-next__box::before {
  opacity: 1;
  -webkit-transform: translateX(2.2rem);
          transform: translateX(2.2rem);
  visibility: visible;
  z-index: 99;
}

.btn-previous-next:hover > .btn-previous-next__box__right::before {
  opacity: 1;
  -webkit-transform: translateX(-2.2rem);
          transform: translateX(-2.2rem);
  visibility: visible;
  z-index: 99;
}

.btn-previous-next-icon {
  height: 1.4rem;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

@media only screen and (max-width: 37.5em) {
  .btn-previous-next-icon {
    height: 1.2rem;
  }
}

.btn-previous-next-icon__right {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}

.btn-previous-next:hover > .btn-previous-next__box > .btn-previous-next-icon {
  -webkit-transform: rotate(90deg) translateY(0.32rem);
          transform: rotate(90deg) translateY(0.32rem);
}

.btn-previous-next:hover > .btn-previous-next__box > .btn-previous-next-icon__right {
  -webkit-transform: rotate(-90deg) translateY(0.32rem);
          transform: rotate(-90deg) translateY(0.32rem);
  visibility: visible;
}

.btn-dots {
  width: 3.2rem;
  height: 3.2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 50%;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  cursor: pointer;
}

.btn-dots:focus {
  background-color: #d1d1d1;
}

.btn-dots:focus + .menu {
  visibility: visible;
  opacity: 1;
  z-index: 999;
}

.btn-dots:hover {
  background-color: #dedede;
}

.btn-dots:active {
  background-color: #d1d1d1;
}

.btn-dots__items {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background-color: var(--color-primary-dark-2);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  position: relative;
}

.btn-dots__items--2 {
  background-color: var(--color-grey-dark-3);
}

.btn-dots:hover .btn-dots__items {
  background-color: var(--color-grey-dark-2);
}

.btn-dots__items::before {
  content: "";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: inherit;
  height: inherit;
  border-radius: inherit;
  background-color: inherit;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  position: absolute;
  top: -7px;
}

.btn-dots:hover .btn-dots__items::before {
  width: inherit;
  height: inherit;
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
  background-color: var(--color-grey-dark-2);
}

.btn-dots:active .btn-dots__items::before,
.btn-dots:focus .btn-dots__items::before {
  width: inherit;
  height: inherit;
  -webkit-transform: translateY(2px);
          transform: translateY(2px);
}

.btn-dots__items::after {
  content: "";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: inherit;
  height: inherit;
  border-radius: inherit;
  background-color: inherit;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  position: absolute;
  top: 7px;
}

.btn-dots:hover .btn-dots__items::after {
  width: inherit;
  height: inherit;
  -webkit-transform: translateY(2px);
          transform: translateY(2px);
  background-color: var(--color-grey-dark-2);
}

.btn-dots:active .btn-dots__items::after,
.btn-dots:focus .btn-dots__items::after {
  width: inherit;
  height: inherit;
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  top: 7px;
}

.btn-x {
  font-size: 1.6rem;
  color: var(--color-grey-light-4);
  -webkit-transition: 0.2s all;
  transition: 0.2s all;
}

.btn-x:hover {
  color: var(--color-red);
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

.btn_fllw_ipad_ {
  display: none;
}

@media only screen and (max-width: 56.25em) {
  .btn_fllw_ipad_ {
    display: block;
  }
}

@media only screen and (max-width: 37.5em) {
  .btn_fllw_ipad_ {
    display: none;
  }
}

.btn-fllw_ {
  display: block;
  margin-top: 1rem;
}

@media only screen and (max-width: 56.25em) {
  .btn-fllw_ {
    display: none !important;
  }
}

@media only screen and (max-width: 37.5em) {
  .btn-fllw_ {
    display: block;
  }
}

.icon__secundary2 {
  height: 2.15rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.img_btn_done {
  display: none;
  height: 2.15rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.img_btn_done2 {
  display: none;
  height: 2.15rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.btn-x-delete {
  width: 3rem;
  height: 3rem;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  line-height: 0;
  text-decoration: none;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.btn-x-delete:hover {
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  background-color: #e6e6e6;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
}

.btn-x-delete::before {
  content: "";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 1.8rem;
  border: none;
  border-bottom: 4rem solid var(--color-grey-dark-3);
  border-width: 0 0 2px 0;
  border-radius: 6px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  position: absolute;
}

.btn-x-delete::after {
  content: "";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 1.8rem;
  border: none;
  border-bottom: 4rem solid var(--color-grey-dark-3);
  border-width: 0 0 2px 0;
  border-radius: 6px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  position: absolute;
}

.btn-x-delete:hover::before, .btn-x-delete:hover::after {
  width: 1.8rem;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border: none;
  border-bottom: 4rem solid var(--color-red);
  border-width: 0 0 2px 0;
  border-radius: 6px;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.btn-notification {
  -webkit-transition: inherit;
  transition: inherit;
  position: relative;
  border-radius: 50% !important;
  width: 3.7rem;
  height: 3.7rem;
}

.btn-notification:hover {
  background-color: #ebebeb;
}

.btn-notification:active {
  background-color: #dbdbdb;
}

.btn-notification:hover img {
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
}

.btn-notification:hover span {
  -webkit-transform: translateY(-1px);
          transform: translateY(-1px);
  border: 2px solid #ebebeb;
}

.btn-notification:active span {
  border: 2px solid #dbdbdb;
}

.btn-notification__circle {
  width: 1.2rem;
  height: 1.2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-radius: 50%;
  border: 2px solid white;
  background-color: var(--color-primary);
  -webkit-transition: inherit;
  transition: inherit;
  position: absolute;
  top: 4px;
  right: 5px;
}

@media only screen and (max-width: 37.5em) {
  .btn-notification__circle {
    top: 6px;
    right: 8px;
  }
}

.btn-notification__circle__hidden {
  display: none;
}

.content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 37.5em) {
  .content {
    padding-bottom: 4rem;
  }
}

.content--1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.content-video-info {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.banner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.banner__box {
  width: 100%;
  height: calc((100vw - 240px) / 7.2 - 1px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  margin: 6.9rem 2rem 0 27rem;
  -webkit-transition: 0.2s all;
  transition: 0.2s all;
}

@media only screen and (max-width: 75em) {
  .banner__box {
    margin: 5.9rem 2rem 0 24rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .banner__box {
    height: calc((100vw - 100px) / 7.2);
    margin: 5.9rem 2rem 0 9rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .banner__box {
    height: calc((100vw - 70px) / 5.2);
    margin: 5.2rem 0 0 0;
  }
}

.banner__box-photo {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: 50% 0%;
  object-position: 50% 0%;
}

.video-info {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 2rem 0;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

@media only screen and (max-width: 37.5em) {
  .video-info {
    margin: 0;
    padding: 0 0.8rem;
  }
  .video-info--phone {
    padding: 0;
  }
}

.video-info__box {
  margin-right: 1.9rem;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 68%;
          flex: 0 0 68%;
  position: relative;
}

@media only screen and (max-width: 75em) {
  .video-info__box {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 64%;
            flex: 0 0 64%;
  }
}

@media only screen and (max-width: 56.25em) {
  .video-info__box {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}

@media only screen and (max-width: 37.5em) {
  .video-info__box {
    margin-right: 0;
  }
}

.video-info__box--1 {
  margin-right: 0;
}

.video-info__box--2 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.video-info__box-item {
  width: 100%;
  max-height: 515px;
  cursor: pointer;
}

@media only screen and (max-width: 37.5em) {
  .video-info__box-item {
    width: calc((100% + 3vw) - -3px);
    margin: 0 calc(-2vw);
  }
}

.video-info__box-item:active, .video-info__box-item:focus, .video-info__box-item:visited {
  border: none;
  background-color: none;
  outline: none;
}

.video-info__canal {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-item-align: stretch;
      align-self: stretch;
  -webkit-box-flex: 1;
      -ms-flex: 1 0 25%;
          flex: 1 0 25%;
  padding: 2rem 2.5rem;
  background-color: var(--color-grey-light-1);
  border-radius: var(--border-radius);
  position: relative;
  overflow: hidden;
}

@media only screen and (max-width: 56.25em) {
  .video-info__canal {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 100%;
            flex: 1 0 100%;
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
    max-height: 50%;
    margin: 2rem 0 1.4rem 0;
  }
}

@media only screen and (max-width: 37.5em) {
  .video-info__canal {
    max-height: 500px;
    margin: 0 0 1.4rem 0;
    color: #ffa9a9;
  }
}

.video-info__canal-tittle {
  color: var(--color-grey-dark-1);
  font-size: 2rem;
  text-align: center;
  margin-bottom: 0.8rem;
  line-height: 21px;
}

.video-info__canal-text {
  max-height: calc((100vw - 9px) / 6.2 - -66px);
  height: 100%;
  overflow: hidden;
  font-size: 1.4rem;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: 0.038rem;
  color: #939393;
  position: relative;
}

@media only screen and (max-width: 75em) {
  .video-info__canal-text {
    line-height: 18px;
  }
}

@media only screen and (max-width: 100em) {
  .video-info__canal-text {
    max-height: calc((100vw - 49px) / 4.2 - 66px);
  }
}

@media only screen and (max-width: 80em) {
  .video-info__canal-text {
    max-height: calc((100vw - 179px) / 5.2 - 66px);
  }
}

@media only screen and (max-width: 56.25em) {
  .video-info__canal-text {
    min-height: 100px;
    max-height: 100%;
  }
}

@media only screen and (max-width: 37.5em) {
  .video-info__canal-text {
    max-height: 100%;
  }
}

.video-info__canal-text--1 {
  height: 30vh;
  max-height: 55%;
  overflow-y: scroll;
}

@media only screen and (max-width: 37.5em) {
  .video-info__canal-text--1 {
    height: 13rem;
    max-height: 55%;
    overflow-y: scroll;
  }
}

.video-info__canal-text::before {
  content: "";
  width: 100%;
  height: 20px;
  display: block;
  position: absolute;
  background: -webkit-gradient(left top, left bottom, color-stop(15%, rgba(250, 249, 249, 0)), color-stop(75%, #faf9f9));
  background: -webkit-gradient(linear, left top, left bottom, color-stop(15%, rgba(250, 249, 249, 0)), color-stop(75%, #faf9f9));
  background: linear-gradient(to bottom, rgba(250, 249, 249, 0) 15%, #faf9f9 75%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#faf9f9', endColorstr='#faf9f9', GradientType=0 );
  bottom: 0;
}

.video-info__canal-text--transparent::before {
  content: "";
  width: 100%;
  height: 20px;
  display: block;
  position: absolute;
  background: transparent;
  bottom: 0;
}

.video-info__canal-link {
  text-decoration: none;
  list-style: none;
}

.video-info__canal-redes {
  margin-top: 1rem;
}

.video-info__tittle {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 68%;
          flex: 0 0 68%;
  padding: 1.5rem 0 0 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media only screen and (max-width: 56.25em) {
  .video-info__tittle {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}

.video-info__tittle-items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.video-info__tittle-items img:not(:last-child) {
  margin-right: 1.2rem;
}

.video-info__tittle-items img:nth-child(2) {
  margin-right: 1.2rem;
}

.video-info__tittle-items img:nth-child(3) {
  margin-right: 1.2rem;
}

.video-info__tittle-views {
  font-size: 1.5rem;
  font-weight: 400;
}

.video-info__box-files-share-report {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: relative;
}

@media only screen and (max-width: 37.5em) {
  .video-info__box-files-share-report {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}

.video-info__descarga {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-bottom: 1rem;
}

@media only screen and (max-width: 56.25em) {
  .video-info__descarga {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
}

.videos-recientes {
  width: 100%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 56.25em) {
  .videos-recientes {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
}

.videos-recientes__box-title {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 0 1.5rem 0;
}

.videos-recientes__btn {
  font-size: 1.3rem;
  white-space: nowrap;
}

.doc-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: start;
  font-size: 1.5rem;
  font-weight: 300;
}

@media only screen and (max-width: 37.5em) {
  .doc-box {
    margin-bottom: 0.5rem;
  }
}

.doc-box__empty {
  width: 100%;
  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;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
}

.doc-box__items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-top: 1rem;
}

.doc-box__items:not(:last-child) {
  margin-right: 1.8rem;
  padding-right: 1.8rem;
  border-right: 1px solid var(--color-grey-light-4);
}

@media only screen and (max-width: 37.5em) {
  .doc-box__items:not(:last-child) {
    margin-right: 0;
    padding-right: 0;
    border-right: none;
  }
}

.doc-box__items--not-border-right:not(:last-child) {
  border-right: none;
}

@media only screen and (max-width: 75em) {
  .doc-box__items {
    margin-bottom: 1.8rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .doc-box__items {
    margin-bottom: 0;
  }
}

.doc-box__items-text {
  display: block;
  max-width: 155px;
  height: 14px;
  border: none;
  font-size: 1.3rem;
  font-weight: 400;
  white-space: nowrap;
  line-height: 1;
  text-decoration: none;
  text-overflow: ellipsis;
  overflow: hidden;
  background-color: transparent;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.video-description__box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.video-description__box-items {
  font-size: 1.3rem;
  font-weight: 300;
  line-height: 1.3;
}

.video-description__box-user {
  display: block;
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--color-grey-dark-1);
  text-decoration: none;
}

.video-description__p {
  width: 82%;
  font-size: 1.4rem;
  font-weight: 400;
  padding: 1.6rem 0 0 4.8rem;
}

.video-description__p--1 {
  width: calc(100% - 8rem);
}

.card__box {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  margin-bottom: 2rem;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.card__box--create-test-video-asociate {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow-y: scroll;
  height: 52em;
  gap: 1rem;
}

.card__box--create-test-video-asociate--landing {
  height: 84vh;
}

@media only screen and (max-width: 37.5em) {
  .card__box--phone {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.card__box__selected {
  width: 238px;
  background-color: #eeeeee;
  border-radius: var(--border-radius);
  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;
  margin: 0 1rem 1rem 0;
  cursor: pointer;
}

.card__box__selected--playlist {
  width: 234px;
  height: 215px;
}

.card__box__selected--1 {
  background-color: #b8b8b8;
}

.card__box-body {
  width: 210px;
  position: relative;
  cursor: pointer;
}

.card__box-body:not(:last-child) {
  margin-right: 2rem;
}

.card__box-body--2 {
  height: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 2rem 0;
}

.card__box-body--3 {
  height: 157px;
  scroll-snap-align: center;
}

.card__box-body--4 {
  width: auto;
  height: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 2rem 0;
}

.card__box-top {
  color: #101020;
  overflow: hidden;
  border-radius: var(--border-radius);
  position: relative;
}

.card__box-top-overlay {
  width: 210px;
  height: 118px;
  background-color: rgba(0, 0, 0, 0.27);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

.card__box-top-overlay--1 {
  top: 20px;
}

.card__box-top__item {
  overflow: hidden;
  width: 210px;
  height: 118px;
}

.card__box-top__img {
  width: 210px;
  height: 118px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
}

.card__box-top__img--nonlock {
  -webkit-filter: blur(0px);
          filter: blur(0px);
  background-image: -webkit-gradient(linear, left top, right bottom, from(#02020215), to(#02020215));
}

.card__box-top__img--lock {
  background-image: -webkit-gradient(linear, left top, right bottom, from(#0202023b), to(#0202023b));
}

.card__box-top__img--notification {
  width: 86px;
  height: 48px;
}

.card__box-items__lock-doc {
  width: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 0.7rem 1rem;
  position: absolute;
  top: 0;
  right: 0;
}

.card__box-items__lock-doc--1 {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
}

.card__box-items__lock-doc--2 {
  right: 23px;
}

.card__box-span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0.4rem 0.5rem;
  background-color: rgba(0, 0, 0, 0.664);
  border-radius: var(--border-radius);
  z-index: 10;
}

.card__box-span:not(:last-child) {
  margin-right: 1rem;
}

.card__box-span--1 {
  height: 1.7rem;
  font-size: 1.1rem;
  font-weight: 500;
  color: #e2e2e2;
  padding: 0 0.4rem;
  margin: 0 0.8rem 0 0;
  position: absolute;
  right: 0;
  bottom: 8px;
}

.card__box-span--2 {
  width: 100%;
  background-color: rgba(0, 0, 0, 0.48);
}

.card__box-span--docs {
  background-color: initial;
}

.card__box-bottom {
  font-size: 1.4rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.card__box-tittle {
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--color-grey-dark-1);
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 250px;
  max-height: 31px;
  min-height: 17px;
  margin: 0.9rem 0 2px 0;
}

.card__box-tittle--playlist {
  width: 20rem;
}

.card__box-position-number {
  width: 210px;
  height: 118px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
}

.card__box-position-number__item {
  width: 210px;
  height: 118px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 5rem;
  font-weight: 500;
  line-height: 1.1;
  background: rgba(255, 255, 255, 0.92);
  color: var(--color-primary);
  z-index: 99;
}

.card__box-subtitle {
  font-size: 1.3rem;
  font-weight: 400;
  color: var(--color-grey-dark-2);
  line-height: 1;
  text-overflow: ellipsis;
  overflow: hidden;
  margin: 0;
  max-width: 250px;
  height: 15px;
  max-height: 16px;
}

.card__bg-gray {
  background-color: rgba(41, 171, 226, 0.251);
}

.card__bg-bluedark-trans {
  background-color: #d6d6d6;
}

.card-box {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  -ms-grid-columns: (minmax(220px, max-content))[auto-fit];
      grid-template-columns: repeat(auto-fit, minmax(220px, -webkit-max-content));
      grid-template-columns: repeat(auto-fit, minmax(220px, max-content));
}

@media only screen and (max-width: 37.5em) {
  .card-box {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.card-box-video {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  -ms-grid-columns: (minmax(220px, max-content))[auto-fit];
      grid-template-columns: repeat(auto-fit, minmax(220px, -webkit-max-content));
      grid-template-columns: repeat(auto-fit, minmax(220px, max-content));
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 37.5em) {
  .card-box-video {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.card-form {
  width: 410px;
  padding: 4rem;
  background-color: var(--color-grey-light-1);
  border-radius: var(--border-radius);
  position: relative;
  -webkit-transition: all 3s ease-in-out;
  transition: all 3s ease-in-out;
}

.card-form__password {
  width: 410px;
}

.card-prices {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(20rem, 25rem))[auto-fit];
      grid-template-columns: repeat(auto-fit, minmax(20rem, 25rem));
  grid-gap: 3rem 3rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 2rem 0 6rem 0;
}

.card-prices__box {
  background-color: white;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(min-content, 1fr))[2];
      grid-template-columns: repeat(2, minmax(-webkit-min-content, 1fr));
      grid-template-columns: repeat(2, minmax(min-content, 1fr));
  -ms-grid-rows: min-content;
      grid-template-rows: -webkit-min-content;
      grid-template-rows: min-content;
  grid-row-gap: 1rem;
  text-align: center;
  font-family: "Montserrat", sans-serif;
  line-height: 1;
  color: var(--color-primary-dark-2);
  border: 3px solid white;
  border-radius: var(--border-radius-1);
  padding: 3rem 1rem;
  -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
          box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.card-prices__box--1 {
  -ms-grid-rows: 2rem min-content;
      grid-template-rows: 2rem -webkit-min-content;
      grid-template-rows: 2rem min-content;
  padding: 1rem 1rem 3rem 1rem;
  cursor: pointer;
}

.card-prices__box--line-blue {
  border: 3px solid var(--color-primary);
}

.card-prices__box:hover {
  -webkit-box-shadow: 0 15px 55px rgba(0, 0, 0, 0.2);
          box-shadow: 0 15px 55px rgba(0, 0, 0, 0.2);
  -webkit-transform: translateY(-4px);
          transform: translateY(-4px);
}

.card-prices__name {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
  grid-column: 1 / -1;
  font-size: 3rem;
  font-weight: 900;
  line-height: inherit;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.card-prices__name--1 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
}

.card-prices__name--letter-spacing {
  letter-spacing: -1.16px;
}

.card-prices__check {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2 / 3;
  justify-self: end;
  width: 2rem;
  height: 2rem;
  margin: 0 0.7rem 0.7rem 0.7rem;
  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;
}

.card-prices__check--1 {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  -ms-grid-column-align: center;
      justify-self: center;
}

.card-prices__videos {
  grid-column: 1 / -1;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: inherit;
}

.card-prices__line {
  grid-column: 1 / -1;
  width: 15rem;
  -ms-grid-column-align: center;
      justify-self: center;
  margin: 0.5rem 0;
  border-bottom: var(--line);
}

.card-prices__views {
  grid-column: 1 / -1;
  font-size: 1.6rem;
  font-weight: 600;
  line-height: inherit;
  color: var(--color-grey-dark-1);
}

.card-prices__price {
  grid-column: 1 / -1;
  font-size: 2.8rem;
  font-weight: 400;
  line-height: inherit;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  justify-self: center;
  color: var(--color-grey-dark-1);
}

.card-prices__price span {
  font-size: 1.4rem;
  line-height: inherit;
  margin-left: 0.6rem;
  color: inherit;
}

.card-home {
  display: -ms-grid;
  display: grid;
  -ms-flex-line-pack: justify;
      align-content: space-between;
  grid-row-gap: 7rem;
  border-radius: var(--border-radius-1);
  border: 1px solid #eee;
  padding: 3rem 3rem;
  background-color: white;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

.card-home:hover {
  -webkit-transform: translateY(-5px);
          transform: translateY(-5px);
  -webkit-box-shadow: 0 15px 25px rgba(0, 0, 0, 0.116);
          box-shadow: 0 15px 25px rgba(0, 0, 0, 0.116);
}

.card-description-home {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-radius: var(--border-radius-1);
  padding: 5rem 4rem;
  background-color: white;
}

@media only screen and (max-width: 37.5em) {
  .card-description-home {
    padding: 3rem 2.5rem;
  }
}

.card-opinion-home {
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: justify;
      align-content: space-between;
  -ms-grid-rows: (min-content)[5];
      grid-template-rows: repeat(5, -webkit-min-content);
      grid-template-rows: repeat(5, min-content);
  border-radius: var(--border-radius-1);
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

.card-opinion-home__photo {
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1 / 3;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  width: 7.5rem;
  height: 7.5rem;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 50%;
  z-index: 3;
  margin-left: 3rem;
}

.card-opinion-home__text {
  -ms-grid-row: 2;
  -ms-grid-row-span: 3;
  grid-row: 2 / 5;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  border: 1px solid grey;
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: justify;
      align-content: space-between;
  border-radius: var(--border-radius-1);
  padding: 5rem 3rem 3rem 3rem;
  background-color: white;
  z-index: 2;
}

.card-opinion-home__text blockquote {
  font-size: 1.7rem;
  line-height: 1.3;
  font-weight: 300;
  font-style: italic;
}

.content-tree-docs {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 28.5rem minmax(min-content, 1fr);
      grid-template-columns: 28.5rem minmax(-webkit-min-content, 1fr);
      grid-template-columns: 28.5rem minmax(min-content, 1fr);
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  grid-column-gap: 2rem;
}

.content-docs-folders {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
  -ms-grid-rows: 2.5rem min-content 2.5rem min-content;
      grid-template-rows: 2.5rem -webkit-min-content 2.5rem -webkit-min-content;
      grid-template-rows: 2.5rem min-content 2.5rem min-content;
  grid-row-gap: 1rem;
}

@media only screen and (max-width: 56.25em) {
  .content-docs-folders {
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1 / 3;
  }
}

.content-docs-folders .heading-docs {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  -ms-grid-row: 3;
  -ms-grid-row-span: 1;
  grid-row: 3 / 4;
}

.content-docs-folders .content-docs {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  -ms-grid-row: 4;
  -ms-grid-row-span: 1;
  grid-row: 4 / 5;
}

.content-docs-folders .heading-folder {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
}

.content-docs-folders .content-folder {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
}

.content-docs-folders--no-btn {
  -ms-grid-rows: 2.5rem min-content 2.5rem min-content 2.9rem;
      grid-template-rows: 2.5rem -webkit-min-content 2.5rem -webkit-min-content 2.9rem;
      grid-template-rows: 2.5rem min-content 2.5rem min-content 2.9rem;
}

.content-docs-folders__btn {
  -ms-grid-column-align: center;
      justify-self: center;
  color: var(--color-grey-dark-1);
}

.content-docs {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (15rem)[auto-fit];
      grid-template-columns: repeat(auto-fit, 15rem);
  -ms-grid-rows: (15.5rem)[auto-fit];
      grid-template-rows: repeat(auto-fit, 15.5rem);
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  -webkit-transition: height 0.6s ease-in-out 0s;
  transition: height 0.6s ease-in-out 0s;
}

.content-docs--active {
  background-color: salmon;
}

.content-folder {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (15rem)[auto-fit];
      grid-template-columns: repeat(auto-fit, 15rem);
  -ms-grid-rows: (9.5rem)[auto-fit];
      grid-template-rows: repeat(auto-fit, 9.5rem);
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  -webkit-transition: height 0.6s ease-in-out 0s;
  transition: height 0.6s ease-in-out 0s;
}

.content-folder--active {
  height: initial;
  overflow: visible;
}

.docs-tree {
  width: 28.5rem;
  height: 100%;
  padding: 2rem 2.2rem 2rem 2.2rem;
  border-radius: var(--border-radius-1);
  font-size: 1.3rem;
  font-weight: 400;
  line-height: 1;
  position: relative;
  background-color: white;
}

@media only screen and (max-width: 56.25em) {
  .docs-tree {
    display: none;
  }
}

.docs-tree__box__items {
  height: 100%;
  overflow: hidden;
}

.doc {
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-radius: var(--border-radius);
  border: 1px solid var(--color-grey-light-4);
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.doc:hover {
  outline: none;
  border: 1px solid var(--color-primary);
  background-color: rgba(0, 0, 0, 0.034);
}

.doc--new {
  border: 1px solid var(--color-primary);
  background-color: rgba(0, 0, 0, 0.034);
}

.doc--active {
  border: 1px solid var(--color-primary);
  background-color: rgba(0, 0, 0, 0.068);
}

.doc__items-dots {
  position: absolute;
  top: 5px;
  right: 2px;
}

.doc__items-elements {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  padding: 4rem 0 2rem 0;
}

.doc__title span,
.doc__title p {
  display: block;
  text-align: center;
  font-size: 1.2rem;
  font-weight: 300;
  line-height: 1.2;
  word-break: break-all;
  text-decoration: none;
  overflow: hidden;
  margin-top: .8rem;
  max-width: 13.5rem;
  max-height: 9.6rem;
  min-height: 1.6rem;
  word-break: break-word;
}

.folder {
  height: 9.5rem;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-radius: var(--border-radius);
  border: 1px solid var(--color-grey-light-4);
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.folder:hover {
  outline: none;
  border: 1px solid var(--color-primary);
  background-color: rgba(0, 0, 0, 0.034);
}

.folder--new {
  border: 1px solid var(--color-primary);
  background-color: rgba(0, 0, 0, 0.034);
}

.folder--active {
  border: 1px solid var(--color-primary);
  background-color: rgba(0, 0, 0, 0.068);
}

.folder a[href^="/folder/"] {
  opacity: 0;
  visibility: hidden;
  background-color: #a0a0a0;
}

.folder__items-dots {
  position: absolute;
  top: 5px;
  right: 2px;
}

.folder__items-elements {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  padding: 1.5rem 0;
}

.folder__title {
  display: block;
  text-align: center;
  font-size: 1.2rem;
  font-weight: 300;
  line-height: 1.2;
  word-break: break-all;
  text-decoration: none;
  overflow: hidden;
  margin-top: .8rem;
  max-width: 13.5rem;
  max-height: 9.6rem;
  min-height: 1.6rem;
  word-break: break-word;
}

.tree-ul {
  list-style: none;
  margin: 0;
  padding: 0;
  line-height: inherit;
  -webkit-transition: .6s ease all;
  transition: .6s ease all;
  position: relative;
  margin-bottom: 0.41rem;
}

.tree-ul--2 {
  padding-left: 0.5rem;
}

.tree-ul--parent {
  height: 1.8rem;
  overflow: hidden;
  -webkit-transition: height 0.6s ease-in-out 0s;
  transition: height 0.6s ease-in-out 0s;
}

.tree-li {
  list-style: none;
  margin: 0;
  padding: 0;
  line-height: inherit;
  -webkit-transition: .6s ease all;
  transition: .6s ease all;
  overflow: hidden;
}

.tree-title-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.4rem;
  font-weight: 800;
}

.tree-title-parent {
  display: inline-block;
  width: 22rem;
  max-width: 22rem;
  max-height: 1.6rem;
  margin-bottom: 0.4rem;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: inherit;
  color: #5c5c5c;
  padding: 0.2rem;
  border-radius: 3px;
  -webkit-transition: 0.5s all;
  transition: 0.5s all;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.tree-title-parent:hover {
  background-color: #eeeeee;
}

.tree-title-parent--child {
  font-weight: 400;
  margin-bottom: 0;
}

.tree-title-parent--1 {
  font-weight: 400;
  margin-bottom: 0.2rem;
  cursor: pointer;
}

.tree-title-parent--empty {
  font-weight: 400;
  text-align: center;
}

.tree-title-parent--empty:hover {
  background-color: transparent;
}

.tree-arrow-btn {
  position: absolute;
  top: 0;
  right: 2px;
}

.box-drag-files {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 4;
  grid-row: 1 / 5;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  border-radius: var(--border-radius);
  -webkit-animation-delay: 2s;
          animation-delay: 2s;
  z-index: -1;
}

.box-drag-files--active {
  visibility: visible;
  z-index: 101;
}

.box-drag-files--leave {
  z-index: -1;
  visibility: hidden;
}

.box-drag-files__element {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -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;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 2rem;
  font-weight: 300;
  line-height: 1.1;
  text-align: center;
  border-radius: var(--border-radius);
  border: 3px solid var(--color-primary);
  background-color: #dfdfdf;
  padding: 0 2rem;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0;
  z-index: 5;
}

.box-drag-files__element img {
  height: 15rem;
  margin-bottom: 2rem;
}

.box-drag-files__element--active {
  opacity: 1;
  background-color: #9e3737;
}

.form-file-upload {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  z-index: 6;
}

.input-doc {
  background-color: #993a3a;
  height: 100%;
  width: 100%;
  opacity: 0;
  z-index: 7;
}

.down-enter-active {
  -webkit-animation: 0.81s down-enter;
          animation: 0.81s down-enter;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}

.down-leave-active {
  -webkit-animation: 0.81s down-leave;
          animation: 0.81s down-leave;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}

@-webkit-keyframes down-enter {
  0% {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  100% {
    -webkit-clip-path: inset(0);
            clip-path: inset(0);
  }
}

@keyframes down-enter {
  0% {
    -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
  }
  100% {
    -webkit-clip-path: inset(0);
            clip-path: inset(0);
  }
}

@-webkit-keyframes down-leave {
  0% {
    -webkit-clip-path: inset(0);
            clip-path: inset(0);
  }
  100% {
    -webkit-clip-path: inset(100% 0 0 0);
            clip-path: inset(100% 0 0 0);
  }
}

@keyframes down-leave {
  0% {
    -webkit-clip-path: inset(0);
            clip-path: inset(0);
  }
  100% {
    -webkit-clip-path: inset(100% 0 0 0);
            clip-path: inset(100% 0 0 0);
  }
}

.upload-docs {
  display: none;
  width: 35rem;
  height: 17rem;
  max-height: 17rem;
  padding: 1.5rem 0;
  position: fixed;
  right: 20px;
  bottom: 20px;
  background-color: white;
  border-radius: var(--border-radius);
  -webkit-box-shadow: var(--shadow-light);
          box-shadow: var(--shadow-light);
  z-index: 101;
}

.upload-docs--active {
  display: block;
}

.upload-docs span.heading-tertiary {
  margin-left: 3rem;
}

.upload-docs__items {
  height: 11rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 1rem 3rem 0 3rem;
  overflow: hidden;
  overflow-y: scroll;
}

.upload-docs__element {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0.3rem;
}

.edit-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.edit-box--1 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 48%;
          flex: 0 0 48%;
  margin-right: 2%;
}

@media only screen and (max-width: 75em) {
  .edit-box--1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    margin-right: 0;
  }
}

.edit-box--2 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

@media only screen and (max-width: 75em) {
  .edit-box--2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    margin-right: 0;
  }
}

@media only screen and (max-width: 37.5em) {
  .edit-box--2 {
    padding-bottom: 8rem;
  }
}

.edit-box__add-trailer-channel {
  margin-bottom: 2rem;
}

.edit-box__add-trailer {
  margin-bottom: 2rem;
}

.edit-box__add-trailer__title-video h5 {
  height: 32px;
  width: calc((100vw / 2) - 17rem);
  font-size: 2.5rem;
  margin-bottom: 0rem;
  padding-left: 1rem;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

@media only screen and (max-width: 75em) {
  .edit-box__add-trailer__title-video h5 {
    width: calc(90vw - 23rem);
  }
}

.edit-box__redes-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 2rem 0;
}

.edit-box__redes-box-items {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.edit-box__redes-box-items--border-red {
  border: 1px solid var(--color-red);
}

.edit-box__redes-box__input {
  width: 100%;
  display: block;
  font-size: 1.5rem;
  font-weight: 400;
  font-family: inherit;
  color: inherit;
  padding: .5rem 1rem;
  border-radius: 2px;
  background-color: transparent;
  outline: none;
  border: 1px solid var(--color-grey-light-4);
  -webkit-transition: all .3s;
  transition: all .3s;
}

.edit-box__redes-box__input:focus {
  outline: none;
  border: 1px solid var(--color-primary);
}

.edit-box__redes-box__input:focus:invalid {
  border: 1px solid var(--color-red);
}

.edit-box__redes-box__input::-webkit-input-placeholder {
  color: var(--color-grey-dark-3);
}

.edit-box__redes-box__label {
  color: var(--color-grey-dark-1);
  font-size: 1.3rem;
  font-weight: 500;
  position: absolute;
  top: 4px;
  left: 32px;
}

.edit-box__icon-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 150px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: var(--color-grey-dark-1);
  white-space: nowrap;
  font-size: 1.3rem;
  font-family: inherit;
  font-weight: 500;
  margin-right: 1rem;
}

.edit__banner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  padding: 1rem;
  border: 1px solid var(--color-grey-light-4);
  position: relative;
}

.edit__banner__box {
  width: 100%;
  height: calc((50vw - 240px) / 7.2 - 1px);
  border-radius: var(--border-radius);
  margin: 2rem 0;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.edit__banner__box--1 {
  height: auto;
}

@media only screen and (max-width: 80em) {
  .edit__banner__box {
    height: calc((100vw - 240px) / 7.2 - 1px);
  }
}

@media only screen and (max-width: 56.25em) {
  .edit__banner__box {
    height: calc((100vw - 125px) / 7.2 - 1px);
  }
}

@media only screen and (max-width: 37.5em) {
  .edit__banner__box {
    height: calc((100vw - 139px) / 5.2 - 1px);
  }
}

.edit__banner__box-photo {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: 50% 0%;
     object-position: 50% 0%;
  border-radius: var(--border-radius);
}

.edit__banner__input-box {
  width: 100%;
  height: 80px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  border: 1px solid var(--color-grey-light-4);
  border-radius: 3px;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.edit__banner__input-box:hover {
  outline: none;
  border: 1px solid var(--color-primary);
  background-color: rgba(0, 0, 0, 0.034);
}

.edit__banner__input-box p {
  color: var(--color-grey-dark-1);
  font-size: 1.3rem;
  font-weight: 500;
}

.edit__banner__input-box--border-red {
  border: 1px solid var(--color-red);
}

.edit__banner_input {
  width: 100%;
  height: 80px;
  border-radius: 3px;
  opacity: 0;
  cursor: pointer;
  position: absolute;
  top: 0px;
  z-index: 10;
  background-color: #165454;
}

.video_edit_card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.cropper {
  width: 40rem;
  margin: 0 auto;
}

@media only screen and (max-width: 37.5em) {
  .cropper {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -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;
  }
}

.cropper__imageBox {
  position: relative;
  height: 40rem;
  width: 40rem;
  border: 1px solid #aaa;
  background: #fff;
  overflow: hidden;
  background-repeat: no-repeat;
  cursor: move;
}

@media only screen and (max-width: 37.5em) {
  .cropper__imageBox {
    height: 25rem;
    width: 25rem;
  }
}

.cropper__imageBox .spinner {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  text-align: center;
  line-height: 400px;
  background: rgba(0, 0, 0, 0.7);
}

.cropper__imageBox .cropper__thumbBox {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20rem;
  height: 20rem;
  margin-top: -10rem;
  margin-left: -10rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border: 1px solid #666666;
  -webkit-box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.5);
          box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.5);
  background: none repeat scroll 0% 0% transparent;
}

.cropper__input-provitional {
  width: 15.5rem;
  height: 3rem;
  border-radius: var(--border-radius);
  opacity: 0;
  cursor: pointer;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
}

.content-form {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #ececec;
}

.content-form--login {
  min-height: 100vh;
}

.content-form--login--1 {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.content-form--register {
  height: 100vh;
}

.content-form__home {
  width: 100%;
  -ms-grid-column: 1;
  -ms-grid-column-span: 4;
  grid-column: 1 / 5;
  display: -ms-grid;
  display: grid;
  -ms-flex-line-pack: center;
      align-content: center;
}

@media only screen and (max-width: 56.25em) {
  .content-form__home {
    -ms-grid-column: 1;
    -ms-grid-column-span: 9;
    grid-column: 1 / span 9;
    -ms-grid-row: 2;
    -ms-grid-row-span: 1;
    grid-row: 2 / 3;
    padding: 6rem 0;
  }
}

@media only screen and (max-width: 37.5em) {
  .content-form__home {
    -ms-flex-item-align: start;
        -ms-grid-row-align: start;
        align-self: start;
    padding: 6rem 0 2rem 0;
  }
}

.content-form__home-2 {
  -ms-grid-column: 5;
  -ms-grid-column-span: 4;
  grid-column: 5 / 9;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  padding: 1rem;
}

@media only screen and (max-width: 56.25em) {
  .content-form__home-2 {
    -ms-grid-column: 1;
    -ms-grid-column-span: 9;
    grid-column: 1 / span 9;
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1 / 2;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}

.content-form__home__img {
  display: block;
  width: 77%;
  margin: auto;
}

@media only screen and (max-width: 56.25em) {
  .content-form__home__img {
    width: 47%;
  }
}

.content-form__home__description {
  font-size: 1.5rem;
  font-weight: 300;
  line-height: 1.4;
  letter-spacing: 0.034em;
  margin-bottom: 2rem;
}

@media only screen and (max-width: 75em) {
  .content-form__home__description {
    padding: 0 0;
  }
}

@media only screen and (max-width: 56.25em) {
  .content-form__home__description {
    font-size: 1.35rem;
    line-height: 1.4;
  }
}

.content-form__p,
.content-form__p a {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  color: inherit;
  font-family: inherit;
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: 0.044rem;
  text-decoration: none;
  list-style: none;
  border: none;
  margin-top: 1rem;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.content-form__p a {
  font-weight: 500;
  color: var(--color-grey-dark-1);
  cursor: pointer;
}

.content-form__p a:hover {
  color: var(--color-primary-dark);
}

.content-form > :nth-child(4) {
  width: calc(45vw);
  text-align: center;
  margin-top: 2rem;
}

@media only screen and (max-width: 37.5em) {
  .content-form > :nth-child(4) {
    width: calc(76vw);
  }
}

.content-form > :nth-child(4) P {
  font-size: 1.2rem;
  line-height: 17px;
}

.card-form {
  width: 100%;
  max-width: 350px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 4rem;
  border-radius: var(--border-radius);
  background-color: var(--color-grey-light-1);
}

@media only screen and (max-width: 56.25em) {
  .card-form {
    padding: 3rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .card-form {
    padding: 3rem 2.5rem 2rem 2.5rem;
  }
}

.alert-error {
  display: inline;
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  color: var(--color-red);
  font-family: "Roboto", sans-serif;
  font-size: 1.3rem;
  font-weight: 400;
  letter-spacing: 0.037rem;
  line-height: 16px;
  text-decoration: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: none;
  background-color: transparent;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.heading-form-primary {
  display: block;
  width: 100%;
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: 3.1rem;
  line-height: 1;
  color: var(--color-grey-dark-1);
  margin-bottom: 0.5rem;
}

@media only screen and (max-width: 75em) {
  .heading-form-primary--2 {
    font-size: 2.3rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .heading-form-primary--2 {
    font-size: 2.8rem;
    line-height: 26px;
  }
}

@media only screen and (max-width: 37.5em) {
  .heading-form-primary {
    font-size: 2.7rem;
    line-height: 28px;
  }
}

.heading-form-primary--3 {
  font-size: 4.6rem;
  line-height: 1;
}

@media only screen and (max-width: 56.25em) {
  .heading-form-primary--3 {
    font-size: 5rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .heading-form-primary--3 {
    font-size: 3.8rem;
  }
}

.heading-form-secoundary {
  display: block;
  width: 100%;
  font-family: "Montserrat", sans-serif;
  font-weight: 300;
  font-size: 2rem;
  color: var(--color-grey-dark-1);
  line-height: 1.1;
  margin-bottom: 2rem;
}

.heading-form-secoundary--1 {
  font-size: 1.8rem;
}

@media only screen and (max-width: 37.5em) {
  .heading-form-secoundary {
    font-size: 1.9rem;
    line-height: 1;
  }
}

.heading-form-tertiary {
  display: block;
  width: 100%;
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: 2rem;
  color: var(--color-grey-dark-1);
  line-height: 1.1;
  letter-spacing: 0.52px;
}

.text-p-general {
  font-size: 1.3rem;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: 0.037rem;
}

.g-recaptcha {
  -webkit-transform: scale(0.9);
          transform: scale(0.9);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
}

.userfiles .checkbox__span {
  top: 8px !important;
}

.checkbox__input {
  display: none;
}

.checkbox__label {
  width: auto;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.5rem;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  position: relative;
}

.checkbox__label::before {
  content: "";
  display: block;
  height: 2.6rem;
  width: 2.6rem;
  border-radius: 20px;
  opacity: 0;
  background-color: var(--color-grey-light-4);
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  position: absolute;
  top: -4px;
  left: -63px;
}

.checkbox__label:hover::before {
  opacity: 1;
}

.checkbox__label:hover .checkbox__span {
  border: 2px solid var(--color-primary);
}

.checkbox__span {
  height: 1.8rem;
  width: 1.8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border: 2px solid #d2d2d2;
  border-radius: 2px;
  position: absolute;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  left: -59px;
  top: 0;
  z-index: 100;
}

.checkbox__span::after {
  content: "";
  display: block;
  height: 1.2rem;
  width: 0.6rem;
  border: solid var(--color-grey-light-1);
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  opacity: 0;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

.checkbox__input:checked ~ .checkbox__label .checkbox__span::after {
  opacity: 1;
}

.checkbox__input:checked ~ .checkbox__label .checkbox__span {
  border: 2px solid var(--color-primary);
  background-color: var(--color-primary);
}

.container-errors {
  width: 100%;
  min-height: 72vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background-color: var(--color-grey-light-3);
}

.container {
  height: 100vh;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #e6e6e6;
}

.popup__password-channel {
  width: 904px !important;
  max-height: -webkit-fit-content;
  max-height: -moz-fit-content;
  max-height: fit-content;
}

.card__bg-gray {
  background-color: #fff !important;
}

.assign_tests .card__box__selected {
  width: 163px !important;
}

.assign_tests .playlist__box__img-user {
  width: 152px !important;
  height: 122px !important;
}

.assign_tests .playlist__img-user {
  width: 115px !important;
  height: 112px !important;
  -o-object-fit: contain !important;
     object-fit: contain !important;
  margin: auto !important;
}

.assign_files img {
  width: 126px !important;
  height: 107px !important;
  margin: auto;
  margin-top: 1rem;
}

.assign_files div.playlist__box__img-user {
  width: 146px !important;
  height: 126px !important;
}

.assign_files .card__box__selected {
  width: 163px !important;
}

.assign_files label {
  white-space: normal;
}

.user_viewtest {
  width: 50rem;
  margin: auto;
}

#myInput {
  position: absolute;
  right: 3rem;
  padding: 0.2rem;
  /* margin: 1rem; */
  font-family: inherit;
  margin: 0.4rem;
  width: 30%;
  font-size: 1.5rem;
  font-weight: 500;
  border: 1px solid #cdcdcd;
  outline: none;
  height: 3rem;
  color: #414141;
  background-color: #fff;
  padding: 1.5rem;
  border-radius: 1.5rem;
}

#myInput::-webkit-input-placeholder {
  color: #818181;
}

#myInput:-ms-input-placeholder {
  color: #818181;
}

#myInput::-ms-input-placeholder {
  color: #818181;
}

#myInput::placeholder {
  color: #818181;
}

.user_table {
  overflow: auto;
  height: 60vh;
}

.message_history {
  border: 1px solid #919191;
  padding: 1.5rem;
  margin: 3rem 0rem;
  margin-bottom: 1rem;
  display: -ms-grid;
  display: grid;
  overflow: auto;
  max-height: 40rem;
}

.popup_message .popup__password-channel {
  width: 60rem;
}

.message_history .message {
  margin: 1.8rem;
}

.message_history .message {
  border: 1px solid #cccccc;
  /* max-width: 49%; */
  word-break: break-all;
  background: #e9e9e9;
  border-radius: 1rem;
}

.message_history div {
  padding: 0.8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 2em;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.message_history .messageUser {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  border: 1px solid #cccccc;
  /* max-width: 49%; */
  word-break: break-all;
  background: #f5f5f5;
  border-radius: 1rem;
  margin: 1.8rem;
}

.message_header {
  text-align: center;
  padding: 0.7em;
  border-radius: 15px;
  word-break: keep-all;
}

.message_history p:first-child {
  position: absolute;
  white-space: nowrap;
  top: -1.1rem;
  left: 0.2rem;
  background: #faf9f9;
  padding: 0.2rem;
  color: #999999;
}

.message_history p:nth-child(2) {
  font-size: 1.3rem;
}

.message_history p:nth-child(3) {
  position: absolute;
  top: -2.5rem;
  left: 0rem;
}

.tests_link_files {
  width: 3rem;
}

.dropdown {
  border: 1px solid #b6b6b6;
  padding: 1rem;
  margin: 1.2rem;
  cursor: pointer;
}

.box-notification__result__li,
.box-notification__result__li2 {
  display: none !important;
}

.active-box {
  display: block !important;
}

.table th,
.table td {
  vertical-align: initial !important;
}

.NU-added {
  -webkit-animation: blue-background 2s linear;
          animation: blue-background 2s linear;
}

.modal-backdrop.show {
  opacity: 0;
  z-index: -555555;
}

.rotate90 {
  -webkit-transform: rotate(90deg) !important;
          transform: rotate(90deg) !important;
}

.rotate-90 {
  -webkit-transform: rotate(-90deg) !important;
          transform: rotate(-90deg) !important;
}

.filter_brightness04 {
  -webkit-filter: brightness(0.4);
          filter: brightness(0.4);
}

.slider-container {
  padding: 2rem 3rem;
  background: #e6e6e6;
  margin: 2rem auto 0 auto;
  overflow: hidden;
  border-radius: 5px;
  position: relative;
}

.slider-container:before {
  content: ".slider-container";
  position: absolute;
  left: 0;
  top: 0;
  color: blue;
}

.my-slider {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.slider-item {
  background: grey;
  border-right: 2px solid #333;
  padding: 1.5rem 0.75rem;
  position: relative;
}

.slider-item:before {
  content: ".slider-item";
  position: absolute;
  left: 0;
  top: 0;
  color: blue;
}

.slider-item:hover {
  cursor: pointer;
}

.controls {
  margin: 0;
  padding: 0;
  list-style: none;
  position: absolute;
  left: 0;
  background: #333;
  width: 100%;
  top: 50%;
  -webkit-transform: translatey(-50%);
          transform: translatey(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.controls:focus {
  outline: none;
}

.controls li:hover {
  cursor: pointer;
}

.card {
  text-align: center;
  margin: 0 auto;
  max-width: 200px;
  color: #333;
  background: white;
  border-radius: 5px;
  padding-bottom: 0.75rem;
  font-family: sans-serif;
  overflow: hidden;
  -webkit-box-shadow: 2px 2px rgba(0, 0, 0, 0.3);
          box-shadow: 2px 2px rgba(0, 0, 0, 0.3);
  position: relative;
}

.card:before {
  content: ".card";
  position: absolute;
  bottom: 0;
  color: blue;
}

.card img {
  margin-bottom: 0.25rem;
}

.card h2 {
  margin: 0 0 0.25rem;
}

.card p {
  margin: 0;
  padding: 0 0.5rem;
}

.btn-disable--bg-gray {
  color: #fff !important;
}

#tns1,
#tns2,
#tns3,
#tns4 {
  width: auto !important;
}

.tns-controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  position: absolute;
  right: 0;
  top: -29px;
}

.tns-controls button:first-child {
  text-indent: -99666669px;
  font-size: 1rem;
  background-image: url("img/icon_arrow_line_left.svg");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  /* put the height and width of your image here */
  height: 22px;
  width: 30px;
  border: none;
}

.tns-controls button:nth-child(2) {
  text-indent: -99666669px;
  font-size: 1rem;
  background-image: url("img/icon_arrow_line_right.svg");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  /* put the height and width of your image here */
  height: 22px;
  width: 30px;
  border: none;
}

.glider-track {
  overflow: 96%;
}

.asign-sect ::-webkit-scrollbar {
  width: 20px;
  height: 6px;
}

/* Track */
.asign-sect::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 5px grey;
          box-shadow: inset 0 0 5px grey;
  border-radius: 10px;
}

/* Handle */
.asign-sect::-webkit-scrollbar-thumb {
  border-radius: 10px;
}

.splide {
  overflow: auto;
  position: initial;
}

.splide__arrows {
  position: absolute;
  z-index: 55555555;
  right: 0px;
  top: -17px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  width: 8rem;
  background: url("../../../img/2019-06-20 105327.jpg");
}

.card-box {
  position: relative;
}

.splide__pagination {
  display: none;
}

.splide__arrow:nth-child(1) {
  background: url("../../../img/icon_arrow_line_left.svg") no-repeat;
  outline: none;
}

.splide__arrow:nth-child(2) {
  background: url("../../../img/icon_arrow_line_right.svg") no-repeat;
  outline: none;
}

.splide__arrow svg {
  display: none;
}

.splide__list {
  padding: 1rem !important;
}

.table-striped tbody tr:nth-of-type(odd) {
  background: none !important;
}

.table th,
.table td {
  vertical-align: middle !important;
}

.table__row-cell p {
  margin: 0 !important;
}

.table__row-cell {
  padding: 0 !important;
}

.user_table th {
  font-size: 1.5rem !important;
  font-family: 600;
}

#user_channel_img2 {
  position: fixed;
  left: 45px;
  z-index: 2222;
  top: 74px;
}

.user-aside {
  padding-top: 222px !important;
}

#sidebarMenuHamb2 {
  padding-top: 222px;
}

.user-mobile-img {
  position: fixed;
  top: 54px;
  margin: 2rem 0;
  height: 14.75rem !important;
  width: auto !important;
}

hr {
  margin-top: 1rem;
  margin-bottom: 1rem;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

#download_user_file:hover {
  background: linear-gradient(181deg, #c2c2c2, transparent);
}

.download_file_alert {
  position: absolute !important;
  top: -84px;
  z-index: 55;
}

.contain-shape {
  width: 50rem;
}

.box-edit-profile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.box-half {
  width: 49.5%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
}

.error-input-profile {
  width: 100%;
  margin-bottom: 0;
}

.input-edit-profile {
  background-color: white;
  border-radius: 1em;
  border: 1px solid #ccc;
}

.input-edit-profile-half {
  width: 100%;
  background-color: white;
  border-radius: 1em;
  border: 1px solid #ccc;
}

.edit_user-info {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (auto)[2];
      grid-template-columns: repeat(2, auto);
  gap: 1.3rem;
}

.swal-height div:nth-child(3) {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.swal-height div:nth-child(3) button {
  color: #fff;
  font-weight: 500;
  background-color: #29abe2;
  padding: 1rem 1.5rem;
  border-radius: 5rem;
}

@-webkit-keyframes blue-background {
  0% {
    background: #29aae249;
  }
  100% {
    background: none;
  }
}

@keyframes blue-background {
  0% {
    background: #29aae249;
  }
  100% {
    background: none;
  }
}

@media (max-width: 1400px) {
  .viewtest {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
  .viewtest .test_img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 100% !important;
    margin-bottom: 1rem;
    width: auto;
  }
  .viewtest .img {
    position: inherit;
    left: 0 !important;
    width: 45rem !important;
    -o-object-fit: contain;
       object-fit: contain;
  }
}

@media (max-width: 900px) {
  .viewtest {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #user_channel_img2,
  #user_channel_img {
    display: none !important;
  }
  .user-aside {
    padding-top: 57px !important;
  }
  .user-mobile-menu {
    padding-top: 222px !important;
  }
  .user-mobile-img {
    display: block !important;
  }
}

@media (min-width: 900px) {
  .overlay-sidebar-menu-hamb {
    visibility: hidden !important;
  }
}

@media (max-width: 600px) {
  .multiple_users .playlist__box-thumbnail {
    display: block !important;
  }
  .box-edit-profile {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .box-half {
    width: 100%;
  }
  .contain-shape {
    width: 100%;
  }
}

.grid-list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(min-content, 1fr))[10];
      grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
      grid-template-columns: repeat(10, minmax(min-content, 1fr));
  border-top: .3px solid #d8d8d8;
  border-right: .3px solid #d8d8d8;
  font-size: 1.3rem;
  line-height: 1.2;
}

.grid-list--1column {
  height: 30rem;
  max-height: 50rem;
  -ms-grid-columns: minmax(min-content, 1fr);
      grid-template-columns: minmax(-webkit-min-content, 1fr);
      grid-template-columns: minmax(min-content, 1fr);
  overflow: hidden;
  overflow-y: scroll;
}

.grid-list--8column {
  -ms-grid-columns: (minmax(min-content, 1fr))[8];
      grid-template-columns: repeat(8, minmax(-webkit-min-content, 1fr));
      grid-template-columns: repeat(8, minmax(min-content, 1fr));
}

.grid-list__parent {
  width: calc(100vw - 31rem);
  overflow: hidden;
  overflow-x: scroll;
}

@media only screen and (max-width: 56.25em) {
  .grid-list__parent {
    width: calc(100vw - 12rem);
  }
}

@media only screen and (max-width: 37.5em) {
  .grid-list__parent {
    width: calc(100vw - 2rem);
  }
}

.grid-list__title {
  font-weight: 600;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  cursor: pointer;
  line-height: .9;
  -webkit-transition: .3s all;
  transition: .3s all;
}

.grid-list__title:hover {
  background-color: #d9d9d9;
}

.grid-list__title--active-down, .grid-list__title--active-up {
  background-color: #e6e6e6;
}

.grid-list__title--active-down::before {
  content: "\003c";
  display: inline-block;
  width: .51rem;
  font-size: 1.4rem;
  border-radius: 10px;
  -webkit-transition: all .3s;
  transition: all .3s;
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg);
}

.grid-list__title--active-up::before {
  content: "\003c";
  display: inline-block;
  width: .51rem;
  font-size: 1.4rem;
  border-radius: 10px;
  -webkit-transition: all .3s;
  transition: all .3s;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}

.grid-list__title-video {
  margin-top: 2rem;
}

.grid-list > span {
  text-align: center;
  padding: .8rem .4rem;
  border-left: .3px solid #d8d8d8;
  border-bottom: .3px solid #d8d8d8;
}

.grid-list__data {
  font-weight: 400;
}

.grid-list .grid-list__data--2 {
  padding: .8rem 1rem;
}

.grid-list__img {
  display: block;
  width: 18rem;
  height: 8.8rem;
  border-radius: var(--border-radius);
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
  margin-bottom: .51rem;
}

.filter {
  width: 50rem;
  height: 0;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
  grid-row-gap: 1.4rem;
  padding: 0;
  margin-top: 2rem;
  border-radius: 1rem;
  background-color: white;
  margin: 1rem auto 0 auto;
  visibility: hidden;
  position: relative;
  -webkit-transition: all 1.3s;
  transition: all 1.3s;
}

@media only screen and (max-width: 56.25em) {
  .filter {
    width: 43rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .filter {
    width: 21rem;
  }
}

.filter__line {
  border-bottom: var(--line);
}

.filter .video_edit_card-progress-bar_eliminate {
  top: 3rem;
  right: 2rem;
}

.filter__title {
  display: block;
  margin: 1rem 0;
}

.filter .pretty {
  margin: 0 3rem 2rem 0;
  opacity: 0;
  visibility: hidden;
}

@media only screen and (max-width: 37.5em) {
  .filter .pretty {
    margin: 0 3rem 1rem 0;
  }
}

.filter .video_edit_card-progress-bar_eliminate {
  opacity: 0;
  visibility: hidden;
}

.filter .fadeInFilter {
  -webkit-animation: fadeInFilter .6s ease-in both .8s;
  animation: fadeInFilter .6s ease-in both .8s;
}

.filter .fadeInFilter-reverse {
  -webkit-animation: fadeInFilter-reverse .2s ease-in both;
  animation: fadeInFilter-reverse .2s ease-in both;
}

.filter__parent {
  display: -ms-grid !important;
  display: grid !important;
  -ms-grid-rows: min-content 1fr min-content;
      grid-template-rows: -webkit-min-content 1fr -webkit-min-content;
      grid-template-rows: min-content 1fr min-content;
  -webkit-transition: all 1.3s;
  transition: all 1.3s;
}

@media only screen and (max-width: 37.5em) {
  .filter__parent .text-center.margin-top-1rem {
    margin-top: 2rem;
  }
}

@-webkit-keyframes fadeInFilter {
  0% {
    opacity: 0;
    visibility: hidden;
  }
  100% {
    opacity: 1;
    visibility: visible;
  }
}

@keyframes fadeInFilter {
  0% {
    opacity: 0;
    visibility: hidden;
  }
  100% {
    opacity: 1;
    visibility: visible;
  }
}

@-webkit-keyframes fadeInFilter-reverse {
  0% {
    opacity: 1;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}

@keyframes fadeInFilter-reverse {
  0% {
    opacity: 1;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}

.filter-scale-down {
  -webkit-animation: filter-scale-down 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
  animation: filter-scale-down 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
}

@media only screen and (max-width: 56.25em) {
  .filter-scale-down {
    -webkit-animation: filter-scale-down-tap-port 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
    animation: filter-scale-down-tap-port 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
  }
}

@media only screen and (max-width: 37.5em) {
  .filter-scale-down {
    -webkit-animation: filter-scale-down-phone 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
    animation: filter-scale-down-phone 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
  }
}

.filter-scale-down--reverse {
  -webkit-animation: filter-scale-down-reverse 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
  animation: filter-scale-down-reverse 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
}

@media only screen and (max-width: 37.5em) {
  .filter-scale-down--reverse {
    -webkit-animation: filter-scale-down-phone-reverse 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
    animation: filter-scale-down-phone-reverse 1.3s cubic-bezier(0.56, 0.3, 0.31, 0.98) 0.1s both;
  }
}

@-webkit-keyframes filter-scale-down {
  0% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 28.6rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

@keyframes filter-scale-down {
  0% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 28.6rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

@-webkit-keyframes filter-scale-down-reverse {
  0% {
    height: 28.6rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

@keyframes filter-scale-down-reverse {
  0% {
    height: 28.6rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

@-webkit-keyframes filter-scale-down-tap-port {
  0% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 30.6rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

@keyframes filter-scale-down-tap-port {
  0% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 30.6rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

@-webkit-keyframes filter-scale-down-phone {
  0% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 41rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

@keyframes filter-scale-down-phone {
  0% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 41rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

@-webkit-keyframes filter-scale-down-phone-reverse {
  0% {
    height: 41rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

@keyframes filter-scale-down-phone-reverse {
  0% {
    height: 41rem;
    padding: 2rem 4rem 4rem 4rem;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    height: 0;
    padding: 0;
    visibility: visible;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

/*
/// home inicio
*/
.home {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: minmax(70rem, 100vh) min-content (min-content)[12];
      grid-template-rows: minmax(70rem, 100vh) -webkit-min-content repeat(12, -webkit-min-content);
      grid-template-rows: minmax(70rem, 100vh) min-content repeat(12, min-content);
  -ms-grid-columns: [full-start] minmax(6rem, 1fr) [center-start] ([col-start] minmax(min-content, 13rem) [col-end])[10] [center-end] minmax(6rem, 1fr) [full-end];
      grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(10, [col-start] minmax(-webkit-min-content, 13rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];
      grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(10, [col-start] minmax(min-content, 13rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];
  background-color: #f9f9f9;
}

@media only screen and (max-width: 56.25em) {
  .home {
    -ms-grid-columns: [full-start] minmax(2rem, 1fr) [center-start] ([col-start] minmax(min-content, 13rem) [col-end])[4] [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(4, [col-start] minmax(-webkit-min-content, 13rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(4, [col-start] minmax(min-content, 13rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
    -ms-grid-rows: minmax(60rem, 100vh) min-content (min-content)[12];
        grid-template-rows: minmax(60rem, 100vh) -webkit-min-content repeat(12, -webkit-min-content);
        grid-template-rows: minmax(60rem, 100vh) min-content repeat(12, min-content);
  }
}

@media only screen and (max-width: 37.5em) {
  .home {
    -ms-grid-columns: [full-start] minmax(2rem, 1fr) [center-start] ([col-start] minmax(4rem, 14rem) [col-end])[6] [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(6, [col-start] minmax(4rem, 14rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
    -ms-grid-rows: minmax(70rem, 100vh) min-content (min-content)[12];
        grid-template-rows: minmax(70rem, 100vh) -webkit-min-content repeat(12, -webkit-min-content);
        grid-template-rows: minmax(70rem, 100vh) min-content repeat(12, min-content);
  }
}

.home__header {
  grid-column: full-start/full-end;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr minmax(15rem, min-content) 1fr;
      grid-template-rows: 1fr minmax(15rem, -webkit-min-content) 1fr;
      grid-template-rows: 1fr minmax(15rem, min-content) 1fr;
  -ms-grid-columns: [full-start] minmax(6rem, 1fr) [center-start] ([col-start] minmax(min-content, 13rem) [col-end])[10] [center-end] minmax(6rem, 1fr) [full-end];
      grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(10, [col-start] minmax(-webkit-min-content, 13rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];
      grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(10, [col-start] minmax(min-content, 13rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 56.25em) {
  .home__header {
    -ms-grid-columns: [full-start] minmax(2rem, 1fr) [center-start] ([col-start] minmax(min-content, 13rem) [col-end])[4] [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(4, [col-start] minmax(-webkit-min-content, 13rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(4, [col-start] minmax(min-content, 13rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
  }
}

@media only screen and (max-width: 37.5em) {
  .home__header {
    -ms-grid-columns: [full-start] minmax(2rem, 1fr) [center-start] ([col-start] minmax(4rem, 14rem) [col-end])[8] [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(8, [col-start] minmax(4rem, 14rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
  }
}

@media only screen and (max-width: 56.25em) {
  .home__header__title {
    font-size: 7rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .home__header__title {
    font-size: 6rem;
  }
}

.home__header__box {
  -ms-grid-column: 2;
  -ms-grid-column-span: 4;
  grid-column: 2 / 6;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media only screen and (max-width: 80em) {
  .home__header__box {
    -ms-grid-column: 2;
    -ms-grid-column-span: 3;
    grid-column: 2 / 5;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__header__box {
    -ms-grid-column: 2;
    -ms-grid-column-span: 4;
    grid-column: 2 / 6;
  }
}

@media only screen and (max-width: 37.5em) {
  .home__header__box {
    -ms-grid-column: 2;
    -ms-grid-column-span: 8;
    grid-column: 2 / 10;
  }
}

.home__header__box div {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.home__header-img {
  -ms-grid-column: 7;
  -ms-grid-column-span: 5;
  grid-column: 7 / 12;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  width: 100%;
}

@media only screen and (max-width: 80em) {
  .home__header-img {
    -ms-grid-column: 5;
    -ms-grid-column-span: 7;
    grid-column: 5 / 12;
    width: 105%;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__header-img {
    display: none;
  }
}

.home__bg {
  grid-column: 1 / -1;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2 / 4;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: (minmax(5rem, 1fr))[5];
      grid-template-rows: repeat(5, minmax(5rem, 1fr));
  z-index: 1;
}

@media only screen and (max-width: 37.5em) {
  .home__bg {
    -ms-grid-column: 1;
    -ms-grid-column-span: 9;
    grid-column: 1 / 10;
  }
}

.home__bg div {
  grid-column: 1 / -1;
  grid-row: 2 / -1;
  background-color: #ececec;
  z-index: 1;
}

.home__bg--2 {
  -ms-grid-row: 9;
  -ms-grid-row-span: 4;
  grid-row: 9 / 13;
}

.home__bg--2 div {
  grid-column: 1 / -1;
  -ms-grid-row: 1;
  -ms-grid-row-span: 4;
  grid-row: 1 / 5;
  background-color: white;
  z-index: 1;
}

.home__bg--3 {
  -ms-grid-row: 9;
  -ms-grid-row-span: 8;
  grid-row: 9 / 17;
}

.home__bg--3 div {
  grid-column: 1 / -1;
  grid-row: 3 / -1;
  background-color: var(--color-primary-dark-2);
  z-index: 1;
}

.home__explication {
  grid-column: center-start/center-end;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(5rem, 1fr))[10];
      grid-template-columns: repeat(10, minmax(5rem, 1fr));
  -ms-grid-rows: min-content min-content;
      grid-template-rows: -webkit-min-content -webkit-min-content;
      grid-template-rows: min-content min-content;
  grid-row-gap: 4rem;
  margin-bottom: 10rem;
  z-index: 10;
}

@media only screen and (max-width: 37.5em) {
  .home__explication {
    -ms-grid-columns: (minmax(min-content, 1fr))[10];
        grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(10, minmax(min-content, 1fr));
  }
}

.home__explication h1 {
  -ms-grid-column: 3;
  -ms-grid-column-span: 6;
  grid-column: 3 / 9;
}

@media only screen and (max-width: 37.5em) {
  .home__explication h1 {
    -ms-grid-column: 1;
    -ms-grid-column-span: 10;
    grid-column: 1 / 11;
  }
}

.home__explication__cards {
  grid-column: 1 / -1;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(26rem, 29rem))[auto-fit];
      grid-template-columns: repeat(auto-fit, minmax(26rem, 29rem));
  -ms-grid-rows: min-content;
      grid-template-rows: -webkit-min-content;
      grid-template-rows: min-content;
  grid-gap: 6rem 6rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 37.5em) {
  .home__explication__cards {
    -ms-grid-column: 1;
    -ms-grid-column-span: 10;
    grid-column: 1 / 11;
  }
}

.home__container-full {
  grid-column: full-start/full-end;
  display: -ms-grid;
  display: grid;
  grid-template-rows: repeat(5, minmax(5rem, -webkit-min-content));
  -ms-grid-rows: (minmax(5rem, min-content))[5];
      grid-template-rows: repeat(5, minmax(5rem, min-content));
  -ms-grid-columns: [full-start] minmax(6rem, 1fr) [center-start] ([col-start] minmax(min-content, 13rem) [col-end])[10] [center-end] minmax(6rem, 1fr) [full-end];
      grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(10, [col-start] minmax(-webkit-min-content, 13rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];
      grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(10, [col-start] minmax(min-content, 13rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 6rem 0 10rem 0;
  z-index: 10;
}

@media only screen and (max-width: 56.25em) {
  .home__container-full {
    -ms-grid-columns: [full-start] minmax(2rem, 1fr) [center-start] ([col-start] minmax(min-content, 13rem) [col-end])[4] [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(4, [col-start] minmax(-webkit-min-content, 13rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(4, [col-start] minmax(min-content, 13rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
  }
}

@media only screen and (max-width: 37.5em) {
  .home__container-full {
    grid-column: full-start/full-end;
    -ms-grid-columns: [full-start] minmax(2rem, 1fr) [center-start] ([col-start] minmax(min-content, 13rem) [col-end])[4] [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(4, [col-start] minmax(-webkit-min-content, 13rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
        grid-template-columns: [full-start] minmax(2rem, 1fr) [center-start] repeat(4, [col-start] minmax(min-content, 13rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
    padding: 2rem 0 0 0;
  }
}

.home__container-full__uploads {
  -ms-grid-row: 3;
  -ms-grid-row-span: 1;
  grid-row: 3 / 4;
}

.home__container-full__playlist-test {
  -ms-grid-row: 4;
  -ms-grid-row-span: 1;
  grid-row: 4 / 5;
  background-color: #f9f9f9;
}

.home__container-full__share {
  -ms-grid-row: 5;
  -ms-grid-row-span: 1;
  grid-row: 5 / 6;
  background-color: #f9f9f9;
}

.home__container-full__share-2 {
  -ms-grid-row: 6;
  -ms-grid-row-span: 1;
  grid-row: 6 / 7;
  background-color: rgba(41, 171, 226, 0.1);
}

.home__container-full__privacy {
  -ms-grid-row: 7;
  -ms-grid-row-span: 1;
  grid-row: 7 / 8;
  background-color: rgba(41, 171, 226, 0.1);
}

.home__container-full__no-ads {
  -ms-grid-row: 8;
  -ms-grid-row-span: 1;
  grid-row: 8 / 9;
}

.home__container-full__img-left {
  -ms-grid-column: 1;
  -ms-grid-column-span: 6;
  grid-column: 1 / 7;
  -ms-grid-row: 1;
  -ms-grid-row-span: 5;
  grid-row: 1 / 6;
  width: 100%;
  z-index: 10;
}

@media only screen and (max-width: 80em) {
  .home__container-full__img-left {
    -ms-grid-column: 1;
    -ms-grid-column-span: 7;
    grid-column: 1 / 8;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__container-full__img-left {
    width: 90%;
    grid-column: 1 / -1;
    -ms-grid-row: 3;
    -ms-grid-row-span: 3;
    grid-row: 3 / 6;
  }
}

.home__container-full__img-right {
  grid-column: 7 / -1;
  -ms-grid-row: 2;
  -ms-grid-row-span: 3;
  grid-row: 2 / 5;
  width: 100%;
}

@media only screen and (max-width: 80em) {
  .home__container-full__img-right {
    grid-column: 6 / -1;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__container-full__img-right {
    width: 90%;
    grid-column: 1 / -1;
    -ms-grid-row: 3;
    -ms-grid-row-span: 2;
    grid-row: 3 / 5;
  }
}

.home__box-right {
  -ms-grid-column: 2;
  -ms-grid-column-span: 6;
  grid-column: 2 / 8;
  -ms-grid-row: 1;
  -ms-grid-row-span: 5;
  grid-row: 1 / 6;
  width: 100%;
  height: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(5rem, 1fr))[10];
      grid-template-columns: repeat(10, minmax(5rem, 1fr));
  -ms-grid-rows: 5rem (min-content)[2];
      grid-template-rows: 5rem repeat(2, -webkit-min-content);
      grid-template-rows: 5rem repeat(2, min-content);
  grid-row-gap: 2rem;
  padding: 5rem 0;
  border-radius: var(--border-radius-1);
  border: 1px solid var(--color-primary-dark);
}

.home__box-right .icon__5rem {
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2 / 3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
}

.home__box-right .heading {
  -ms-grid-column: 2;
  -ms-grid-column-span: 6;
  grid-column: 2 / 8;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
  margin-bottom: 1rem;
}

@media only screen and (max-width: 80em) {
  .home__box-right .heading {
    -ms-grid-column: 2;
    -ms-grid-column-span: 5;
    grid-column: 2 / 7;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__box-right .heading {
    -ms-grid-column: 2;
    -ms-grid-column-span: 8;
    grid-column: 2 / 10;
  }
}

@media only screen and (max-width: 37.5em) {
  .home__box-right .heading {
    -ms-grid-column: 2;
    -ms-grid-column-span: 8;
    grid-column: 2 / 10;
  }
}

.home__box-right .card-description-home {
  -ms-grid-column: 2;
  -ms-grid-column-span: 6;
  grid-column: 2 / 8;
  -ms-grid-row: 3;
  -ms-grid-row-span: 1;
  grid-row: 3 / 4;
}

@media only screen and (max-width: 80em) {
  .home__box-right .card-description-home {
    -ms-grid-column: 2;
    -ms-grid-column-span: 5;
    grid-column: 2 / 7;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__box-right .card-description-home {
    -ms-grid-column: 2;
    -ms-grid-column-span: 8;
    grid-column: 2 / 10;
  }
}

@media only screen and (max-width: 37.5em) {
  .home__box-right .card-description-home {
    -ms-grid-column: 2;
    -ms-grid-column-span: 8;
    grid-column: 2 / 10;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__box-right {
    -ms-grid-column: 2;
    -ms-grid-column-span: 4;
    grid-column: 2 / 6;
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    grid-row: 1 / 3;
  }
}

@media only screen and (max-width: 37.5em) {
  .home__box-right {
    -ms-grid-columns: (minmax(min-content, 1fr))[10];
        grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(10, minmax(min-content, 1fr));
    -ms-grid-column: 1;
    -ms-grid-column-span: 6;
    grid-column: 1 / 7;
    padding: 2rem 0;
    border: none;
  }
}

.home__box-left {
  -ms-grid-column: 3;
  -ms-grid-column-span: 9;
  grid-column: 3 / 12;
  -ms-grid-row: 1;
  -ms-grid-row-span: 5;
  grid-row: 1 / 6;
  height: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(5rem, 1fr))[10];
      grid-template-columns: repeat(10, minmax(5rem, 1fr));
  -ms-grid-rows: 5rem (min-content)[2];
      grid-template-rows: 5rem repeat(2, -webkit-min-content);
      grid-template-rows: 5rem repeat(2, min-content);
  grid-row-gap: 2rem;
  padding: 5rem 0;
  border-radius: var(--border-radius-1);
  border: 1px solid var(--color-primary-dark);
  z-index: 9;
}

@media only screen and (max-width: 80em) {
  .home__box-left {
    padding-right: 2rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__box-left {
    -ms-grid-column: 2;
    -ms-grid-column-span: 4;
    grid-column: 2 / 6;
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    grid-row: 1 / 3;
  }
}

@media only screen and (max-width: 37.5em) {
  .home__box-left {
    -ms-grid-column: 1;
    -ms-grid-column-span: 6;
    grid-column: 1 / 7;
    -ms-grid-columns: (minmax(min-content, 1fr))[10];
        grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(10, minmax(min-content, 1fr));
    padding: 2rem 0;
    border: none;
  }
}

.home__box-left .icon__5rem {
  grid-column-end: 10;
  -ms-grid-column-align: end;
      justify-self: end;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
}

@media only screen and (max-width: 80em) {
  .home__box-left .icon__5rem {
    grid-column-end: 11;
  }
}

.home__box-left .heading {
  -ms-grid-column: 6;
  -ms-grid-column-span: 4;
  grid-column: 6 / 10;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
  margin-bottom: 1rem;
}

@media only screen and (max-width: 80em) {
  .home__box-left .heading {
    -ms-grid-column: 6;
    -ms-grid-column-span: 5;
    grid-column: 6 / 11;
  }
}

.home__box-left .heading--home-1 {
  -ms-grid-column: 5;
  -ms-grid-column-span: 7;
  grid-column: 5 / 12;
  padding-right: 2rem;
}

.home__box-left .card-description-home {
  -ms-grid-column: 7;
  -ms-grid-column-span: 3;
  grid-column: 7 / 10;
  -ms-grid-row: 3;
  -ms-grid-row-span: 1;
  grid-row: 3 / 4;
}

@media only screen and (max-width: 80em) {
  .home__box-left .card-description-home {
    -ms-grid-column: 7;
    -ms-grid-column-span: 4;
    grid-column: 7 / 11;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__box-left .icon__5rem, .home__box-left .heading, .home__box-left .card-description-home {
    -ms-grid-column: 2;
    -ms-grid-column-span: 8;
    grid-column: 2 / 10;
  }
}

.home__opinions {
  grid-column: center-start/center-end;
  -ms-grid-row: 9;
  -ms-grid-row-span: 1;
  grid-row: 9 / 10;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(5rem, 1fr))[10];
      grid-template-columns: repeat(10, minmax(5rem, 1fr));
  -ms-grid-rows: (min-content)[2];
      grid-template-rows: repeat(2, -webkit-min-content);
      grid-template-rows: repeat(2, min-content);
  grid-row-gap: 4rem;
  background-color: white;
  z-index: 10;
}

.home__opinions h1.heading {
  grid-column: 1 / -1;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
}

@media only screen and (max-width: 37.5em) {
  .home__opinions h1.heading {
    -ms-grid-column: 1;
    -ms-grid-column-span: 10;
    grid-column: 1 / 11;
  }
}

.home__opinions__cards-box {
  grid-column: 1 / -1;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
  display: -ms-grid;
  display: grid;
  grid-column-gap: 5rem;
  -ms-grid-columns: (minmax(20rem, 1fr))[auto-fit];
      grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
}

@media only screen and (max-width: 37.5em) {
  .home__opinions__cards-box {
    grid-row-gap: 4rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .home__opinions {
    -ms-grid-columns: (minmax(min-content, 1fr))[10];
        grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(10, minmax(min-content, 1fr));
  }
}

.home__plans {
  grid-column: center-start/center-end;
  -ms-grid-row: 11;
  -ms-grid-row-span: 1;
  grid-row: 11 / 12;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: var(--border-radius-1);
  background-color: #eeeeee;
  padding: 10rem 9rem;
  margin: 12rem 0;
  grid-row-gap: 5rem;
  grid-column-gap: 5rem;
  z-index: 10;
}

@media only screen and (max-width: 80em) {
  .home__plans {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    grid-row-gap: 5rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .home__plans {
    padding: 4rem 0;
  }
}

.home__plans h1 {
  text-align: center;
}

.home__plans__cards-box {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(18rem, 27rem))[auto-fit];
      grid-template-columns: repeat(auto-fit, minmax(18rem, 27rem));
  -ms-grid-rows: (min-content)[2];
      grid-template-rows: repeat(2, -webkit-min-content);
      grid-template-rows: repeat(2, min-content);
  grid-gap: 4rem 4rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 80em) {
  .home__plans__cards-box {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.home__register {
  grid-column: center-start/center-end;
  -ms-grid-row: 12;
  -ms-grid-row-span: 1;
  grid-row: 12 / 13;
  z-index: 10;
  display: -ms-grid;
  display: grid;
  grid-row-gap: 4rem;
}

.home-sidebar {
  width: 0;
  height: 100vh;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: min-content;
      grid-template-columns: -webkit-min-content;
      grid-template-columns: min-content;
  -ms-grid-rows: min-content;
      grid-template-rows: -webkit-min-content;
      grid-template-rows: min-content;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: center;
      align-content: center;
  background-color: var(--color-primary-dark-2);
  visibility: hidden;
  opacity: 0;
  position: fixed;
  z-index: 1000;
  -webkit-transition: all .5s;
  transition: all .5s;
}

.home-sidebar nav {
  display: none !important;
  -ms-grid-columns: min-content;
      grid-template-columns: -webkit-min-content;
      grid-template-columns: min-content;
  -ms-grid-rows: (max-content)[6];
      grid-template-rows: repeat(6, -webkit-max-content);
      grid-template-rows: repeat(6, max-content);
  grid-row-gap: 2rem;
  text-align: center;
  font-size: 4rem;
  font-weight: 700;
  letter-spacing: .57px;
  color: var(--color-grey-light-1);
  -webkit-transition: all .4s;
  transition: all .4s;
}

.home-sidebar nav a {
  -webkit-transition: all .4s;
  transition: all .4s;
  cursor: pointer;
}

.home-sidebar nav a:hover {
  color: var(--color-grey-light-4);
}

.home-sidebar button {
  visibility: visible;
  top: 3rem;
  right: 6rem;
}

.home-sidebar--visible {
  height: 100vh;
  width: 100vw;
  visibility: visible;
  opacity: 1;
}

.home-sidebar--visible nav {
  display: -ms-grid !important;
  display: grid !important;
}

@media only screen and (max-width: 37.5em) {
  .heading-home-to-large {
    -ms-grid-column: 1 !important;
    -ms-grid-column-span: 9 !important;
    grid-column: 1 / 10 !important;
  }
}

/*
/// home final
*/
.home-change-boxes-height {
  height: 600px;
}

@media only screen and (max-width: 56.25em) {
  .home-change-boxes-height {
    height: 800px;
  }
}

@media only screen and (max-width: 56.25em) {
  .home__container-full__img--display-none {
    display: none !important;
  }
}

.register-box {
  padding: 5rem 4rem;
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-grid-columns: minmax(60rem, 100rem);
      grid-template-columns: minmax(60rem, 100rem);
}

@media only screen and (max-width: 56.25em) {
  .register-box {
    -ms-grid-columns: minmax(min-content, 100rem);
        grid-template-columns: minmax(-webkit-min-content, 100rem);
        grid-template-columns: minmax(min-content, 100rem);
  }
}

.register-box__text {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(35.5rem, 53rem);
      grid-template-columns: minmax(35.5rem, 53rem);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.register-box__text--2 {
  -ms-grid-columns: minmax(35.5rem, 40rem) minmax(35.5rem, 40rem);
      grid-template-columns: minmax(35.5rem, 40rem) minmax(35.5rem, 40rem);
}

@media only screen and (max-width: 56.25em) {
  .register-box__text {
    padding: 0 2rem;
    -ms-grid-columns: minmax(min-content, 40rem);
        grid-template-columns: minmax(-webkit-min-content, 40rem);
        grid-template-columns: minmax(min-content, 40rem);
  }
}

.contact {
  display: -ms-grid;
  display: grid;
  grid-column-gap: 3rem;
  -ms-grid-columns: minmax(min-content, 60rem) minmax(min-content, 35rem);
      grid-template-columns: minmax(-webkit-min-content, 60rem) minmax(-webkit-min-content, 35rem);
      grid-template-columns: minmax(min-content, 60rem) minmax(min-content, 35rem);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 56.25em) {
  .contact {
    -ms-grid-columns: minmax(min-content, 50rem);
        grid-template-columns: minmax(-webkit-min-content, 50rem);
        grid-template-columns: minmax(min-content, 50rem);
    grid-row-gap: 3rem;
  }
}

/*
.contact_box{
    display: grid;
    grid-template-columns: 3rem 1fr 3rem;
    grid-template-rows: 2rem 1fr 1fr 3rem;
    
    &__line-box{
        border-radius: var(--border-radius-1);
        border: 1px solid var(--color-primary-dark);
        grid-column: 2 / 4;
        grid-row: 1 / 5;
    }

    &__card{
        display: grid;
        grid-template-columns: 1fr 2fr;
        grid-column-gap: 2rem;
        grid-column: 1 / 3;

        &--1{
            grid-row: 2 / 3;
        }
        &--2{
            grid-row: 3 / 4;
            margin-top: 2rem;
        }
    }
 
    &__img{
        display: grid;
        grid-template-columns: minmax(min-content, 19rem);
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        align-self: center;
        border-radius: 20px;
    }
}

*/
.contact_box {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 3rem 2rem 1fr 2rem 3rem;
  grid-template-columns: 3rem 1fr 3rem;
  -ms-grid-rows: 2rem 1fr 1fr 3rem;
  grid-template-rows: 2rem 1fr 1fr 3rem;
}

.contact_box__line-box {
  border-radius: var(--border-radius-1);
  border: 1px solid var(--color-primary-dark);
  -ms-grid-column: 2;
  -ms-grid-column-span: 2;
  grid-column: 2 / 4;
  -ms-grid-row: 1;
  -ms-grid-row-span: 4;
  grid-row: 1 / 5;
}

.contact_box__card {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 2rem 2fr;
  grid-template-columns: 1fr 2fr;
  grid-column-gap: 2rem;
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
}

.contact_box__card--1 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2 / 3;
}

.contact_box__card--2 {
  -ms-grid-row: 3;
  -ms-grid-row-span: 1;
  grid-row: 3 / 4;
  margin-top: 2rem;
}

@media only screen and (max-width: 37.5em) {
  .contact_box__card .paragraph-primary span {
    white-space: nowrap;
  }
}

.contact_box__img {
  width: 100%;
  display: -ms-grid;
  display: grid;
  border-radius: 20px;
}

@supports ((grid-template-columns: minmax(-webkit-min-content, 19rem)) or (grid-template-columns: minmax(min-content, 19rem))) or (-ms-grid-columns: minmax(min-content, 19rem)) {
  .contact_box__img {
    -ms-grid-columns: minmax(-webkit-min-content, 19rem);
    -ms-grid-columns: minmax(min-content, 19rem);
    grid-template-columns: minmax(-webkit-min-content, 19rem);
    grid-template-columns: minmax(min-content, 19rem);
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    grid-column: 2 / 3;
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1 / 2;
    -ms-grid-row-align: center;
    -ms-flex-item-align: center;
        align-self: center;
  }
}

@media only screen and (max-width: 37.5em) {
  .contact_box__img {
    display: none;
  }
}

.contact_box > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.contact_box > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.contact_box > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.contact_box > *:nth-child(4) {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
}

.contact_box > *:nth-child(5) {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
}

.contact_box > *:nth-child(6) {
  -ms-grid-row: 2;
  -ms-grid-column: 5;
}

.contact_box > *:nth-child(7) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}

.contact_box > *:nth-child(8) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}

.contact_box > *:nth-child(9) {
  -ms-grid-row: 3;
  -ms-grid-column: 5;
}

.contact_box > *:nth-child(10) {
  -ms-grid-row: 4;
  -ms-grid-column: 1;
}

.contact_box > *:nth-child(11) {
  -ms-grid-row: 4;
  -ms-grid-column: 3;
}

.contact_box > *:nth-child(12) {
  -ms-grid-row: 4;
  -ms-grid-column: 5;
}

.sidebar-nav__link-icon,
.sidebar--2-nav__link-icon {
  height: 2.15rem;
  margin-right: 2rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 75em) {
  .sidebar-nav__link-icon,
  .sidebar--2-nav__link-icon {
    height: 2rem;
    margin-right: 1.4rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .sidebar-nav__link-icon--phone,
  .sidebar--2-nav__link-icon--phone {
    margin-right: 0;
  }
}

.sidebar-nav__link-icon--test:hover,
.sidebar--2-nav__link-icon--test:hover {
  -webkit-transform: translateY(2);
          transform: translateY(2);
  background-image: url(..css\..sass\..components\public\img);
}

.header__btn-menu-hamburguer {
  width: 15%;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.icon-video-primary {
  height: 2rem;
  margin-right: 0.6rem;
}

.icon-video-player {
  height: 2rem;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.icon-video-player:not(:last-child) {
  margin-right: 1.5rem;
}

.video-player__btn {
  text-decoration: none;
  border: none;
  display: inline-block;
  background-color: transparent;
  cursor: pointer;
}

.video-player__btn:not(:last-child) {
  margin-right: 1.5rem;
}

.video-player__btn::before {
  content: "";
  display: none;
  white-space: nowrap;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: all 3s;
  transition: all 3s;
}

.video-player__btn--1::before {
  content: "10 segundos atrás";
  display: none;
  top: 0;
  left: 10px;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
}

.video-player__btn--2::before {
  content: "Reproducir video";
  display: none;
  top: 0;
  left: 20px;
  -webkit-transition: all 0.7s;
}

.video-player__btn--3::before {
  content: "10 segundos adelante";
  display: none;
  top: 0;
  left: 35px;
  -webkit-transition: all 0.7s;
}

.video-player__btn--4::before {
  content: "Ajustar volumen";
  display: none;
  top: 0;
  left: 86px;
  -webkit-transition: all 0.7s;
}

.video-player__btn--5::before {
  content: "Siguiente video";
  display: none;
  position: absolute;
  top: -35px;
  left: -37px;
  -webkit-transition: all 0.7s;
}

.video-player__btn--6::before {
  content: "Fullscreen";
  display: none;
  position: absolute;
  top: -35px;
  left: 5px;
  -webkit-transition: all 0.7s;
}

.video-player__btn:hover::before {
  display: block;
  background-color: #f3f3f3;
  color: var(--color-grey-dark-1);
  font-weight: 400;
  font-size: 1.2rem;
  text-decoration: none;
  padding: 0.3rem 0.5rem;
  border: none;
  border-radius: 2px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
}

.icon_doc {
  height: 3rem;
  margin-right: 0.6rem;
}

.video-info__canal-redes-icon {
  height: 2rem;
  margin-right: 0.4rem;
  border: none;
}

@media only screen and (max-width: 75em) {
  .video-info__canal-redes-icon {
    margin-right: 0;
  }
}

.card__box-icon {
  height: 1.6rem;
}

.card__box-icon--1 {
  height: 4rem;
  opacity: 0.9;
  position: absolute;
  top: 45px;
}

.line_1 {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0.5rem 0;
  border-bottom: var(--line);
}

.line_1--2 {
  margin: 0;
}

.line_1--footer {
  width: 80px;
  margin: auto;
  margin-bottom: 1rem;
}

.line_channel {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 1.5rem 0;
  border-bottom: var(--line);
}

@media only screen and (max-width: 56.25em) {
  .line_channel--tap-port {
    display: none;
    -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
            order: 6;
    margin: 0;
  }
}

.upload__file-icon {
  width: 100%;
  -webkit-transition: ease-in 0.3s;
  transition: ease-in 0.3s;
}

.upload__file-icon--1 {
  height: 14rem;
}

.upload__file-icon--1:hover {
  -webkit-transform: translateY(-3px);
          transform: translateY(-3px);
}

@media only screen and (max-width: 37.5em) {
  .upload__file-icon--1 {
    height: 10rem;
  }
}

.upload__file-icon--2 {
  width: 3rem;
}

.upload__form-file:hover + div img {
  -webkit-transform: translateY(-4px);
          transform: translateY(-4px);
  z-index: 1;
}

.upload__form-icons {
  height: 1.8rem;
  margin: 0 1rem 0 3rem;
  position: relative;
  top: 0;
}

.upload__form-icons--2 {
  height: 1.8rem;
  margin: 0 1rem 0 0;
  position: relative;
  top: 0;
}

.edit-box__icons {
  height: 2.15rem;
  margin-right: 1rem;
}

.video_edit_card-icon {
  height: 3.5rem;
  margin-bottom: 1rem;
}

.video__link-icon {
  height: 1.8rem;
  cursor: pointer;
}

.video_edit_icon-thumbnail {
  height: 2.8rem;
}

.playlist__icon-x {
  height: 1.15rem;
  margin-right: 1rem;
}

.playlist__icon-lock-item {
  height: 4rem;
  opacity: 0.9;
  position: absolute;
}

.icon__secundary {
  height: 2.15rem;
  margin-right: 1rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.icon__secundary--1 {
  margin: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

@media only screen and (max-width: 37.5em) {
  .icon__secundary {
    height: 1.9rem;
    margin-right: 0.5rem;
  }
}

.circle {
  width: 17px;
  height: 15px;
}

.circle__warning-btn {
  width: 36px;
  height: 36px;
}

.box-icon-warning {
  background: transparent;
  border-radius: 50%;
  position: absolute;
  top: -22px;
  right: 32px;
  z-index: 15;
}

.box-icon-warning__item-loop {
  width: 35px;
  height: 35px;
  z-index: 14;
  background: #29aae2;
  background: radial-gradient(ellipse at center, #29aae2 0%, rgba(41, 170, 226, 0.62) 29%, rgba(41, 170, 226, 0.32) 52%, rgba(41, 170, 226, 0) 76%, rgba(41, 170, 226, 0) 77%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29aae2', endColorstr='#29aae2', GradientType=1 );
}

.box-icon-warning__item {
  height: 3rem;
}

.icon__-8rem {
  height: 0.8rem;
}

.icon__1-3rem {
  height: 1.3rem;
}

.icon__1-8rem {
  height: 1.8rem;
}

.icon__2rem {
  width: 2rem;
}

.icon__2-5rem {
  height: 2.5rem;
}

.icon__3rem {
  height: 3rem;
}

.icon__3-5rem {
  height: 3.5rem;
}

.icon__4rem {
  height: 4rem;
}

.icon__5rem {
  height: 5rem;
}

.icon__8rem {
  height: 8rem;
}

.icon__10rem {
  height: 10rem;
}

.icon__18rem {
  height: 18rem;
}

.icon__24rem {
  height: 24rem;
}

.icon__45rem {
  height: 45rem;
}

.logo__4-2rem {
  height: 4.2rem;
}

.logo__4rem {
  height: 4rem;
}

.logo__3-4rem {
  height: 3.4rem;
}

.rotate90 {
  -webkit-transform: rotate(90deg) !important;
          transform: rotate(90deg) !important;
}

.rotate-90 {
  -webkit-transform: rotate(-90deg) !important;
          transform: rotate(-90deg) !important;
}

.icon__illustration {
  display: block;
  margin: auto;
  -webkit-transition: ease-in 0.3s;
  transition: ease-in 0.3s;
}

.icon__illustration-45w {
  width: 45%;
}

.icon__illustration-34rem {
  width: 34rem;
}

.icon__illustration-18rem {
  width: 18rem;
  height: 18rem;
}

.icon__illustration-answers-test {
  width: 100%;
}

@media only screen and (max-width: 56.25em) {
  .icon__illustration-answers-test {
    width: 30rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .icon__illustration-answers-test {
    width: 19rem;
  }
}

.observer- {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.137);
  padding: 15rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  z-index: 1000;
}

@media only screen and (max-width: 37.5em) {
  .observer- {
    padding: 6rem 6rem 3rem 6rem;
  }
}

.observer-__item {
  background-color: rgba(142, 255, 151, 0.432);
  width: 100%;
  height: 100%;
}

.observer-__section {
  background-color: sandybrown;
}

.observer-__active {
  background-color: #2b2b2b;
}

.menu {
  width: 18rem;
  background-color: white;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: (1fr)[1];
      grid-template-rows: repeat(1, 1fr);
  -ms-grid-columns: 18rem;
      grid-template-columns: 18rem;
  grid-gap: 0.2rem;
  padding: 1rem 0;
  border-radius: var(--border-radius);
  -webkit-box-shadow: var(--box-shadow-box);
          box-shadow: var(--box-shadow-box);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  right: 42px;
  top: 139px;
  z-index: 99;
}

.menu--1 {
  right: 3rem;
  top: 0;
}

.menu--2 {
  -ms-grid-rows: 2rem (1fr)[2];
      grid-template-rows: 2rem repeat(2, 1fr);
}

.menu--3 {
  right: 0.3rem;
  top: 4.2rem;
}

.menu--4 {
  right: 0rem;
  top: 2rem;
}

.menu-box {
  padding: 0.5rem 2rem;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.35px;
  white-space: nowrap;
  list-style: none;
  text-decoration: none;
  background-color: white;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  cursor: pointer;
}

.menu-box:hover {
  background-color: #dedede;
}

.menu-box:active {
  background-color: #d1d1d1;
}

.menu-box:link, .menu-box:visited {
  background-color: #d1d1d1;
}

.menu-box:hover > .menu-list > .menu-list__text--red {
  color: var(--color-red);
  font-weight: 600;
}

.menu-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
}

.menu-list__text--red {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.menu-list__text--red:hover {
  color: var(--color-red);
}

.menu-title {
  font-size: 1.04rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.12px;
  margin-left: 2rem;
}

.menu--active {
  visibility: visible;
  opacity: 1;
  z-index: 999;
}

.search {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 3.9rem 1fr;
      grid-template-rows: 3.9rem 1fr;
  -ms-grid-columns: minmax(1rem, 1fr) minmax(10rem, 40rem) minmax(1rem, 1fr);
      grid-template-columns: minmax(1rem, 1fr) minmax(10rem, 40rem) minmax(1rem, 1fr);
      grid-template-areas: ". search        ."
 ". search-result .";
  position: relative;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  z-index: 100;
}

@media only screen and (max-width: 37.5em) {
  .search {
    display: none;
    -ms-grid-columns: minmax(1rem, 1fr) minmax(10rem, 35rem) minmax(1rem, 1fr);
        grid-template-columns: minmax(1rem, 1fr) minmax(10rem, 35rem) minmax(1rem, 1fr);
  }
}

.search--menu-hamb {
  display: none;
}

@media only screen and (max-width: 37.5em) {
  .search--menu-hamb {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: minmax(1rem, 1fr) minmax(10rem, 35rem) minmax(1rem, 1fr);
        grid-template-columns: minmax(1rem, 1fr) minmax(10rem, 35rem) minmax(1rem, 1fr);
  }
}

@media only screen and (max-width: 37.5em) {
  .search--videos {
    display: -ms-grid;
    display: grid;
  }
}

.search__box {
  background-color: white;
  -ms-grid-row: 1;
  -ms-grid-column: 2;
  grid-area: search;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  -ms-grid-columns: 2rem 1fr 2rem;
      grid-template-columns: 2rem 1fr 2rem;
  grid-column-gap: 0.7rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.4rem 1rem;
  border: 2px solid #eaeaea;
  border-radius: 26px;
}

.search__box:focus-within {
  border: 2px solid var(--color-primary);
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.161);
          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.161);
}

.search__box--transparent {
  background-color: rgba(255, 255, 255, 0);
}

@media only screen and (max-width: 80em) {
  .search__box--active {
    width: 40vw;
    position: absolute;
    z-index: 100;
  }
}

@media only screen and (max-width: 56.25em) {
  .search__box--active {
    width: initial;
    position: initial;
  }
}

.search__icon {
  height: 1.7rem;
}

.search__input {
  width: 100%;
  display: block;
  font-size: 1.4rem;
  font-weight: 600;
  font-family: inherit;
  color: var(--color-grey-dark-1);
  padding: 0.5rem 0;
  border: none;
  background-color: transparent;
  outline: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.search__input:focus {
  outline: none;
  border: none;
}

.search__input:focus:invalid {
  outline: none;
  border: none;
  border-bottom: 1px solid var(--color-red);
}

.search__input::-webkit-input-placeholder {
  font-size: 1.4rem;
  font-weight: 400;
  color: #a7a7a7;
  background-color: transparent;
}

.search__input::-moz-placeholder {
  color: #a7a7a7;
  font-size: 1.4rem;
  font-weight: 400;
  background-color: transparent;
  opacity: 1;
}

.search__input::-ms-input-placeholder {
  font-size: 1.4rem;
  font-weight: 400;
  color: #a7a7a7;
  background-color: transparent;
}

.search-result__box2 {
  width: 100%;
  -ms-grid-row: 2;
  -ms-grid-column: 2;
  grid-area: search-result;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2.4rem 1fr;
      grid-template-columns: 2.4rem 1fr;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  white-space: nowrap;
  list-style: none;
  -webkit-transition: visibility 0.5s;
  transition: visibility 0.5s;
  border-radius: var(--border-radius);
  background-color: #fff;
  -webkit-box-shadow: var(--box-shadow-box);
          box-shadow: var(--box-shadow-box);
  padding: 1rem 0;
  margin-top: 1rem;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  left: 0;
  z-index: 50;
}

.search-result__box2--active {
  visibility: visible;
  opacity: 1;
}

@media only screen and (max-width: 37.5em) {
  .search-result__box2--menu-hamb {
    width: 100%;
    left: 0;
  }
}

.search-result__box {
  width: 100%;
  -ms-grid-row: 2;
  -ms-grid-column: 2;
  grid-area: search-result;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2.4rem 1fr;
      grid-template-columns: 2.4rem 1fr;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  white-space: nowrap;
  list-style: none;
  -webkit-transition: visibility 0.5s;
  transition: visibility 0.5s;
  border-radius: var(--border-radius);
  background-color: #fff;
  -webkit-box-shadow: var(--box-shadow-box);
          box-shadow: var(--box-shadow-box);
  padding: 1rem 0;
  margin-top: 1rem;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  left: 0;
  z-index: 50;
}

.search-result__box--active {
  visibility: visible;
  opacity: 1;
}

@media only screen and (max-width: 80em) {
  .search-result__box--active {
    width: 40vw;
  }
}

@media only screen and (max-width: 56.25em) {
  .search-result__box--active {
    width: 100%;
    width: 50vw;
  }
}

@media only screen and (max-width: 37.5em) {
  .search-result__box--active--menu-hamb {
    width: 50vw;
  }
}

@media only screen and (max-width: 37.5em) {
  .search-result__box {
    width: calc(-3rem + 100vw);
    left: -181px;
  }
}

@media only screen and (max-width: 37.5em) {
  .search-result__box--menu-hamb {
    width: 100%;
    left: 0;
  }
}

.search-result__list {
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  grid-column: 1 / span 3;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 3fr 1fr;
      grid-template-columns: 3fr 1fr;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  grid-column-gap: 1rem;
  padding: 0 2rem 0 2.5rem;
}

.search-result__list:hover {
  background-color: #dedede;
}

.search-result__list:active {
  background-color: #d1d1d1;
}

.search-result__list:link, .search-result__list:visited {
  background-color: #d1d1d1;
}

.search-result__list:not(:last-child) {
  border-bottom: var(--line--2);
}

.search-result__list--current {
  background-color: #dedede;
}

.search-result__list__icon {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  height: 4.15rem;
  width: 100%;
  margin-top: 0.5rem;
}

.search-result__list__title {
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2 / 3;
  font-size: 1.1rem;
  font-weight: 400;
  margin-bottom: 0.5rem;
  letter-spacing: 0.528px;
  text-transform: uppercase;
  line-height: 14px;
}

.search-result__list__title--2 {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  font-size: 1.33rem;
  text-transform: none;
  text-align: center;
  margin-top: 1rem;
}

.search-result__list__link {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 4rem 1fr;
      grid-template-columns: 4rem 1fr;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  grid-gap: 1rem;
  text-decoration: none;
  padding: 0.9rem 0 0.9rem 0;
  cursor: pointer;
}

.search-result__list__photo {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
  width: 4rem;
  height: 4rem;
  border-radius: var(--border-radius);
  -o-object-fit: cover;
     object-fit: cover;
}

.search-result__list__name {
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2 / 3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1 / 2;
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  overflow: hidden;
  font-size: 1.3rem;
  text-overflow: ellipsis;
  letter-spacing: 0.69px;
  color: var(--color-grey-dark-1);
}

.playlist {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: min-content 17.5rem;
      grid-template-rows: -webkit-min-content 17.5rem;
      grid-template-rows: min-content 17.5rem;
  -ms-grid-columns: 20rem (1fr)[2] 6.4rem;
      grid-template-columns: 20rem repeat(2, 1fr) 6.4rem;
      grid-template-areas: "title     title    .        nav-btn"
 "thumbnail carousel carousel carousel";
  grid-column-gap: 4rem;
  grid-row-gap: 0.5rem;
  margin-bottom: 2.5rem;
  padding-bottom: 1rem;
  border-bottom: var(--line);
}

@media only screen and (max-width: 37.5em) {
  .playlist {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    grid-row-gap: 1.2rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .playlist--2 {
    padding-bottom: 3rem;
  }
}

.playlist .line_1 {
  margin: 0;
  margin: 2rem 0;
}

@media only screen and (max-width: 56.25em) {
  .playlist .line_1 {
    margin: 0 0 2rem 0;
  }
}

@media only screen and (max-width: 37.5em) {
  .playlist .line_1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 20rem;
    -ms-flex-line-pack: center;
        align-content: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-left: 1rem;
    border-bottom: var(--line);
  }
}

.playlist__group {
  width: 50%;
}

@media only screen and (max-width: 56.25em) {
  .playlist__group {
    width: 100%;
  }
}

.playlist__box {
  font-size: 1.4rem;
  font-weight: 400;
  list-style: none;
}

.playlist__box-nav-carousel {
  -ms-grid-row: 1;
  -ms-grid-column: 4;
  grid-area: nav-btn;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 3.2rem;
      grid-template-rows: 3.2rem;
  -ms-grid-columns: 3.2rem 3.2rem;
      grid-template-columns: 3.2rem 3.2rem;
}

@media only screen and (max-width: 37.5em) {
  .playlist__box-nav-carousel {
    display: none;
  }
}

.playlist__box-nav-carousel__item {
  width: 3.2rem;
  height: 3.2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 50%;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.playlist__box-nav-carousel__item:hover {
  cursor: pointer;
  background-color: #dedede;
}

.playlist__box-nav-carousel__item:active {
  cursor: pointer;
  background-color: #d1d1d1;
}

.playlist__box-nav-carousel__item--1:active img {
  -webkit-transform: translateX(-3px);
          transform: translateX(-3px);
}

.playlist__box-nav-carousel__item--2:active img {
  -webkit-transform: translateX(3px);
          transform: translateX(3px);
}

.playlist__box-nav-carousel__item--inactive:hover, .playlist__box-nav-carousel__item--inactive:active {
  background-color: transparent;
  cursor: default;
}

.playlist__box-thumbnail {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  grid-area: thumbnail;
}

.playlist__box-carousel {
  -ms-grid-row: 2;
  -ms-grid-column: 2;
  -ms-grid-column-span: 3;
  grid-area: carousel;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 17.5rem;
      grid-template-rows: 17.5rem;
  -ms-grid-columns: (minmax(21rem, 1fr))[auto-fit];
      grid-template-columns: repeat(auto-fit, minmax(21rem, 1fr));
}

.playlist__box-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-decoration: none;
  position: relative;
  z-index: 10;
}

@media only screen and (max-width: 56.25em) {
  .playlist__box-link {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

.playlist__box-link-items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 56.25em) {
  .playlist__box-link-items {
    margin-bottom: 2rem;
  }
}

.playlist__box-link-items > span {
  font-size: 1.2rem;
  font-weight: 400;
  color: var(--color-grey-dark-1);
  line-height: 1.1;
  margin: 0 0.9rem 0 0.5rem;
}

.playlist__box-link__carousel__lock {
  width: 100%;
  height: 157px !important;
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / span 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: var(--color-grey-light-4) !important;
  border-radius: var(--border-radius);
}

@media only screen and (max-width: 56.25em) {
  .playlist__box-link__carousel__lock {
    height: inherit;
  }
}

.playlist__box-title {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-area: title;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.playlist__box-title h2 {
  font-size: 1.6rem;
  line-height: 15px;
}

@media only screen and (max-width: 37.5em) {
  .playlist__box-title {
    text-align: center;
    padding: 0rem 3rem;
  }
}

.playlist__box-title-videos-num {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: 0.56;
  white-space: nowrap;
  color: white;
  margin-left: 1rem;
  position: absolute;
  bottom: 12px;
  z-index: 11;
}

.playlist__box--2 .video__edit__link-icon {
  padding: 0;
}

.playlist__box--2 .heading-tertiary {
  position: relative;
  top: -5px;
  margin-bottom: -5px;
}

.playlist__box__img-user {
  width: 200px;
  height: 157px;
  overflow: hidden;
  border-radius: var(--border-radius);
  background-color: #dfdfdf;
  position: relative;
}

.playlist__box__img-user__overlay {
  width: 200px;
  height: 170px;
  background: -webkit-gradient(left top, left bottom, color-stop(63%, rgba(0, 0, 0, 0)), color-stop(68%, rgba(0, 0, 0, 0.07)), color-stop(78%, rgba(0, 0, 0, 0.21)), color-stop(82%, rgba(0, 0, 0, 0.35)), color-stop(100%, black));
  background: -webkit-gradient(linear, left top, left bottom, color-stop(63%, rgba(0, 0, 0, 0)), color-stop(68%, rgba(0, 0, 0, 0.07)), color-stop(78%, rgba(0, 0, 0, 0.21)), color-stop(82%, rgba(0, 0, 0, 0.35)), to(black));
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 63%, rgba(0, 0, 0, 0.07) 68%, rgba(0, 0, 0, 0.21) 78%, rgba(0, 0, 0, 0.35) 82%, black 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

.playlist__img-user {
  width: 200px;
  height: 157px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

.playlist__icon-lock-overlay {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.329);
}

.glider-contain {
  width: 100%;
  margin: 0 auto;
  position: relative;
}

.glider {
  margin: 0 auto;
  position: relative;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}

.glider-track {
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  width: 100%;
  margin: 0;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 1;
}

.glider.draggable {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: -webkit-grab;
  cursor: grab;
}

.glider.draggable .glider-slide img {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none;
}

.glider.drag {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.glider-slide {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: center;
      align-content: center;
  width: 100%;
}

.glider::-webkit-scrollbar {
  opacity: 0;
  height: 0;
}

.glider-prev,
.glider-next {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  position: absolute;
  outline: none;
  background: none;
  padding: 0;
  z-index: 2;
  font-size: 40px;
  text-decoration: none;
  left: -23px;
  border: 0;
  top: 30%;
  cursor: pointer;
  color: #666;
  opacity: 1;
  line-height: 1;
  -webkit-transition: opacity 0.5s cubic-bezier(0.17, 0.67, 0.83, 0.67), color 0.5s cubic-bezier(0.17, 0.67, 0.83, 0.67);
  transition: opacity 0.5s cubic-bezier(0.17, 0.67, 0.83, 0.67), color 0.5s cubic-bezier(0.17, 0.67, 0.83, 0.67);
}

.glider-prev:hover,
.glider-next:hover,
.glider-prev:focus,
.glider-next:focus {
  color: #a89cc8;
}

.glider-next {
  right: -23px;
  left: auto;
}

.glider-next.disabled,
.glider-prev.disabled {
  opacity: 0.25;
  color: #666;
  cursor: default;
}

.glider-hide {
  opacity: 0;
}

.glider-dots {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 auto;
  padding: 0;
}

.glider-dot {
  background: none;
  border: 0;
  padding: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  outline: none;
  display: block;
  cursor: pointer;
  color: #ccc;
  border-radius: 999px;
  background: #ccc;
  width: 12px;
  height: 12px;
  margin: 7px;
}

.glider-dot:hover,
.glider-dot:focus,
.glider-dot.active {
  background: #a89cc8;
}

@media (max-width: 36em) {
  .glider::-webkit-scrollbar {
    opacity: 1;
    -webkit-appearance: none;
    width: 7px;
    height: 3px;
  }
  .glider::-webkit-scrollbar-thumb {
    opacity: 1;
    border-radius: 99px;
    background-color: rgba(156, 156, 156, 0.25);
    -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.25);
            box-shadow: 0 0 1px rgba(255, 255, 255, 0.25);
  }
}

@-moz-document url-prefix() {
  .glider-track {
    margin-bottom: 17px;
  }
  .glider-wrap {
    overflow: hidden;
  }
}

.popup-overlay {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: var(--bg-color-overlay);
  visibility: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  z-index: -1;
  -webkit-transition: opacity 500ms;
  transition: opacity 500ms;
}

@media only screen and (max-width: 37.5em) {
  .popup-overlay {
    padding: 1rem 1rem;
  }
}

.popup-overlay:target {
  visibility: visible;
  opacity: 1;
}

.popup-overlay--active {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  opacity: 1;
  visibility: visible;
  z-index: 1000;
}

.popup-status-fixed {
  position: fixed;
  top: 127px;
  right: 19px;
  z-index: 100;
}

.popup-status-fixed--2 {
  top: 435px;
  left: 268px;
}

@media only screen and (max-width: 37.5em) {
  .popup-status-fixed--2 {
    top: 196;
    left: 4px;
  }
}

.popup {
  width: 420px;
  padding: 4rem;
  background-color: var(--color-grey-light-1);
  border-radius: var(--border-radius);
  position: relative;
  z-index: 1000;
}

.popup--1 {
  padding: 4rem 0;
}

@media only screen and (max-width: 37.5em) {
  .popup--1 {
    padding: 2.2rem 0 1rem 0;
  }
}

.popup-status {
  width: 38rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 2rem;
  -webkit-box-shadow: 0 10px 14px rgba(0, 0, 0, 0.169);
          box-shadow: 0 10px 14px rgba(0, 0, 0, 0.169);
}

.popup-status--1 {
  width: 41rem;
}

.popup-status--hidden {
  display: none;
}

@media only screen and (max-width: 37.5em) {
  .popup-status {
    width: 27rem;
    padding: 2rem 3rem;
  }
}

.popup-status-items {
  width: 100%;
  margin-left: 2rem;
}

@media only screen and (max-width: 37.5em) {
  .popup-status-items {
    width: 100%;
    margin: 0;
  }
}

.popup-status-items__icon {
  width: 4.15rem;
}

@media only screen and (max-width: 37.5em) {
  .popup-status-items__icon {
    display: none;
  }
}

.popup-status-items h5 {
  display: block;
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--color-grey-dark-1);
}

@media only screen and (max-width: 37.5em) {
  .popup-status-items h5 {
    text-align: center;
  }
}

.popup-status-items span {
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 19px;
}

.popup-status-items__buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 1rem;
}

@media only screen and (max-width: 37.5em) {
  .popup-status-items__buttons {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .popup-status-items__buttons :nth-child(2) {
    width: 100%;
    display: block;
    margin-top: 1rem;
  }
}

.popup__width-80vw {
  width: 90vw;
  background-color: #f7f7f7;
  padding: 4rem 0;
}

.popup__video-password {
  width: 410px;
}

.popup__password-channel {
  width: 410px;
  max-height: 535px;
}

.popup__create-test {
  width: 1000px;
  max-height: 728px;
  overflow: auto;
  margin: 0 2rem;
}

.popup__create-test > h2 {
  padding: 0 calc(5vw);
}

.popup__create-test__view-test {
  padding: 4rem 2rem;
}

.popup__create-test > div > h2 {
  padding: 0 calc(6vw);
}

.popup__create-test > .card__box--create-test-video-asociate > .box-flex-46 > h5 {
  text-align: center;
}

.popup__create-file {
  width: 550px;
  max-height: 728px;
  overflow: auto;
  margin: 0 2rem;
}

.popup__create-file > h2 {
  padding: 0 calc(5vw);
}

.popup__create-file__view-test {
  padding: 4rem 2rem;
}

.popup__create-file > div > h2 {
  padding: 0 calc(6vw);
}

.popup__create-file > .card__box--create-test-video-asociate > .box-flex-46 > h5 {
  text-align: center;
}

.popup__doc-box-download {
  position: relative;
}

.popup__doc-box-download__items {
  display: none;
  height: 0%;
  width: 270px;
  padding: 2rem 3rem;
  -webkit-box-shadow: var(--box-shadow-box);
          box-shadow: var(--box-shadow-box);
  position: absolute;
  left: -159px;
  top: 10px;
}

@media only screen and (max-width: 37.5em) {
  .popup__doc-box-download__items {
    width: 250px;
    padding: 2rem 2rem 1rem 2rem;
    left: -164px;
    top: 24px;
  }
}

.popup__doc-box-download__items--active {
  display: block;
  height: auto;
}

.popup__box-copy-link {
  width: 420px;
  padding: 0;
  position: absolute;
  bottom: -144px;
  left: 0;
}

.popup__copy-link {
  width: 420px;
  padding: 2rem 4rem 2rem 0;
  -webkit-box-shadow: 0 10px 14px rgba(0, 0, 0, 0.169);
          box-shadow: 0 10px 14px rgba(0, 0, 0, 0.169);
  position: absolute;
  bottom: 113px;
  left: 0;
}

@media only screen and (max-width: 37.5em) {
  .popup__copy-link {
    width: 27rem;
    padding: 2rem 4rem 2rem 1rem;
  }
}

.popup__copy-link--2 {
  bottom: -31px;
  left: -179px;
}

@media only screen and (max-width: 37.5em) {
  .popup__copy-link--2 {
    left: 0;
  }
}

.popup__copy-link__text {
  font-size: 1.4rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__copy-link__text {
    line-height: 15px;
  }
}

.popup__video-edit-test {
  width: 550px;
  max-height: 700px;
  overflow: hidden;
}

@media only screen and (max-width: 37.5em) {
  .popup__video-edit-test {
    padding: 3rem 2rem 2rem 2rem;
  }
}

.popup__channel-description {
  width: 750px;
  padding: 3rem 4rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__channel-description {
    max-height: 100vh;
    max-width: 100vw;
    padding: 2rem 2.2rem;
    overflow: hidden;
  }
}

.popup form p {
  margin-top: 0.4rem;
}

.popup__answers {
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.popup__answers::before {
  content: "";
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
}

.popup__answers:hover::before {
  content: "Al presionar: PUBLICAR, su video será visible a los usuarios en su canal. A excepción que sea privado u oculto, si es así, no será visible en su canal.";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 37rem;
  height: auto;
  padding: 1.4rem 2.5rem;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 19px;
  white-space: normal;
  color: var(--color-grey-dark-2);
  background-color: var(--color-grey-light-1);
  border-radius: var(--border-radius);
  -webkit-box-shadow: 0 10px 14px rgba(0, 0, 0, 0.169);
          box-shadow: 0 10px 14px rgba(0, 0, 0, 0.169);
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  opacity: 1;
  visibility: visible;
  position: absolute;
  top: 4rem;
  right: 0rem;
  z-index: 15;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers:hover::before {
    width: 20rem;
    padding: 2rem;
    font-size: 1.2rem;
    line-height: 15px;
  }
}

.popup__answersuser:hover::before {
  content: "Debido a las actualizaciones normativas y/o legislativas, si el test a descargar no ha sido realizado recientemente, puede que las cuestiones planteadas y las respuestas contestadas no correspondan a la versión actual del mismo.";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 37rem;
  height: auto;
  padding: 1.4rem 2.5rem;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 19px;
  white-space: normal;
  color: var(--color-grey-dark-2);
  background-color: var(--color-grey-light-1);
  border-radius: var(--border-radius);
  -webkit-box-shadow: 0 10px 14px rgba(0, 0, 0, 0.169);
          box-shadow: 0 10px 14px rgba(0, 0, 0, 0.169);
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  opacity: 1;
  visibility: visible;
  position: absolute;
  top: 4rem;
  right: -14rem;
  z-index: 15;
}

@media only screen and (max-width: 37.5em) {
  .popup__answersuser:hover::before {
    width: 20rem;
    padding: 2rem;
    font-size: 1.2rem;
    line-height: 15px;
  }
}

.popup__answers--only-inplaylist-video:hover::before {
  content: "Al seleccionar esta opción el video aparecerá únicamente en una lista de reproducción creada previamente. Si el video no está en una lista, esta opción no estará disponible.";
  top: 3rem;
  right: -1rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--only-inplaylist-video:hover::before {
    top: 2rem;
    right: 5rem;
  }
}

.popup__answers--video-hidden:hover::before {
  content: "Al seleccionar esta opción podrás compartir el video únicamente por link. No aparecerá en todos los videos del canal";
  top: 3rem;
  right: -4rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--video-hidden:hover::before {
    top: 2rem;
    right: 5rem;
  }
}

.popup__answers--video-private:hover::before {
  content: "Al seleccionar esta opción el video tendrá una contraseña que le asignarás para poder verlo posteriormente.";
  top: 3rem;
  right: -21rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--video-private:hover::before {
    top: 2rem;
    right: -3.5rem;
  }
}

.popup__answers--video-private_:hover::before {
  content: "Al seleccionar esta opción, el video podrá ser compartido e insertado en otros canales.";
  top: 3rem;
  right: -21rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--video-private_:hover::before {
    top: 2rem;
    right: -3.5rem;
  }
}

.popup__answers--channel-private:hover::before {
  content: "Al seleccionar esta opción el canal solo sera visible mediante contraseña.";
  top: 3rem;
  right: -21rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--channel-private:hover::before {
    top: 2rem;
    right: -3.5rem;
  }
}

.popup__answers--playlist-hidden:hover::before {
  content: "Al seleccionar esta opción podrás compartir la lista de reproducción únicamente por link. No aparecerá en todos los videos del canal";
  top: 3rem;
  right: -4rem;
}

.popup__answers--playlist-private:hover::before {
  content: "Al seleccionar esta opción la lista de reproducción tendrá una contraseña que le asignarás para poder verlo posteriormente.";
  top: 3rem;
  right: -21rem;
}

.popup__answers--select-test-invideo:hover::before {
  content: "Haz click en asociar test para seleccionar un solo test (test que ya esté creado previamente) para este video.";
  top: 3rem;
  right: 13rem;
}

.popup__answers--select-playlist-invideo:hover::before {
  content: "Haz click en añadir para seleccionar listas de reproducción a este video.";
  top: 3rem;
  right: 13rem;
}

.popup__answers--edit-video:hover::before {
  content: "Haz click en editar para subir y cambiar el video.";
  top: 3rem;
  right: 13rem;
}

.popup__answers--test-autocorrect:hover::before {
  content: "Seleccionando la tipología “test” se aplicará la autocorrección en las preguntas con respuesta única (botón redondo). Para ello, la respuesta correcta deberá ser seleccionada en la creación o edición de este test.";
  top: 0rem;
  right: -37rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--test-autocorrect:hover::before {
    top: 0rem;
    right: -18rem;
  }
}

.popup__answers--test-uploadFile:hover::before {
  content: "Aquí podrás asociar un archivo que tenga relación con el presente test/cuestionario.";
  top: 0rem;
  right: -37rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--test-uploadFile:hover::before {
    top: 0rem;
    right: -18rem;
  }
}

.popup__answers--test-download:hover::before {
  content: "Permite la descarga del test una vez finalizado y aprobado por el usuario.";
  top: 0rem;
  right: -37rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--test-download:hover::before {
    top: 0rem;
    right: -18rem;
  }
}

.popup__answers--test-autocorrectdiploma:hover::before {
  content: "Permite la generación de un certificado / diploma que acredita la formación del test.";
  top: 4rem;
  right: -9rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--test-autocorrectdiploma:hover::before {
    top: 0rem;
    right: -9rem;
  }
}

.popup__answers--test-uploadfiletest:hover::before {
  content: "Permite adjuntar archivos asociados al test o cuestionario cuando éste ha sido finalizado.";
  top: 4rem;
  right: -9rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--test-uploadfiletest:hover::before {
    top: 0rem;
    right: -9rem;
  }
}

.popup__answers--watcher-generatepassword:hover::before {
  content: "Haciendo clic aquí, el sistema generará una contraseña aleatoria segura para esta cuenta.";
  top: 27rem;
  right: 13rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--watcher-generatepassword:hover::before {
    top: 27rem;
    right: 16rem;
  }
}

.popup__answers--watcher-sendpassword:hover::before {
  content: "Envía los datos aquí introducidos a la cuenta de correo electrónico indicada.";
  top: 17rem;
  right: 0rem;
}

@media only screen and (max-width: 37.5em) {
  .popup__answers--watcher-sendpassword:hover::before {
    top: 17rem;
    right: 3rem;
  }
}

@media screen and (max-width: 700px) {
  .box {
    width: 70%;
  }
  .popup-video-password {
    width: 70%;
  }
}

.btn-secundary:hover
+ .popup__doc-box-download
.popup__doc-box-download__items {
  display: block;
  height: auto;
}

.popup__doc-box-download__items:hover {
  display: block;
  height: auto;
}

/*
=============================================================================================================
INICIO ==========> TOOL TIP PARA MOSTRAR AL USUARIO QUE PUEDE USAR CTRL + SHIFT + S PARA GUARDAR ARCHIVOS
=============================================================================================================
*/
.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: 100%;
  left: 50%;
  margin-left: -60px;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

/*
=============================================================================================================
FIN ==========> TOOL TIP PARA MOSTRAR AL USUARIO QUE PUEDE USAR CTRL + SHIFT + S PARA GUARDAR ARCHIVOS
=============================================================================================================
*/
@media only screen and (max-width: 37.5em) {
  .body-login {
    min-height: 100vh;
  }
}

.login {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: [login-start] minmax(min-content, 100vh) [login-end description-start] min-content [description-end footer-start] 10rem [footer-end];
      grid-template-rows: [login-start] minmax(-webkit-min-content, 100vh) [login-end description-start] -webkit-min-content [description-end footer-start] 10rem [footer-end];
      grid-template-rows: [login-start] minmax(min-content, 100vh) [login-end description-start] min-content [description-end footer-start] 10rem [footer-end];
  -ms-grid-columns: [full-start] minmax(6rem, 1fr) [center-start] ([col-start] minmax(min-content, 14rem) [col-end])[8] [center-end] minmax(6rem, 1fr) [full-end];
      grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(8, [col-start] minmax(-webkit-min-content, 14rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];
      grid-template-columns: [full-start] minmax(6rem, 1fr) [center-start] repeat(8, [col-start] minmax(min-content, 14rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];
  grid-row-gap: 2rem;
}

@media only screen and (max-width: 56.25em) {
  .login {
    -ms-grid-rows: [login-start] 1fr [login-end description-start] min-content [description-end footer-start] 10rem [footer-end];
        grid-template-rows: [login-start] 1fr [login-end description-start] -webkit-min-content [description-end footer-start] 10rem [footer-end];
        grid-template-rows: [login-start] 1fr [login-end description-start] min-content [description-end footer-start] 10rem [footer-end];
    -ms-grid-columns: [center-start] ([col-start] minmax(min-content, 14rem) [col-end])[8] [center-end];
        grid-template-columns: [center-start] repeat(8, [col-start] minmax(-webkit-min-content, 14rem) [col-end]) [center-end];
        grid-template-columns: [center-start] repeat(8, [col-start] minmax(min-content, 14rem) [col-end]) [center-end];
  }
}

.login-1 {
  grid-column: center-start / center-end;
  grid-row: login-start / login-end;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(7rem, 14rem))[8];
      grid-template-columns: repeat(8, minmax(7rem, 14rem));
  -ms-grid-rows: minmax(min-content, 100vh);
      grid-template-rows: minmax(-webkit-min-content, 100vh);
      grid-template-rows: minmax(min-content, 100vh);
  padding-top: 1.5rem;
}

@media only screen and (max-width: 56.25em) {
  .login-1 {
    -ms-grid-columns: (minmax(min-content, 14rem))[8];
        grid-template-columns: repeat(8, minmax(-webkit-min-content, 14rem));
        grid-template-columns: repeat(8, minmax(min-content, 14rem));
    -ms-grid-rows: (minmax(min-content, 1fr))[2];
        grid-template-rows: repeat(2, minmax(-webkit-min-content, 1fr));
        grid-template-rows: repeat(2, minmax(min-content, 1fr));
  }
}

@media only screen and (max-width: 37.5em) {
  .login-1 {
    -ms-grid-rows: min-content;
        grid-template-rows: -webkit-min-content;
        grid-template-rows: min-content;
    padding-top: 5.5rem;
  }
}

.login-2 {
  grid-column: center-start / center-end;
  grid-row: description-start / description-end;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(7rem, 14rem))[8];
      grid-template-columns: repeat(8, minmax(7rem, 14rem));
  -ms-grid-rows: minmax(min-content, max-content);
      grid-template-rows: minmax(-webkit-min-content, -webkit-max-content);
      grid-template-rows: minmax(min-content, max-content);
  padding: 5.5rem 0;
}

@media only screen and (max-width: 56.25em) {
  .login-2 {
    -ms-grid-columns: (minmax(min-content, 14rem))[8];
        grid-template-columns: repeat(8, minmax(-webkit-min-content, 14rem));
        grid-template-columns: repeat(8, minmax(min-content, 14rem));
    -ms-grid-rows: (minmax(min-content, 1fr))[1];
        grid-template-rows: repeat(1, minmax(-webkit-min-content, 1fr));
        grid-template-rows: repeat(1, minmax(min-content, 1fr));
    padding: 0 4rem;
    grid-row-gap: 2rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .login-2 {
    padding: 0 1rem;
  }
}

.login-3 {
  grid-column: center-start / center-end;
  grid-row: footer-start / footer-end;
}

.login-box {
  background-color: #ffd4d4;
  width: 100%;
  height: calc(100vh + 58px);
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: min-content;
      grid-template-rows: -webkit-min-content;
      grid-template-rows: min-content;
  -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr;
  grid-column-gap: 2rem;
  padding: 7rem 4rem 0 4rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: center;
      align-content: center;
}

.login-box--1 {
  background-color: #b6ffc0;
  height: calc(80vh + 58px);
  padding: 0 4rem 0 4rem;
}

@media only screen and (max-width: 37.5em) {
  .login-box {
    -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
  }
}

.login__description-text {
  -ms-grid-column: 1;
  -ms-grid-column-span: 4;
  grid-column: 1 / 5;
  width: 90%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(26rem, 1fr);
      grid-template-columns: minmax(26rem, 1fr);
  -ms-grid-rows: min-content min-content;
      grid-template-rows: -webkit-min-content -webkit-min-content;
      grid-template-rows: min-content min-content;
  -ms-grid-column-align: center;
      justify-self: center;
}

.login__description-text div {
  background-color: var(--color-grey-light-1);
  padding: 4rem 6rem;
  border-radius: var(--border-radius);
}

@media only screen and (max-width: 37.5em) {
  .login__description-text div {
    padding: 4rem 3rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .login__description-text {
    width: 100%;
    -ms-grid-columns: minmax(min-content, 1fr);
        grid-template-columns: minmax(-webkit-min-content, 1fr);
        grid-template-columns: minmax(min-content, 1fr);
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1 / 2;
    -ms-grid-column: 1;
    -ms-grid-column-span: 8;
    grid-column: 1 / 9;
  }
}

@media only screen and (max-width: 56.25em) {
  .login__description-text {
    padding: 3rem 4rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .login__description-text {
    padding: 3rem 0;
  }
}

.login__box-image {
  -ms-grid-column: 5;
  -ms-grid-column-span: 4;
  grid-column: 5 / 9;
  display: -ms-grid;
  display: grid;
  -ms-flex-line-pack: center;
      align-content: center;
  grid-row-gap: 2rem;
}

@media only screen and (max-width: 56.25em) {
  .login__box-image {
    -ms-grid-row: 2;
    -ms-grid-row-span: 1;
    grid-row: 2 / 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 7;
    grid-column: 1 / 8;
    -ms-grid-column: 1;
    -ms-grid-column-span: 8;
    grid-column: 1 / 9;
  }
}

.login__box-image p span {
  display: block;
  margin-bottom: 1rem;
}

.login__text-content {
  display: block;
  width: 100%;
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  font-size: 1.8rem;
  color: var(--color-grey-dark-1);
  line-height: 1.1;
}

.login__text-content li {
  margin-top: 1rem;
}

.login__box-dots {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(10rem, 1fr);
      grid-template-columns: minmax(10rem, 1fr);
  padding: 1rem 3rem;
  border-radius: var(--border-radius);
  border-color: #d9d9d9;
  border-style: dotted;
}

.login__register {
  background-color: indianred;
}

.edit-test__group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 2rem;
  position: relative;
}

@media only screen and (max-width: 37.5em) {
  .edit-test__group {
    margin-bottom: 0;
  }
}

.edit-test__group + .line_1 {
  margin: 2.5rem 0;
}

@media only screen and (max-width: 37.5em) {
  .edit-test__group + .line_1 {
    margin: 1rem 0 2rem 0;
  }
}

.edit-test__group div a {
  text-decoration: none;
}

@media only screen and (max-width: 37.5em) {
  .edit-test__group {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

.edit-test__user-title {
  display: block;
  font-size: 1.4rem;
  font-family: inherit;
  font-weight: 400;
  color: inherit;
  padding-left: 1rem;
  background-color: transparent;
  outline: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

@media only screen and (max-width: 56.25em) {
  .edit-test__user-title {
    line-height: 20px;
  }
}

@media only screen and (max-width: 37.5em) {
  .edit-test__user-title {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 18px;
  }
}

.edit-test__user-title ~ div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 37.5em) {
  .edit-test__user-title ~ div {
    width: 100%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.edit-test__user-title ~ div .btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 2rem;
}

.edit-test__description {
  width: 60%;
  height: 10rem;
  resize: none;
  display: none;
  font-size: 1.5rem;
  font-family: inherit;
  font-weight: 400;
  color: inherit;
  padding: 2.2rem 1rem 1.3rem 1rem;
  border-radius: 3px;
  overflow-x: hidden;
  background-color: transparent;
  outline: none;
  border: 1px solid var(--color-grey-light-4);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  z-index: 40;
}

@media only screen and (max-width: 56.25em) {
  .edit-test__description {
    width: 80%;
    height: 11rem;
    font-size: 1.3rem;
    line-height: 18px;
  }
}

@media only screen and (max-width: 37.5em) {
  .edit-test__description {
    width: 100%;
    height: 11.5rem;
    font-size: 1.2rem;
    margin-bottom: 1rem;
  }
}

.edit-test__description:focus {
  outline: none;
  border: 1px solid var(--color-primary);
}

.edit-test__description:focus:invalid {
  border: 1px solid var(--color-red);
}

.edit-test__description::-webkit-input-placeholder {
  color: var(--color-grey-dark-3);
}

.edit-test__non-active-input {
  display: none;
  width: 100%;
  height: 100%;
  position: fixed;
  background-color: rgba(57, 124, 115, 0.322);
  opacity: 0;
  z-index: 39;
}

div.edit-test__success span {
  font-weight: 800;
  font-size: 4.5rem;
  line-height: 1;
  color: var(--color-green);
}

div span.edit-test__errors-1 {
  font-weight: 800;
  font-size: 4.5rem;
  line-height: 1;
  color: var(--color-red);
}

div span.edit-test__errors-2 {
  font-weight: 500;
  font-size: 2.2rem;
  line-height: 1;
  color: var(--color-red);
}

.list__box {
  font-size: 1.4rem;
  font-weight: 400;
  list-style: none;
  text-decoration: none;
}

.list__box--1 {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 37.5em) {
  .list__box--1 {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

.list__box-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-item-align: stretch;
      align-self: stretch;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  border: 1px solid #80808030;
  padding: 0.5rem;
}

.list__box-list--active {
  background-color: #dfdfdf;
}

.list__box-list--nonactive {
  background-color: transparent;
}

@media only screen and (max-width: 56.25em) {
  .list__box-list {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

@media only screen and (max-width: 37.5em) {
  .list__box-list {
    -ms-flex-pack: distribute;
        justify-content: space-around;
    padding: 1rem 0;
  }
}

.list__box-list:hover {
  background-color: #dedede;
}

.list__box-list:active {
  background-color: #d1d1d1;
}

.list__box-list:link, .list__box-list:visited {
  background-color: #d1d1d1;
}

.list__box-list--1:hover {
  background-color: transparent;
}

.list__box-list--1:active {
  background-color: transparent;
}

.list__box-list--footer:hover,
.list__box-list--footer:hover a {
  color: var(--color-primary);
  background-color: transparent;
}

.list__box-list--footer:active {
  color: var(--color-primary);
  background-color: transparent;
}

.list__box-list--footer:link, .list__box-list--footer:visited {
  color: var(--color-primary);
  background-color: transparent;
}

.list__box-list--footer span {
  color: #797979;
  font-size: 1.1rem;
  font-weight: 300;
  letter-spacing: 0.038rem;
  margin-bottom: 1rem;
}

@media only screen and (max-width: 37.5em) {
  .list__box-list--footer {
    padding: 0;
  }
}

.list__box-list--footer--white span {
  color: white;
  z-index: 100;
}

.list__box-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-decoration: none;
  padding: 1.5rem;
  position: relative;
  z-index: 10;
  white-space: nowrap;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 80em) {
  .list__box-link {
    white-space: normal;
  }
}

@media only screen and (max-width: 37.5em) {
  .list__box-link {
    padding: 0 0 0 2rem;
  }
}

.list__box-link--footer {
  font-size: 1.2rem;
  font-weight: 400;
  color: var(--color-grey-dark-1);
  padding: 0.8rem 2rem;
  cursor: pointer;
}

.list__box-link--footer a:hover {
  color: var(--color-primary);
}

@media only screen and (max-width: 37.5em) {
  .list__box-link--footer {
    padding: 0.2rem 1rem;
  }
}

li .list__box-link--footer--white {
  cursor: pointer;
  color: white;
}

li .list__box-link--footer--white:hover {
  color: var(--color-primary);
}

.list__box-link-items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.list__box-link ~ .btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 1.5rem;
}

@media only screen and (max-width: 37.5em) {
  .list__box-link ~ .btn {
    margin-right: 0;
  }
}

.list__box-link:hover + .btn {
  color: var(--color-primary);
}

.list__box-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: #777777;
  line-height: 1.1;
  margin-bottom: 0.4rem;
}

.list__box-title--1 {
  font-size: 1.4rem;
}

.list__box-subtitle {
  font-size: 1.1rem;
  font-weight: 400;
  color: var(--color-grey-dark-2);
  line-height: 1.1;
}

.display-block-none-btn-accept {
  display: none;
}

.selectedquestion {
  color: var(--color-primary);
}

.questions-test {
  background-color: #f7f7f7;
  border-radius: var(--border-radius);
  padding: 2rem;
  margin-bottom: 2rem;
}

.test-card-box-wraper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 48%;
          flex: 0 0 48%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 37.5em) {
  .test-card-box-wraper {
    width: 100%;
  }
}

/* Table */
.table {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  border: 0.3px solid #d8d8d8;
  padding: 1em;
}

.table__row {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0;
  padding: 0;
}

.table__row-line {
  width: 100%;
  height: 1px;
  border-top: 0.3px solid #d8d8d8;
}

.table__row-cell {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  text-align: center;
  font-size: 1.3rem;
  width: 100%;
  padding: 0.8em 1.2em;
  overflow: hidden;
  list-style: none;
}

.table__row-cell__title {
  font-weight: 600;
}

.table__row-cell__element {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: 400;
}

.table__row-cell .btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.table__row--2cols > .table__row-cell {
  margin: 0.5em 0;
}

.table__row--3cols > .table__row-cell {
  width: 33.33%;
}

.table__row--4cols > .table__row-cell {
  width: 25%;
}

.table__row--5cols > .table__row-cell {
  width: 20%;
}

.table__row--6cols > .table__row-cell {
  width: 16.6%;
}

.video-test {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding: 2rem 2.5rem 3rem 2.5rem;
  border-radius: var(--border-radius);
  background-color: var(--color-grey-light-1);
}

@media only screen and (max-width: 56.25em) {
  .video-test {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin: 2rem 0 1rem 0;
  }
}

.video-test__box {
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0, 35px;
}

.video-test__box-question {
  margin-bottom: 2rem;
}

@media only screen and (max-width: 37.5em) {
  .video-test__box-question {
    max-width: 100vw;
    margin-bottom: 1.2rem;
  }
}

.video-test__box-question__element {
  display: block;
  font-size: 1.6rem;
  line-height: 1.2;
  font-weight: 400;
  margin-bottom: 0.2rem;
}

.video-test__box-question__element--1 {
  font-weight: 700;
  color: #3e3e3e;
}

.video-test__button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.video-test__button--1 {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.video-test__send-status {
  width: 100%;
  font-family: "Montserrat", sans-serif;
  color: var(--color-grey-dark-1);
}

.video-test__send-status h5 {
  display: block;
  font-weight: 800;
  font-size: 3.1rem;
  line-height: 31px;
  color: var(--color-grey-dark-1);
  margin-bottom: 2rem;
}

@media only screen and (max-width: 75em) {
  .video-test__send-status h5 {
    font-size: 2.3rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .video-test__send-status h5 {
    font-size: 2.9rem;
  }
}

.video-test__send-status span {
  display: block;
  font-weight: 300;
  font-size: 2rem;
  line-height: 1.1;
  margin-bottom: 3rem;
}

/* Reset Select */
.select {
  width: 27rem;
  cursor: pointer;
  position: relative;
}

.select:hover {
  background-color: #e9e9e9;
}

.select__top-element {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.5rem;
  font-family: 'Roboto', sans-serif;
  color: inherit;
  border-radius: 3px;
  border: 1px solid var(--color-grey-light-4);
  padding: 1.2rem 1.8rem;
}

.select__top-element:focus {
  border: 1px solid var(--color-primary);
}

.select__ul {
  width: 100%;
  white-space: nowrap;
  list-style: none;
  border-radius: var(--border-radius);
  background-color: #fff;
  -webkit-box-shadow: var(--box-shadow-box);
          box-shadow: var(--box-shadow-box);
  padding: 1rem 0;
  margin-top: 1rem;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: 44px;
  z-index: 1;
}

.select__list {
  font-size: 1.4rem;
  font-weight: 400;
  list-style: none;
  text-decoration: none;
}

.select__list:hover {
  background-color: #dedede;
}

.select__list:active {
  background-color: #d1d1d1;
}

.select__list:link, .select__list:visited {
  background-color: #d1d1d1;
}

.select__list:not(:last-child) {
  border-bottom: var(--line--2);
}

.select__elements {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2.8rem 1fr 1.6rem;
      grid-template-columns: 2.8rem 1fr 1.6rem;
  grid-column-gap: .5rem;
  white-space: nowrap;
  text-decoration: none;
  padding: 1.4rem 2.1rem 1.4rem 2.5rem;
  cursor: pointer;
}

.select__elements > img {
  height: 2.15rem;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.select__elements > span {
  color: var(--color-grey-dark-1);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.content-upload {
  background-color: var(--color-grey-light-3);
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin: 7.3rem 0 0 25rem;
  padding: 0 2rem 6rem 2rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 75em) {
  .content-upload {
    margin: 7.3rem 0 0 22rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .content-upload {
    margin: 7.3rem 0 0 7rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .content-upload {
    margin: 6.2rem 0 0 0;
    padding: 0 0.8rem;
  }
  .content-upload > .line_1 {
    display: none;
  }
}

.content-upload--1 {
  margin: 0 0 0 25rem;
}

@media only screen and (max-width: 75em) {
  .content-upload--1 {
    margin: 0 0 0 22rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .content-upload--1 {
    margin: 0 0 0 7rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .content-upload--1 {
    margin: 0;
    padding: 0;
  }
}

.content-upload--2 {
  margin: 3.8rem 0 0 25rem;
}

@media only screen and (max-width: 75em) {
  .content-upload--2 {
    margin: 3.8rem 0 0 22rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .content-upload--2 {
    margin: 3.8rem 0 0 7rem;
  }
}

.content-upload--3 {
  margin: 3.2rem 0 0 25rem;
  padding: 0;
}

@media only screen and (max-width: 75em) {
  .content-upload--3 {
    margin: 3.8rem 0 0 22rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .content-upload--3 {
    margin: 3.8rem 0 0 7rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .content-upload--3 {
    margin: 0;
  }
}

.upload__form {
  border-radius: 6px;
  position: relative;
}

.upload__form-box--1 {
  border: 1px solid var(--color-grey-light-4);
  border-radius: 4px;
  margin-bottom: 2rem;
  height: 400px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -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;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: transparent;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.upload__form-box--1-selected {
  border: 1px solid var(--color-primary);
}

.upload__form-box--1-upload {
  display: none;
}

.upload__form-box-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.upload__form-progress-bar {
  width: 100%;
  height: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin: 2rem 0;
  font-size: 1.35rem;
  font-weight: 400;
  color: inherit;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.upload__form-progress-bar p {
  width: 100%;
  display: block;
  margin-bottom: 0.4rem;
}

.upload__form-file {
  width: 100%;
  height: 400px;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 100;
}

.upload__form-group {
  margin-bottom: 2rem;
  position: relative;
}

.upload__form-group__content-warning {
  height: 350px;
  padding: 0 14rem;
  overflow: hidden;
  overflow-y: scroll;
}

@media only screen and (max-width: 56.25em) {
  .upload__form-group__content-warning {
    padding: 0 calc(12vw);
  }
}

.upload__form-group__content-warning-p {
  font-size: 1.6rem;
  font-weight: 300;
  line-height: 23px;
}

@media only screen and (max-width: 56.25em) {
  .upload__form-group__content-warning-p {
    font-size: 1.5rem;
    line-height: 20px;
  }
}

@media only screen and (max-width: 37.5em) {
  .upload__form-group__content-warning-p {
    font-size: 1.4rem;
    line-height: 17px;
  }
}

.upload__form-group__content-warning__list {
  padding: 0 5rem;
  margin: 1rem 0;
}

@media only screen and (max-width: 56.25em) {
  .upload__form-group__content-warning__list {
    padding: 0 2rem;
  }
}

.upload__form-group__content-warning__list li {
  margin-bottom: 0.2rem;
}

.upload__form-group__content-warning__list-items {
  font-size: 1.4rem;
  font-weight: 400;
}

@media only screen and (max-width: 56.25em) {
  .upload__form-group__content-warning__list-items {
    font-size: 1.3rem;
  }
}

.upload__form-video-box {
  margin-bottom: 2rem;
  border: 1px solid var(--color-grey-light-4);
}

.upload__form-text {
  font-size: 2.5rem;
  font-weight: 300;
  text-align: center;
  margin-top: 1rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@media only screen and (max-width: 37.5em) {
  .upload__form-text {
    font-size: 1.9rem;
    line-height: 23px;
  }
}

.upload__form-text-2 {
  font-size: 2rem;
  margin-top: 0;
}

@media only screen and (max-width: 37.5em) {
  .upload__form-text-2 {
    font-size: 1.6rem;
    line-height: 23px;
  }
}

.upload__form-text-3 {
  font-size: 1.9rem;
  font-weight: 600;
  margin-top: 1rem;
  line-height: 21px;
}

.upload__form-text-4 {
  font-size: 2.8rem;
  font-weight: 300;
  color: var(--color-primary);
  margin-top: 0.5rem;
  line-height: 21px;
}

.upload__form-text-5 {
  font-size: 2rem;
  margin-top: 1rem;
  line-height: 24px;
}

.upload__form-title {
  width: 100%;
  height: 6rem;
  resize: none;
  display: block;
  font-size: 1.5rem;
  font-family: "Roboto", sans-serif;
  color: inherit;
  padding: 2.5rem 1rem 1.3rem 1rem;
  border-radius: 3px;
  overflow-x: hidden;
  background-color: transparent;
  outline: none;
  border: 1px solid var(--color-grey-light-4);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.upload__form-title:focus {
  outline: none;
  border: 1px solid var(--color-primary);
}

.upload__form-title:focus:invalid {
  border: 1px solid var(--color-red);
}

.upload__form-title::-webkit-input-placeholder {
  color: var(--color-grey-dark-3);
}

.upload__form-title--border-red {
  border: 1px solid var(--color-red);
}

.upload__form-title--sm {
  width: 80%;
  height: 3rem;
  padding: 1.3rem 1rem;
}

.upload__form-title--medium {
  height: 12rem;
}

.upload__form-description {
  width: 100%;
  height: 9rem;
  resize: none;
  display: block;
  font-size: 1.5rem;
  font-family: "Roboto", sans-serif;
  color: inherit;
  padding: 2.2rem 1rem 1.3rem 1rem;
  border-radius: 3px;
  overflow-x: hidden;
  background-color: transparent;
  outline: none;
  border: 1px solid var(--color-grey-light-4);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.upload__form-description:focus {
  outline: none;
  border: 1px solid var(--color-primary);
}

.upload__form-description:focus:invalid {
  border: 1px solid var(--color-red);
}

.upload__form-description::-webkit-input-placeholder {
  color: var(--color-grey-dark-3);
}

.upload__form-description--border-red {
  border: 1px solid var(--color-red) !important;
}

.upload__form-password {
  width: 100%;
  height: 6rem;
  resize: none;
  display: block;
  font-size: 1.5rem;
  font-family: "Roboto", sans-serif;
  color: inherit;
  padding: 2.3rem 2rem 1.3rem 1rem;
  border-radius: 0.5em;
  overflow-x: hidden;
  background-color: transparent;
  outline: none;
  border: 1px solid var(--color-grey-light-4);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.upload__form-password:focus {
  outline: none;
  border: 1px solid var(--color-primary);
}

.upload__form-password:focus:invalid {
  border: 1px solid var(--color-red);
}

.upload__form-password::-webkit-input-placeholder {
  color: var(--color-grey-dark-3);
}

.upload__form-password--invalid {
  border: 1px solid var(--color-red);
}

.upload__form-group__checkbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 2rem;
  position: relative;
}

.upload__form-group__checkbox__input {
  display: none;
}

.upload__form-group__checkbox__label-input {
  width: calc(100% - 3rem);
  color: var(--color-grey-dark-1);
  background-color: var(--color-grey-light-3);
  padding-top: 0.3rem;
  font-size: 1.3rem;
  font-weight: 500;
  position: absolute;
  top: 1px;
  left: 11px;
}

.upload__form-group__checkbox__label-input--1 {
  background-color: var(--color-grey-light-1);
}

.upload__form-group__checkbox__label-input--2 {
  width: 59%;
}

.upload__form-group__checkbox__label-input--3 {
  background-color: transparent;
}

.upload__form-group__checkbox__label {
  width: auto;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.5rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  position: relative;
}

@media only screen and (max-width: 37.5em) {
  .upload__form-group__checkbox__label {
    white-space: normal;
  }
}

.upload__form-group__checkbox__label--non-active {
  cursor: no-drop;
}

.upload__form-group__checkbox__label--1 {
  margin: 1rem 0 0.2rem 3rem;
}

.upload__form-group__checkbox__button {
  height: 1.8rem;
  width: 1.8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border: 2px solid #d2d2d2;
  border-radius: 2px;
  position: absolute;
  left: 0;
}

.upload__form-group__checkbox__button--2 {
  border: 2px solid #f5f5f5;
  background-color: rgba(253, 253, 253, 0.84);
  left: 12px;
  top: 30px;
  z-index: 100;
}

.upload__form-group__checkbox__button::after {
  content: "";
  display: block;
  height: 1.2rem;
  width: 0.6rem;
  border: solid var(--color-primary);
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  opacity: 0;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.upload__form-group__checkbox__button--non-active {
  background-color: #ececec;
  border: 2px solid #e1e1e1;
}

.upload__form-group__checkbox__input:checked ~ .upload__form-group__checkbox__label .upload__form-group__checkbox__button::after {
  opacity: 1;
}

.upload__form-group__checkbox__text {
  font-size: 1.5rem;
  font-family: inherit;
  color: var(--color-grey-dark-2);
  font-weight: 400;
  position: relative;
  top: 2px;
}

@media only screen and (max-width: 37.5em) {
  .upload__form-group__checkbox__text {
    font-size: 1.2rem;
    line-height: 14px;
  }
}

.upload__form-group__checkbox__text--non-active {
  color: var(--color-grey-light-4);
}

.upload__form-group__checkbox__text--1 {
  width: 100%;
  white-space: break-spaces;
}

.upload__form-group__radio {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 2rem;
}

.upload__form-group__radio--non-active {
  color: var(--color-grey-light-4);
}

.upload__form-group__radio__text {
  display: inline;
  margin-left: 2px;
  font-size: 1.5rem;
  font-family: "Roboto", sans-serif;
  color: var(--color-grey-dark-2);
  font-weight: 400;
  position: relative;
}

.upload__form-group__radio__text--1 {
  width: 89%;
  font-size: 1.4rem;
  margin-left: 0.6rem;
}

@media only screen and (max-width: 37.5em) {
  .upload__form-group__radio__text {
    font-size: 1.2rem;
    line-height: 14px;
  }
}

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

.upload__form-group__radio__group--1 {
  display: block;
}

.upload__form-group__radio__input {
  display: none;
}

.upload__form-group__radio__label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.5rem;
  cursor: pointer;
  position: relative;
  margin-left: 1rem;
}

.upload__form-group__radio__label--1 {
  margin: 1rem 0 0.2rem 3rem;
}

.upload__form-group__radio__label--2 {
  margin: 0;
}

.upload__form-group__radio__button {
  height: 1.8rem;
  width: 1.8rem;
  border: 2px solid #d2d2d2;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.upload__form-group__radio__button--blue {
  border: 2px solid var(--color-primary);
}

.upload__form-group__radio__button::after {
  content: "";
  display: block;
  height: 1rem;
  width: 1rem;
  border-radius: 50%;
  background-color: var(--color-primary);
  opacity: 0;
  position: relative;
  top: 2px;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

@media only screen and (max-width: 37.5em) {
  .upload__form-group__radio__button::after {
    height: 0.95rem;
    width: 0.9rem;
    right: 0;
  }
}

.upload__form-group__radio__input:checked ~ .upload__form-group__radio__label .upload__form-group__radio__button::after {
  opacity: 1;
}

.upload__form-group__radio--non-active {
  cursor: no-drop;
}

.upload__form-group__radio--non-active > p {
  color: var(--color-grey-light-4);
}

.upload__form-group__radio--non-active > div > label,
.upload__form-group__radio--non-active > div > label > p {
  cursor: inherit;
  color: var(--color-grey-light-4);
}

.upload__form-video {
  width: 100%;
}

.upload__form-btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin-top: 3rem;
}

.upload__form-btn-box input {
  margin-right: 3rem;
}

.upload__link-user-video:link, .upload__link-user-video:visited {
  color: var(--color-primary);
  font-size: 1.5rem;
  font-weight: 400;
  text-decoration: none;
}

@media (max-width: 900px) {
  .user-view .content-upload {
    margin: 5.8rem 0 0 7rem;
  }
}

@media (max-width: 600px) {
  .user-view .content-upload {
    margin: 5rem 0 0 0rem;
  }
}

.video_edit_card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.video_edit_card-box {
  width: 170px;
  height: 165px;
  padding: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-radius: 3px;
  border: 1px solid var(--color-grey-light-4);
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.video_edit_card-box:hover {
  outline: none;
  border: 1px solid var(--color-primary);
  background-color: rgba(0, 0, 0, 0.034);
}

.video_edit_card-box--1 {
  height: 181px;
}

.video_edit_card-box--2 {
  height: 165px;
}

.video_edit_card-box--3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.video_edit_card-box--playlist {
  width: 200px;
  height: 220px;
}

.video_edit_card-img-box {
  width: 230px;
  height: auto;
  padding: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-radius: 3px;
  border: 1px solid var(--color-grey-light-4);
  -webkit-transition: all .3s;
  transition: all .3s;
  position: relative;
}

.video_edit_card-img-box--playlist {
  width: 230px;
}

.video_edit_card-img-box--border-red {
  border: 1px solid var(--color-red);
}

.video_edit_card-img {
  width: 210px;
  height: 118px;
  border: 1px solid var(--color-grey-light-4);
  margin-top: 2rem;
  overflow: hidden;
  border-radius: 3px;
}

.video_edit_card-img--playlist {
  width: 200px;
  height: 157px;
}

.video_edit_card-img--frame {
  width: 350px;
  height: 200px;
}

.video_edit_card-img-default {
  width: 210px;
  height: 118px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
}

.video_edit_card-img-default--playlist {
  width: 200px;
  height: 157px;
}

.video_edit_card-img-user {
  width: 210px;
  height: 118px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
}

.video_edit_card-img-user--playlist {
  width: 200px;
  height: 157px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
}

.video_edit_card-icon-box {
  width: inherit;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-radius: 3px;
  position: relative;
}

.video_edit_card-icon-box .video_edit_card-icon-box__btn {
  color: var(--color-grey-dark-1);
  text-align: center;
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 1.2;
  white-space: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 135px;
}

.video_edit_card-icon-box p {
  color: var(--color-grey-dark-1);
  text-align: center;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-decoration: none;
  text-overflow: ellipsis;
  max-width: 135px;
  max-height: 16px;
}

.video_edit_card-progress-bar {
  width: 150px;
  height: 3px;
  background-color: var(--color-grey-light-4);
  border-radius: 15px;
  margin: .8rem 0 .7rem 0;
  text-align: center;
  position: relative;
}

.video_edit_card-progress-bar_item {
  width: 135px;
  height: 3px;
  display: block;
  border-radius: 15px;
}

.video_edit_card-progress-bar_item--1 {
  width: 50%;
  background-color: var(--color-primary);
  -webkit-animation-name: progressBarAnimation;
  animation-name: progressBarAnimation;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

.video_edit_card-progress-bar_eliminate {
  width: 1.9rem;
  height: 1.9rem;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  display: block;
  line-height: 0;
  text-decoration: none;
  background-color: transparent;
  border: none;
  cursor: pointer;
  position: absolute;
  top: 8px;
  right: 10px;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.video_edit_card-progress-bar_eliminate:hover {
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
}

.video_edit_card-progress-bar_eliminate--1 {
  top: 14px;
  right: 14px;
}

@media only screen and (max-width: 37.5em) {
  .video_edit_card-progress-bar_eliminate--1 {
    top: 16px;
    right: 7px;
  }
}

.video_edit_card-progress-bar_eliminate--absolute-initial {
  position: initial;
  top: 0;
  right: 0;
}

.video_edit_card-progress-bar_eliminate--popup-copy-link {
  top: 20px;
  right: 14px;
}

.video_edit_card-progress-bar_eliminate--overlay-menu-hamb {
  visibility: hidden;
  top: 77px;
  right: 30px;
}

.video_edit_card-progress-bar_eliminate--overlay-menu-hamb--active {
  visibility: visible;
  top: 77px;
  right: 30px;
}

.video_edit_card-progress-bar_eliminate:hover::before, .video_edit_card-progress-bar_eliminate:hover::after {
  width: 2rem;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border: none;
  border-bottom: 4rem solid var(--color-red);
  border-width: 0 0 2px 0;
  border-radius: 6px;
  -webkit-transition: all .2s;
  transition: all .2s;
}

.video_edit_card-progress-bar_eliminate::before {
  content: "";
  display: block;
  width: 2rem;
  border: none;
  border-bottom: 4rem solid var(--color-grey-dark-3);
  border-width: 0 0 2px 0;
  border-radius: 6px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: all .2s;
  transition: all .2s;
  position: absolute;
}

.video_edit_card-progress-bar_eliminate--white::before {
  border-bottom: 4rem solid white;
  border-width: 0 0 2px 0;
  border-radius: 6px;
}

.video_edit_card-progress-bar_eliminate::after {
  content: "";
  display: block;
  width: 2rem;
  border: none;
  border-bottom: 4rem solid var(--color-grey-dark-3);
  border-width: 0 0 2px 0;
  border-radius: 6px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: all .2s;
  transition: all .2s;
  position: absolute;
}

.video_edit_card-progress-bar_eliminate--white::after {
  border-bottom: 4rem solid white;
  border-width: 0 0 2px 0;
  border-radius: 6px;
}

.video_edit_input {
  width: inherit;
  height: 100%;
  border-radius: 3px;
  opacity: 0;
  cursor: pointer;
  position: absolute;
  z-index: 10;
}

.video__edit__link-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 1rem;
  padding: 0 1rem;
}

.video-edit-fixed-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-item-align: center;
      align-self: center;
  margin-right: .5rem;
  -webkit-transition: all .2s;
  transition: all .2s;
  position: relative;
}

.video-edit-fixed-box p {
  font-size: 1.3rem;
  font-weight: 400;
  letter-spacing: .048em;
  white-space: nowrap;
}

.video-edit-fixed-box--hidden {
  display: none;
}

progress {
  width: 100%;
  height: 3px;
  border: 0px none;
  background-color: var(--color-grey-light-4);
  color: var(--color-primary);
}

progress::-webkit-progress-bar {
  background-color: var(--color-grey-light-4);
}

progress::-webkit-progress-value {
  background-color: var(--color-green);
}

progress::-moz-progress-bar {
  background-color: var(--color-green);
}

.alert-div {
  padding: 1rem;
  border-radius: 3px;
  background-color: rgba(171, 171, 171, 0.2);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-item-align: center;
      align-self: center;
}

.shared-div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-item-align: center;
      align-self: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0;
  margin-left: 10px;
}

.shared-div p {
  color: black;
  font-size: 1.3rem;
  font-weight: 400;
  letter-spacing: .048em;
  white-space: wrap;
}

.shared-div b {
  text-transform: capitalize;
  color: black;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: .048em;
  white-space: nowrap;
}

#snackbar {
  visibility: hidden;
  /* Hidden by default. Visible on click */
  min-width: 250px;
  /* Set a default minimum width */
  margin-left: -125px;
  /* Divide value of min-width by 2 */
  background-color: #333;
  /* Black background color */
  color: #fff;
  /* White text color */
  text-align: center;
  /* Centered text */
  border-radius: 2px;
  /* Rounded borders */
  padding: 16px;
  /* Padding */
  position: fixed;
  /* Sit on top of the screen */
  z-index: 1;
  /* Add a z-index if needed */
  left: 50%;
  /* Center the snackbar */
  bottom: 30px;
  /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
  visibility: visible;
  /* Show the snackbar */
  /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
However, delay the fade out process for 2.5 seconds */
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
  from {
    bottom: 0;
    opacity: 0;
  }
  to {
    bottom: 30px;
    opacity: 1;
  }
}

@keyframes fadein {
  from {
    bottom: 0;
    opacity: 0;
  }
  to {
    bottom: 30px;
    opacity: 1;
  }
}

@-webkit-keyframes fadeout {
  from {
    bottom: 30px;
    opacity: 1;
  }
  to {
    bottom: 0;
    opacity: 0;
  }
}

@keyframes fadeout {
  from {
    bottom: 30px;
    opacity: 1;
  }
  to {
    bottom: 0;
    opacity: 0;
  }
}

.video-player-box {
  width: 100%;
  height: 0;
  margin: 0 auto;
  padding-bottom: 56.25%;
  /* 16:9 Aspect Ratio */
  position: relative;
}

.video-player-box--1 {
  height: auto;
  padding-bottom: 0;
  /* 16:9 Aspect Ratio, se cambia a 0 por width, cuando no hay test */
}

.video-player-box--edge-height-auto {
  height: auto;
  padding-bottom: 0;
  /* 16:9 Aspect Ratio, se cambia a 0 por width, cuando no hay test */
}

.video-player {
  width: 100%;
  padding: 0;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer;
}

.video-player:active, .video-player:focus, .video-player:visited {
  border: none;
  background-color: none;
  outline: none;
}

.video-player__docs {
  width: 8rem;
  height: 70px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 1.5rem 2rem;
  position: absolute;
  top: 0;
  right: 0;
}

.video-player__caption {
  display: none;
}

.video-player__controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-right: 2.5rem;
}

.video-player__volume {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-right: 2.5rem;
}

.video-player__volume-bar {
  width: 65px;
  height: 3px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background-color: var(--color-grey-light-4);
  border-radius: 15px;
  margin: .8rem 0 .7rem 0;
  text-align: center;
  position: relative;
}

.video-player__volume-bar-item {
  width: 50%;
  height: 3px;
  display: block;
  background-color: var(--color-primary);
  border-radius: 15px;
}

.video-player__progress-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  color: #f1f1f1;
  font-weight: 400;
  font-size: 1.2rem;
  text-decoration: none;
  padding: 0;
  margin-right: 2.5rem;
}

.video-player__progress {
  width: 100%;
  height: 3px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background-color: var(--color-grey-light-4);
  border-radius: 15px;
  margin: .8rem 0 .7rem 0;
  text-align: center;
  position: relative;
}

.video-player__progress-item {
  width: 135px;
  height: 3px;
  background-color: var(--color-primary);
  display: block;
  border-radius: 15px;
}

.video-player__progress-item--1 {
  width: 50%;
  background-color: var(--color-primary);
  -webkit-animation-name: progressBarAnimation;
  animation-name: progressBarAnimation;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

.video-player__timer {
  margin-right: 2rem;
  white-space: nowrap;
}

.video-player__aditionals {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

video {
  width: 100%;
  max-height: 100%;
  padding: 0;
  margin: 0;
  background-color: black;
  background-size: cover;
  margin: auto;
  display: block;
}

video:active, video:focus, video:visited {
  border: none;
  background-color: none;
  outline: none;
}

video:-webkit-full-screen {
  width: 100%;
  height: 100%;
  max-height: 100%;
}

.footer {
  display: block;
  width: 100%;
  background-color: #ececec;
  z-index: 200;
  bottom: 0;
}

@media only screen and (max-width: 37.5em) {
  .footer {
    margin-top: auto;
    position: static;
    background-color: #ececec;
  }
}

.container-full-width {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: var(--color-grey-light-2);
}

.box-min-height-100vh {
  min-height: 100vh;
}

.flex-direction-column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.box-center-cross-axis {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.box-center-main-axis {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.box-space-between {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.box-space-around {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
}

.box-flex-end {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.box-center-main-and-cross-axis {
  width: 100%;
  height: 95%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.box-flex-46 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 46%;
          flex: 0 0 46%;
}

.box-50-percent {
  width: 50%;
}

.box-800-height {
  height: 80rem;
}

.box-50 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 49%;
          flex: 0 0 49%;
  padding: 0 calc(16vw);
}

.box-50 p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.container-3-columns {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(min-content, 20rem))[3];
      grid-template-columns: repeat(3, minmax(-webkit-min-content, 20rem));
      grid-template-columns: repeat(3, minmax(min-content, 20rem));
  grid-gap: 3rem 3rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 2rem 0;
}

@media only screen and (max-width: 56.25em) {
  .container-3-columns {
    -ms-grid-columns: minmax(min-content, 20rem);
        grid-template-columns: minmax(-webkit-min-content, 20rem);
        grid-template-columns: minmax(min-content, 20rem);
  }
}

.container-3-columns-fr {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(min-content, 1fr))[3];
      grid-template-columns: repeat(3, minmax(-webkit-min-content, 1fr));
      grid-template-columns: repeat(3, minmax(min-content, 1fr));
  grid-gap: 3rem 2rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 56.25em) {
  .container-3-columns-fr {
    background-color: #386897;
  }
}

.container-2-columns {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(min-content, 1fr))[2];
      grid-template-columns: repeat(2, minmax(-webkit-min-content, 1fr));
      grid-template-columns: repeat(2, minmax(min-content, 1fr));
  grid-column-gap: 3rem;
}

@media only screen and (max-width: 56.25em) {
  .container-2-columns {
    -ms-grid-columns: minmax(min-content, 1fr);
        grid-template-columns: minmax(-webkit-min-content, 1fr);
        grid-template-columns: minmax(min-content, 1fr);
  }
}

.container-2-columns-md-sm {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2fr minmax(33.6rem, 3fr);
      grid-template-columns: 2fr minmax(33.6rem, 3fr);
  grid-column-gap: 2rem;
}

@media only screen and (max-width: 56.25em) {
  .container-2-columns-md-sm {
    -ms-grid-columns: minmax(min-content, 1fr) 2fr;
        grid-template-columns: minmax(-webkit-min-content, 1fr) 2fr;
        grid-template-columns: minmax(min-content, 1fr) 2fr;
    grid-column-gap: 1.5rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .container-2-columns-md-sm {
    -ms-grid-columns: minmax(min-content, 1fr);
        grid-template-columns: minmax(-webkit-min-content, 1fr);
        grid-template-columns: minmax(min-content, 1fr);
    -ms-grid-rows: (minmax(min-content, 1fr))[2];
        grid-template-rows: repeat(2, minmax(-webkit-min-content, 1fr));
        grid-template-rows: repeat(2, minmax(min-content, 1fr));
  }
}

.header {
  height: 5.8rem;
  font-size: 1.4rem;
  /* height: 95vh;  */
  /* viewport height */
  background-color: white;
  z-index: 100;
  position: fixed;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.161);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.161);
  z-index: 999;
}

.header--home {
  -webkit-box-shadow: initial;
          box-shadow: initial;
  height: 6.5rem;
}

@media only screen and (max-width: 37.5em) {
  .header--home {
    height: 5.5rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .header {
    height: 5rem;
  }
}

.header__log-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.header__log-box a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.header__log-box button {
  display: none;
  margin-left: 2rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 37.5em) {
  .header__log-box button {
    margin-left: 1rem;
  }
}

.header__log-box button:hover {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

@media only screen and (max-width: 56.25em) {
  .header__log-box button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.header__log-box button img {
  width: 3.3rem;
}

@media only screen and (max-width: 37.5em) {
  .header__log-box button img {
    width: 3rem;
  }
}

.header__logo {
  height: 3.4rem;
  margin-left: 3.35rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 75em) {
  .header__logo {
    margin-left: 1.9rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .header__logo {
    height: 2.7rem;
    margin-left: 1rem;
  }
}

.user-nav {
  font-size: 1.25rem;
  -ms-flex-item-align: stretch;
      align-self: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.user-nav--2 {
  display: -ms-grid;
  display: grid;
  grid-column-gap: 3rem;
  -ms-grid-columns: (min-content)[5];
      grid-template-columns: repeat(5, -webkit-min-content);
      grid-template-columns: repeat(5, min-content);
  padding-right: 4rem;
}

@media only screen and (max-width: 80em) {
  .user-nav--2 {
    grid-column-gap: 1.5rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .user-nav--2 {
    -ms-grid-columns: (min-content)[2];
        grid-template-columns: repeat(2, -webkit-min-content);
        grid-template-columns: repeat(2, min-content);
    grid-column-gap: 1rem;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: end;
    padding-right: 1rem;
  }
}

.user-nav--2 .user-nav__items-home {
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: 0.57px;
  color: var(--color-primary-dark);
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  position: relative;
  cursor: pointer;
}

@media only screen and (max-width: 56.25em) {
  .user-nav--2 .user-nav__items-home {
    display: none;
  }
}

.user-nav--2 .user-nav__items-home:hover {
  color: var(--color-primary-dark-2);
}

.user-nav--2 .user-nav__items-home:before {
  content: "";
  display: block;
  width: 0;
  border: none;
  border-bottom: 4rem solid var(--color-primary-dark);
  border-width: 0 0 2px 0;
  border-radius: 21px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  position: absolute;
  top: 21px;
}

.user-nav--2 .user-nav__items-home:hover::before {
  content: "";
  display: block;
  width: 100%;
  border: none;
  border-bottom: 4rem solid var(--color-primary-dark);
  border-width: 0 0 2px 0;
  border-radius: 21px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  position: absolute;
  top: 21px;
}

.user-nav > * {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.user-nav__user {
  padding: 0 1rem;
  color: var(--color-grey-dark-1);
}

.user-nav__user-photo {
  width: 4.5rem;
  height: 4.5rem;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: var(--border-radius);
  background-color: #f5f5f5;
  margin-right: 1rem;
}

@media only screen and (max-width: 37.5em) {
  .user-nav__user-photo {
    width: 4rem;
    height: 4rem;
    margin: 0;
  }
  .user-nav__user-photo:hover + div > span ~ .user-nav__user-dropdown-box {
    visibility: visible;
    opacity: 1;
  }
}

.user-nav__user-dropdown {
  margin-right: 1rem;
}

@media only screen and (max-width: 37.5em) {
  .user-nav__user-dropdown {
    margin-right: 0;
  }
}

.user-nav__user-dropdown-box {
  visibility: hidden;
  white-space: nowrap;
  list-style: none;
  -webkit-transition: visibility 0.5s;
  transition: visibility 0.5s;
  border-radius: var(--border-radius);
  background-color: #fff;
  -webkit-box-shadow: var(--box-shadow-box);
          box-shadow: var(--box-shadow-box);
  padding: 1rem 0;
  margin-top: 1rem;
  opacity: 0;
  position: absolute;
  right: 19px;
  z-index: 1;
}

.user-nav__user-dropdown-list {
  font-size: 1.4rem;
  font-weight: 400;
  text-decoration: none;
  list-style: none;
  text-decoration: none;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.user-nav__user-dropdown-list:hover {
  background-color: #dedede;
}

.user-nav__user-dropdown-list:active {
  background-color: #d1d1d1;
}

.user-nav__user-dropdown-list:link, .user-nav__user-dropdown-list:visited {
  background-color: #d1d1d1;
}

.user-nav__user-dropdown-list:not(:last-child) {
  border-bottom: var(--line--2);
}

.user-nav__user-dropdown-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
  text-decoration: none;
  padding: 1.4rem 3.5rem 1.4rem 2.5rem;
  cursor: pointer;
}

.user-nav__user-dropdown > span {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.user-nav__user-dropdown > span,
.user-nav__user-dropdown > div {
  cursor: pointer;
  outline: 0;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.user-nav__user-dropdown > div {
  background-color: rgba(0, 0, 0, 0);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
}

.user-nav__user-dropdown > span:focus ~ div {
  display: block;
}

.user-nav__user-dropdown > span:focus ~ .user-nav__user-dropdown-box {
  visibility: visible;
  opacity: 1;
}

.user-nav__user-dropdown > .user-nav__user-name:hover {
  color: var(--color-grey-dark-2);
}

.user-nav__user-name {
  letter-spacing: 0.083rem;
  white-space: nowrap;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

@media only screen and (max-width: 37.5em) {
  .user-nav__user-name-item {
    display: none;
  }
}

.user-nav__icon-box {
  text-transform: uppercase;
}

.user-nav__icon {
  height: 2.15rem;
}

.user-nav__icon-canal {
  color: var(--color-grey-dark-1);
  text-decoration: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.user-nav__icon-canal:hover {
  color: var(--color-grey-dark-2);
}

.user-nav__icon-canal--1 {
  width: 3.2rem;
  height: 3.2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 50%;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.user-nav__icon-canal--1:hover {
  cursor: pointer;
  background-color: #ececec;
}

.user-nav__icon-canal--1:active {
  background-color: #e2e2e2;
}

.user-nav__login-logout {
  margin-right: 0 2rem 0 1rem;
  padding: 0 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.user-nav__login-logout:hover a {
  color: var(--color-primary);
}

.user-nav__login-logout:not(:last-child) {
  margin-right: 1rem;
}

.overlay-sidebar-menu-hamb {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: fixed;
  width: 100vw;
  height: 100vh;
  visibility: visible;
  background-color: var(--bg-color-overlay);
  z-index: 909;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.overlay-sidebar-menu-hamb--nonactive {
  visibility: hidden;
  z-index: 0;
}

.box-notification {
  width: 3.7rem;
  height: 3.7rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 50%;
  padding: 0;
  -webkit-transition: 0.3s all;
  transition: 0.3s all;
}

.box-notification__result {
  width: 48rem;
  height: 48rem;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 3.9rem 1fr;
      grid-template-rows: 3.9rem 1fr;
  -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
  padding: 2rem 0;
  background-color: white;
  border-radius: var(--border-radius);
  -webkit-box-shadow: 0 5px 17px rgba(0, 0, 0, 0.28);
          box-shadow: 0 5px 17px rgba(0, 0, 0, 0.28);
  visibility: hidden;
  opacity: 0;
  overflow-y: scroll;
  overflow-x: hidden;
  position: absolute;
  z-index: 999;
}

.box-notification__result__btn-dots {
  -ms-grid-column: 4;
  -ms-grid-column-span: 1;
  grid-column: 4 / 5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  position: absolute;
  right: -16px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

@media only screen and (max-width: 37.5em) {
  .box-notification__result {
    -ms-grid-rows: 1.9rem 1fr;
        grid-template-rows: 1.9rem 1fr;
  }
}

.box-notification__result--active {
  margin-right: 2rem;
  visibility: visible;
  opacity: 1;
  right: 0;
  top: 7rem;
}

@media only screen and (max-width: 37.5em) {
  .box-notification__result--active {
    grid-gap: 1rem;
    margin-right: 0;
    width: calc(90vw);
    right: calc(3vw);
    top: 6rem;
  }
}

.box-notification__result__ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.box-notification__result__li {
  -webkit-transition: 0.3s all;
  transition: 0.3s all;
  border-bottom: 1px solid #e2e2e2;
}

.box-notification__result__li:hover {
  background-color: #e9e9e9;
}

.box-notification__result__li:active {
  background-color: #e0e0e0;
}

.box-notification__result .box-notification__result__link {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr;
      grid-template-rows: 1fr;
  -ms-grid-columns: 4rem minmax(15rem, 1fr) 9rem 4.2rem;
      grid-template-columns: 4rem minmax(15rem, 1fr) 9rem 4.2rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1rem 1.6rem;
}

@media only screen and (max-width: 37.5em) {
  .box-notification__result .box-notification__result__link {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.box-notification__result__text {
  font-size: 1.35rem;
  font-weight: 400;
  line-height: 17px;
  padding: 0 2rem 0 1.5rem;
}

.box-notification__result__text--1 {
  -ms-grid-column: 2;
  -ms-grid-column-span: 2;
  grid-column: 2 / 4;
}

@media only screen and (max-width: 37.5em) {
  .box-notification__result__text {
    font-size: 1.2rem;
    padding: 0 1rem 0 0.9rem;
    line-height: 14px;
  }
}

.box-notification__result__empty {
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding-top: 2rem;
}

.content-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 240px;
          flex: 0 0 240px;
}

.user-box {
  color: var(--color-grey-dark-1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media only screen and (max-width: 37.5em) {
  .user-box--phone {
    display: none;
  }
}

.user-box__box-edit-channel {
  width: 100%;
  background-color: gray;
  border: var(--border-line-gray);
  border-radius: var(--border-radius);
  overflow: hidden;
  cursor: pointer;
  position: relative;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.user-box__box-edit-channel::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: 0;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  position: absolute;
  z-index: 9;
}

.user-box__box-edit-channel:hover::before {
  outline: none;
  opacity: 1;
  border: 1px solid var(--color-primary);
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.22);
}

.user-box__box-edit-channel--border-red {
  border: 2px solid var(--color-red);
}

.user-box__input-user-img {
  width: 100%;
  height: 100%;
  border-radius: var(--border-radius);
  opacity: 0;
  cursor: pointer;
  position: absolute;
  z-index: 10;
  background-color: #9c9c9c;
}

.user-box__icon-edit-box {
  width: 3.2rem;
  height: 3.2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: rgba(41, 171, 226, 0.729);
  border-radius: var(--border-radius);
  border-bottom-right-radius: 0%;
  -webkit-box-shadow: var(--shadow-dark);
          box-shadow: var(--shadow-dark);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 9;
}

.user-box__photo {
  width: 14.75rem;
  height: 14.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: var(--border-radius);
  background-color: white;
  overflow: hidden;
  -webkit-transition: 0.2s all;
  transition: 0.2s all;
}

@media only screen and (max-width: 56.25em) {
  .user-box__photo {
    width: 5.75rem;
    height: 5.75rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .user-box__photo--menu-hamb {
    width: 14.75rem;
    height: 14.75rem;
  }
}

.user-box__photo--edit-channel {
  width: 14.75rem;
  height: 14.75rem;
}

.user-box__photo--non-border-radius {
  border-radius: 0;
}

.user-box__photo-item {
  width: 14.75rem;
  height: 14.75rem;
  -o-object-fit: cover;
     object-fit: cover;
}

@media only screen and (max-width: 56.25em) {
  .user-box__photo-item {
    width: 5.75rem;
    height: 5.75rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .user-box__photo-item--menu-hamb {
    width: 14.75rem;
    height: 14.75rem;
  }
}

.user-box__photo-item--edit-channel {
  width: 14.75rem;
  height: 14.75rem;
}

.user-box__user-name {
  font-size: 1.75rem;
  font-weight: 600;
  text-decoration: none;
}

@media only screen and (max-width: 56.25em) {
  .user-box__user-name {
    display: none;
  }
}

@media only screen and (max-width: 56.25em) {
  .user-box__user-name--menu-hamb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.user-box__user-name h3 {
  font-weight: 500;
  line-height: 20px;
  text-align: center;
  letter-spacing: 0;
  padding: 0 2rem;
}

.user-box__user-name:hover {
  color: var(--color-grey-dark-1);
}

.user-box__user-name:active {
  color: var(--color-grey-dark-1);
}

.user-box__user-name:link, .user-box__user-name:visited {
  color: var(--color-grey-dark-1);
}

.user-box__user-location {
  font-size: 1.4rem;
  font-weight: 300;
  margin-bottom: 1rem;
}

.sidebar,
.sidebar--2 {
  position: fixed;
  height: 100%;
  width: 250px;
  padding-top: 75px;
  background-color: white;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  border-right: var(--line);
  overflow-y: auto;
  z-index: 900;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 75em) {
  .sidebar,
  .sidebar--2 {
    width: 220px;
  }
}

@media only screen and (max-width: 56.25em) {
  .sidebar,
  .sidebar--2 {
    width: 75px;
    overflow-x: hidden;
  }
}

@media only screen and (max-width: 37.5em) {
  .sidebar--phone,
  .sidebar--2--phone {
    height: 5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    width: 100%;
    overflow: hidden;
    padding-top: 0;
    -webkit-box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.161);
            box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.161);
    bottom: 0;
  }
}

.sidebar__title-config,
.sidebar--2__title-config {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media only screen and (max-width: 56.25em) {
  .sidebar__title-config,
  .sidebar--2__title-config {
    display: none;
  }
}

.sidebar__title-config--phone,
.sidebar--2__title-config--phone {
  display: none;
}

@media only screen and (max-width: 37.5em) {
  .sidebar__title-config--phone,
  .sidebar--2__title-config--phone {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.sidebar__title-config__items,
.sidebar--2__title-config__items {
  font-size: 1.1rem;
  font-weight: 800;
  line-height: 18px;
  letter-spacing: 0.98px;
  color: var(--color-grey-dark-3);
  text-transform: uppercase;
  margin: 1rem 0;
}

@media only screen and (max-width: 37.5em) {
  .sidebar__title-config__items,
  .sidebar--2__title-config__items {
    font-size: 1rem;
    letter-spacing: 1.26px;
    margin: 0;
  }
}

.sidebar-box,
.sidebar--2-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.sidebar--menu-hamb,
.sidebar--2--menu-hamb {
  background-color: white;
  opacity: 1;
  z-index: 910;
  position: fixed;
  left: -250px;
  top: 0;
}

@media only screen and (max-width: 75em) {
  .sidebar--menu-hamb,
  .sidebar--2--menu-hamb {
    width: 250px;
  }
}

@media only screen and (max-width: 56.25em) {
  .sidebar--menu-hamb,
  .sidebar--2--menu-hamb {
    width: 250px;
  }
}

.sidebar-nav,
.sidebar--2-nav {
  font-size: 1.4rem;
  font-weight: 400;
  list-style: none;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 75em) {
  .sidebar-nav,
  .sidebar--2-nav {
    font-size: 1.35rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .sidebar-nav--phone,
  .sidebar--2-nav--phone {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
  }
  .sidebar-nav--phone > :nth-child(1),
  .sidebar--2-nav--phone > :nth-child(1) {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  .sidebar-nav--phone > :nth-child(2),
  .sidebar--2-nav--phone > :nth-child(2) {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .sidebar-nav--phone > :nth-child(3),
  .sidebar--2-nav--phone > :nth-child(3) {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  .sidebar-nav--phone > :nth-child(4),
  .sidebar--2-nav--phone > :nth-child(4) {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }
  .sidebar-nav--phone > :nth-child(5),
  .sidebar--2-nav--phone > :nth-child(5) {
    -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
            order: 5;
  }
}

.sidebar-nav__item,
.sidebar--2-nav__item {
  position: relative;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.sidebar-nav__item--phone,
.sidebar--2-nav__item--phone {
  width: 100%;
}

@media only screen and (max-width: 37.5em) {
  .sidebar-nav__item--phone--admin,
  .sidebar--2-nav__item--phone--admin {
    display: none;
  }
}

@media only screen and (max-width: 37.5em) {
  .sidebar-nav__item--order1,
  .sidebar--2-nav__item--order1 {
    -webkit-box-ordinal-group: 2 !important;
        -ms-flex-order: 1 !important;
            order: 1 !important;
  }
  .sidebar-nav__item--order2,
  .sidebar--2-nav__item--order2 {
    -webkit-box-ordinal-group: 3 !important;
        -ms-flex-order: 2 !important;
            order: 2 !important;
  }
  .sidebar-nav__item--order3,
  .sidebar--2-nav__item--order3 {
    -webkit-box-ordinal-group: 4 !important;
        -ms-flex-order: 3 !important;
            order: 3 !important;
  }
  .sidebar-nav__item--order4,
  .sidebar--2-nav__item--order4 {
    -webkit-box-ordinal-group: 5 !important;
        -ms-flex-order: 4 !important;
            order: 4 !important;
  }
  .sidebar-nav__item--order5,
  .sidebar--2-nav__item--order5 {
    -webkit-box-ordinal-group: 6 !important;
        -ms-flex-order: 5 !important;
            order: 5 !important;
  }
  .sidebar-nav__item--order6,
  .sidebar--2-nav__item--order6 {
    -webkit-box-ordinal-group: 7 !important;
        -ms-flex-order: 6 !important;
            order: 6 !important;
  }
  .sidebar-nav__item--order7,
  .sidebar--2-nav__item--order7 {
    -webkit-box-ordinal-group: 8 !important;
        -ms-flex-order: 7 !important;
            order: 7 !important;
  }
  .sidebar-nav__item--order8,
  .sidebar--2-nav__item--order8 {
    -webkit-box-ordinal-group: 9 !important;
        -ms-flex-order: 8 !important;
            order: 8 !important;
  }
}

.sidebar-nav__item:not(:last-child),
.sidebar--2-nav__item:not(:last-child) {
  margin-bottom: 0.1rem;
}

.sidebar-nav__item:hover,
.sidebar--2-nav__item:hover {
  background-color: #dedede;
}

.sidebar-nav__item:active,
.sidebar--2-nav__item:active {
  background-color: #d1d1d1;
}

.sidebar-nav__item:link, .sidebar-nav__item:visited,
.sidebar--2-nav__item:link,
.sidebar--2-nav__item:visited {
  background-color: #d1d1d1;
}

.sidebar-nav__item--active,
.sidebar--2-nav__item--active {
  background-color: #ececec;
}

.sidebar-nav__item::before,
.sidebar--2-nav__item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 4px;
  background-color: var(--color-primary);
  -webkit-transform: scaleY(0);
          transform: scaleY(0);
  -webkit-transition: background-color 0.01s, -webkit-transform 0.2s;
  transition: background-color 0.01s, -webkit-transform 0.2s;
  transition: transform 0.2s, background-color 0.01s;
  transition: transform 0.2s, background-color 0.01s, -webkit-transform 0.2s;
  z-index: 20;
}

.sidebar-nav__item:hover::before,
.sidebar--2-nav__item:hover::before {
  -webkit-transform: scaleY(1);
          transform: scaleY(1);
}

.sidebar-nav__item:active::before,
.sidebar--2-nav__item:active::before {
  -webkit-transform: scaleY(1);
          transform: scaleY(1);
}

.sidebar-nav__item--active:before,
.sidebar--2-nav__item--active:before {
  -webkit-transform: scaleY(1);
          transform: scaleY(1);
}

@media only screen and (max-width: 37.5em) {
  .sidebar-nav__item--2::before,
  .sidebar--2-nav__item--2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 44px;
    bottom: 0;
    height: 4px;
    width: 100%;
    background-color: var(--color-primary);
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transition: background-color 0.01s, -webkit-transform 0.2s;
    transition: background-color 0.01s, -webkit-transform 0.2s;
    transition: transform 0.2s, background-color 0.01s;
    transition: transform 0.2s, background-color 0.01s, -webkit-transform 0.2s;
    z-index: 20;
  }
  .sidebar-nav__item--2:hover::before,
  .sidebar--2-nav__item--2:hover::before {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
  .sidebar-nav__item--2:active::before,
  .sidebar--2-nav__item--2:active::before {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
}

.sidebar-nav__link,
.sidebar--2-nav__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: var(--color-grey-dark-1);
  text-decoration: none;
  display: block;
  padding: 1rem 3rem;
  position: relative;
  z-index: 10;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 75em) {
  .sidebar-nav__link,
  .sidebar--2-nav__link {
    padding: 1rem 1.9rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .sidebar-nav__link,
  .sidebar--2-nav__link {
    padding: 1rem 2.4rem;
  }
}

.sidebar-nav__link:link, .sidebar-nav__link:visited,
.sidebar--2-nav__link:link,
.sidebar--2-nav__link:visited {
  color: var(--color-grey-dark-1);
  text-decoration: none;
  display: block;
  position: relative;
  z-index: 10;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media only screen and (max-width: 37.5em) {
  .sidebar-nav__link--phone,
  .sidebar--2-nav__link--phone {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 1.5rem;
  }
}

.sidebar-nav__link-name,
.sidebar--2-nav__link-name {
  white-space: nowrap;
}

.sidebar-nav__link-name--active,
.sidebar--2-nav__link-name--active {
  font-weight: 500;
}

@media only screen and (max-width: 56.25em) {
  .sidebar-nav__link-name,
  .sidebar--2-nav__link-name {
    display: none;
  }
}

@media only screen and (max-width: 37.5em) {
  .sidebar-nav__link-name--phone,
  .sidebar--2-nav__link-name--phone {
    display: none;
  }
}

@media only screen and (max-width: 56.25em) {
  .sidebar-nav__link-name--menu-hamb,
  .sidebar--2-nav__link-name--menu-hamb {
    display: block;
  }
}

.sidebar__box-search,
.sidebar--2__box-search {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 1.2rem 0 2.8rem 3.4rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 75em) {
  .sidebar__box-search,
  .sidebar--2__box-search {
    padding: 1.2rem 0 2.8rem 1.9rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .sidebar__box-search,
  .sidebar--2__box-search {
    padding: 1.2rem 0 2.8rem 2.4rem;
  }
}

@media only screen and (max-width: 37.5em) {
  .sidebar__box-search--phone,
  .sidebar--2__box-search--phone {
    display: none;
  }
}

.sidebar__search-form,
.sidebar--2__search-form {
  display: block;
  width: 100%;
  padding-right: 3rem;
}

.sidebar__search-input,
.sidebar--2__search-input {
  width: 100%;
  display: block;
  font-size: 1.5rem;
  font-weight: 400;
  font-family: inherit;
  color: var(--color-grey-dark-1);
  padding: 0.5rem 0;
  border-radius: 2px;
  border: none;
  border-bottom: var(--line);
  background-color: transparent;
  outline: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.sidebar__search-input:focus,
.sidebar--2__search-input:focus {
  outline: none;
  border: none;
  border-bottom: 1px solid var(--color-primary);
}

.sidebar__search-input:focus:invalid,
.sidebar--2__search-input:focus:invalid {
  outline: none;
  border: none;
  border-bottom: 1px solid var(--color-red);
}

.sidebar__search-input::-webkit-input-placeholder,
.sidebar--2__search-input::-webkit-input-placeholder {
  color: #a7a7a7;
  background-color: transparent;
}

.sidebar__search-input::-moz-placeholder,
.sidebar--2__search-input::-moz-placeholder {
  color: #a7a7a7;
  background-color: transparent;
  opacity: 1;
}

.sidebar__search-input:-moz-placeholder,
.sidebar--2__search-input:-moz-placeholder {
  color: #a7a7a7;
  background-color: transparent;
  opacity: 1;
}

.sidebar__search-input::-ms-input-placeholder,
.sidebar--2__search-input::-ms-input-placeholder {
  color: var(--color-grey-dark-1);
  background-color: transparent;
}

.related-tittle {
  font-size: 1.4rem;
  font-weight: 600;
  text-transform: uppercase;
  padding-left: 3rem;
  margin-bottom: 1rem;
}

@media only screen and (max-width: 56.25em) {
  .related-tittle {
    display: none;
  }
}

@media only screen and (max-width: 56.25em) {
  .related-tittle--menu-hamb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.related-nav {
  font-size: 1.4rem;
  font-weight: 400;
  list-style: none;
  margin-top: 1.5rem;
}

@media only screen and (max-width: 56.25em) {
  .related-nav {
    margin-top: 0;
  }
}

@media only screen and (max-width: 37.5em) {
  .related-nav--phone {
    display: none;
  }
}

.related-nav__item {
  position: relative;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.related-nav__item:not(:last-child) {
  margin-bottom: 0.1rem;
}

.related-nav__item:hover {
  background-color: #dedede;
}

.related-nav__item:active {
  background-color: #d1d1d1;
}

.related-nav__item:link, .related-nav__item:visited {
  background-color: #d1d1d1;
}

.related-nav__link {
  color: var(--color-grey-dark-1);
  text-decoration: none;
  display: block;
  padding: 1rem 3rem;
  position: relative;
  z-index: 10;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media only screen and (max-width: 56.25em) {
  .related-nav__link {
    padding: 1rem 1.8rem;
  }
}

@media only screen and (max-width: 56.25em) {
  .related-nav__link--menu-hamb {
    padding: 1rem 3rem;
  }
}

.related-nav__link-icon {
  height: 2.75rem;
  margin-right: 1rem;
}

.related-nav__link:link, .related-nav__link:visited {
  color: var(--color-grey-dark-1);
  text-decoration: none;
  display: block;
  position: relative;
  z-index: 10;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media only screen and (max-width: 56.25em) {
  .related-nav__link-name {
    display: none;
  }
}

@media only screen and (max-width: 56.25em) {
  .related-nav__link-name--menu-hamb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.related-nav__photo {
  width: 3.75rem;
  height: 3.75rem;
  -o-object-fit: cover;
     object-fit: cover;
  margin-right: 1rem;
  border-radius: var(--border-radius);
  background-color: #cacaca;
}

.line_navbar {
  margin: 1rem 1rem 2rem 1rem;
  border-bottom: var(--line);
}

.line_navbar--left {
  width: 30px;
  margin: 0;
  margin-left: 0.5rem;
}

.line_navbar--right {
  width: 30px;
  margin: 0;
  margin-right: 0.5rem;
}

@media only screen and (max-width: 37.5em) {
  .line_navbar--phone {
    display: none;
  }
}

.legal {
  font-size: 1.2rem;
  color: var(--color-grey-dark-2);
  text-align: center;
  padding: 2.5rem;
}

@media only screen and (max-width: 56.25em) {
  .legal {
    display: none;
  }
}

.nav-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 37.5em) {
  .nav-top {
    display: none;
  }
}

.nav-top__box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  list-style: none;
}

.nav-top__link:link, .nav-top__link:visited {
  color: var(--color-grey-dark-1);
  font-size: 1.3rem;
  font-weight: 400;
  text-decoration: none;
  margin-right: 0.6rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.nav-top__link:hover {
  color: var(--color-primary-dark);
}

.nav-top .nav-top__link--current {
  font-weight: 700;
}

.nav-top__span {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--color-grey-dark-1);
  text-decoration: none;
  margin-right: 0.6rem;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.nav-tabs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 0 2rem 0;
}

.nav-tabs__box {
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(20rem, 22rem))[auto-fill];
      grid-template-columns: repeat(auto-fill, minmax(20rem, 22rem));
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: start;
  font-size: 1.4rem;
  font-weight: 400;
  list-style: none;
  text-decoration: none;
  border-bottom: var(--line);
}

@media only screen and (max-width: 56.25em) {
  .nav-tabs__box {
    -ms-grid-columns: (minmax(13rem, 1fr))[auto-fill];
        grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
  }
}

@media only screen and (max-width: 37.5em) {
  .nav-tabs__box {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.nav-tabs__box-list {
  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;
  padding: 1.2rem 6rem;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  position: relative;
}

.nav-tabs__box-list:hover {
  background-color: #dedede;
  color: var(--color-primary);
}

.nav-tabs__box-list:active {
  background-color: #d1d1d1;
}

.nav-tabs__box-list:link, .nav-tabs__box-list:visited {
  background-color: #d1d1d1;
}

@media only screen and (max-width: 56.25em) {
  .nav-tabs__box-list {
    padding: 1rem 1rem;
  }
}

.nav-tabs__box-list:hover::before {
  content: "";
  width: 100%;
  height: 2px;
  display: block;
  background-color: var(--color-primary);
  position: absolute;
  bottom: 0;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.nav-tabs__box-list:focus::before {
  content: "";
  width: 100%;
  height: 2px;
  display: block;
  background-color: var(--color-primary);
  position: absolute;
  bottom: 0;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.nav-tabs__box-list:active::before {
  content: "";
  width: 100%;
  height: 2px;
  display: block;
  background-color: var(--color-primary);
  position: absolute;
  bottom: 0;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.nav-tabs__box-list--selected----- {
  background-color: #e4e4e4;
}

.nav-tabs__box-list--selected::before {
  content: "";
  width: 100%;
  height: 2px;
  display: block;
  background-color: var(--color-primary);
  position: absolute;
  bottom: 0;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.nav-tabs__box-title {
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--color-grey-dark-1);
  line-height: 1.1;
  list-style: none;
  white-space: nowrap;
  text-decoration: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media only screen and (max-width: 56.25em) {
  .nav-tabs__box-title {
    font-size: 1.35rem;
  }
}

.nav-tabs__box-title--selected {
  color: var(--color-primary);
}

.nav-tabs__box-list:hover .nav-tabs__box-title {
  color: var(--color-primary);
}

.nav-tabs__box-list:active .nav-tabs__box-title {
  color: var(--color-primary-dark);
}

.nav-tabs__box-list:link,
.nav-tabs__box-list:visited .nav-tabs__box-title {
  color: var(--color-primary);
}

/*

Esto sirve para hacer pruebas en el responsive
NO borrar
NO poner responsive aqui
El responsive tiene que ir en cada elemento

*/
.test__responsive {
  background-color: #82acac;
  display: block;
  color: white;
  font-size: 1.3rem;
  position: fixed;
  top: 0;
  left: 250px;
  z-index: 100010;
}

@media only screen and (max-width: 100em) {
  .test__responsive {
    background-color: #d8631f;
    color: #122204;
  }
}

@media only screen and (max-width: 75em) {
  .test__responsive {
    background-color: #214dac;
    color: #dbd6fa;
  }
}

@media only screen and (max-width: 80em) {
  .test__responsive {
    background-color: #ac216e;
    color: #0a4123;
  }
}

@media only screen and (max-width: 56.25em) {
  .test__responsive {
    background-color: #ac8721;
    color: #412b0a;
  }
}

@media only screen and (max-width: 37.5em) {
  .test__responsive {
    background-color: #2b3131;
    color: #ffa9a9;
  }
}

@media only screen and (min-width: 112.5em) {
  .test__responsive {
    background-color: #5fa034;
    color: #122204;
  }
}

@media (max-width: 1500px) {
  .requests_user_lists {
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
        -ms-flex-direction: column !important;
            flex-direction: column !important;
  }
  .requests_user_lists > div:first-of-type {
    margin-bottom: 2rem;
  }
}
/*# sourceMappingURL=main.css.map */