/*****************************************************************************
Elaborado	: por:Yader Ricardo Morales Sevilla
******************************************************************************/

<style>
/*Definiendo las fuentes externas */
@font-face {
  font-family: "Open Sans";
  src: url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.eot");
  src: url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"),
       url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.woff") format("woff"),
       url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}


@font-face {
  font-family: "Open Sans Light";
  src: url("//www.mozilla.org/media/fonts/OpenSans-Light-webfont.eot");
  src: url("//www.mozilla.org/media/fonts/OpenSans-Light-webfont.eot?#iefix") format("embedded-opentype"),
       url("//www.mozilla.org/media/fonts/OpenSans-Light-webfont.woff") format("woff"),
       url("//www.mozilla.org/media/fonts/OpenSans-Light-webfont.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
/*Definiendo id y Clases */
 html, body, aside, article, footer, section, nav, header, p, h1, h2, h3{
                margin:0;
                padding:0;
            }

            body{
                margin:0 auto;
                width:960px;
                --background-image: url(..imagenes/medical-background.jpg);
                --background-image: url(/imagenes/medical-background.jpg);
                background-color: #E6E6E6;
                font-family: "Open Sans", "Helvetica", "sans.serif";
                font-size: 1em;
            }

            /*Etiquetas estrucurales*/
            header{
              background-color: #F2F2F2;
              height:60px;
            }
            
            section{
              --margin:20 auto;
              padding:10px; 
              background-color: #F2F2F2;
              height:600px;
            }
            aside{
              padding:10px; 
              background-color: #F2F2F2;
              color: #0B3861;
              font-family: "Open Sans", "Helvetica", "sans.serif";
              text-align: justify;
              font-style: italic;
            }
            footer{
                height:150px;
                text-align: left;
                font-size: 0.9em;
                font-style: Italic; 
                font-family: "Open Sans", "Helvetica", "sans.serif";
                color: #6E6E6E;
                background-color: #F2F2F2;
                padding-bottom: 20;
            }
            
           


#Titulos {
p:font-family:"Open Sans Light","Arial","Helvetica", "sans.serif"; font-size: 1.8em; font-weight: 100;color : #000000; 
}
#SubTitulos {
p:font-family:"Open Sans","Arial","Helvetica", "sans.serif"; font-size: 1.2em; font-weight: 100; color :#000000 ;background-color: #F2F2F2;
}
#Fecha {
font-family:"Arial","Helvetica", "sans.serif"; font-size: 1em; font-weight: 100; color :#0489B1;
}
.Enunciados {
font-family:"Arial","Helvetica", "sans.serif"; font-style: Italic; font-size: 1.2em; font-weight: 300; color :#000000 ;
}
.Encabezados {
font-family:"Arial","Helvetica", "sans.serif"; font-style: Italic; font-size: 1em; font-weight: 300; color :white;
}
.Info {
font-family:"Arial","Helvetica", "sans.serif"; font-style: Normal; font-size: 0.8em; font-weight: 300; color :white; text-align:right;
}
#Imagenes {background-color:#6E6E6E;}
#Enlaces{font-family:"Arial","Helvetica", "sans.serif"; font-style: Italic; font-size: 0.9em; font-weight: 300; color :#013ADF; }


/* Propiedades del Menu */
  .cajamenu{
    background-color: black;
    padding: 5px;
  }
  nav{
    width : 960px;
    height: 62px;
  }

  ul{      
    list-style: none;
    margin: 0px;
    padding: 0px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #ccc;
    background-color: #EAEAEA;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #ccc;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #ccc;
  }
  li{background-color: black;
    display: inline;
  }
  a{

    font-family: OpenSans-Regular-webfont, Arial, Helvetica;
    color: white;
    text-decoration: none;
    font-size: 1.1 em;
    display: block;
    padding: 18.5px; 
    float: left;

  }
  a:hover {
    color:#424242;
    font-weight: 100;
    background-color: #D7DF01;
  }
  .clear: { both;
  }

  /*Propiedades del Box*/
  .caja{width:960px;
    background-color: #2E9AFE;
    color: black;
  }
  .caja .centro {
    width: 60%;
    float:left;
  }
  .caja .izquierda{
    width: 20%;
    float: left;
  }
    .caja .derecha{
    width: 20%;
    color:black;
    float: left;
  }

    .caja .texto {
    padding: 10px;
    width: 450px;
    height: 55px;
    color: white;
    font-size: 1.2em;
    background-color: #2E9AFE;
    position:absolute;
    left: 130px;
    top:350px;
    text-align: center;
    padding-left: 10px;
  }
  .clear{
    clear:both;
  }

  .cajapie{
    background-color: #FFFFFF;
    padding: 25px;
  }
  .cajapie .centropie {
    width: 33%;
    --background-color: #FFFFFF;
    float:left;
  }
  .cajapie .izquierdapie{
    width: 33%;
    float: left;
    --background-color: #FFFFFF;
  }
    .cajapie .derechapie{
    width: 33%;
    float: left;
    --background-color: #FFFFFF;
    text-align: right;
  }
  .clearpie{
    clear:both;
  }

.cajaseccion{
    font-family:  "Open Sans Light","Arial","Helvetica", "sans.serif";
    padding: -10px;
    padding-right: -5;
    color: black;
  }
  .cajaseccion .izquierdaseccion{
    width: 30%;
    float: left;
  }
    .cajaseccion .derechaseccion{
    width: 70%;
    text-align: justify;
    float: left;
  }

  .clearseccion{
    clearseccion:both;
  }


 /*Fin Propiedades del Box*/
  </style>