.back{

    max-height: fit-content; /*alto*/
    position: relative;
    
}
  #fondo{

  margin-top: 100px;

  }


img{
    height:100%;
    width:100%; 

}

body{
  background-size: cover;
}


.navbar{
    color: white;
    height: 100px;
}

.navlogo{
    height: 80px;
    width: 80px;
    
}

.navbarbrand{
    float: left;
}

.navmenu{
  color:black;
  font: arial;
  float: right; 
}

.footerglobal {
  position: relative;
  width:100%;
  left:0px;
  bottom:0px;
}

/* ------------ Efecto de servicios ------------*/
@keyframes slideInFromLeft {
    0% {
      transform: translateX(-100%);
    }
    100% {
      transform: translateX(0);
    }
  }

.services{
    animation: 1s ease-out 0s 1 slideInFromLeft;
  
  background: white;
  padding: 30px;
}

/* ------------ Efecto de servicios ------------*/
/* ----------- Efecto de texto sobre imagen --------- */

  /* ----------- Efecto de texto sobre imagen --------- */

.footers-icon{
max-width: 30px;
max-height: 30px;

}

.text-footer{
    font-family: Arial;
    text-align-last: center;
    color:rgb(29, 62, 95); 
    font-weight: bold;
    }

#contacto{
 text-align-last: center;
}

.footer-logo{
max-width: 150px;
max-height: 150px;
text-align-last: center;
         }
.newsletter{
  border: 10px;
  border-radius: 2px;
  border-color: white;
}

.footer{
  position: center;

}



/* ----------- Efecto de texto sobre imagen --------- */


/* ----------- Efecto tarjeta de novedades  --------- */

.body {
  margin: 0;
  padding: 0;
  background: #250008;
  font-family: Arial;
}

.card {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 400px;
  height: 500px;
 
}

.card .image {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.card .image img {
  width: 100%;
  transition: .5s;
}

.card:hover .image img {
  opacity: .5;
  transform: translateX(30%);
  /*100%*/
}

.card .details {
  position: absolute;
  top: 0;
  left: 0;
  width: 70%;
  /*100%*/
  height: 100%;
  background: white;
  transition: .5s;
  transform-origin: left;
  transform: perspective(2000px) rotateY(-90deg);
}

.card:hover .details {
  transform: perspective(2000px) rotateY(0deg);
}

.card .details .center {
  padding: 20px;
  text-align: center;
  background: #fff;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.card .details .center h1 {
  margin: 0;
  padding: 0;
  color: #ff3636;
  line-height: 20px;
  font-size: 20px;

}

.card .details .center h1 span {
  font-size: 14px;
  color: #262626;
}

.card .details .center p {
  margin: 10px 0;
  padding: 0;
  color: #262626;
}

.card .details .center ul {
  margin: 10px auto 0;
  padding: 0;
  display: table;
}

.card .details .center ul li {
  list-style: none;
  margin: 0 5px;
  float: left;
}

.card .details .center ul li a {
  display: block;
  background: #262626;
  color: #fff;
  width: 100%;
  height: 30px;
  line-height: 30px;
  text-align: center;
  transform: .5s;
  
}

.card .details .center ul li a:hover {
  background: #ff3636;
  margin: 1%;
}


/* ----------- Efecto tarjeta de novedades  --------- */

/* ----------- Texto de novedades  --------- */

.nota{
position: relative;
text-align: justify;
margin-left: 10%;
margin-right: 10%;
margin-top: 5%;
margin-bottom: 5%;
width: 80%;
font-family: Arial;
font-size: 18px;
}

.notasas {
  position: relative;
  text-align: justify;
  margin-left: 10%;
  margin-right: 10%;
  margin-top: 5%;
  margin-bottom: 5%;
  width: 80%;
  font-family: Arial;
  font-size: 18px;
}

.subtitulo{
  font-weight: bold;
  margin-top:2%;
  margin-bottom: 2%;
  font-family: Arial;
  
}

.destacado{
text-decoration: underline;
margin-left: 30px;
margin-top: 1%;
margin-bottom: 1%;
font-family: Arial;

}

.enumerado {
  margin-left: 30px;
  margin-top: 1%;
  margin-bottom: 1%;
  font-family: Arial;

}

.destacado2 {
  text-decoration: underline;
  margin-left: 100px;
  margin-top: 1%;
  margin-bottom: 1%;
  font-family: Arial;

}

s {
  text-decoration: underline;
  font-weight:bold;
  font-family: Arial;
}

.lead{
  text-align: justify;
}

p{
  font-family: Arial;

}
h2{
  font-family: Arial;
}

h1{
  font-family: Arial;
}
a{
  font-family: Arial;
}

h5{
  font-family: Arial;
}


/* ----------- Estilos de barra de navegacion  --------- */
#navbartext{
  font-family: Arial;
  color: rgb(29, 62, 95);
  font-weight: bold;
  text-align: center;

}

#navproperties{
    background-color: rgba(239, 245, 254);
    text-align: center;
}


/* ----------- Texto de novedades  --------- */


/* ----------- FLECHAS --------- */


button {
  -webkit-appearance: none;
  background: rgb(212, 209, 209);
  border: 0;
  outline: 0;
}

svg {
  padding: 5px;
}

.arrow {
  cursor: pointer;
  position: relative;
  top: 50%;
  margin-top: 1%;
  margin-bottom: 1%;
  margin-left: -35px;
  width: 70px;
  height: 90px;
}

.left {
  left: 42%;
}

.right {
  left: 58%;
}

.left:hover polyline,
.left:focus polyline {
  stroke-width: 3;
}

.left:active polyline {
  stroke-width: 6;
  transition: all 100ms ease-in-out;
}

.right:hover polyline,
.right:focus polyline {
  stroke-width: 3;
}

.right:active polyline {
  stroke-width: 6;
  transition: all 100ms ease-in-out;
}

polyline {
  transition: all 250ms ease-in-out;
}

/*------ EFECTO CONTADOR------*/

bodycontenedor {
  margin: 0;
 
  display: flex;
  justify-content: center;
  align-items: center;
}

.contenedor {
  position: relative;
}

.color_fondo {
  height: 0%;
  width: 100%;
  background-color: yellow;
}

.numero {
  height: 10%;
  width: 10%;
  font-size: 6.8em;
  font-family: Arial;
  color: black;
  display: flex;
  justify-content: center;
  align-items: center;

}



/*------ EFECTO CONTADOR------*/

.header {
  color: #36A0FF;
  font-size: 27px;
  padding: 10px;
}

.bigicon {
  font-size: 35px;
  color: #36A0FF;
}

/*------ EFECTO CONTADOR------*/

.box{
  width: 200px;
  height: 200px;
  background-image: url(/img/perfil.jpeg);
  background-size: cover;
  border-radius: 50%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}


.col-lg-4.zoomservices:hover {
  transform: scale(1.1, 1.1);
  transition: .2s ease-in;
  /*100%*/
}


/* #color:hover{
  background-color: rgba(13, 110, 253, 0.1);

}