.compromisocategorias a:link, .compromisocategorias a:visited {
  color: #fff;
  text-decoration: none;
}
.compromisocategorias a:hover, .compromisocategorias a:active {
  color: #fff;
  text-decoration: none;
}

.compromisocategoria {
  float: left;
}

.compromisocategoriatexto {
  float: left;
}

.compromisocategoriacategorias {
  background-image: url("../img2020/actores/categorias.1.png");
  background-repeat: no-repeat;
}

.compromisocategoriacategorias.active {
  background-image: url("../img2020/actores/categorias.0.png");
  background-repeat: no-repeat;
}

.compromisocategoriaoferta {
  background-image: url("../img2020/actores/oferta.1.png");
  background-repeat: no-repeat;
}

.compromisocategoriaoferta.active {
  background-image: url("../img2020/actores/oferta.0.png");
  background-repeat: no-repeat;
}

.compromisocategoriaflotas {
  background-image: url("../img2020/actores/flotas.1.png");
  background-repeat: no-repeat;
}

.compromisocategoriaflotas.active {
  background-image: url("../img2020/actores/flotas.0.png");
  background-repeat: no-repeat;
}

.compromisocategoriaestaciones {
  background-image: url("../img2020/actores/estaciones.1.png");
  background-repeat: no-repeat;
}

.compromisocategoriaestaciones.active {
  background-image: url("../img2020/actores/estaciones.0.png");
  background-repeat: no-repeat;
}

.compromisocategoriainvestigacion {
  background-image: url("../img2020/actores/investigacion.1.png");
  background-repeat: no-repeat;
}

.compromisocategoriainvestigacion.active {
  background-image: url("../img2020/actores/investigacion.0.png");
  background-repeat: no-repeat;
}

.compromisocategoriafinanciamiento {
  background-image: url("../img2020/actores/financiamiento.1.png");
  background-repeat: no-repeat;
}

.compromisocategoriafinanciamiento.active {
  background-image: url("../img2020/actores/financiamiento.0.png");
  background-repeat: no-repeat;
}

.compromisocategoriadesarrollo {
  background-image: url("../img2020/actores/desarrollo.1.png");
  background-repeat: no-repeat;
}

.compromisocategoriadesarrollo.active {
  background-image: url("../img2020/actores/desarrollo.0.png");
  background-repeat: no-repeat;
}

.compromisocategoriacategorias {
  background-size: 176px;
  border-bottom: 1px solid #E1E1E1;
}

.compromisocategoriacategorias.active {
  background-size: 176px;
  border-bottom: 1px solid #E1E1E1;
}

.compromisoportada {
  float: left;
  background-color: #fff;
}

.compromisodecoracionizquierda {
  float: left;
  border-left: 1px solid #355c95;
  border-bottom: 1px solid #355c95;
}

.compromisotextoacciones {
  float: left;
  color: #355c95;
  font-weight: bold;
}

.compromisodecoracionderecha {
  float: left;
  border-right: 1px solid #355c95;
  border-bottom: 1px solid #355c95;
}

.compromisocolumnaizquierda {
  float: left;
  color: #40678e;
}

.compromisotituloizquierdo {
  text-transform: uppercase;
  font-weight: bold;
  color: #40678e;
}

.compromisocolumnaderecha {
  float: left;
  color: #5e5a57;
  background-color: #eff1f0;
}

.compromisofotogrupo {
  float: left;
  background-size: contain;
  border-bottom: 5px solid #eff1f0;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 1;
}

.compromisointerior {
  float: left;
  background-color: #fff;
}

.compromisointeriorcolumna {
  float: left;
  width: 50%;
}

.compromisointeriortitulo {
  text-transform: uppercase;
  font-weight: bold;
  color: #2666a6;
}

.compromisoactor {
  float: left;
  border-bottom: 1px dotted #2666a6;
}

.compromisologogris {
  float: left;
}

.compromisologogris .anio-compromiso {
  cursor: pointer;
  color: #939496;
}
.compromisologogris .anio-compromiso.active {
  color: #2666a6 !important;
}

.compromisoactornombre {
  float: left;
  font-weight: bold;
  color: #2666a6;
  overflow: hidden;
}

.compromisoactortexto {
  float: left;
  color: #2666a6;
  overflow: hidden;
  min-height: 120px;
}
.compromisoactortexto a.vermas {
  color: #939496;
}

.col-compromiso-col {
  border-bottom: 1px dotted #2666a6;
  width: 100%;
  float: left;
  height: 320px;
  padding-bottom: 10px;
}

@media (max-width: 380px) {
  .compromisocategoriatexto {
    width: 68%;
    height: 30px;
    margin: 15px 0 0 70px;
    font-size: 15px;
    text-align: left;
  }
}
@media (max-width: 767.98px) {
  .compromisocategoriacategoriassmall {
    background-image: url("../img2020/actores/categorias.2.png");
    background-repeat: no-repeat;
    background-size: 500px;
  }
  .compromisocategoriaofertasmall {
    background-image: url("../img2020/actores/oferta.2.png");
    background-repeat: no-repeat;
    background-size: 500px;
  }
  .compromisocategoriaflotassmall {
    background-image: url("../img2020/actores/flotas.2.png");
    background-repeat: no-repeat;
    background-size: 500px;
  }
  .compromisocategoriaestacionessmall {
    background-image: url("../img2020/actores/estaciones.2.png");
    background-repeat: no-repeat;
    background-size: 500px;
  }
  .compromisocategoriainvestigacionsmall {
    background-image: url("../img2020/actores/investigacion.2.png");
    background-repeat: no-repeat;
    background-size: 500px;
  }
  .compromisocategoriafinanciamientosmall {
    background-image: url("../img2020/actores/financiamiento.2.png");
    background-repeat: no-repeat;
    background-size: 500px;
  }
  .compromisocategoriadesarrollosmall {
    background-image: url("../img2020/actores/desarrollo.2.png");
    background-repeat: no-repeat;
    background-size: 500px;
  }
  .compromisocategoriacategoriassmall {
    background-color: #fff;
    border-bottom: 1px dotted #2666a6;
  }
  .compromisocategoriaofertasmall {
    background-color: #2B5EA0;
  }
  .compromisocategoriaflotassmall {
    background-color: #0E446A;
  }
  .compromisocategoriaestacionessmall {
    background-color: #EC681B;
  }
  .compromisocategoriainvestigacionsmall {
    background-color: #FAB426;
  }
  .compromisocategoriafinanciamientosmall {
    background-color: #C84748;
  }
  .compromisocategoriadesarrollosmall {
    background-color: #EA5254;
  }
  .compromisocategoriatexto {
    width: 68%;
    height: 30px;
    margin: 15px 0 0 100px;
    font-size: 15px;
    text-align: left;
  }
  .compromisoportada {
    width: 100%;
  }
  .compromisotituloizquierdo {
    margin: 5px 0 10px;
  }
  .compromisocolumnaizquierda {
    padding: 15px;
    font-size: 14px;
    line-height: 17px;
  }
  .compromisocolumnaderecha {
    min-height: 300px;
    padding: 15px;
    font-size: 14px;
    line-height: 17px;
  }
  .compromisofotogrupo {
    width: 100%;
    height: 170px;
    margin: -100px 0 0;
    z-index: 1;
  }
  .compromisointerior {
    width: 100%;
  }
  .compromisointeriortitulo {
    font-size: 18px;
    padding: 40px 0 30px 20px;
  }
  .compromisoactor {
    width: 100%;
    margin: 0;
    padding-bottom: 0;
  }
  .compromisologogris {
    margin: 0;
  }
  .compromisologogris img {
    width: 130px;
    height: 130px;
  }
  .compromisoactornombre {
    font-size: 15px;
    width: 100%;
    margin: 20px 0 0;
  }
  .compromisoactortexto {
    font-size: 14px;
    width: 100%;
    margin: 10px 0 0;
  }
  .compromisoactortexto a.vermas {
    font-size: 10px;
    line-height: 20px;
  }
  .compromisoactortextoalto {
    min-height: 120px;
  }
  .col-compromiso-col {
    height: 400px;
  }
  .text-collapse {
    text-overflow: ellipsis;
    overflow: hidden;
    max-height: 195px;
  }
  .container-actores {
    display: none;
  }
  .containersmall {
    display: block;
  }
  .compromisocategoria {
    width: 100%;
    height: 67px;
    background-size: contain;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .containersmall {
    display: none;
  }
  .container-actores {
    display: block;
  }
  .compromisocategoria {
    width: 102px;
    height: 74px;
    background-size: contain;
  }
  .compromisocategoriatexto {
    width: 100px;
    height: 30px;
    margin: 50px 0 0;
    font-size: 8px;
    line-height: 10px;
    text-align: center;
  }
  .compromisoportada {
    width: 713px;
  }
  .compromisodecoracionizquierda {
    width: 90px;
    height: 20px;
    margin: 10px 0 0 140px;
  }
  .compromisodecoracionderecha {
    width: 80px;
    height: 20px;
    margin: 10px 0 0 5px;
  }
  .compromisotextoacciones {
    width: 350px;
    font-size: 12px;
    margin: 25px 0 0 5px;
  }
  .compromisocolumnaizquierda {
    width: 250px;
    margin: 30px 0 0 25px;
  }
  .compromisotituloizquierdo {
    width: 100%;
    font-size: 16px;
    margin: 0 0 10px;
  }
  .compromisocolumnaderecha {
    width: 350px;
    min-height: 330px;
    margin: 30px 0 0 35px;
    padding: 20px;
  }
  .compromisofotogrupo {
    width: 717px;
    height: 229px;
    margin: 0;
    z-index: 1;
  }
  .compromisointerior {
    width: 713px;
  }
  .compromisointeriortitulo {
    font-size: 16px;
    padding: 40px 0 30px 35px;
  }
  .compromisoactor {
    width: 315px;
    margin: 0 0 0 35px;
    padding-bottom: 0;
  }
  .compromisologogris {
    margin: 0;
  }
  .compromisologogris img {
    width: 70px;
    height: 70px;
  }
  .compromisoactornombre {
    font-size: 10px;
    width: 235px;
    margin: 20px 0 0 10px;
  }
  .compromisoactortexto {
    font-size: 12px;
    width: 220px;
    margin: 10px 0 0 10px;
    min-height: 130px !important;
  }
  .compromisoactortexto a.vermas {
    font-size: 10px;
    line-height: 20px;
  }
  .compromisoactortextoalto {
    min-height: 100px;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .containersmall {
    display: none;
  }
  .container-actores {
    display: block;
  }
  .compromisocategoria {
    width: 134px;
    height: 98px;
    background-size: contain;
  }
  .compromisocategoriatexto {
    width: 140px;
    height: 30px;
    margin: 70px 0 0;
    font-size: 11px;
    line-height: 12px;
    text-align: center;
  }
  .compromisoportada {
    width: 958px;
  }
  .compromisodecoracionizquierda {
    width: 140px;
    height: 20px;
    margin: 10px 0 0 180px;
  }
  .compromisodecoracionderecha {
    width: 150px;
    height: 20px;
    margin: 10px 0 0 5px;
  }
  .compromisotextoacciones {
    width: 410px;
    font-size: 14px;
    margin: 25px 0 0 5px;
  }
  .compromisocolumnaizquierda {
    width: 300px;
    margin: 30px 0 0 35px;
  }
  .compromisotituloizquierdo {
    width: 100%;
    font-size: 16px;
    margin: 0 0 10px;
  }
  .compromisocolumnaderecha {
    width: 490px;
    min-height: 250px;
    margin: 30px 0 0 35px;
    padding: 20px;
  }
  .compromisofotogrupo {
    width: 954px;
    height: 304px;
    margin: 0;
    z-index: 1;
  }
  .compromisointerior {
    width: 958px;
  }
  .compromisointeriortitulo {
    font-size: 16px;
    padding: 40px 0 30px 35px;
  }
  .compromisoactor {
    width: 440px;
    margin: 0 0 0 35px;
    padding-bottom: 20px;
  }
  .compromisologogris {
    margin: 0;
  }
  .compromisologogris img {
    width: 100px;
    height: 100px;
  }
  .compromisoactornombre {
    width: 330px;
    margin: 30px 0 0 10px;
  }
  .compromisoactortexto {
    width: 330px;
    margin: 10px 0 0 10px;
    min-height: 130px !important;
  }
  .compromisoactortexto a.vermas {
    font-size: 10px;
    line-height: 20px;
  }
  .compromisoactortextoalto {
    min-height: 80px;
  }
}
@media (min-width: 1200px) {
  .containersmall {
    display: none;
  }
  .container-actores {
    display: block;
  }
  .compromisocategoria {
    width: 162px;
    height: 116px;
  }
  .compromisocategoriatexto {
    width: 150px;
    height: 40px;
    margin: 75px 0 0 7px;
    font-size: 12px;
    text-align: center;
  }
  .compromisoportada {
    width: 1134px;
  }
  .compromisodecoracionizquierda {
    width: 170px;
    height: 20px;
    margin: 10px 0 0 220px;
  }
  .compromisodecoracionderecha {
    width: 170px;
    height: 20px;
    margin: 10px 0 0 5px;
  }
  .compromisotextoacciones {
    width: 470px;
    font-size: 16px;
    margin: 25px 0 0 5px;
  }
  .compromisocolumnaizquierda {
    width: 400px;
    margin: 30px 0 0 35px;
  }
  .compromisotituloizquierdo {
    width: 100%;
    font-size: 16px;
    margin: 0 0 10px;
  }
  .compromisocolumnaderecha {
    width: 550px;
    min-height: 250px;
    margin: 30px 0 0 35px;
    padding: 20px;
  }
  .compromisofotogrupo {
    width: 1126px;
    height: 359px;
    margin: 0;
    z-index: 1;
  }
  .compromisointerior {
    width: 1134px;
  }
  .compromisointeriortitulo {
    font-size: 16px;
    padding: 40px 0 30px 35px;
  }
  .compromisoactor {
    width: 530px;
    margin: 0 0 0 35px;
    padding-bottom: 20px;
  }
  .compromisologogris {
    margin: 0;
  }
  .compromisologogris img {
    width: 100px;
    height: 100px;
  }
  .compromisoactornombre {
    margin: 30px 0 0 10px;
  }
  .compromisoactortexto {
    width: 400px;
    margin: 10px 0 0 10px;
    min-height: 130px;
  }
  .compromisoactortexto a.vermas {
    font-size: 10px;
    line-height: 20px;
  }
  .compromisoactortextoalto {
    min-height: 60px;
  }
}
