@font-face {
font-family: 'Montserrat';
src: url('font/Montserrat-Italic-VariableFont_wght.ttf') format('truetype');

}
header{
  position:fixed;
  width: 100%;
  height: 70px;
  background-color: brown;
  z-index: 100;
}
nav{
  display: table;
  margin:auto;
  margin-top: 15px;
  height: 40px;
  justify-content: center;
  font-family: 'Montserrat', sans-serif;
  background-color:transparent;
}
.text-justify {
  text-align: justify;
}
#logo{
  width: 100px;
  height: 100px;
  float: left;
  display: block;
  margin-left: 30px;
  margin-right: 30px;
}
ul{
display: block;
float: left;
list-style: none;
}
ul li{
    float: left;
    margin: 0;
    padding: 10px;
    font-family: 'Montserrat', sans-serif;
}
ul a{
    color: rgb(247, 247, 247);
    text-decoration-line: none;
}
ul a:hover{
  color:darkgrey;
  text-decoration-line: none;
}
#aliados{
  background: rgb(46,78,119);
  background: linear-gradient(0deg, rgba(46,78,119,1) 0%, rgba(255,255,255,1) 100%);
}
#footerdos{
  background: rgb(46,78,119);
  background: linear-gradient(0deg, rgba(46,78,119,1) 0%, rgba(255,255,255,1) 300%);
}
img.btn-whatsapp {
  display: block !important;
  position: fixed;
  z-index: 9999999;
  bottom: 20px;
  right: 20px;
  cursor: pointer;
  border-radius:100px !important;
}
img.btn-whatsapp:hover{
  border-radius:100px !important;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(7,94,84,1); 
  -moz-box-shadow: 0px 0px 15px 0px rgba(7,94,84,1);
  box-shadow: 0px 0px 15px 0px rgba(7,94,84,1);
  transition-duration: 1s;
} 
.call-to-action {
  border-radius: 50px;
}
h2{
font-family: 'Montserrat', sans-serif;
}
p{
    font-family: 'Montserrat', sans-serif;
}
:root {
--primary: rgb(150,25,19);
--dark: #000000;
--light: #ffffff;
--grey: #f5f5f5;
}
.text-primary {
  color: var(--primary) !important;
}
#hero{
  background: rgb(46,78,119);
  background: linear-gradient(1800deg, rgba(150,25,19,1) 0%, rgba(255,255,255,1) 25%);
}
.first-element {
  position: relative;
}

.first-item {
  color: white;
  position: relative;
  padding: 12px;
}

.first-item::after {
  content: "";
  position:absolute;
  bottom: -25px;
  left: 20%;
  transform: translateX(-28%);
  border-left: 60px solid transparent;
  border-right: 60px solid transparent;
  border-top: 20px solid brown
}
.second-item {
  color: white;
  position: relative;
  padding: 12px;
}
.second-item::after {
  content: "";
  position:absolute;
  bottom: -25px;
  left: 112%;
  transform: translateX(-28%);
  border-left: 60px solid transparent;
  border-right: 60px solid transparent;
  border-top: 20px solid brown
}
.tercer-item {
  color: white;
  position: relative;
  padding: 12px;
}
.tercer-item::after {
  content: "";
  position:absolute;
  bottom: -25px;
  left: 265%;
  transform: translateX(-28%);
  border-left: 60px solid transparent;
  border-right: 60px solid transparent;
  border-top: 20px solid brown
}
.cuarto-item {
  color: white;
  position: relative;
  padding: 12px;
}
.cuarto-item::after {
  content: "";
  position:absolute;
  bottom: -25px;
  left: 341%;
  transform: translateX(-28%);
  border-left: 60px solid transparent;
  border-right: 60px solid transparent;
  border-top: 20px solid brown
}