/*/////////////////// DOM RESET */a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}*{margin: 0; padding: 0; text-decoration: none;}

/*//////////////////////////////////////*/
/*//////////////////////////////////////*/
/*/////////////////// GENERAL SETTINGS//*/
/*//////////////////////////////////////*/
/*//////////////////////////////////////*/

:root {
  --color-A: #0B4D6E;
  --color-B: #3A8FAA;
  --color-C: #1E1E1E;
  --color-D: #f0f0f0;
  --color-F: #C8C6C5;
  --tsize-h1: 4rem;
  --tsize-h2: 3rem;
  --tsize-h3: 1.8rem;
  --tsize-h4: 1.4rem;
  --tsize-p: 1.2rem;
  --tsize-sub1: 0.8rem;
}

/* 
.source-serif-4-<uniquifier> {
  font-family: "Source Serif 4", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}


.cinzel-<uniquifier> {
  font-family: "Cinzel", serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
} */

body {
  font-family: "Source Serif 4", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-size: 2rem;
  font-style: normal;
  line-height: 2.5rem;
  background-color: var(--color-C);
}

.lang-es {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 99999;
  background: url(img/mx.svg);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center center; 
  width: 2rem;
  height: 2rem;
  cursor: pointer;
  border-radius: 10%;
  border: 1px solid #000;
}

.lang-eng {
  position: absolute;
  top: 1rem;
  right: 4rem;
  z-index: 99999;
  background: url(img/gb.svg);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center center; 
  width: 2rem;
  height: 2rem;
  cursor: pointer;
  border-radius: 10%;
  border: 1px solid #000;
}

.lang-active {
  opacity: 1!important;
}

.lang-inactive {
  opacity: 0.3!important;
}

header {
  padding: 1rem;
  text-align: center;
  color: var(--color-B);
  background: var(--color-D);
}

#logo {
  width: 60vw;
  margin-left: calc(20vw - 1rem);
  margin-bottom: 2rem;
  margin-top: 4rem;
}

.BBimg {
  display: block;
  position: relative;
  top:-1px;
  width: 100vw;
  height: 100vh;
}

.bb01 {
  background-image: url("img/BB01.jpg");
  background-size: cover;
  background-position: top center;
}

.bb02 {
  background-image: url("img/BB02.jpg");
  background-size: cover;
  background-position: top;
}

.bb03 {
  background-image: url("img/BB03.jpg");
  background-size: cover;
  background-position: top center;
}

.bb04 {
  background-image: url("img/BB04.jpg");
  background-size: cover;
  background-position: top center;
}

h1 {
  font-size: 3rem;
  font-family: "Cinzel", serif;
  line-height:auto!important;
}

.container {
  display: block;
  max-width: 100vw!important;
  height: auto;
  padding: 3rem 1rem;

  text-align: center;;
}

.dark {
  background-color: var(--color-C);
  color: var(--color-D);
}

.light {
  background-color: var(--color-F);
  color: var(--color-C);
}

.welcome2 {
  font-family: "Source Serif 4", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-size: 2rem;
  font-style: normal;
  margin-top: 2rem;
  line-height: 2.5rem;
}

.button {
  display: inline-block;
  font-family: "Source Serif 4", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  background-color: var(--color-B);
  padding: 0.8rem 1.6rem;
  margin-top: 2rem;
  border-radius: 5rem;
}

.service {
  display: block;
  margin-top: 3rem;;
}

.service-image {
  width: 100%;
  height: 20vh;
    margin: 0 auto;
  background: white;
  border: 2px solid #000;

}

.svi01 {
  background-image: url("img/SV01.jpg");
  background-size: cover;
  background-position: center;
}

.svi02 {
  background-image: url("img/SV02.jpg");
  background-size: cover;
  background-position: center;
}

.svi03 {
  background-image: url("img/SV03.jpg");
  background-size: cover;
  background-position: center;
}

.svi04 {
  background-image: url("img/SV04.jpg");
  background-size: cover;
  background-position: center;
}

.service-text {
  padding-top: 1rem;;
}

.semi-container {
  display: block;
  position: relative;
  max-width: 100vw;
  height: auto;
  padding-top: 3rem;
  text-align: center;;
}

.card {
  display: inline-block;
  position: relative;
  width: 94vw;
  background: var(--color-D);
  color: var(--color-C);
  padding: 1rem 0;
  margin-bottom: 2rem;
}

.card-image {
  position: relative;
  width: 92%;
  height: 92vw;
  margin: 0 auto;
}

.cl-armando {
  background-image: url("img/cl-armando.jpg");
  background-size: cover;
  background-position: center;
}

.cl-leonardo{
  background-image: url("img/cl-leonardo.jpg");
  background-size: cover;
  background-position: center;
}

.cl-adhair{
  background-image: url("img/cl-adhair.jpg");
  background-size: cover;
  background-position: center;
}

.cl-diego{
  background-image: url("img/cl-diego.jpg");
  background-size: cover;
  background-position: center;
}

.card-name {
  display: inline;
  color: var(--color-D);
  position: absolute;
  left: 0.5rem;
  bottom: 0;
  text-align: left;
  text-shadow: 3px 3px 6px rgba(0, 0, 0, 1);
}


.card-text {
  margin-top: 2rem;
  font-family: "Source Serif 4", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  padding: 0 1rem;
  line-height: 2rem;
}

.values{
  width: 96vw;
  height: 25vh;
  margin: 0 auto;
  padding-top: 5rem;
  text-align: center;
  background: #040507;
background: linear-gradient(to top, #040507 0%, #1E1E1E 100%);
}

.values-inside {
  width: 100%;
  height: 100%;
  background-image: url("img/3values.svg");
  background-repeat: no-repeat;
  background-size: contain;
}
.font-source {
  font-family: "Source Serif 4", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.form-group {
  display: block;
  position: relative;
  width: 70vw;
  margin: 0 auto;
}

.form-group input, label, select, button {
  width: 100%;
  font-family: "Source Serif 4", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-size: 2rem;
  margin-bottom: 1rem;
}

textarea {
  width: 100%;
  font-family: "Source Serif 4", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-size: 2rem;
  margin-bottom: 1rem;
}

.form-group button:disabled {
  border-radius: 10rem;
  background: none;
  border: 4px solid var(--color-F);
  color: var(--color-F);
  opacity: 0.5;
}

.form-group button:enabled {
  border-radius: 10rem;
  background: none;
  border: 4px solid var(--color-B);
  color: var(--color-B);
  opacity: 1;
}

a {
  color: var(--color-B);
}

.subs {
  font-size: 1.5rem;
  width: 70vw;
  color: var(--color-B);
  border: 4px solid var(--color-A);
  margin: 1rem auto;
  border-radius: 10rem;
}

b {
  font-weight: 800;
}

footer {
  display: block;
  background-color: #000;
  position: relative;
  width: 100vw;
  margin: 0 auto;
  padding: 2rem 0;
  text-align: center;
  color: var(--color-F);
  font-size: 1.5rem;
}

footer a {
  text-decoration: underline;
}


.reveal {
      opacity: 0;
      transform: translateY(20px);
      transition: opacity 1.2s ease-out, transform 0.6s ease-out;
    }
    
    .reveal.visible {
      opacity: 1;
      transform: translateY(0);
    }

.thanks {
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  color: var(--color-D);
  background-color: var(--color-C);
}

.ty-w {
  text-align: center;
  padding: 1rem 3rem;
}

.ty-btn {
  background-color: var(--color-A);
  border-radius: 10rem;
  cursor: pointer;
  margin-top: 2rem;
}

.logo-success {
  display: block;
  position: absolute;
  width: 60vw;
  height: 25vh;
  left: 20vw;
  top: 20vw;
}

/*/////////////////// MEDIA QUERIES //*/