/*----- Header navbar -----*/
nav {
  background: linear-gradient(90deg, #0e2133 0%, #2f4b6b 100%);
  position: fixed;
  width: 100%;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
}
nav div {
  width: 50%;
}
nav .burguermenu-icon {
  display: none;
}

nav .logo-container {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 20px 40px;
}

nav .logo-container img {
  width: 200px;
}

nav .menu-container {
  display: flex;
  justify-content: flex-end;
}

nav .menu-container ul li {
  display: inline-block;
  margin-right: 40px;
  font-size: 20px;
  cursor: pointer;
}

nav .menu-container ul li:hover,
nav .menu-container ul li a:hover {
  color: rgba(172, 224, 255, 1);

  transition: color 0.4s ease;
}
nav .menu-container ul li a {
  text-decoration: none;
  color: #fff;
}
nav.menu-container ul li a:active {
  text-decoration: none;
  color: #fff;
}

nav .menu-container .burguermenu {
  display: none;
  position: relative;
  margin-bottom: 20px;
}

nav .menu-container .burguermenu li {
  margin: 10px;
  display: block;
  text-align: right;
}
/*----- Fin Header navbar -----*/

.mAuto {
  margin: auto;
}
.mainImg {
  display: flex;
  justify-content: center;
  align-items: center;
}
.imgDetails {
  width: 100%;
  max-width: 703px;
  margin-bottom: 70px;
}
.titleTxt {
  font-size: 55px;
  font-weight: 500;
}
.subTitleTxt {
  font-size: 45px;
  font-weight: 300;
}
.txtTitleContainer {
  padding-top: 7em;
  margin-bottom: 15px;
}
.txtSubtitleContainer {
  margin-top: 15px;
  margin-bottom: 25px;
}
.ndSection {
  background-color: #fff;
}
.imgs2ndSection {
  display: grid;
  grid-template-areas:
    "a c e"
    "b d f"
    ". g ."
    ". h .";
  margin: auto;
  width: 90%;
  gap: 20px;
  padding-top: 50px;
  padding-bottom: 40px;
}
.itemA {
  grid-area: a;
}
.itemB {
  grid-area: b;
}
.itemC {
  grid-area: c;
}
.itemD {
  grid-area: d;
}
.itemE {
  grid-area: e;
}
.itemF {
  grid-area: f;
}
.itemG {
  grid-area: g;
}
.itemH {
  grid-area: h;
}
.itemI {
  grid-area: i;
}
.itemJ {
  grid-area: j;
}
.itemK {
  grid-area: k;
}
.itemL {
  grid-area: l;
}
.icon {
  max-width: 144px;
}
.b24px {
  font-size: 1.5em;
  font-weight: bold;
}
.txtCenter {
  text-align: center;
}
.description {
  padding-top: 80px;
  padding-bottom: 100px;
  display: grid;
  grid-template-areas:
    "a a c c e e"
    "b b d d f f"
    "g g g i i i"
    "h h h j j j";
  width: 90%;
  margin: auto;
  gap: 25px;
}
.b2E4B6B {
  color: #2e4b6b;
}
.bContainer {
  padding-top: 20px;
  display: flex;
  justify-content: center;
  gap: 200px;
  padding-bottom: 100px;
}
.button1 {
  border-radius: 7px;
  padding: 15px;
  background-color: #2f4b6b;
  color: #f6f6f6;
  font-size: 25px;
  width: 290px;
  cursor: pointer;
  transition: transform 0.3s ease;
}
.button1:hover {
  transform: scale(1.1);
  transition: 0.5s;
}
.button2 {
  border: 2px solid #2f4b6b;
  border-radius: 7px;
  padding: 15px;
  background-color: none;
  font-size: 25px;
  width: 290px;
  cursor: pointer;
}
.video {
  border-radius: 15px;
  margin: auto;
  background-color: rgb(32, 32, 32);
  width: 85%;
  height: 660px;
  padding-bottom: 50px;
}
.pdR65 {
  padding-right: 65px;
}
.widthRsp {
  max-width: 640px;
}
.widthRsp1 {
  max-width: 310px;
}
.widthRsp2 {
  max-width: 380px;
}
.px23 {
  font-size: 23px;
}
.px26 {
  font-size: 26px;
}

.buttons-section {
  display: flex;
  justify-content: center;
  padding: 4rem 0;
}

.main-button {
  margin-right: 2rem;
  font-size: 2.5rem;
}

.secondary-button {
  background-color: rgba(0, 0, 0, 0);
  border: 2px solid #2f4b6b;
  color: #6b6b6b;
  font-size: 2.5rem;
}

.secondary-button:hover {
  color: #fff;
}

.video-section {
  display: flex;
  align-items: center;
  justify-content: center;
}

.video-section iframe {
  border-radius: 30px;
  max-width: 1600px;
  width: 100%;
  max-height: calc(100vw * 9 / 16);
}

.aplications-section {
  padding: 4rem 0;
}

.aplications-section .tag {
  font-size: 1.3rem;
  padding: 2rem 0;
}
.bold {
  font-weight: bold;
}
.px28 {
  font-size: 28px;
}
.px29 {
  font-size: 29px;
}

.aplications-section .aplications-container .apliactions-filtered {
  display: grid;
  grid-template-columns: repeat(auto-fit, 400px);
}
.wd85 {
  width: 85%;
}
.wd70 {
  width: 70%;
}
.wd60 {
  width: 60%;
}
.pdB0 {
  padding-bottom: 0;
}
@media (max-width: 1850px) {
}
@media (max-width: 1000px) {
  nav .burguermenu-icon {
    display: block;
    position: absolute;
    width: fit-content;
    top: 0;
    right: 0;
    margin-top: 20px;
    margin-right: 20px;
  }
}
@media (max-width: 1199px) and (min-width: 1025px) {
  .titleTxt {
    font-size: 50px;
  }
  .subTitleTxt {
    font-size: 40px;
  }
  .imgDetails {
    max-width: 583px;
  }
  .icon {
    max-width: 124px;
  }
  .px28 {
    font-size: 24px;
  }
  .px29,
  .px26 {
    font-size: 26px;
  }
  .px23,
  .px25 {
    font-size: 21px;
  }
  .bContainer {
    gap: 8%;
  }
}
@media (max-width: 1024px) and (min-width: 777px) {
  .titleTxt {
    font-size: 38px;
  }
  .subTitleTxt {
    font-size: 28px;
  }
  .imgDetails {
    max-width: 531px;
  }
  .icon {
    max-width: 120px;
  }
  .px28 {
    font-size: 20px;
  }
  .px29,
  .px26 {
    font-size: 25px;
  }
  .b24px {
    font-size: 24px;
    font-weight: 400;
  }
  .px23,
  .px25 {
    font-size: 18px;
  }
  .bContainer {
    gap: 8%;
  }
  .button1,
  .button2 {
    font-size: 22px;
  }
}
@media (max-width: 776px) {
  .titleTxt {
    font-size: 30px;
  }
  .subTitleTxt {
    font-size: 20px;
  }
  .imgDetails {
    max-width: 295px;
  }
  .icon {
    max-width: 142px;
  }
  .px28 {
    font-size: 19px;
  }
  .px29,
  .px26 {
    font-size: 23px;
  }
  .b24px {
    font-size: 20px;
    font-weight: 400;
  }
  .px23,
  .px25 {
    font-size: 16px;
  }
  .bContainer {
    gap: 3%;
    margin: auto;
    width: 90%;
  }
  .button1,
  .button2 {
    width: 142px;
    font-size: 18px;
  }
  .pdR65 {
    padding: 0px;
  }
  .imgs2ndSection {
    grid-template-areas:
      "a"
      "b"
      "c"
      "d"
      "e"
      "f"
      "g"
      "h"
      "i"
      "j"
      "k"
      "l";
  }
  .description {
    grid-template-areas:
      "a"
      "b"
      "c"
      "d"
      "e"
      "f"
      "g"
      "h"
      "i"
      "j";
  }
  .video {
    height: 189px;
  }

  .main-button {
    font-size: 1rem;
  }

  .secondary-button {
    margin-right: 1rem;
    font-size: 1rem;
  }
  .aplication-card {
    margin-bottom: 20px;
  }

  /*----- Header navbar -----*/
  nav {
    flex-direction: column;
  }

  nav div {
    width: 100%;
  }

  nav .logo-container img {
    width: 100px;
  }
  nav .menu-container {
    padding: 0;
  }
  /*----- Header navbar -----*/
}
