:root {
    --naranja1: rgb(239,102,42);
    --amarillo: rgb(252,221,5);
    --naranja2: rgb(234,163,61);
    --verde: rgb(57,181,74);
    --verde2: #00c18a;
  --morado: #2f1c72;
    --negro: rgb(11,23,53);
    --azul: rgb(14,118,188);
    --gris: rgb(93,99,118);
}

html, body {
  width: 100vw !important;
    overflow-x: hidden;
}


/***  apartado para fonts ****/

@font-face {
    font-family: 'Montserrat';
    src: url('/fonts/Montserrat-Regular.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
  }

@font-face {
    font-family: 'Montserrat-Bold';
    src: url('/fonts/Montserrat-Bold.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
  }

@font-face {
    font-family: 'Montserrat-SemiBold';
    src: url('/fonts/Montserrat-SemiBold.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
  }


@font-face {
    font-family: 'MavenPro';
    src: url('/fonts/MavenPro-Regular.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
  }

@font-face {
    font-family: 'MavenPro-Bold';
    src: url('/fonts/MavenPro-Bold.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
  }

@font-face {
    font-family: 'MavenPro-SemiBold';
    src: url('/fonts/MavenPro-SemiBold.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
  }


  body {
    font-family: Gilroy !important;
    font-size: 1.4rem !important;
  }

header {
    height: 10.5 rem;
    box-shadow: 7px 0px 1px 1px #00000026;
    padding: 0.5rem;
  	width: 100vw;
  background-color: #042990;
}

footer {
    background-color: #ff0000;
    width: 100vw;
    display: block;
    color: white;
    padding-top: 2rem;
    padding-bottom: 2rem;
    /*margin-top: 100vh;*/
}

#logo {
  margin-top: 0.5rem;
    margin-left: 1rem;
}

#BtnMenu {
  width: 4rem;
  height: 3rem;
  margin-top: 1rem;
}

#MenuSuperior01 > li > a {
  	color: white !important;
    font-variant: all-petite-caps;
  	font-family: MavenPro;
}

#MenuSuperior01 > li {
  padding-left: 0.5rem;
    padding-right: 0.8rem;
}

#redes01 {
      margin-left: 2rem;
  position: absolute;
    top: 1rem;
    margin-bottom: 2rem;
    /* left: 27vw; */
}

.imgRed01 {
  width: 3rem;
}

#RadioMovil {
  display: flex;
  align-content: space-around;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  background-color: var(--morado);
  color: white;
  font-weight: 900;
  padding: 0.5rem;
}


#Moviles {
  /** background-image: url(/images/fondo.jpg);**/
    background-size: contain;
    padding-top: 5rem;
    padding-bottom: 6rem;
  font-family: 'MavenPro';
}

.apps {
  max-width: 13rem;
    margin-right: 2rem;
    display: inline-block;
}

#musica {
  background-image: url(/images/fondo2.jpg);
    min-height: 14rem;
    padding-top: 5rem;
    background-size: contain;
}

#navmenu1 {
    list-style: none;
    display: inline-flex;
}

#navmenu1  > li {
    padding: 0.8rem;
    font-size: 1.1rem;
    font-weight: 700;
}

#navmenu1 > li > a {
	color: black;
}

#navmenu1 > li > a:hover  {
  	color: #94cb59 !important;
    text-decoration: solid;  
  	zoom: 1.3;
    position: relative;
    top: -5px;
}

#menuDesk {
    padding-top: 2.25rem;
}


#btnSup1 {
    height: 2.5rem;
    margin-left: 2rem;
    margin-top: 0.5rem;
}



#lateralMenu {
  	z-index: 95100;
    width: 80vw;
    background-color: #0a1470;
    height: 100vh;
    top: 0;
    position: absolute;
    left: -105vw;
    transition: left 1.5s;
}

#lateralMenu > .nav {
  flex-direction: column;
}

.btnLateral {
    font-size: 2rem !important;
    margin-top: -34px;
    margin-bottom: 0px;
    font-weight: 900 !important;
}

#Mlateral > ul {
  margin-top: 3rem;
}

#Mlateral > ul > li > a {
  	font-weight: 700;
    font-size: 1.3rem;
    vertical-align: -webkit-baseline-middle;
    text-decoration: none;
    font-family: 'Gilroy-Bold';
}


#Mlateral > ul > li {
    width: 100%;
    border-bottom: 1px solid #00a981;
    line-height: 2;
    height: 3rem;
    text-align: center;
    padding-bottom: 3.5rem;
    font-weight: 700;
}


/*** formularios con efecto movil y linea baja ***/

.form__group {
    position: relative;
    padding: 15px 0 0;
    margin-top: 10px;
    width: 100%;
  }
  
  .form__field {
    /*font-family: inherit;*/
    width: 100%;
    border: 0;
    border-bottom: 2px solid white;
    outline: 0;
    font-size: 1.3rem;
    color: #fff;
    padding: 7px 0;
    background: transparent;
    transition: border-color 0.2s;
  }
  .form__field::placeholder {
    color: transparent;
  }
  .form__field:placeholder-shown ~ .form__label {
    font-size: 1.3rem;
    cursor: text;
    top: 20px;
  }
  
  .form__label {
    position: absolute;
    top: 0;
    display: block;
    transition: 0.2s;
    font-size: 1rem;
    /*color: #9b9b9b;*/
  }
  
  .form__field:focus {
    padding-bottom: 6px;
    font-weight: 700;
    border-width: 3px;
    border-image: linear-gradient(to right, #f2f3f3, #6873db, white);
    border-image-slice: 1;
  }
  .form__field:focus ~ .form__label {
    position: absolute;
    top: 0;
    display: block;
    transition: 0.2s;
    font-size: 1rem;
    /*color: #11998e;*/
    font-weight: 700;
  }
  
  /* reset input */
  .form__field:required, .form__field:invalid {
    box-shadow: none;
  }


h3 {
  font-family: Gilroy-Bold;
    font-size: 2.1rem;
    padding-bottom: 1.5rem;
    /*line-height: 0.5rem !important;*/
    margin-bottom: 3rem !important;
}

.hrx1 {
    border-block-color: var(--verde2);
    border-width: 7px;
    width: 15vw;
    margin-left: 0px;
    margin-top: -3.1rem;
    margin-bottom: 3rem;
}

.txt001 {
      font-family: 'Gilroy-Bold';
    font-size: 1.7rem;
    margin-top: 1.2rem;
    text-align: center;
}

.mt-10 {
  margin-top: 10rem;
}

.tblog1 {
      text-align: justify;
    line-height: 2rem;
    min-height: 32.3rem;
    margin-top: 2rem;
}

.tpie {
       font-size: 1.8rem;
    margin-top: 5rem;
    margin-bottom: 3rem;
    font-weight: 700;
}

.tpie2 {
    font-size: 0.8rem;
    color: white;
    text-align: justify;
}

#cuerpo {
    width: 100vw;
}


#RSociales {
    zoom: 0.85;
    margin-top: 2rem;
    margin-left: 3rem;
}

#RSociales > a {
  margin-right: 1.2rem;
}

#pasador1 {
    overflow: hidden;
    height: 32vw;
    margin-bottom: 5rem;
    padding-left: 24vw;
}

.txt02 {
  font-size: 1.2rem;
    text-align: justify;
}

body {
      background-color: white !important;
}

@media only screen and (max-width: 760px) {
  #pasador1 {
    	overflow: hidden;
    height: 58vw;
    margin-bottom: 5rem;
    padding-left: 3vw;
  }
}