:root {
  --background-color-heaader-pages: linear-gradient(#12A6FF, #05145E);

  --primary-color: #ffffff;
  --primary-color-fonts: var(--primary-color);
  --secundary-color-fonts: #0889F1;
}

body {
  margin: 0;
  padding: 0;
  font-family: 'Montserrat', sans-serif;
}

/* ----------------------------------------------- Header ----------------------------------------------- */

.header__pages {
  width: 100%;
  /* min-height: calc(100vh - 25px); */
  background-image: var(--background-color-heaader-pages);
  /* border-radius: 0 0 0px 200px; */
}

.container__pages--header{
  width: 80%;
  padding: 150px 0 100px;
  margin: auto;
  text-align: center;
  max-width: 1920px;
  display: flex;
  justify-content: space-around;
}

.header--page--img {
  /* height: 50vh; */
  width: 300px;
}

.groupText--header {
  text-align: left;
  width: 50%;
}

.groupText--header h1,
.groupText--header p {
  display: inline-block;
}

/* ----------------------------------------------- Global ----------------------------------------------- */

h1 {
  font-size: 50px;
}
h2 {
  font-size: 40px;
}
h3 {
  font-size: 35px;
}
h4 {
  font-size: 20px;
}

.p-botton-0{
  padding-bottom: 0 !important;
}

.container--pages{
  width: 80%;
  padding: 100px 0;
  margin: auto;
  text-align: center;
  max-width: 1920px;
  margin: 0 auto;
}

.page--p {
  width: 80%;
  text-align: center;
  padding-bottom: 50px;
  margin: auto;
}

/* ----------------------------------------------- Fonts ----------------------------------------------- */

.font-color-primary {
  color: var(--primary-color-fonts);
}
.font-color-secundary {
  color: var(--secundary-color-fonts);
}

/* ----------------------------------------------- Video ----------------------------------------------- */

.container--video {
  display: flex;
  justify-content: center;
  width: 80%;
  height: 0;
  overflow: hidden;
  padding-bottom: 33%;
  padding-top: 30px;
  position: relative;
}
.container--video iframe{
  height: 100%;
  position: absolute;
  top: 0;
  width: 80%;
}


/* ----------------------------------------------- Responsive ----------------------------------------------- */

@media (max-width: 800px) {

  /* ---------------------- Header ---------------------- */
  .container__pages--header {
    padding: 50px 0;
  }
  .header--page--img {
    display: none;
  }
  .groupText--header {
    width: 80%;
    text-align: center;
  }

}