@charset"UTF-8";
aside,footer,header,main,nav,section 
{
    display : block;
}


html,body,h3,ul,li,a,p,aside,footer,input[type=text],input[type=button],header,main,nav,h2,section
{
  padding :0;
  margin : 0;
}

.banner /*para esilar  primer encabezado*/
{
   background-color: rgb(129, 33, 124);
   color: floralwhite;
   padding: 30px 50px;
   text-align: center;
}

h3 /*para posicionar el texto mayor en el primer encabezado*/
{
    margin-top: -45px;
}

h4  /*para posicionar el texto menor en el primer encabezado*/
{
    text-align : center;
    margin-left: 65px;
    margin-top: -15px;
}
.i /*para estilar el texto de tipo h4 en el segun encabezado*/
{
    text-align: left;
}

.m /*para estilar el texto en la tercera seccion*/
{
    text-align: center;
    margin-top: 10px;
}

.j/*para estilar el texto de tipo h4 en la tercera seccion*/
{
    text-align: center;
}


body /*para estilar todo el cuerpo de la pagina*/
{
   width : 960px ;
   margin-left: auto;
   margin-right: auto;
   background-color: rgb(194, 118, 184);
   font-family: Arial, Helvetica, sans-serif;
   font-size: 15px;
}

img
{
     /* para arreglar la imagen como quiera en el primer encabezado*/
    font-size: 15px;   /* tamano de la imagen*/
    margin-right: 140px;/* margen de la imagen*/
    margin-top : 10px;
    border: none;
    width: 50px; /* ancho de la imagen*/
   height: auto;/*altura de la imagen*/
}


main /*para estilar la parte principal de la pagina ,es decir, las secciones*/
{
    width : 640px;
    float: left;
    margin-bottom: 10px;
    margin-top: 10px;
}

.c/*para estilar la primera parte de main*/
{
    width : 960px;
    
}

.a/*para estilar el segun encabezado*/
{

   color: rgb(15, 15, 14);
   padding: 20px 30px;
   text-align: left;
   margin-left: -70px;
   
}

.h /*para estilar el texto del segun encabezado*/
{
    text-align: left;
   margin-top: -5px;
   margin-left: 40px;
}

.b/*para estilar la segunda seccion*/
{
    margin-top: 30px;
    padding: 50px 70px;
}

.d/*para estilar la tercera seccion*/
{
    margin-top: 30px;
    padding: 10px 20px;
}

.p/*para estilar el boton si*/

{
    padding: 10px 16px;
    width: 50px;
    height: auto;
    color: black;
    text-align: center;

}

.t/*para estilar el boton no*/
{
    padding: 10px 16px;
    width: 50px;
    height: auto;
    color: black;
    text-align: center;
    
}



.u /*para estilar los enlaces en el segun encabezado*/
{
    float: right;
    color : black;
    margin-top: -40px;
}

h5
{
    text-align: center;
    margin-top: 10px;
}


section/*para estilar todas las secciones juntas*/
{
  background-color: rgb(228, 160, 77);
  margin-top: 10px;
  padding: 5px;
  border-color: rgb(211, 55, 211);
}


aside /*para estilar la parte que se encuebtra al lado derecho de la pagina*/
{
    background-color: rgb(173, 102, 240);
    width : 200px;

    float: right;
    padding : 20px;
    margin-top : -250px;                
}

nav/*para estilar la parte donde se encuentran los enlaces*/
{
    background-color: rgb(241, 186, 230);
    padding: 5px;
    margin-top: 1px;
}

li a
{
    color: black;/*color de los enlaces*/
}

li
{
    display: inline;
    margin-left: 15px;
    margin-right:15px;
    font-size: 20px;
    font-variant: small-caps;
    font-weight: bld;
}

input[type=text]
    {
       border-color: black;
       margin-top: 5px;
    }
 
input[class=p]/*para posicionar los botones si y no*/
{
    margin-left:250px;
    
}

    input[type=button]
    {   color:rgb(12, 12, 12);
        margin-top: 20px;
        background-color: palevioletred;
    }   
        

footer/*para estilar el pie de pagina*/
{
    clear: both;
    background-color: rgb(129, 33, 124);
    color :black;
    padding: 5px 20px;
    margin-top:560px;
    text-align: center;
}