@import url(https://fonts.googleapis.com/css2?family=Barlow&display=swap);@import url(https://fonts.googleapis.com/css2?family=Rubik&display=swap);:root {
  --primary-color: #3CABD0;
  --regular-color: #585862;
  --invalid-color: #dc3545;
}

.content-wrapper {
  padding: 1.8rem;
  height: 100%;
}

.card {
  background-color: #fff;
  box-shadow: 0px 2px 1px rgba(0,0,0,0.05);
  margin-bottom: 1.875rem;
  padding: 1.5rem;
  border-radius: 0.375rem;
}

.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-clip: border-box;
  border: 1px solid #d9d9d9;
}

.card-body {
  flex: 1 1 auto;
  min-height: 1px;
  padding: 1rem;
}

.media {
  display: flex;
  align-items: flex-start;
}

.row-cols-auto>*{
  flex:0 0 auto;
  width:auto
}
.row-cols-1>*{
  flex:0 0 auto;
  width:100%
}
.row-cols-2>*{
  flex:0 0 auto;
  width:50%
}
.row-cols-3>*{
  flex:0 0 auto;
  width:33.33333333%
}
.row-cols-4>*{
  flex:0 0 auto;
  width:25%
}
.row-cols-5>*{
  flex:0 0 auto;
  width:20%
}
.row-cols-6>*{
  flex:0 0 auto;
  width:16.66666667%
}
.col-auto{
  flex:0 0 auto;
  width:auto
}
.col-1{
  flex:0 0 auto;
  width:8.33333333%
}
.col-2{
  flex:0 0 auto;
  width:16.66666667%
}
.col-3{
  flex:0 0 auto;
  width:25%
}
.col-4{
  flex:0 0 auto;
  width:33.33333333%
}
.col-5{
  flex:0 0 auto;
  width:41.66666667%
}
.col-6{
  flex:0 0 auto;
  width:50%
}
.col-7{
  flex:0 0 auto;
  width:58.33333333%
}
.col-8{
  flex:0 0 auto;
  width:66.66666667%
}
.col-9{
  flex:0 0 auto;
  width:75%
}
.col-10{
  flex:0 0 auto;
  width:83.33333333%
}
.col-11{
  flex:0 0 auto;
  width:91.66666667%
}
.col-12{
  flex:0 0 auto;
  width:100%
}

.g-0,.gx-0{
  --bs-gutter-x:0
}
.g-0,.gy-0{
  --bs-gutter-y:0
}
.g-1,.gx-1{
  --bs-gutter-x:0.25rem
}
.g-1,.gy-1{
  --bs-gutter-y:0.25rem
}
.g-2,.gx-2{
  --bs-gutter-x:0.5rem
}
.g-2,.gy-2{
  --bs-gutter-y:0.5rem
}
.g-3,.gx-3{
  --bs-gutter-x:1rem
}
.g-3,.gy-3{
  --bs-gutter-y:1rem
}
.g-4,.gx-4{
  --bs-gutter-x:1.5rem
}
.g-4,.gy-4{
  --bs-gutter-y:1.5rem
}
.g-5,.gx-5{
  --bs-gutter-x:3rem
}
.g-5,.gy-5{
  --bs-gutter-y:3rem
}

.col-xs-12{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}

@media (min-width:992px){
  .col-lg{
      flex:1 0 0%
  }
  .row-cols-lg-auto>*{
      flex:0 0 auto;
      width:auto
  }
  .row-cols-lg-1>*{
      flex:0 0 auto;
      width:100%
  }
  .row-cols-lg-2>*{
      flex:0 0 auto;
      width:50%
  }
  .row-cols-lg-3>*{
      flex:0 0 auto;
      width:33.33333333%
  }
  .row-cols-lg-4>*{
      flex:0 0 auto;
      width:25%
  }
  .row-cols-lg-5>*{
      flex:0 0 auto;
      width:20%
  }
  .row-cols-lg-6>*{
      flex:0 0 auto;
      width:16.66666667%
  }
  .col-lg-auto{
      flex:0 0 auto;
      width:auto
  }
  .col-lg-1{
      flex:0 0 auto;
      width:8.33333333%
  }
  .col-lg-2{
      flex:0 0 auto;
      width:16.66666667%
  }
  .col-lg-3{
      flex:0 0 auto;
      width:25%
  }
  .col-lg-4{
      flex:0 0 auto;
      width:33.33333333%
  }
  .col-lg-5{
      flex:0 0 auto;
      width:41.66666667%
  }
  .col-lg-6{
      flex:0 0 auto;
      width:50%
  }
  .col-lg-7{
      flex:0 0 auto;
      width:58.33333333%
  }
  .col-lg-8{
      flex:0 0 auto;
      width:66.66666667%
  }
  .col-lg-9{
      flex:0 0 auto;
      width:75%
  }
  .col-lg-10{
      flex:0 0 auto;
      width:83.33333333%
  }
  .col-lg-11{
      flex:0 0 auto;
      width:91.66666667%
  }
  .col-lg-12{
      flex:0 0 auto;
      width:100%
  }
  .offset-lg-0{
      margin-left:0
  }
  .offset-lg-1{
      margin-left:8.33333333%
  }
  .offset-lg-2{
      margin-left:16.66666667%
  }
  .offset-lg-3{
      margin-left:25%
  }
  .offset-lg-4{
      margin-left:33.33333333%
  }
  .offset-lg-5{
      margin-left:41.66666667%
  }
  .offset-lg-6{
      margin-left:50%
  }
  .offset-lg-7{
      margin-left:58.33333333%
  }
  .offset-lg-8{
      margin-left:66.66666667%
  }
  .offset-lg-9{
      margin-left:75%
  }
  .offset-lg-10{
      margin-left:83.33333333%
  }
  .offset-lg-11{
      margin-left:91.66666667%
  }
  .g-lg-0,.gx-lg-0{
      --bs-gutter-x:0
  }
  .g-lg-0,.gy-lg-0{
      --bs-gutter-y:0
  }
  .g-lg-1,.gx-lg-1{
      --bs-gutter-x:0.25rem
  }
  .g-lg-1,.gy-lg-1{
      --bs-gutter-y:0.25rem
  }
  .g-lg-2,.gx-lg-2{
      --bs-gutter-x:0.5rem
  }
  .g-lg-2,.gy-lg-2{
      --bs-gutter-y:0.5rem
  }
  .g-lg-3,.gx-lg-3{
      padding-left:1rem;
      margin-left:1rem
  }
  .g-lg-3,.gy-lg-3{
      --bs-gutter-y:1rem
  }
  .g-lg-4,.gx-lg-4{
      --bs-gutter-x:1.5rem
  }
  .g-lg-4,.gy-lg-4{
      --bs-gutter-y:1.5rem
  }
  .g-lg-5,.gx-lg-5{
      --bs-gutter-x:3rem
  }
  .g-lg-5,.gy-lg-5{
      --bs-gutter-y:3rem
  }
}

.media-body {
  flex: 1;
}

.p-0{
  padding:0!important
}
.p-1{
  padding:.25rem!important
}
.p-2{
  padding:.5rem!important
}
.p-3{
  padding:1rem!important
}
.p-4{
  padding:1.5rem!important
}
.p-5{
  padding:3rem!important
}

.alert {
  position: relative;
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;
}

.alert-success {
  color: #155724;
  background-color: #d4edda;
  border-color: #c3e6cb;
}

.alert-success hr {
  border-top-color: #b1dfbb;
}

.alert-success .alert-link {
  color: #0b2e13;
}

.modal-dialog-scrollable .modal-body {
  overflow-y: auto;
}

.col-form-label {
  padding-top: calc(0.375rem + 1px);
  padding-bottom: calc(0.375rem + 1px);
  margin-bottom: 0;
  font-size: inherit;
  line-height: 1.5;
}

.col-form-label-lg {
  padding-top: calc(0.5rem + 1px);
  padding-bottom: calc(0.5rem + 1px);
  font-size: 1.25rem;
  line-height: 1.5;
}

.col-form-label-sm {
  padding-top: calc(0.25rem + 1px);
  padding-bottom: calc(0.25rem + 1px);
  font-size: 0.875rem;
  line-height: 1.5;
}

.modal-body {
  position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 1rem;
}

.modal-title {
  margin-bottom: 0;
  line-height: 1.5;
}

.modal-dialog {
  position: relative;
  width: auto;
  margin: 0.5rem;
}

.modal.fade .modal-dialog {
  transition: -webkit-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
  -webkit-transform: translate(0, -50px);
  transform: translate(0, -50px);
}

.modal-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: start;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0 0 0 1rem;
  border-bottom: 1px solid #dee2e6;
  border-top-left-radius: calc(0.3rem - 1px);
  border-top-right-radius: calc(0.3rem - 1px);
}

.modal-header .close {
  padding: 1rem 1rem;
}

.modal-dialog-scrollable .modal-header,
.modal-dialog-scrollable .modal-footer {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.modal-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: end;
  justify-content: flex-end;
  padding: 0.75rem;
  border-top: 1px solid #dee2e6;
  border-bottom-right-radius: calc(0.3rem - 1px);
  border-bottom-left-radius: calc(0.3rem - 1px);
}

.modal-footer > * {
  margin: 0.25rem;
}

.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

.col-md-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}

.pt-4 {
  padding-top: 1.2rem!important;
}

.col-md-3 {
  flex: 0 0 auto;
  padding: 0 10px 0 20px;
}

.col-md-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}

/*Efecto*/
.modalmask {
  position: fixed;
  font-family: Arial, sans-serif;
  top: -100px;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0,0,0,0.8);
  z-index: 99999;
  opacity:0;
  -webkit-transition: opacity 400ms ease-in;
  -moz-transition: opacity 400ms ease-in;
  transition: opacity 400ms ease-in;
  pointer-events: none;
}
.modalmask:target {
  opacity:1;
  pointer-events: auto;
}

/*Formato de la ventana*/
.modalbox{
  width: 700px;
  position: relative;
  padding: 5px 20px 13px 20px;
  background: #fff;
  border-radius:3px;
  -webkit-transition: all 500ms ease-in;
  -moz-transition: all 500ms ease-in;
  transition: all 500ms ease-in;
   
}

/*Movimientos*/
.movedown {
  margin: 0 auto;
}
.rotate {
  margin: 10% auto;
  -webkit-transform: scale(-5,-5);
  transform: scale(-5,-5);
}
.resize {
  margin: 10% auto;
  width:0;
  height:0;

}
.modalmask:target .movedown{       
  margin:10% auto;
}
.modalmask:target .rotate{     
  transform: rotate(360deg) scale(1,1);
      -webkit-transform: rotate(360deg) scale(1,1);
}

.modalmask:target .resize{
  width:680px;
  height:520px;
}

/*Boton de cerrar*/
.close {
  background: #606061;
  color: #FFFFFF;
  line-height: 25px;
  right: 1px;
  text-align: center;
  top: 1px;
  text-decoration: none;
  font-weight: bold;
  border-radius:3px;

}

.close:hover {
  background: #FAAC58;
  color:#222;
}

.w3-container{
  width:900px;
  text-align:justify;
}

.grupomenu{
  background-color: #08162F;
  height:60px;
}

.specs{
  width: 30%;
  height: 35px;
  margin-top: 15px;
  padding-top: 7px;
  padding-left: 15px;
  color: white;
}

.colorbox1{
  background-color: #28396a;
}

.colorbox2{
  background-color: #2381a1;
}

.colorbox3{
  background-color: #3d9cc9;
}

.colorbox4{
  background-color: #63b99d;
}

.textoparrafo{
  margin-left: 50px;
  margin-top: 15px;
}

/* Fixed sidenav, full height */
.sidenav2 {
  height: 60%;
  top: 180px;
  width: 250px;
  position: fixed;
  z-index: 1;
  left: 0;
  background-color: #08162F;
  overflow-x: hidden;
  padding-top: 20px;
}

/* Style the sidenav links and the dropdown button */
.sidenav2 a, .dropdown-btn2 {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  font-size: 16px;
  color: #818181;
  display: block;
  border: none;
  background: none;
  width:100%;
  text-align: left;
  cursor: pointer;
  outline: none;
}

/* On mouse-over */
.sidenav2 a:hover, .dropdown-btn:hover {
  color: #f1f1f1;
}
  
/* Add an active class to the active dropdown button */
.active2 {
  background-color: green;
  color: white;
}

/* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */
.dropdown-container2 {
  display: none;
  background-color: #262626;
  padding-left: 8px;
}

/* Optional: Style the caret down icon */
.flecha {
  float: right;
  padding-right: 8px;
}

.fa{
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
}

.fa-caret-down:before {
  content: "\f0d7";
}

.d-flex {
  display: flex;
}

.flex-column {
  flex-direction: column;
}

.justify-content-center {
  justify-content: center;
}

.justify-content-start {
  justify-content: start;
}

.align-item-center {
  align-items: center;
}

.color-primary {
  color: #3CABD0;
}

.color-alternative {
  color: #BCBCBC;
}

.color-regular {
  color: #585862;
}

.bold {
  font-weight: bold;
}

.bold {
  font-weight: bold;
}

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

.downloaded_file {
  color: #e70d9a !important;
}

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

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

/*@media (min-width:576px){
  .container{
      max-width:540px
  }
}
@media (min-width:768px){
  .container{
      max-width:720px
  }
}
@media (min-width:992px){
  .container{
      max-width:960px
  }
}
@media (min-width:1200px){
  .container{
      max-width:1140px
  }
}

@media (min-width:576px){
  .col-sm{
      -ms-flex-preferred-size:0;
      flex-basis:0;
      -webkit-box-flex:1;
      -ms-flex-positive:1;
      flex-grow:1;
      max-width:100%
  }
  .col-sm-auto{
      -webkit-box-flex:0;
      -ms-flex:0 0 auto;
      flex:0 0 auto;
      width:auto;
      max-width:none
  }
  .col-sm-1{
      -webkit-box-flex:0;
      -ms-flex:0 0 8.333333%;
      flex:0 0 8.333333%;
      max-width:8.333333%
  }
  .col-sm-2{
      -webkit-box-flex:0;
      -ms-flex:0 0 16.666667%;
      flex:0 0 16.666667%;
      max-width:16.666667%
  }
  .col-sm-3{
      -webkit-box-flex:0;
      -ms-flex:0 0 25%;
      flex:0 0 25%;
      max-width:25%
  }
  .col-sm-4{
      -webkit-box-flex:0;
      -ms-flex:0 0 33.333333%;
      flex:0 0 33.333333%;
      max-width:33.333333%
  }
  .col-sm-5{
      -webkit-box-flex:0;
      -ms-flex:0 0 41.666667%;
      flex:0 0 41.666667%;
      max-width:41.666667%
  }
  .col-sm-6{
      -webkit-box-flex:0;
      -ms-flex:0 0 50%;
      flex:0 0 50%;
      max-width:50%
  }
  .col-sm-7{
      -webkit-box-flex:0;
      -ms-flex:0 0 58.333333%;
      flex:0 0 58.333333%;
      max-width:58.333333%
  }
  .col-sm-8{
      -webkit-box-flex:0;
      -ms-flex:0 0 66.666667%;
      flex:0 0 66.666667%;
      max-width:66.666667%
  }
  .col-sm-9{
      -webkit-box-flex:0;
      -ms-flex:0 0 75%;
      flex:0 0 75%;
      max-width:75%
  }
  .col-sm-10{
      -webkit-box-flex:0;
      -ms-flex:0 0 83.333333%;
      flex:0 0 83.333333%;
      max-width:83.333333%
  }
  .col-sm-11{
      -webkit-box-flex:0;
      -ms-flex:0 0 91.666667%;
      flex:0 0 91.666667%;
      max-width:91.666667%
  }
  .col-sm-12{
      -webkit-box-flex:0;
      -ms-flex:0 0 100%;
      flex:0 0 100%;
      max-width:100%
  }
  .order-sm-first{
      -webkit-box-ordinal-group:0;
      -ms-flex-order:-1;
      order:-1
  }
  .order-sm-last{
      -webkit-box-ordinal-group:14;
      -ms-flex-order:13;
      order:13
  }
  .order-sm-0{
      -webkit-box-ordinal-group:1;
      -ms-flex-order:0;
      order:0
  }
  .order-sm-1{
      -webkit-box-ordinal-group:2;
      -ms-flex-order:1;
      order:1
  }
  .order-sm-2{
      -webkit-box-ordinal-group:3;
      -ms-flex-order:2;
      order:2
  }
  .order-sm-3{
      -webkit-box-ordinal-group:4;
      -ms-flex-order:3;
      order:3
  }
  .order-sm-4{
      -webkit-box-ordinal-group:5;
      -ms-flex-order:4;
      order:4
  }
  .order-sm-5{
      -webkit-box-ordinal-group:6;
      -ms-flex-order:5;
      order:5
  }
  .order-sm-6{
      -webkit-box-ordinal-group:7;
      -ms-flex-order:6;
      order:6
  }
  .order-sm-7{
      -webkit-box-ordinal-group:8;
      -ms-flex-order:7;
      order:7
  }
  .order-sm-8{
      -webkit-box-ordinal-group:9;
      -ms-flex-order:8;
      order:8
  }
  .order-sm-9{
      -webkit-box-ordinal-group:10;
      -ms-flex-order:9;
      order:9
  }
  .order-sm-10{
      -webkit-box-ordinal-group:11;
      -ms-flex-order:10;
      order:10
  }
  .order-sm-11{
      -webkit-box-ordinal-group:12;
      -ms-flex-order:11;
      order:11
  }
  .order-sm-12{
      -webkit-box-ordinal-group:13;
      -ms-flex-order:12;
      order:12
  }
  .offset-sm-0{
      margin-left:0
  }
  .offset-sm-1{
      margin-left:8.333333%
  }
  .offset-sm-2{
      margin-left:16.666667%
  }
  .offset-sm-3{
      margin-left:25%
  }
  .offset-sm-4{
      margin-left:33.333333%
  }
  .offset-sm-5{
      margin-left:41.666667%
  }
  .offset-sm-6{
      margin-left:50%
  }
  .offset-sm-7{
      margin-left:58.333333%
  }
  .offset-sm-8{
      margin-left:66.666667%
  }
  .offset-sm-9{
      margin-left:75%
  }
  .offset-sm-10{
      margin-left:83.333333%
  }
  .offset-sm-11{
      margin-left:91.666667%
  }
}*/
@media (min-width:768px){
  .text-md-right{
    text-align: right !important;
  }
  .col-md{
      -ms-flex-preferred-size:0;
      flex-basis:0;
      -webkit-box-flex:1;
      -ms-flex-positive:1;
      flex-grow:1;
      max-width:100%
  }
  .col-md-auto{
      -webkit-box-flex:0;
      -ms-flex:0 0 auto;
      flex:0 0 auto;
      width:auto;
      max-width:none
  }
  .col-md-1{
      -webkit-box-flex:0;
      -ms-flex:0 0 8.333333%;
      flex:0 0 8.333333%;
      max-width:8.333333%
  }
  .col-md-2{
      -webkit-box-flex:0;
      -ms-flex:0 0 16.666667%;
      flex:0 0 16.666667%;
      max-width:16.666667%
  }
  .col-md-3{
      -webkit-box-flex:0;
      -ms-flex:0 0 25%;
      flex:0 0 25%;
      max-width:25%
  }
  .col-md-4{
      -webkit-box-flex:0;
      -ms-flex:0 0 33.333333%;
      flex:0 0 33.333333%;
      max-width:33.333333%
  }
  .col-md-5{
      -webkit-box-flex:0;
      -ms-flex:0 0 41.666667%;
      flex:0 0 41.666667%;
      max-width:41.666667%
  }
  .col-md-6{
      -webkit-box-flex:0;
      -ms-flex:0 0 50%;
      flex:0 0 50%;
      max-width:50%
  }
  .col-md-7{
      -webkit-box-flex:0;
      -ms-flex:0 0 58.333333%;
      flex:0 0 58.333333%;
      max-width:58.333333%
  }
  .col-md-8{
      -webkit-box-flex:0;
      -ms-flex:0 0 66.666667%;
      flex:0 0 66.666667%;
      max-width:66.666667%
  }
  .col-md-9{
      -webkit-box-flex:0;
      -ms-flex:0 0 75%;
      flex:0 0 75%;
      max-width:75%
  }
  .col-md-10{
      -webkit-box-flex:0;
      -ms-flex:0 0 83.333333%;
      flex:0 0 83.333333%;
      max-width:83.333333%
  }
  .col-md-11{
      -webkit-box-flex:0;
      -ms-flex:0 0 91.666667%;
      flex:0 0 91.666667%;
      max-width:91.666667%
  }
  .col-md-12{
      -webkit-box-flex:0;
      -ms-flex:0 0 100%;
      flex:0 0 100%;
      max-width:100%
  }
  .order-md-first{
      -webkit-box-ordinal-group:0;
      -ms-flex-order:-1;
      order:-1
  }
  .order-md-last{
      -webkit-box-ordinal-group:14;
      -ms-flex-order:13;
      order:13
  }
  .order-md-0{
      -webkit-box-ordinal-group:1;
      -ms-flex-order:0;
      order:0
  }
  .order-md-1{
      -webkit-box-ordinal-group:2;
      -ms-flex-order:1;
      order:1
  }
  .order-md-2{
      -webkit-box-ordinal-group:3;
      -ms-flex-order:2;
      order:2
  }
  .order-md-3{
      -webkit-box-ordinal-group:4;
      -ms-flex-order:3;
      order:3
  }
  .order-md-4{
      -webkit-box-ordinal-group:5;
      -ms-flex-order:4;
      order:4
  }
  .order-md-5{
      -webkit-box-ordinal-group:6;
      -ms-flex-order:5;
      order:5
  }
  .order-md-6{
      -webkit-box-ordinal-group:7;
      -ms-flex-order:6;
      order:6
  }
  .order-md-7{
      -webkit-box-ordinal-group:8;
      -ms-flex-order:7;
      order:7
  }
  .order-md-8{
      -webkit-box-ordinal-group:9;
      -ms-flex-order:8;
      order:8
  }
  .order-md-9{
      -webkit-box-ordinal-group:10;
      -ms-flex-order:9;
      order:9
  }
  .order-md-10{
      -webkit-box-ordinal-group:11;
      -ms-flex-order:10;
      order:10
  }
  .order-md-11{
      -webkit-box-ordinal-group:12;
      -ms-flex-order:11;
      order:11
  }
  .order-md-12{
      -webkit-box-ordinal-group:13;
      -ms-flex-order:12;
      order:12
  }
  .offset-md-0{
      margin-left:0
  }
  .offset-md-1{
      margin-left:8.333333%
  }
  .offset-md-2{
      margin-left:16.666667%
  }
  .offset-md-3{
      margin-left:25%
  }
  .offset-md-4{
      margin-left:33.333333%
  }
  .offset-md-5{
      margin-left:41.666667%
  }
  .offset-md-6{
      margin-left:50%
  }
  .offset-md-7{
      margin-left:58.333333%
  }
  .offset-md-8{
      margin-left:66.666667%
  }
  .offset-md-9{
      margin-left:75%
  }
  .offset-md-10{
      margin-left:83.333333%
  }
  .offset-md-11{
      margin-left:91.666667%
  }
}
@media (min-width:992px){
  .col-lg{
      -ms-flex-preferred-size:0;
      flex-basis:0;
      -webkit-box-flex:1;
      -ms-flex-positive:1;
      flex-grow:1;
      max-width:100%
  }
  .col-lg-auto{
      -webkit-box-flex:0;
      -ms-flex:0 0 auto;
      flex:0 0 auto;
      width:auto;
      max-width:none
  }
  .col-lg-1{
      -webkit-box-flex:0;
      -ms-flex:0 0 8.333333%;
      flex:0 0 8.333333%;
      max-width:8.333333%
  }
  .col-lg-2{
      -webkit-box-flex:0;
      -ms-flex:0 0 16.666667%;
      flex:0 0 16.666667%;
      max-width:16.666667%
  }
  .col-lg-3{
      -webkit-box-flex:0;
      -ms-flex:0 0 25%;
      flex:0 0 25%;
      max-width:25%
  }
  .col-lg-4{
      -webkit-box-flex:0;
      -ms-flex:0 0 33.333333%;
      flex:0 0 33.333333%;
      max-width:33.333333%
  }
  .col-lg-5{
      -webkit-box-flex:0;
      -ms-flex:0 0 41.666667%;
      flex:0 0 41.666667%;
      max-width:41.666667%
  }
  .col-lg-6{
      -webkit-box-flex:0;
      -ms-flex:0 0 50%;
      flex:0 0 50%;
      max-width:50%
  }
  .col-lg-7{
      -webkit-box-flex:0;
      -ms-flex:0 0 58.333333%;
      flex:0 0 58.333333%;
      max-width:58.333333%
  }
  .col-lg-8{
      -webkit-box-flex:0;
      -ms-flex:0 0 66.666667%;
      flex:0 0 66.666667%;
      max-width:66.666667%
  }
  .col-lg-9{
      -webkit-box-flex:0;
      -ms-flex:0 0 75%;
      flex:0 0 75%;
      max-width:75%
  }
  .col-lg-10{
      -webkit-box-flex:0;
      -ms-flex:0 0 83.333333%;
      flex:0 0 83.333333%;
      max-width:83.333333%
  }
  .col-lg-11{
      -webkit-box-flex:0;
      -ms-flex:0 0 91.666667%;
      flex:0 0 91.666667%;
      max-width:91.666667%
  }
  .col-lg-12{
      -webkit-box-flex:0;
      -ms-flex:0 0 100%;
      flex:0 0 100%;
      max-width:100%
  }
  .order-lg-first{
      -webkit-box-ordinal-group:0;
      -ms-flex-order:-1;
      order:-1
  }
  .order-lg-last{
      -webkit-box-ordinal-group:14;
      -ms-flex-order:13;
      order:13
  }
  .order-lg-0{
      -webkit-box-ordinal-group:1;
      -ms-flex-order:0;
      order:0
  }
  .order-lg-1{
      -webkit-box-ordinal-group:2;
      -ms-flex-order:1;
      order:1
  }
  .order-lg-2{
      -webkit-box-ordinal-group:3;
      -ms-flex-order:2;
      order:2
  }
  .order-lg-3{
      -webkit-box-ordinal-group:4;
      -ms-flex-order:3;
      order:3
  }
  .order-lg-4{
      -webkit-box-ordinal-group:5;
      -ms-flex-order:4;
      order:4
  }
  .order-lg-5{
      -webkit-box-ordinal-group:6;
      -ms-flex-order:5;
      order:5
  }
  .order-lg-6{
      -webkit-box-ordinal-group:7;
      -ms-flex-order:6;
      order:6
  }
  .order-lg-7{
      -webkit-box-ordinal-group:8;
      -ms-flex-order:7;
      order:7
  }
  .order-lg-8{
      -webkit-box-ordinal-group:9;
      -ms-flex-order:8;
      order:8
  }
  .order-lg-9{
      -webkit-box-ordinal-group:10;
      -ms-flex-order:9;
      order:9
  }
  .order-lg-10{
      -webkit-box-ordinal-group:11;
      -ms-flex-order:10;
      order:10
  }
  .order-lg-11{
      -webkit-box-ordinal-group:12;
      -ms-flex-order:11;
      order:11
  }
  .order-lg-12{
      -webkit-box-ordinal-group:13;
      -ms-flex-order:12;
      order:12
  }
  .offset-lg-0{
      margin-left:0
  }
  .offset-lg-1{
      margin-left:8.333333%
  }
  .offset-lg-2{
      margin-left:16.666667%
  }
  .offset-lg-3{
      margin-left:25%
  }
  .offset-lg-4{
      margin-left:33.333333%
  }
  .offset-lg-5{
      margin-left:41.666667%
  }
  .offset-lg-6{
      margin-left:50%
  }
  .offset-lg-7{
      margin-left:58.333333%
  }
  .offset-lg-8{
      margin-left:66.666667%
  }
  .offset-lg-9{
      margin-left:75%
  }
  .offset-lg-10{
      margin-left:83.333333%
  }
  .offset-lg-11{
      margin-left:91.666667%
  }
}
@media (min-width:1200px){
  .col-xl{
      -ms-flex-preferred-size:0;
      flex-basis:0;
      -webkit-box-flex:1;
      -ms-flex-positive:1;
      flex-grow:1;
      max-width:100%
  }
  .col-xl-auto{
      -webkit-box-flex:0;
      -ms-flex:0 0 auto;
      flex:0 0 auto;
      width:auto;
      max-width:none
  }
  .col-xl-1{
      -webkit-box-flex:0;
      -ms-flex:0 0 8.333333%;
      flex:0 0 8.333333%;
      max-width:8.333333%
  }
  .col-xl-2{
      -webkit-box-flex:0;
      -ms-flex:0 0 16.666667%;
      flex:0 0 16.666667%;
      max-width:16.666667%
  }
  .col-xl-3{
      -webkit-box-flex:0;
      -ms-flex:0 0 25%;
      flex:0 0 25%;
      max-width:25%
  }
  .col-xl-4{
      -webkit-box-flex:0;
      -ms-flex:0 0 33.333333%;
      flex:0 0 33.333333%;
      max-width:33.333333%
  }
  .col-xl-5{
      -webkit-box-flex:0;
      -ms-flex:0 0 41.666667%;
      flex:0 0 41.666667%;
      max-width:41.666667%
  }
  .col-xl-6{
      -webkit-box-flex:0;
      -ms-flex:0 0 50%;
      flex:0 0 50%;
      max-width:50%
  }
  .col-xl-7{
      -webkit-box-flex:0;
      -ms-flex:0 0 58.333333%;
      flex:0 0 58.333333%;
      max-width:58.333333%
  }
  .col-xl-8{
      -webkit-box-flex:0;
      -ms-flex:0 0 66.666667%;
      flex:0 0 66.666667%;
      max-width:66.666667%
  }
  .col-xl-9{
      -webkit-box-flex:0;
      -ms-flex:0 0 75%;
      flex:0 0 75%;
      max-width:75%
  }
  .col-xl-10{
      -webkit-box-flex:0;
      -ms-flex:0 0 83.333333%;
      flex:0 0 83.333333%;
      max-width:83.333333%
  }
  .col-xl-11{
      -webkit-box-flex:0;
      -ms-flex:0 0 91.666667%;
      flex:0 0 91.666667%;
      max-width:91.666667%
  }
  .col-xl-12{
      -webkit-box-flex:0;
      -ms-flex:0 0 100%;
      flex:0 0 100%;
      max-width:100%
  }
  .order-xl-first{
      -webkit-box-ordinal-group:0;
      -ms-flex-order:-1;
      order:-1
  }
  .order-xl-last{
      -webkit-box-ordinal-group:14;
      -ms-flex-order:13;
      order:13
  }
  .order-xl-0{
      -webkit-box-ordinal-group:1;
      -ms-flex-order:0;
      order:0
  }
  .order-xl-1{
      -webkit-box-ordinal-group:2;
      -ms-flex-order:1;
      order:1
  }
  .order-xl-2{
      -webkit-box-ordinal-group:3;
      -ms-flex-order:2;
      order:2
  }
  .order-xl-3{
      -webkit-box-ordinal-group:4;
      -ms-flex-order:3;
      order:3
  }
  .order-xl-4{
      -webkit-box-ordinal-group:5;
      -ms-flex-order:4;
      order:4
  }
  .order-xl-5{
      -webkit-box-ordinal-group:6;
      -ms-flex-order:5;
      order:5
  }
  .order-xl-6{
      -webkit-box-ordinal-group:7;
      -ms-flex-order:6;
      order:6
  }
  .order-xl-7{
      -webkit-box-ordinal-group:8;
      -ms-flex-order:7;
      order:7
  }
  .order-xl-8{
      -webkit-box-ordinal-group:9;
      -ms-flex-order:8;
      order:8
  }
  .order-xl-9{
      -webkit-box-ordinal-group:10;
      -ms-flex-order:9;
      order:9
  }
  .order-xl-10{
      -webkit-box-ordinal-group:11;
      -ms-flex-order:10;
      order:10
  }
  .order-xl-11{
      -webkit-box-ordinal-group:12;
      -ms-flex-order:11;
      order:11
  }
  .order-xl-12{
      -webkit-box-ordinal-group:13;
      -ms-flex-order:12;
      order:12
  }
  .offset-xl-0{
      margin-left:0
  }
  .offset-xl-1{
      margin-left:8.333333%
  }
  .offset-xl-2{
      margin-left:16.666667%
  }
  .offset-xl-3{
      margin-left:25%
  }
  .offset-xl-4{
      margin-left:33.333333%
  }
  .offset-xl-5{
      margin-left:41.666667%
  }
  .offset-xl-6{
      margin-left:50%
  }
  .offset-xl-7{
      margin-left:58.333333%
  }
  .offset-xl-8{
      margin-left:66.666667%
  }
  .offset-xl-9{
      margin-left:75%
  }
  .offset-xl-10{
      margin-left:83.333333%
  }
  .offset-xl-11{
      margin-left:91.666667%
  }
}
/*
@media (max-width:575.98px){
  .table-responsive-sm{
      display:block;
      width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      -ms-overflow-style:-ms-autohiding-scrollbar
  }
  .table-responsive-sm>.table-bordered{
      border:0
  }
}
@media (max-width:767.98px){
  .table-responsive-md{
      display:block;
      width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      -ms-overflow-style:-ms-autohiding-scrollbar
  }
  .table-responsive-md>.table-bordered{
      border:0
  }
}
@media (max-width:991.98px){
  .table-responsive-lg{
      display:block;
      width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      -ms-overflow-style:-ms-autohiding-scrollbar
  }
  .table-responsive-lg>.table-bordered{
      border:0
  }
}
@media (max-width:1199.98px){
  .table-responsive-xl{
      display:block;
      width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      -ms-overflow-style:-ms-autohiding-scrollbar
  }
  .table-responsive-xl>.table-bordered{
      border:0
  }
}

@media (min-width:576px){
  .d-sm-none{
      display:none!important
  }
  .d-sm-inline{
      display:inline!important
  }
  .d-sm-inline-block{
      display:inline-block!important
  }
  .d-sm-block{
      display:block!important
  }
  .d-sm-table{
      display:table!important
  }
  .d-sm-table-row{
      display:table-row!important
  }
  .d-sm-table-cell{
      display:table-cell!important
  }
  .d-sm-flex{
      display:-webkit-box!important;
      display:-ms-flexbox!important;
      display:flex!important
  }
  .d-sm-inline-flex{
      display:-webkit-inline-box!important;
      display:-ms-inline-flexbox!important;
      display:inline-flex!important
  }
}
@media (min-width:768px){
  .d-md-none{
      display:none!important
  }
  .d-md-inline{
      display:inline!important
  }
  .d-md-inline-block{
      display:inline-block!important
  }
  .d-md-block{
      display:block!important
  }
  .d-md-table{
      display:table!important
  }
  .d-md-table-row{
      display:table-row!important
  }
  .d-md-table-cell{
      display:table-cell!important
  }
  .d-md-flex{
      display:-webkit-box!important;
      display:-ms-flexbox!important;
      display:flex!important
  }
  .d-md-inline-flex{
      display:-webkit-inline-box!important;
      display:-ms-inline-flexbox!important;
      display:inline-flex!important
  }
}
@media (min-width:992px){
  .d-lg-none{
      display:none!important
  }
  .d-lg-inline{
      display:inline!important
  }
  .d-lg-inline-block{
      display:inline-block!important
  }
  .d-lg-block{
      display:block!important
  }
  .d-lg-table{
      display:table!important
  }
  .d-lg-table-row{
      display:table-row!important
  }
  .d-lg-table-cell{
      display:table-cell!important
  }
  .d-lg-flex{
      display:-webkit-box!important;
      display:-ms-flexbox!important;
      display:flex!important
  }
  .d-lg-inline-flex{
      display:-webkit-inline-box!important;
      display:-ms-inline-flexbox!important;
      display:inline-flex!important
  }
}
@media (min-width:1200px){
  .d-xl-none{
      display:none!important
  }
  .d-xl-inline{
      display:inline!important
  }
  .d-xl-inline-block{
      display:inline-block!important
  }
  .d-xl-block{
      display:block!important
  }
  .d-xl-table{
      display:table!important
  }
  .d-xl-table-row{
      display:table-row!important
  }
  .d-xl-table-cell{
      display:table-cell!important
  }
  .d-xl-flex{
      display:-webkit-box!important;
      display:-ms-flexbox!important;
      display:flex!important
  }
  .d-xl-inline-flex{
      display:-webkit-inline-box!important;
      display:-ms-inline-flexbox!important;
      display:inline-flex!important
  }
}*/

.btn {
  display: inline-block;
  font-weight: 400;
  color: #212529;
  text-align: center;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: 0.25rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  cursor: pointer;
}

.btn:focus {
  outline: none;
}

.btn-primary {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

.btn-primary:hover {
  color: #fff;
  background-color: #0069d9;
  border-color: #0062cc;
}

.btn-primary:focus, .btn-primary.focus {
  color: #fff;
  background-color: #0069d9;
  border-color: #0062cc;
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}

.btn-primary.disabled, .btn-primary:disabled {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #0062cc;
  border-color: #005cbf;
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}

.btn-outline {
  border: 0.15rem solid #3CABD0;
  color: #3CABD0;
  font-size: 0.8rem;
  font-weight: bold;
  padding: 1rem 2rem;
}

.btn-audio {
  background-image: url("/images/icon-audio.svg");
}

.btn-download:before {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  background-image: url("/images/icon-download.svg");
}

.btn-download-secondary:before {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-right: 0.5rem;
  background-image: url("/images/icon-download-w.svg");
}

.btn-download {
  color: #3CABD0;
}

.btn-download-secondary {
  color: #ffffff;
  background-color: #3CABD0;
}

.btn-pending {
  color: #F46066;
}

.btn-pending:before {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  background-image: url("/images/icon-pending.svg");
}

.btn-trash,
.btn-danger,
.btn-warning,
.btn-audio-play,
.btn-audio-stop,
.btn-audio {
  width: 1.6rem;
  height: 1.6rem;
  background-repeat: no-repeat;
  background-position: center center;
}

.btn-success {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

.btn-success:hover {
  color: #fff;
  background-color: #218838;
  border-color: #1e7e34;
}

.btn-success:focus, .btn-success.focus {
  color: #fff;
  background-color: #218838;
  border-color: #1e7e34;
  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
}

.btn-success.disabled, .btn-success:disabled {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
  color: #fff;
  background-color: #1e7e34;
  border-color: #1c7430;
}

.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-success.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
}

.btn-secondary {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.btn-secondary:hover {
  color: #fff;
  background-color: #5a6268;
  border-color: #545b62;
}

.btn-secondary:focus, .btn-secondary.focus {
  color: #fff;
  background-color: #5a6268;
  border-color: #545b62;
  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
}

.btn-secondary.disabled, .btn-secondary:disabled {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
  color: #fff;
  background-color: #545b62;
  border-color: #4e555b;
}

.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
}

.btn-confirm-audio:before {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-right: 0.2rem;
  background-image: url("/images/icon-confirm.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.btn-reject-qc {
  color: #c1c33c;
}

.btn-reject-audio:before {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-right: 0.2rem;
  background-image: url("/images/icon-reject.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.btn-pending-send-audio:before {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-right: 0.2rem;
  background-image: url("/images/icon-pending-send-audio.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.btn-success-send-audio:before {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-right: 0.2rem;
  background-image: url("/images/icon-success-send-audio.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.btn-upload-audio:before {
  content: "";
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-right: 0.2rem;
  background-image: url("/images/icon-upload-audio.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.btn-edit-audio:before {
  content: "";
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 0.2rem;
  background-image: url("/images/icon-edit-audio.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.btn-accepted:before {
  content: "";
  display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  margin-right: 0.2rem;
  background-image: url("/images/accepted.svg");
  background-repeat: no-repeat;
  background-position: center;
}

.btn-rejected:before {
  content: "";
  display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  margin-right: 0.2rem;
  background-image: url("/images/rejected.svg");
  background-repeat: no-repeat;
  background-position: center;
}

.btn-reject-audio,
.btn-confirm-audio,
.btn-pending-send-audio,
.btn-success-send-audio,
.btn-upload-audio,
.btn-edit-audio,
.btn-accepted,
.btn-rejected {
  display: flex;
  align-items: baseline;
}

.btn-upload-audio {
  color: #3CABD0;
  border: 2px solid #3CABD0;
  border-radius: 10px;
  padding: 0.4rem 1.2rem;
}

.btn-accepted {
  color: #ffffff;
  background-color: #3CABD0;
  font-weight: 600;
  align-items: center;
}

.btn-rejected {
  color: #3CABD0;
  background-color: #ffffff;
  font-weight: 600;
  align-items: center;
}

.btn-confirm-audio {
  color: #FF8024;
  font-weight: bold;
  font-size: 0.9rem;
}

.btn-reject-audio {
  color: #F46066;
}

.btn-pending-send-audio {
  color: #00BB4B;
}

.btn-success-send-audio {
  color: #06CCAB;
  text-decoration: underline;
}

.btn-trash {
  background-image: url("/images/icon-trash.svg");
}

.btn-danger {
  background-image: url("/images/icon-danger.svg");
}

.btn-warning {
  background-image: url("/images/icon-warning.svg");
}

.btn-audio-play {
  background-image: url("/images/icon-audio-play.svg");
}

.btn-audio-stop {
  background-image: url("/images/icon-audio-stop.svg");
}

.btn-icon {
  font-size: 1.35rem;
  color: #3CABD0;
  display: flex;
  align-items: center;
}

.btn-info {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

.btn-info:hover {
  color: #fff;
  background-color: #138496;
  border-color: #117a8b;
}

.btn-info:focus, .btn-info.focus {
  color: #fff;
  background-color: #138496;
  border-color: #117a8b;
  box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5);
}

.btn-info.disabled, .btn-info:disabled {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active,
.show > .btn-info.dropdown-toggle {
  color: #fff;
  background-color: #117a8b;
  border-color: #10707f;
}

.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus,
.show > .btn-info.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5);
}

.btn-warning {
  color: #212529;
  background-color: #ffc107;
  border-color: #ffc107;
}

.btn-warning:hover {
  color: #212529;
  background-color: #e0a800;
  border-color: #d39e00;
}

.btn-warning:focus, .btn-warning.focus {
  color: #212529;
  background-color: #e0a800;
  border-color: #d39e00;
  box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5);
}

.btn-warning.disabled, .btn-warning:disabled {
  color: #212529;
  background-color: #ffc107;
  border-color: #ffc107;
}

.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active,
.show > .btn-warning.dropdown-toggle {
  color: #212529;
  background-color: #d39e00;
  border-color: #c69500;
}

.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus,
.show > .btn-warning.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5);
}

.btn-danger {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}

.btn-danger:hover {
  color: #fff;
  background-color: #c82333;
  border-color: #bd2130;
}

.btn-danger:focus, .btn-danger.focus {
  color: #fff;
  background-color: #c82333;
  border-color: #bd2130;
  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}

.btn-danger.disabled, .btn-danger:disabled {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}

.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active,
.show > .btn-danger.dropdown-toggle {
  color: #fff;
  background-color: #bd2130;
  border-color: #b21f2d;
}

.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus,
.show > .btn-danger.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}

.badge {
  display: inline-block;
  padding: 0.25em 0.4em;
  font-size: 90%;
  font-weight: 300;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 0.25rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.badge:empty{
  display:none
}

.btn .badge{
  position:relative;
  top:-1px
}

@media (prefers-reduced-motion: reduce) {
  .badge {
    transition: none;
  }
}

a.badge:hover, a.badge:focus {
  text-decoration: none;
}

.badge:empty {
  display: none;
}

.btn .badge {
  position: relative;
  top: -1px;
}

.badge-pill {
  padding-right: 0.6em;
  padding-left: 0.6em;
  border-radius: 10rem;
}

.badge-primary {
  color: #fff;
  background-color: #007bff;
}

a.badge-primary:hover, a.badge-primary:focus {
  color: #fff;
  background-color: #0062cc;
}

a.badge-primary:focus, a.badge-primary.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.badge-secondary {
  color: #fff;
  background-color: #6c757d;
}

a.badge-secondary:hover, a.badge-secondary:focus {
  color: #fff;
  background-color: #545b62;
}

a.badge-secondary:focus, a.badge-secondary.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
}

.badge-success {
  color: #fff;
  background-color: #28a745;
}

a.badge-success:hover, a.badge-success:focus {
  color: #fff;
  background-color: #1e7e34;
}

a.badge-success:focus, a.badge-success.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}

.badge-info {
  color: #fff;
  background-color: #17a2b8;
}

a.badge-info:hover, a.badge-info:focus {
  color: #fff;
  background-color: #117a8b;
}

a.badge-info:focus, a.badge-info.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
}

.badge-warning {
  color: #212529;
  background-color: #ffc107;
}

a.badge-warning:hover, a.badge-warning:focus {
  color: #212529;
  background-color: #d39e00;
}

a.badge-warning:focus, a.badge-warning.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
}

.badge-danger {
  color: #fff;
  background-color: #dc3545;
}

a.badge-danger:hover, a.badge-danger:focus {
  color: #fff;
  background-color: #bd2130;
}

a.badge-danger:focus, a.badge-danger.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}

.badge-light {
  color: #212529;
  background-color: #f8f9fa;
}

a.badge-light:hover, a.badge-light:focus {
  color: #212529;
  background-color: #dae0e5;
}

a.badge-light:focus, a.badge-light.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
}

.badge-dark {
  color: #fff;
  background-color: #343a40;
}

a.badge-dark:hover, a.badge-dark:focus {
  color: #fff;
  background-color: #1d2124;
}

a.badge-dark:focus, a.badge-dark.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
}

.jumbotron {
  padding: 2rem 1rem;
  margin-bottom: 2rem;
  background-color: #e9ecef;
  border-radius: 0.3rem;
}

.rounded-pill {
  border-radius: 50rem !important;
}

.text-bg-success {
  color: #fff!important;
  background-color: #198754 !important;
}

.text-bg-danger {
  color: #fff!important;
  background-color: #cf1212 !important;
}



.modal {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
  background-color: rgba(0, 0, 0, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal__container {
  background-color: white;
  width: 500px;
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  border-radius: 0.5rem;
  padding: 1rem;
  position: relative;
}

.modal__body {
  text-align: center;
}

.modal__close {
  background-color: white;
  position: absolute;
  right: -10px;
  top: -10px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid #585862;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.modal__active {
  pointer-events: initial;
  opacity: 1;
}

.form-control {
  display: block;
  width: 100%;
  height: calc(1.5em + .75rem + 2px);
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: normal;
  line-height: 1.5;
  color: #585862;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  transition: borde;
}

/* The container-check */

.container-check {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */

.container-check input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  border: 2px solid #3CABD0;
  border-radius: 20%;
}

/* On mouse-over, add a grey background color */

.container-check:hover input ~ .checkmark {
  background-color: #ffffff;
}

/* When the checkbox is checked, add a blue background */

.container-check input:checked ~ .checkmark {
  background-color: #ffffff;
}

/* Create the checkmark/indicator (hidden when not checked) */

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */

.container-check input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */

.container-check .checkmark:after {
  left: 6px;
  top: 3px;
  width: 5px;
  height: 10px;
  border: solid #3CABD0;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

/*
@import '~bootstrap/scss/bootstrap';
*/

*,
*:after,
*:before {
  box-sizing: border-box;
  margin: 0;
}

* a {
  text-decoration: none;
}

.container {
  color: #ffffff;
  display: grid;
  min-height: 100vh;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 5rem auto 10%;
  grid-template-areas: "header header header header" " main main  main main" " footer footer footer footer";
  font-family: "Rubik", sans-serif;
}

.header {
  grid-area: header;
  height: 100%;
}

.main {
  grid-area: main;
}

footer {
  grid-area: footer;
  text-align: center;
  margin: 1rem 0;
  color: #585862;
  font-family: "Rubik", sans-serif;
}

.header,
.main,
footer {
  padding: 0 3rem;
}

.main-logo {
  height: 4rem;
}

.header {
  font-size: 0.8rem;
}

header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background-color: #08162F;
  font-size: 0.9rem;
}

.nav ul,
.nav-user ul,
.nav,
.nav-user {
  display: flex;
  align-items: center;
}

.nav_item {
  margin: 0 2rem;
  list-style: none;
}

.nav_item a {
  color: #3CABD0;
}

.active a {
  color: #ffffff;
  font-weight: bold;
}

.nav_item a {
  text-decoration: none;
}

.nav ul {
  justify-content: flex-start;
  padding: 0;
}

.nav-user {
  justify-content: flex-end;
}

.nav_item__close-session {
  padding: 0.7rem 1rem;
  font-family: "Rubik", sans-serif;
  width: auto;
  color: #08162F !important;
  background-color: #3CABD0;
  font-size: 0.8rem;
  border-radius: 0.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 500;
}

.nav_item__close-session img {
  margin-right: 0.5rem;
}

.main {
  padding-top: 2rem;
  color: #585862;
}

.main .main_greeting {
  color: #3CABD0;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  text-align: center;
  height: 5rem;
  width: 100%;
}

.main .main_greeting .main_greeting_sub_title {
  color: #4E5057;
}

.main .main_content {
  width: 100%;
  height: 100%;
}

.form-send {
  height: 7rem;
}

.form-send .form-group {
  margin: 0 1.5rem;
  /*width: 25%;*/
}

.form-send .form-group:first-child {
  margin-left: 0;
}

.form-group label {
  display: block;
  margin-bottom: 0.2rem;
}

.col-auto {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: auto;
  max-width: 100%;
  padding: 15px 10px 0 0;
}

.pb-3, .py-3 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.form-inline .form-group {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 0;
}

.upload {
  height: 13rem;
  border: dotted 0.1rem #3CABD0;
  cursor: pointer;
}

.upload_description_message {
  font-size: 0.8rem;
}

.upload-footer {
  margin: 1rem 0;
}

.list-upload {
  margin: 2rem 0;
  width: 100%;
}

.container-table {
  padding: 1.5rem;
  position: relative;
  margin: 0 -1.5rem 1rem;
  border: solid #dee2e6;
  border-width: 1px 0;
}

table{
  border-collapse:collapse
}

.table{
  width:100%;
  max-width:100%;
  margin-bottom:1rem;
  background-color:transparent
}
.table td,.table th{
  padding:.75rem;
  vertical-align:top;
  border-top:1px solid #dee2e6
}
.table thead th{
  vertical-align:bottom;
  border-bottom:2px solid #dee2e6
}
.table tbody+tbody{
  border-top:2px solid #dee2e6
}
.table .table{
  background-color:#fff
}
.table-sm td,.table-sm th{
  padding:.3rem
}
.table-bordered{
  border:1px solid #dee2e6
}
.table-bordered td,.table-bordered th{
  border:1px solid #dee2e6
}
.table-bordered thead td,.table-bordered thead th{
  border-bottom-width:2px
}
.table-striped tbody tr:nth-of-type(odd){
  background-color:rgba(0,0,0,.05)
}
.table-hover tbody tr:hover{
  background-color:rgba(0,0,0,.075)
}
.table-primary,.table-primary>td,.table-primary>th{
  background-color:#b8daff
}
.table-hover .table-primary:hover{
  background-color:#9fcdff
}
.table-hover .table-primary:hover>td,.table-hover .table-primary:hover>th{
  background-color:#9fcdff
}
.table-secondary,.table-secondary>td,.table-secondary>th{
  background-color:#d6d8db
}
.table-hover .table-secondary:hover{
  background-color:#c8cbcf
}
.table-hover .table-secondary:hover>td,.table-hover .table-secondary:hover>th{
  background-color:#c8cbcf
}
.table-success,.table-success>td,.table-success>th{
  background-color:#c3e6cb
}
.table-hover .table-success:hover{
  background-color:#b1dfbb
}
.table-hover .table-success:hover>td,.table-hover .table-success:hover>th{
  background-color:#b1dfbb
}
.table-info,.table-info>td,.table-info>th{
  background-color:#bee5eb
}
.table-hover .table-info:hover{
  background-color:#abdde5
}
.table-hover .table-info:hover>td,.table-hover .table-info:hover>th{
  background-color:#abdde5
}
.table-warning,.table-warning>td,.table-warning>th{
  background-color:#ffeeba
}
.table-hover .table-warning:hover{
  background-color:#ffe8a1
}
.table-hover .table-warning:hover>td,.table-hover .table-warning:hover>th{
  background-color:#ffe8a1
}
.table-danger,.table-danger>td,.table-danger>th{
  background-color:#f5c6cb
}
.table-hover .table-danger:hover{
  background-color:#f1b0b7
}
.table-hover .table-danger:hover>td,.table-hover .table-danger:hover>th{
  background-color:#f1b0b7
}
.table-light,.table-light>td,.table-light>th{
  background-color:#fdfdfe
}
.table-hover .table-light:hover{
  background-color:#ececf6
}
.table-hover .table-light:hover>td,.table-hover .table-light:hover>th{
  background-color:#ececf6
}
.table-dark,.table-dark>td,.table-dark>th{
  background-color:#c6c8ca
}
.table-hover .table-dark:hover{
  background-color:#b9bbbe
}
.table-hover .table-dark:hover>td,.table-hover .table-dark:hover>th{
  background-color:#b9bbbe
}
.table-active,.table-active>td,.table-active>th{
  background-color:rgba(0,0,0,.075)
}
.table-hover .table-active:hover{
  background-color:rgba(0,0,0,.075)
}
.table-hover .table-active:hover>td,.table-hover .table-active:hover>th{
  background-color:rgba(0,0,0,.075)
}
.table .thead-dark th{
  color:#fff;
  background-color:#212529;
  border-color:#32383e
}
.table .thead-light th{
  color:#495057;
  background-color:#e9ecef;
  border-color:#dee2e6
}
.table-dark{
  color:#fff;
  background-color:#212529
}
.table-dark td,.table-dark th,.table-dark thead th{
  border-color:#32383e
}
.table-dark.table-bordered{
  border:0
}
.table-dark.table-striped tbody tr:nth-of-type(odd){
  background-color:rgba(255,255,255,.05)
}
.table-dark.table-hover tbody tr:hover{
  background-color:rgba(255,255,255,.075)
}
@media (max-width:575.98px){
  .table-responsive-sm{
      display:block;
      width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      -ms-overflow-style:-ms-autohiding-scrollbar
  }
  .table-responsive-sm>.table-bordered{
      border:0
  }
}
@media (max-width:767.98px){
  .table-responsive-md{
      display:block;
      width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      -ms-overflow-style:-ms-autohiding-scrollbar
  }
  .table-responsive-md>.table-bordered{
      border:0
  }
}
@media (max-width:991.98px){
  .table-responsive-lg{
      display:block;
      width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      -ms-overflow-style:-ms-autohiding-scrollbar
  }
  .table-responsive-lg>.table-bordered{
      border:0
  }
}
@media (max-width:1199.98px){
  .table-responsive-xl{
      display:block;
      width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      -ms-overflow-style:-ms-autohiding-scrollbar
  }
  .table-responsive-xl>.table-bordered{
      border:0
  }
}
.table-responsive{
  display:block;
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  -ms-overflow-style:-ms-autohiding-scrollbar
}
.table-responsive>.table-bordered{
  border:0
}

.audio_player_description button {
  margin-right: 0.5rem;
}

.audio_player_description {
  display: flex;
  align-items: center;
}

.audio_player_description .audio_name {
  font-size: 1rem;
  color: #585862;
}

.audio_player_description .audio_link {
  display: block;
}

.audio_player_description .audio_date {
  font-size: 0.9rem;
  color: #B0BACF;
}

.swal2-container {
  font-family: "Rubik", sans-serif;
}

.swal2-container .content .main-content .btn {
  display: inline-block;
}

.swal2-container .cancel-button {
  background-color: white !important;
  color: var(--primary-color) !important;
  border: 1px solid var(--primary-color) !important;
}

.swal2-title {
  color: #3CABD0 !important;
}

.swal2-actions button {
  background-color: #3CABD0 !important;
}

.swal2-content {
  color: #4E5057 !important;
}

.form-translate {
  height: 5rem;
}

.list-group-audio {
  width: 100%;
  border: 2px solid #3CABD0;
  border-radius: 10px;
  padding: 1rem 3rem;
  margin: 1.5rem 0;
}

.list-group-audio .form-remember {
  margin-bottom: 1rem;
}

.result {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  justify-content: center;
  align-items: center;
  text-align: center;
}

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

.result h1 {
  color: #3CABD0;
}

.result p {
  width: 50rem;
}

.result h1,
.result p,
.result button {
  margin: 0.8rem 0;
}