body, html {
  height: 100%;
  font-family: 'microsoft-tai-le-regular', sans-serif;
/*  background: #E6E7E8;  
  background: #F6F6F6;  */
  background: #FFF;
  color: #6D6E71;
  text-align: justify;

}
header.sticky{
    position: sticky;
    background: white;
    box-shadow: 0 4px 8px 2px rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
}
p{text-align: justify;}
.cinta{
  max-height: 218px;
  border-bottom: 8px solid #7F273F;
  padding: 0;
  margin: 0;
}

.bg-main{
  background: rgba(39,51,118, 1.0) !important;
  color: white !important;
}

.text-main{
  color: rgba(39,51,118, 1.0) !important;
}
.bg {
  /* The image used */
  background-image: url("../img/cintillo2022-2030.png");


  /* Full height */
  height: 218px;
  max-width: 1300px;
  /* Center and scale the image nicely */
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0 auto;
}
/*
.bg {
  /* The image used *
  background-image: url("img_girl.jpg");

  /* Full height *
  height: 50%; 

  /* Center and scale the image nicely *
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
*/
.carousel-item {
  height: 65vh;
  min-height: 350px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.logo-siss {
  /* The image used */
  background-image: url("../img/logo-siss.png");

  /* Full height */
  /*height: 218px;*/
  max-width: 200px;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  padding: 50px;
}

.top-nav{
 /* background: --bs-primary-rgb:13,110,253;*/
  box-shadow: 0 4px 8px 2px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.navbar-dark .navbar-nav .nav-link{color:rgba(255,255,255,1)}
span.social{color:white;}
.grid-horizontal{
  height: 100%;
/*  border: 1px solid green;*/
  padding-top: 0px;
  font-family: 'microsoft-tai-le-bold', sans-serif;
  font-size: 20px;
  color: #7F273F;
}
.nav-link{
  color: white !important;
}
.nav-link:active{color: yellow;}
.nav-item:active{
  border-bottom: 2px solid blue;

}
.navbar-light .navbar-nav .nav-link{
  color: #7F273F;
}
.navbar-light .navbar-nav .nav-link.active{
  color: #7F273F;
  border-bottom: 3px solid #7F273F;
}
.nav-link:active{color: yellow;}
.nav-item:active{
  border-bottom: 2px solid blue;

}


.bg-full-sps{
  position: relative;
  background: url("../img/sps.png");
  background-size: contain;
  background-repeat: repeat;
}
.bg-full-spv{
  position: relative;
  background: url("../img/spv.png");
  background-size: contain;
  background-repeat: repeat;
}
.bg-full-spps{
  position: relative;
  background: url("../img/spps.png");
  background-size: contain;
  background-repeat: repeat;
}        
.bg-transparente{
  background: rgba(127,39,63,0.9);
  width: 100%;
  height: 100%;
}
.bg-infografia{
  width: 100%;
  box-shadow: 0 4px 8px 2px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }
.bg-shadow{
  box-shadow: 0 4px 8px 2px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }
.bg-gris-5{
  background: #F6F6F6;
}

.card-border{
  position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;

    height: 300px;
    border-top: 8px solid #273376;
    border-bottom: 8px solid #273376;
}
.rounded-3 {
    border-radius: 1rem!important;
}
.text-sp{
  color: white;
  font-weight: bold;
  margin: 25% auto;
}
.text-sp-secondary{
  color: white;
  font-weight: bold;
  margin: 16% auto;
}
.text-vine{
  color: #273376;
}
.bg-vine{
  background: #273376;  
}

.card-sps{
  background: url("../img/sps.png");
  background-size: cover;
    height: 225px;
}
.card-spv{
  background: url("../img/spv.png");
  background-size: cover;
    height: 225px;
}.card-spps{
  background: url("../img/spps.png");
  background-size: cover;
    height: 225px;
}
.carde{
  background: rgba(127,39,63,0.8);
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.shadow-card{
  box-shadow: 0 .5rem 1rem rgba(0,0,0,0.50)!important;
}

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: none;
    border-radius: 0;
}

.card-img-t{
  max-height: 150px;
}
.card-title-t{
  max-height: 110px;
  height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  font-weight:bolder;
  }
.card-body-t{
      height: 8rem;
      padding-bottom: 1rem;
     /*background-color: lightgreen;*/
}
.card-text-t{
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 4;
      overflow: hidden;
      text-overflow: ellipsis;
}

.cat-news h2 {
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 3px solid #213467;
}

.grid-entes{
  height: 100px;
}
.entes img{
  max-width: 150px;
}
.card-entes{
  background-position: left center;
  background-repeat: no-repeat;
    height: 138px;
    width: 133px;
    border-radius: 100px;
  border: 5px solid #7F273F;
}
.card-entes.inass{
background: url(../img/inass.jpg)white;
    background-size: 150px 150px;
    background-position: center center;
    background-repeat: no-repeat;
}
.card-entes.incret{
background: url(../img/incret.png)white;
    background-size: 112px 150px;
    background-position: center center;
    background-repeat: no-repeat;  }
.card-entes.inpsasel{
    background: url(../img/inpsasel.png)white;
    background-size: 100px 100px;
    background-position: center center;
    background-repeat: no-repeat;}
.card-entes.ipasme{
background: url(../img/ipasme.png)white;
    background-size: 100px 100px;
    background-position: center center;
    background-repeat: no-repeat;}
.card-entes.mppt{
background: url(../img/mppt.jpg)white;
    background-size: 150px 150px;
    background-position: center center;
    background-repeat: no-repeat;}
.card-entes.tesoreria{
    background: url(../img/tesoreria.png)white;
    background-size: 87px 90px;
    background-position: center center;
    background-repeat: no-repeat;}






.marea{
  /* The image used */
  background-image: url("../img/marea1.png");

  /* Center and scale the image nicely */
  background-position: bottom right;
  background-repeat: no-repeat;
  background-size: 150px 100px;
  height: 100px;
  /*border: 1px solid blueviolet;*/
}
a{
  text-decoration: none;
}
span{color: #7F273F}
list-group-item>a {color: #7F273F}





.hoy {
  position: relative;
  width: 100%;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay-in{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #fff;
}

.hoy:hover .overlay-in {
  opacity: 1;
}

.overlay-in-text {
  color: rgb(33, 52, 103);
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

.overlay-out{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
}

.overlay-text:hover .overlay-out {
  opacity: 1;
}

.overlay-out-text {
  color: rgb(33, 52, 103);
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.text-white{
  color: white !important;
}
.text-left{
  text-align: left;
}
.text-right{
  text-align: right;
}
h1{
  font-size: calc(1.1rem + 1.5vw);
}

.map-responsive{

    overflow:hidden;

    padding-bottom:56.25%;

    position:relative;

    height:0;

}

.map-responsive iframe{

    left:0;

    top:0;

    height:100%;

    width:100%;

    position:absolute;

}
 