/*--------------------------------------------------------------

# General

--------------------------------------------------------------*/

body {

    font-family: "Open Sans", sans-serif;

    color: #444444;

    min-width: 500px;

}



a {

    text-decoration: none;

    color: #5cb874;

}



a:hover {

    color: #80c792;

    text-decoration: none;

}



.navbar-nav {

    padding-left: 3rem;

}

.navbar .flags img{

    padding-right: 1rem;

    width: 35px;

}

/*--------------------------------------------------------------

# Banner

--------------------------------------------------------------*/

#hero {

    background-image: url(../img/image1.jpg);

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    position: relative;

    top: 0;

    right: 0;

    left: 0;

    bottom: 0;
    

}



#hero p {

    animation-delay: 0.4s;

    color: #fff;

    padding-top: 3rem;

    padding-bottom: 1rem;

    padding-left: 4rem;

    font-size: 32px;

    font-weight: 600;



}



#hero .fondo {

    background-color: rgba(9, 9, 9, 0.3);

    width: 100%;

    min-height: 45vh;

}



/*--------------------------------------------------------------

# Detalle

--------------------------------------------------------------*/



#detalle {

    padding-top: 3rem;

}



#detalle .container2 {

    width: 100%;    

}



#detalle .col1 {

    padding-right: 10%;

    padding-top: 10%;

    padding-left: 10%;

    padding-bottom: 10%;

    font-weight: 400;

    color: #545454;



}



#detalle .col1 h3 {

    text-align: justify;

    line-height: 1.5;

    font-size: 22px;

    font-weight: 400;

    color: #545454;

    padding-bottom: 1rem;



}



#detalle .col1 ul {

    list-style: none;

}



#detalle .col1 li {

    padding-top: 1rem;

    list-style: none;

}



#detalle ul i {

    font-style: normal;

    font-size: 20px;

    font-weight: 300;

    padding-left: 1rem;

    padding-right: 10px;

}




#detalle .col2 {

    height: auto;

    padding-left: 5%;

    padding-right: 10%;

    font-size: 36px;

    font-weight: 700;

    color: whitesmoke;

    display: flex;

    align-items: center;

    justify-content: center;

    min-height: 60vh;

    background-color: #DDAE9A;

}



#detalle .col2 p {

    height: auto;

    padding-left: 5%;

    padding-right: 10%;

}



/*--------------------------------------------------------------

# Productos

--------------------------------------------------------------*/

#productos {

    margin-top: 5rem;

}



#productos h2 { 

    padding-bottom: 2rem;

    font-size: 32px;

}



#productos .row {

    text-align: left;

    padding: 10px 20px 80px 20px;

    min-height: 90vh;

    height: auto;

    padding-left: 5%;

    padding-right: 5%;

    font-size: 30px;

    color: whitesmoke;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;



}



#productos .row li {

    list-style: disc;

    font-size: 20px;

    font-weight: 300;

}



#productos .row h2 {



    padding-top: 20%;

    margin-left: 1rem;

    font-weight: 700;

    font-size: 30px;

}



#productos .row h3 {

    margin-left: 1rem;

    padding-bottom: 1rem;

    margin-right: 3rem;

    font-weight: 400;

    font-size: 20px;

}



#productos .col-1 {

    width: auto;

    color: whitesmoke;

    background-color: #2f2f2f;

    border: solid 1px white;

}



#productos .col-2 {

    width: auto;

    color: whitesmoke;

    background-color: #555555;

    border: solid 1px white;

}



#productos .col-3 {

    width: auto;

    color: whitesmoke;

    background-color: #919191;

    border: solid 1px white;

}



#productos .col-md .ul {

    list-style: none !important;

}



/*--------------------------------------------------------------

# Servicios

--------------------------------------------------------------*/

#servicios h2 {

    padding-bottom: 2rem;

    font-size: 32px;

}



#servicios h3 {

    margin-left: 3rem;

    margin-right: 3rem;

    font-weight: 400;

    font-size: 20px;

}



#servicios p {

    margin-left: 3rem;

    margin-right: 3rem;

    font-weight: 300;

    font-size: 20px;

}



/*--------------------------------------------------------------

# Team

--------------------------------------------------------------*/

#team h2 {

  padding-top: 4rem;

  font-size: 32px;

}

#team .member {

  text-align: center;

  margin-bottom: 20px;

  box-shadow: 0px 0px 12px 0px rgba(34, 34, 34, 0.07);

  padding: 30px 20px;

  background: #fff;

}



#team .member img {

  max-width: 60%;

  border-radius: 50%;

  margin: 0 0 30px 0;

}



#team .member h4 {

  font-weight: 700;

  margin-bottom: 2px;

  font-size: 18px;

}



#team .member span {

  font-style: italic;

  display: block;

  font-size: 13px;

}



#team .member p {

  padding-top: 10px;

  font-size: 14px;

  font-style: italic;

  color: #aaaaaa;

}



/*--------------------------------------------------------------

# Mapa

--------------------------------------------------------------*/

#mapa {

    margin-top: 1.5rem;

    background-color: #21371a;

    text-align: center;

}



#mapa .container {

    padding-top: 2rem;

}



#mapa h2 { 

    color: #fff;

    text-align: center;

    font-size: 20px;

}

#mapa img {

    width: 100%;

}



/*--------------------------------------------------------------

# Valores

--------------------------------------------------------------*/



#valores .col1 {

    min-height: 40vw;

    background-image: url(../img/image2.jpg);

    background-position: center;

    background-size: cover;

    background-repeat: no-repeat;

}



#valores .container {

    margin-left: 0;

}



#valores h2 {

    padding-left: 3vw;

    padding-top: 5vw;

    font-size: 32px;

    padding-bottom: 2vw;

}



#valores .col2 ul {

    padding-left: 5vw;

    list-style: none;

    font-size: 26px;

    font-weight: 300;

}



#valores .col2 li {

    padding-top: 0.5vw;

}



/*--------------------------------------------------------------

# Contacto

--------------------------------------------------------------*/

#contacto {

    color: #fff;

    align-items: center;

    background-color: #21371a;

}



#contacto .row {

    flex-wrap: wrap;

    justify-content: center;

    align-items: center;

    

}



#contacto .container2 {

    width: 100%;

}



#contacto .col1 {

    text-align: center;

}



#contacto .col2 {

    text-align: right;

    padding-right: 3rem ;

}



#contacto img {



    width: 35%;

}



#contacto h2 {

    padding-top: 2vw;

    font-size: 20px;

    font-weight: 600;

}



#contacto h3 {

    font-size: 12px;

    font-weight: 200;

}



#contacto p {

    font-size: 12px;

    padding-top: 1vw;

    font-weight: 200;

}





