*{
    margin: 0px;
    padding: 0px;   
}
div#general{
  margin: auto;
    margin-top:50px; 
    width: 550px;
    height:889px;
    background-color:#808896;
    list-style: none;
   }
div#contenedorsuperios{
    width: 550px;
    height:100px;
    background-color: #16306c;        
}

div#botones3{
    width: 550px;
    height: 450px;
    margin-top:160px;
}



/*mantiene el fila la barra superior*/
.nav-hidden{
    display: none !important;
}

/*tItulo de barra superior*/ .titulo{
    margin: 24px 60px 10px 0px;
    color:#ff7e81;
font-family:sans-serif;
    font-size: 1.7rem ;
}

/*propiedades de la barra*/
.barra_superior {display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between}
.menu_contenedor {padding: 1rem;}

nav a{
    text-decoration: none;
}
div div a{
     text-decoration: none;
}
div span{
    padding:35px; 
    margin: 5000px 0px 0px 0px;
}
 
/*Desplegable menu inicio*/

.nav-opciones{background:#7fffd4;
    
}

.menu_contenedor {width: 3%;
color:#16306c}

header nav ul{
    height:52.31rem;
    width: 18.75rem;
    background:rgba( 0,0,0,0.8);
    list-style: none;
    position: relative
    
}
header nav ul li{
    display:block;
   
}
header nav ul li:hover{
    background:#E6344A;
}
header nav ul li a{
    color:#fff;
    display: block;
    text-decoration: none;
    padding: 2.5rem ;
    font-family: sans-serif;
}

div a span{
    
    padding:50px 10; 
    height: 50px;
    width:0px;
    color: aquamarine;
     font-size:35px;
     margin:0px 0px 0px 0px;
} 
/*fin de fondo y barra superior*/

/*nnnnnnnnnnnnnnnnnnnnnnnooooooooooooooooooooooooooooooooooooooooo tttttttttocarrrrrrrrrrrrrrrrrrrr*/


.subtitulo{
    color: #fff;
    margin: 80px 0px 0px 130px;
    width: 400px;
    font-family: sans-serif;
    
}



/*Estilos Generales*/
.buttonwhite{
    background:#7f8c8d;
    color: #fff;
    display: inline-block;
    font-size:18px;
    margin: 20px;
    padding: 10px 0px;
    text-align: center;
    width: 500px;
    text-decoration: none;
    box-shadow: 0px 3px 0px #373c3c;
    font-family: sans-serif;
    
}


/*Colores*/
.buttonwhite {
    background: #5f697c;
    box-shadow: 0px 3px 0px #303541;
    
}
.buttonwhite:hover{
    background:#7fffd4;
    color:#282e3b;
}


/*tamaños*/

.buttonwhite.medium{
    margin:5px 0px 0px 0px;
    width:550px; 
    height: 65px; 
}



.buttonwhite:hover{
    box-shadow: 0px 0px 0px;
    padding-top: 7px;
    float: left;
}

/*saca los puntitos de las listas*/
main div ul{list-style: none;
}



/*barraverde hubicacion*/
img{
    max-width: 100%;
    
}
.caja5{
    border:0px solid #999;
    padding: 0;
    width:550px;
    left:2px;
     margin:-720px  20px 10px 0px;
}

.lineaver{
    width:400px;
    left:50px;
     margin:80px 0px 10px 78px;
}




                          /*HOJA2............................................*/



.enlaces a{
    display: block;
     box-shadow: 0px 0px 0px;
    padding-top: 30px;
     

}




.subtitulo1 {
    margin: -38px 20px 10px 210px;
    color: #16306c;
font-family: 'Roboto', sans-serif;
    height: 30px;
    width: 250px;
}

.contenido{
    display: inline-block
    padding: 1;
  margin:0px 0px 10px 100px;
 color: #fff;
  font-family: 'Roboto', sans-serif;
    height: 0px;
    width: 400px;
}

/*Estilos Generales boton*/
.buttonorange{
    background:#7FFFD4;
    color: #16306C;
    display: inline-block;
    font-size:18px;
    margin: 20px;
    padding: 10px 0px;
    text-align: center;
    width: 200px;
    text-decoration: none;
    box-shadow: 0px 3px 0px #373c3c;
    font-family: sans-serif;
    border-radius: 15px;
}
/*Colores*/
.buttonorange {
    background: #7FFFD4;
    box-shadow: 0px 3px 0px #303541;
}

/*tamaños*/

.buttonorange{
    margin: 440px 40px 10px 70px;
    width:400px; 
    left:0px; 
}


/*estilos generales de boton fin*/










/*para iconosde hamburguesa y registro*/
header nav ul li a{
    color:#fff;
    display: block;
    text-decoration: none;
    padding: 30px ;
    text-decoration: none;
    font-family: sans-serif;
}


.barra_inferior li{
  float:right;
    list-style: none;
    padding: 22px;
    margin:10px 9px 0px 25px; 
    
}


/*barra inferior*/
nav#registro {
  
  margin:60px 0px  0px 0px; 
   
    background:#16306c;
    height: 100px;
    width: 550px;
    padding: 
    
}
/*barra inferior fin*/



.abc{
    border:0px solid #999;
    padding: 10;
    width:450px;
    left:2px;
     margin:70px 0px 0px 80px;
    }




/*PANTALLA3.....................*/
/*ESTILO DE LA GALERIA*/
.galeria{
    width: 90%;
    height: 100%
    margin: 0px 0px 0px px;
    list-style: none;
    padding: 25px;
    
    
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.galeria li{
    margin:10px;
}

.galeria img{
    width: 204px;
    height:326px;
}





h {
    margin:-50px 200px 10px 265px;
    color: #fff;
font-family: 'Roboto', sans-serif;
    height: 0px;
    width: 0px;
}





/*estilos del modal*/

.modal{
    display: none;
    
}


.modal:target{
    display: block;
    position: absolute;
    background: rgba( 0,0,0,0.8);
    top:50px;
    left:5;
    width:550px;
    height: 889px;
    margin:50px 100px 40px20px;
    
}

.modal h3{
    color: #fff;
    font-size: 15px;
    text-align: center;
    margin: 15px 0px;

    
}

.imagen{
    width: 100%;
    height: 80%;
    
    display: flex;
    justify-content: center;
    align-items:center;
    
    
    
    
    
    
}
.imagen a{
    color: #fff;
    font-size: 40px;
    text-decoration: none;
    margin: 0 10px;

}
.imagen a:nth-child(2){
    margin: 0;
    height: 100%;
}

.imagen img{
    width: 600px;
    height: 100%;
    max-width: 100%;
    border: 7px solid #fff;
    box-sizing: border-box;
}

.cerrar{
    display: block;
    background: #fff;
    width: 25px;
    height: 25px;
    margin: 20px auto;
    text-align: center;
    text-decoration: none;
    font-size: 25px;
    color: #000;
    padding: 5px;
    border-radius: 25px;
}

.modal h3{
 color:#fff;
    font-size: 25px;
    text-align: center;
    margin: 15px 0;
    width: 350px;
    height: 39px;
  
}


/*PANTALLA 4.........................................*/



/*menu desplazable inicio*/
div section{
    width: 100%;
    background:#3e558a;
    box-shadow: 1px 1px 5px #000;
    height: 50px;
}
#menudesplazable1{
  width: 550px;
  padding-top: 10px;
  margin: 3px auto;
}

#menudesplazable1 ul a{
    color: #fff;
    text-decoration: none;
    font: bold 16px san-serif;
    font-family:sans-serif;
    padding:11px 47px 23px 46px;
    background:transparent;
    border-bottom:9px solid transparent;
    margin:4px auto;
    transition:border-bottom .7s;
    
}

#menudesplazable1 ul a:hover{
    border-bottom:9px solid #7fffd4;
}
/*menu desplazable fin*/

.buttonrosa{ackground:;
    color: #ff7e81;
    display: inline-block;
    margin: 50px;
    padding:10px 0px;
    text-align: center;
    width: 200px;
    text-decoration: none;
    box-shadow: 0px 3px 0px #373c3c;
    font: bold 18px sans-serif;
    border-radius: 15px;
    border: 4px solid;
    transition:background .5s, color .5s;
     margin:10px 0px 0px 160px;
}

/*transparencia de menu hamburguesa*/
.buttonrosa:hover{
    background:#7fffd4;
    color:#16306c;
}
/*estilos generales de boton fin*/



/*inicio de ficha*/
.caja1  {
    width:500px;
    height: 162px;
    background:#ff7e81;
    border-radius: 15px;
    margin:35px 0px 0px 25px;
}

h2{
    color: #16306c;
   font: bold 18px san-serif;
    font-family:sans-serif;
    margin:-135px 0px 0px 250px;
    width:230px;
}

.subtitulo8{
    color: #16306c;
   font:  14px san-serif;
    font-family:sans-serif;
    margin:30px 0px 0px 200px;
    padding:5px;
    width:120px;
}

    
.ficha1{
    margin:-120px 0px 0px 30px;
    width: 480px;
}  
         
.flecha{
 margin:-145px 0px 0px 433px;   
}
/*fin de ficha*/



/*inicio de ficha*/
.caja2  {
    width:500px;
    height: 156px;
    background:#ff7e81;
    border-radius: 15px;
    margin:115px 0px 0px 25px;
}

h2{
    color: #16306c;
   font: bold 18px san-serif;
    font-family:sans-serif;
    margin:-135px 0px 0px 250px;
    width:230px;
}

.class="subtitulo8"{ color: #16306c;
   font:  14px san-serif;
    font-family:sans-serif;
    margin:30px 0px 0px 200px;
    padding:5px;
    width:120px;
}


    
.ficha2{
    margin:-120px 0px 0px 30px;
    width: 480px;
    margin-left: auto;
}  
         
.flecha{
 margin:-145px 0px 0px 438px;   
}
/*fin de ficha*/



/*inicio de ficha*/
.caja3  {
    width:500px;
    height: 162px;
    background:#ff7e81;
    border-radius: 15px;
    margin:115px 0px 0px 25px;
}

h2{
    color: #16306c;
   font: bold 18px san-serif;
    font-family:sans-serif;
    margin:-135px 0px 0px 250px;
    width:230px;
}

.class="subtitulo8"{
    color: #16306c;
   font:  14px san-serif;
    font-family:sans-serif;
    margin:30px 0px 0px 200px;
    padding:5px;
    width:120px;
}

h4{
    color: #16306c;
   font: 14px san-serif;
    font-family:sans-serif;
    margin:-45px 0px 0px 400px;
    padding: 5px;
       width:80px;
    display: flex;
   flex-direction: row;
    position: relative
}
    
.ficha2{
    margin:-120px 0px 0px 30px;
    width: 480px;
}  
         
.flecha{
 margin:-145px 0px 0px 438px;   
}
/*fin de ficha*/




/*inicio de ficha*/


h2{
    color: #16306c;
   font: bold 18px san-serif;
    font-family:sans-serif;
    margin:-135px 0px 0px 250px;
    width:230px;
}

.class="subtitulo8"{
    color: #16306c;
   font:  14px san-serif;
    font-family:sans-serif;
    margin:30px 0px 0px 200px;
    padding:5px;
    width:120px;
}

    
.ficha2{
    margin:-120px 0px 0px 30px;
    width: 480px;
}  
         
.flecha{
 margin:-145px 0px 0px 438px;   
}

/*fin de ficha*/

.caja6 img{
    margin:117px 0px 0px 30px
    
}



           /*PANTALLA 5...............................*/





.cajaultima{
    border:0px solid #999;
    padding: 0;
    width:550px;
    left:2px;
     margin:00px  20px 10px 0px;
}

/*barra y linea hubicacion*/
img{
    max-width: 100%;
    
}
.caja{
    border:0px solid #999;
    padding: 0;
    width:550px;
    left:2px;
     margin:00px  20px 10px 0px;
}

.linea{
    width:550px;
    left:50px;
     margin:70px 10px 0px 78px;
}

/*finde barra  linea hubicacion*/


/*Estilos Generales*/
.buttonred{
    background:#5f697c;
    color: #fff;
    display: inline-block;
    font-size:18px;
    margin: 20px;
    padding: 10px 0px;
    text-align: center;
    width: 500px;
    text-decoration: none;
    box-shadow: 0px 3px 0px #373c3c;
    font-family: sans-serif;
    
}




/*Colores*/
.buttonred {
    background: #5f697c;
    box-shadow: 0px 3px 0px #303541;
    
}
.buttonred:hover{
    background:#ff7e81;
    color:#282e3b;
}


/*tamaños*/

.buttonred.medium{
    margin:4px 100px 0px -25px;
    width:550px; 
    height: 55px; 
}

.buttonred:hover{
    box-shadow: 0px 0px 0px;
    padding-top: 7px;
}


div#botones4{
margin: auto;
    margin-top:120px;
    width: 500px;
    height: 329px;
     border: 1px;}

main  div ul{
    list-style: none;
}


.buttonred{
    margin: 440px 40px 10px 70px;
    width:400px; 
    left:0px; 
}


/*menu desplazable inicio*/

section{
    width: 100%;
    background:#3e558a;
    box-shadow: 1px 1px 5px #000;
    height: 50px;
}
#menudesplazable{
  width: 550px;
  padding-top: 10px;
  margin:-58px auto;
}

#menudesplazable ul a{
    color: #fff;
    text-decoration: none;
    font: bold 16px san-serif;
    font-family:sans-serif;
    padding:7px 18px 23px 19px;
    background:transparent;
    border-bottom:9px  solid transparent;
    margin:4px auto;
    transition:border-bottom .7s;
}

#menudesplazable ul a:hover{
    border-bottom:9px solid #ff7e81;
  
}

menudesplazable ul a{
    margin:0px  20px 10px 0px;
}
    
/*menu desplazable fin*/


article h3{
    color:#16306c;
     margin:0px 20px 0px 20px;
    width:200px;
    font: bold 18px san-serif;
    font-family: sans-serif
}

article p{
    color:#fff;
     margin:50px 0px 10px 200px;
    width:150px;
    font-family: sans-serif;
    font: 15px;
}


.subtitulo3{
    padding: 0px;
    margin: -40px 50px 0px 90px;
    width: 380px;
    height:50px;
    color:#fff;
    font-size:28px;
    font-family:sans-serif;
}


/*PANTALLA 6..............................*/


div a span{
    
    padding:50px 10; 
    height: 50px;
    width:0px;
    color: aquamarine;
     font-size:35px;
     margin:0px 0px 0px 0px;
}

/*estilos generales de boton inicio*/
form{
    margin:100px 50px 0px 30px;
    padding: 40px;
    background: #16306c;
    border: 1px; solid(0,0,0,0.2);
    width: 400px;
    border-radius: 15px
    }
.subtitulo6{
    text-align: center;
    margin-bottom: 0px;
    color: #ff7e81;
    font-family:sans-serif ;
    font: ligth 10px ;
}
input{
    display: block;
    padding: 20px;
    width: 300px;;
    margin: 30px auto;
    font-size: 20px;
    border-radius: 15px;
    color:#fff
    }
input[type="submit"] {
    background: #ff7e81;
    box-shadow: 0px 3px 0px #303541;
}
/*estilos generales de boton fin*/


h3 {
    margin: 40px 0px 0px 30px;
    color: #FFF;
font-family: 'Roboto', sans-serif;
    font-size: 25px;
    height: 30px;
    width:100px;
}

h6 {
    margin: 0px 0px 10px 30px;
    color: #16306c;
font-family: 'Roboto', sans-serif;
    font-size: 12px;
    height: 30px;
    width:300px;
   
}









































