/*
 * Globals
 */

/* Links */
a,
a:focus,
a:hover {
  color: #fff;
}

/*
 * Base structure
 */


  body,{
    height: 100%;
    width: 100%;
    max-width: 100%;
    max-height: 100%;
    background-color: #eaeaea;
}



/*
 * Header Navbar
 */

 .masthead-brand {
  margin-bottom: 0;
}

header{
  position: fixed;
  height: auto;
  width: 100%;
  background-color: rgba(26, 25, 25, 0.5);
  z-index: 1;
   
}

.nav-masthead .nav-link {
  padding: .25rem 0;
  font-weight: 700;
  color: rgba(255, 255, 255, .5);
  background-color: transparent;
  border-bottom: .25rem solid transparent;
}


.nav-masthead .nav-link:hover,
.nav-masthead .nav-link:focus {
  border-bottom-color: rgba(255, 255, 255, .25);
}


.nav-masthead .nav-link + .nav-link {
  margin-left: 2rem;
}


.nav-masthead .active {
  color: #fff;
  border-bottom-color: #fff;
}


@media (min-width: 48em) {
  .masthead-brand {
    float: left;
    margin-left: 15%;
    margin-top: 1%;
  }

  .nav-masthead {
    float: right;
    margin-right: 20%;
    margin-top: 1%;
  }
  }

  /* Loader */

*,*:after. *:before{
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

#contenedor_carga{
  background-color: rgba(250, 240, 245, 0.9);
  height: 100%;
  width: 100%;
  position: fixed;
  -webkit-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
  z-index: 10000;
}

#carga {
  border: 15px solid;
  border-top-color: black;
  border-top-style: groove;
  height: 100px;
  width: 100px;
  border-radius: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -webkit-animation: girar 1.5s linear infinite;
  -o-animaion: girar 1.5s linear infinite;
  animation: girar 1.5s linear infinite;
}

@keyframes girar {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

    /* Carousel */

    .carousel-inner img {
      height: auto;
      width: 100%;
      }
  
      .carousel-inner{
      height: 300px;
      }
  
      #banner1 {
        height: 100%;
        width: 100%;
        max-height: 60%;
      }
  
      #banner2 {
        height: 100%;
        width: 100%;
        max-height: 60%;
      }
  
      #banner3 {
        height: 100%;
        width: 100%;
        max-height: 60%;
      }

/* Scrollbar */

body::-webkit-scrollbar{
  width: 10px;
  background-color: gray;
  position: fixed;
  }

body::-webkit-scrollbar-thumb {
    background-color: black;
    border-radius: 10px;
    }

    /* Logos on the page */
    #logo{
      height: 1.5em;
      width: 2em;
      float: left;
    }

    /* Footer */
    footer {
      height: 65px;
      width: 100%;
      background-color: black;
      filter: opacity(95%);
      bottom: 0px;
      margin-bottom: -11%;
    }

    #instagram {
      margin-right: 2%;
      float: right;
    }
    
    #whatsapp {
      margin-right: 1%;
      float: right;
    } 
    
    #facebook{
    margin-right: 1%;
     float: right;
    }
    
    #tele{
      margin-left: 2%;
      float: left;  
    }
    
    #telefonos{
      float: left;
      color: #f1f1f1
    }
    
    #conten {
      text-align: center;
      align-items: center;
      justify-content: center;
      color: #f1f1f1;
      display: flex;
    }

    #Whatsapp{
      height: 20%;
      width: 40%;
      float: center;
      border-radius: 8px;
      text-align: center;
      max-width: 25%;
      box-shadow: 5px 5px 5px #333;   
    }
    
    #whatsapplogo{
    height: 7.9em;
    width: 8.3em;
    float:center;
    margin-left: 30%
    }


    /* formulario */

    h1 {
	font-size: 22px;
	margin: 0px 0px;
  text-align: center;
}

p {
	font-size: 16px;
	margin-bottom: 0px;
}
a {
  color: #333;
  text-decoration: none;
}
label {
	font-size: 16px;
	margin-bottom: 0px;
	font-weight: bold;
}

input[type=text], input[type=tel], input[type=email] {
	width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    box-sizing: border-box;
    border: 2px solid #ccc;
    border-radius: 10px;
}

textarea {
    width: 100%;
    height: 100px;
    padding: 12px 20px;
    box-sizing: border-box;
    border: 2px solid #ccc;
    border-radius: 10px;
    background-color: #f8f8f8;
    resize: none;
}

input[type=button], input[type=submit], input[type=reset] {
    background-color: #4CAF50;
    border: none;
    color: white;
    padding: 16px 32px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
    margin-top: 10px;
    border-radius: 5px;
}

input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
    background-color: #333;
}

#formulario {
  width: 50%;
  margin-left: 25%;

}


hr {
width: 80%;
margin-top: 2%;
margin-bottom: 2%;
size: 100px;

}

iframe{
float: center;
margin-left: 20%;
max-height: 100%;
width: 60%;
}

#mapa {
  height: 400px;
}



#nav {
  height: 60px;
  width: 100%;
  max-height: auto;
  background-color: black;
  
}