body {
 margin: 0px;
 padding: 0px;
 font-family: Segoe UI Regular;
 letter-spacing: -.2px;
 -webkit-touch-callout: none;
 -webkit-user-select: none;
 -khtml-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
}

/* Barra de menu superior */
.barrasuperior {
 position: fixed;
 height: 100px;
 width: 100vw;
 background: rgb(0,76,29); 
 transition: ease .5s;
 z-index: 999999; 
}

.barramenu {
 max-width: 1100px;
 height: 100px;
 margin: auto;
}

.logo {
 margin: 15px 0 0 20px;
 float: left;
 transition: ease .5s;
}

nav {
 margin-top: 55px;
 float: right;
 color: white;
 font-weight: 500;
 font-size: .8em;
}

nav a {
 margin: 0 15px;
 padding: 0 5px 5px 5px;
 cursor: pointer;
 text-decoration: none;
 background-image: linear-gradient(currentColor, currentColor);
 background-position: 0 100%;
 background-repeat: no-repeat;
 background-size: 0 2px;
 transition: background-size .3s;
}

nav a:hover {
 opacity: .6;
 background-size: 100% 2px;
}


/* Vista inicial */
.vistainicial {
 width: 100vw;
 height: 100vh;
 min-height: 1000px;
 background: rgb(0,76,29);
}

.centradoinicial {
 max-width: 1300px;
 margin: 0 auto;
}


.primerbloque {
 float: left;
}

.tituloentrada {
 display: flex;
 color: white;
 font-size: 2.5em;
 font-weight: 600;
 padding: 30vh 0 0 20px;
 max-width: 15em;
 line-height: 1em;
 margin-bottom: 15px;
}

.subtituloentrada {
 background: linear-gradient(to bottom, #ff9900, #ff7700);
 display: inline;
 padding: 2px 10px;
 margin-left: 20px;
 border-radius: 0 0 10px 10px;
 border-top: solid thin orangered;
 font-weight: 500;
 cursor: pointer;

}

.subtituloentrada:hover {
 filter: brightness(120%);
}

.imagenentrada {
 float: right;
 height: 500px;
 width: 620px;
 background-image: url(../imagenes/principal.png);
 background-repeat: no-repeat;
 background-size: 100% 100%;
 margin-top: 120px;
}

.mensajeentrada {
 width: 100%;
 float: left;
 color: #ABB695;
 text-align: center;
 font-weight: 500;
 padding: 40px 180px 40px 180px;
 box-sizing: border-box;
 font-size: 1.3em;
 opacity: .8;
}

.iconosentrada {
 float: left;
 width: 100%;
 padding: 0 150px;
 box-sizing: border-box;
 text-align: center;
 color: #CEC28C;
 font-weight: 700;
 font-size: 1.5em;
}

.iconosentrada img {
 padding: 0 10px;
 transition: ease .5s;
 height: 100px;
}

.iconosentrada img:hover {
 transform: scale(1.1);
 filter: brightness(150%);
}

.iconosentrada span {
 float: left;
 width: 100%;
 padding-bottom: 20px;
}

/* Contenido en cuerpo*/
main {
 max-width: 1300px;
 height: auto;
 margin: auto;
 display: flex;
 flex-flow: wrap;
}

.contenidoseccion {
 box-sizing: border-box;
 padding: 20px 250px 25px 250px;
 width: 100%;
 text-align: center;
 font-weight: 700;
 font-size: 2em;
}

.contenidoseccion img {
 padding-top: 20px;
}

.primercontenido {
 box-sizing: border-box;
 width: 50%;
 height: auto;
 border-radius: 50px;
}

.primercontenido img {
 width: 100%;
 border-radius: 10px;
}

.segundocontenido {
 box-sizing: border-box;
 width: 40%;
 padding: 100px 30px 0 30px;
}

.contenidovalores {
 width: 80%;
 margin: 0 auto;
 display: flex;
 flex-flow: wrap;
}

.valores {
 width: 250px;
 height: 300px;
 text-align: center;
 margin: auto;
}

.valores img {
 height: 70px;
 padding: 8px;
 border-radius: 10px;
 opacity: .7;
}

.contenidoservicios {
 width: 100%;
 margin: 0 auto 50px auto;
 display: flex;
 flex-flow: wrap;
}

.servicios img {
 margin-top: -50px;
 width: 85%;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
 border-radius: 20px;
 border: solid 2px white;
}

.servicios {
 width: 250px;
 height: 390px;
 background-image: linear-gradient(to top, rgb(0,76,29), black);
 box-sizing: border-box;
 padding: 8px;
 margin: 60px auto 0 auto;
 transition: ease .5s;
 transform: skewx(176deg);
 border: solid 1px black;
 -webkit-box-shadow: 0 8px 6px -6px gray;
 -moz-box-shadow: 0 8px 6px -6px gray;
 box-shadow: 0 8px 6px -6px gray;
 border-radius: 15px 15px;
 color: white;
}

.aplicacion {
 font-size: .8em;
 font-weight: 700;
 width: 650px;
 margin: 20px auto 0 auto;
 padding-right: 25px;
}

.refempleo {
 width: 650px;
 height: 400px;
 background: gray;
 margin: 20px auto 0 auto;
}

.aplicacion label {
    float: right;
 margin-top: 10px;
 z-index: 999;
}

.aplicacion input:not(.botonaplicacion), .aplicacion select {
 box-sizing: border-box;
 appearance: none;
 border-radius: 10px;
 height: 30px;
 border: solid 1px gray;
 margin-top: 5px;
 padding: 5px;
 width: 100%;
}

.botonaplicacion {
 background: linear-gradient(10deg, orangered, red);
 width: 120px;
 padding: 5px;
 border-radius: 10px;
 color: white;
 transition: ease .1s;
 cursor: pointer;
 box-shadow: .1px .1px .1px .1px green;
 transition: ease .15s;
 opacity: .8;
 float: right;
 margin-right: 25px;
}

.botonaplicacion:hover {
 transform: scale(1.05);
 opacity: 1;
}

.fondoflotante {
 margin-top: 10px;
 position: absolute;
 width: 100vw;
 height: 650px;
 background: rgba(0,0,0,5%);
 z-index: -2;
 left: calc(-50vw + 50%);
}

.servicios:hover {
 transform: scale(1.1);
 z-index: 99;
}

.contenidoempleo {
 width: 100%;
 height: auto;
 display: flex;
 flex-flow: wrap;
 margin-bottom: 50px;
}

.contenidoempleo span {
 text-align: center;
 width: 60%;
 margin: 0 auto
 
}

footer {
 width: 100vw;
 height: auto;
 bottom: 0;
 background: linear-gradient(to bottom, #001E0C, black);
 margin: 0 auto;
}

.contenidocontacto {
 max-width: 1300px;
 margin: 0 auto;
 display: flex;
 flex-flow: wrap;
}

.footerderecha {
 box-sizing: border-box;
 width: 40%;
 color: white;
 font-size: .75em;
 padding: 20px;
 margin: 10px 5px 30px 5px;
 font-weight: 500;
 text-align: center;
 background: #18330C;
 border-radius: 10px;
}

.footerderecha input:not(.boton) {
 box-sizing: border-box;
 appearance: none;
 margin: 0 5px 15px 0;
 padding: 10px;
 height: 35px;
 border-radius: 8px;
 width: 95%;
 text-align: left;
 opacity: .3;
 padding: 2px 12px;
 font-weight: 600;
 font-style:italic;
 font-size: 1.3em;
 text-align: center;
}

.footerderecha input:not(.boton):focus {
 opacity: .8;
}

.titulocontacto {
 font-weight: 700;
 font-size: 2em;
}

.requerido {
    font-size: .8em;
    font-style: italic;
    float: right;
}

.white{
 color:white;
}

.footerderecha textarea {
 box-sizing: border-box;
 appearance: none;
 margin: 0 5px 15px 5px;
 height: 100px;
 border-radius: 8px;
 width: 95%;
 text-align: left;
 opacity: .30;
 padding: 2px 12px;
 font-weight: 600;
 font-style:italic;
 font-size: 1.4em;
 resize: none;
 font-family: Segoe UI Regular;
 text-align: justify;
}

.footerderecha textarea:focus {
 opacity: .8;
}

.boton {
 background: linear-gradient(10deg, orangered, red);
 width: 170px;
 padding: 5px;
 border-radius: 10px;
 color: white;
 transition: ease .15s;
 cursor: pointer;
 box-shadow: .1px .1px .1px .1px green;
 opacity: .8
}

.boton:hover {
 transform: scale(1.05);
 opacity: 1;
}

.footerizquierda {
 box-sizing: border-box;
 width: 58%;
 margin: 20px 0;
 height: auto;
 padding: 10px;
 font-size: 0.8em;
 font-weight: 600;
 line-height: 1.6em;
 font-style: italic;
}

.footerizquierda a:link {
 text-decoration: none;
 color: currentColor;
 font-weight: 600;
}

.mapa {
 width: 100%;
 height: 200px; 
 border:0;
 margin-bottom: 20px;
 border-radius: 10px;
}

.creditos {
 text-align: center;
 width: 100vw;
 background: black;
 border-top: gray inset 1px;
 color: white;
 font-size: .7em;
 padding: 8px 0;
 font-style: italic;
 opacity: .3
}

.footerizquierda a:hover {
 color: olivedrab;
}

.redes {
 margin-top: -50px;
 text-align: right;
}

.redes img {
 width: 35px;
 padding-left: 8px;
 cursor: pointer;
 opacity: .2;
 transition: ease 1s;
}

.redes img:hover {
 opacity: .8;
}

.bienvenida {
 font-style: italic;
 font-weight: 900;
 color: rgb(0,76,29);
 font-size: 1.1em;
 line-height: .9em;
 text-shadow: .5px .5px .5px gray;
}

.bienvenida2 {
 font-style: italic;
 font-weight: 900;
 color: white;
 font-size: 1.1em;
 line-height: .9em;
 text-shadow: .5px .5px .5px green;
}

.resaltar {
 font-weight: 700;
}

.textosval {
 font-size: .8em;
 padding: 0 30px 20px 30px;
}

.titulosval {
 font-size: 1em;
 font-weight: 700;
}

.textosser {
 font-size: .8em;
 padding: 0 30px 20px 30px;
}

.titulosser {
 box-sizing: border-box;
 margin-top: 10px;
 font-size: 1.1em;
 font-weight: 700;
 line-height: 1.1em;
 background: white;
 width: 107%;
 padding: 7px 15px;
 margin-left: -8px;
 border: solid 1px black;
 color: black;
 
}

.textos {
 font-size: 0.9em;
 font-weight: 400;
}

.titulos {
 font-size: 1.4em;
 font-weight: 700;
}

.encabezados {
 background: rgb(0,76,29);
 display: inline-block;
 padding: 4px 13px;
 font-weight: 500;
 color: white;
 border-radius: 10px 10px 0 0;
 margin: -10px 0;
}

.derecha {
 text-align: right;
}

.contenido {
 width: 100%;
}

.margen1{
 margin-top: 25px; 
}

.centrado {
 text-align: center;
}

@media screen and (max-width: 1300px)and (orientation: landscape) {
 .centradoinicial {
  display: flex;
  flex-flow: column;
 }
 
 .centradoinicial > * {
  order: 0;
 }

 .primerbloque {
  order: 2;
  margin: 0 auto 20px auto;
 }
 
 .imagenentrada {
  order: 1;
  margin: 120px auto 30px auto;
 }
 
 .mensajeentrada {
  order: 3;
 }
 
 .iconosentrada {
  order: 4;
 }

 .tituloentrada {
  padding-top: 0;
 }
 
 .vistainicial {
  height: 130%;
 } 
 
 .servicios {
  box-sizing: border-box;
  width: 235px;
 }
 
 .valores {
  width: 25%;
 }
 
 .servicios:hover {
  transform: scale(1.2);
 }
 
 .primercontenido, .segundocontenido {
  height: 47%;
  margin-left: auto;
  margin-right: auto;
 }
 
 .contenidocontacto {
  flex-flow: wrap;
 }
 
 .segundocontenido {
  padding: 80px 30px 0 30px;
 }
 
}

@media screen and (max-width: 1300px) and (orientation: portrait) {
 main {
  display: flex;
 }
 
 main > * {
  order: 0;
 }
 
 #uno {
  order: 1;
 }
 
 #dos {
  order: 2;
 }
 
 #tres {
  order: 4;
 }
 
 #cuatro {
  order: 3;
 }
 
 #cinco {
  order: 5;
 }
 
 #seis {
  order: 6;
 }
 
 #siete {
  order: 7;
 }
 
 #ocho {
  order: 8;
 }
 
 #nueve {
  order: 9;
 }
 
 #servicios {
  order:10;
 }
 
 #once {
  order:11;
 }
 
 #doce {
  order:12;
 }
 
 #trece {
  order:13;
 }
 
 #catorce {
  order:15;
 }
 
 #empleo {
  order:14;
 }
 
 #quince {
  order:16;
 }
 
 .centradoinicial {
  display: flex;
  flex-flow: column;
 }
 
 .centradoinicial > * {
  order: 0;
 }

 .primerbloque {
  order: 2;
  margin: 0 auto 20px auto;
 }
 
 .imagenentrada {
  order: 1;
  margin: 120px auto 30px auto;
 }
 
 .mensajeentrada {
  order: 3;
 }
 
 .iconosentrada {
  order: 4;
 }

 .tituloentrada {
  padding-top: 0px;
 }
 
 .vistainicial {
  height: 130%;
 }
 
 .mensajeentrada {
  font-size: 1.4em;
  padding: 30px 50px;
 }
 
 .primercontenido, .segundocontenido {
  width: 90%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
 }
 
 .segundocontenido {
  padding: 0 30px 30px 30px;
  margin: -15px auto;
 }
 
 .valores {
  width: 50%;
 }
 
 .contenidoseccion {
  box-sizing: border-box;
  padding: 20px 25px 25px 25px;
 }
 
 .fondoflotante {
  background: rgba(0,0,0,0);
 }
 
 .contenidovalores {
  background: rgba(0,0,0,5%);
 }
 
 .servicios {
  box-sizing: border-box;
  width: 320px;
  height: auto;
 }
 

 
 .servicios:hover {
  transform: scale(1.4);
 }
 
 .encabezados {
     border: solid medium white;
 }
 
   .aplicacion {
       width: 80%;
       margin: 0 auto;
   }
   
   .contenidoempleo span {
 width: 90%;
 
}

  .aplicacion {
 width: 80%;
}
   
   .refempleo {
 width: 80%;
}

.contenidoempleo {
     flex-flow: column;
 }

}

@media screen and (max-width: 1300px) {
 .barrasuperior, .barramenu, .vistainicial, .centradoinicial, .contenidoservicios, .mensajeentrada, .iconosentrada, .contenido, main, .contenidoseccion, .contenido, .contenidovalores, .contenidocontacto, footer, .creditos {
  min-width: 550px;
 }
 
 
 .barrasuperior {
  height: 130px;
 }
    
 .barramenu {
  width: 100vw;
  display: flex;
  flex-flow: column;
 }
    
 nav {
  margin: 0 auto;
  padding-top: 20px;    
 }
    
 .logo {
  margin: 10px auto 0 auto;
 }
 
 
    
 .tituloentrada {
  font-size: 2em;
 }
 
 .primerbloque {
  text-align: center;
 }
 
 .iconosentrada {
  padding-bottom: 20px;
  padding: 0 90px;
 }
 
 .iconosentrada img {
  padding: 20px 5px;
  height: 100px;
 }
 
 .contenidocontacto {
  margin: 0 auto;
 }
 
 .footerderecha, .footerizquierda {
  width: 90%;
  margin: 10px auto;
 }
 
 footer {
  height: auto;
  text-align: center;
 }
 
 .redes {
  margin: 20px 0 0 0;
  text-align: center;
 }
 


 
 
}