@charset "utf-8";
/* CSS Document */

/*------------------------------------*\
  RESET
\*------------------------------------*/
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0b1 | 201101
   NOTE:WORK IN PROGRESS
   USE WITH CAUTION AND TEST WITH ABANDON */

html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  font:inherit;
  vertical-align:baseline;
}
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section{
  display:block;
}

body { background-color:#bfb9a7}

.clear { clear:both}

/* HEADER */
header { width:100%; height:150px; background:url(../img/fondo-header.jpg) repeat-x; z-index:5px; position:fixed; z-index:10}
#header-espacio { width:100%; height:150px}

#header-up { width:980px; height:100px; margin:0 auto; background:url(../img/logo.png) no-repeat; background-position:0 10px; position:relative }

nav { width:980px; height:40px; margin:0 auto; padding:10px 0 0 10px; position:relative }
nav ul { list-style:none}
nav li { background-color:#11b69d; height:25px; padding:5px 15px 0 15px; display:block; float:left; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-right:10px; box-shadow: inset 0 0 4px #0e8d7b; -moz-box-shadow: inset 0 0 4px #0e8d7b; -webkit-box-shadow: inset 0 0 4px #0e8d7b; }
nav a { font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF; text-decoration:none; text-transform:uppercase; }
nav a:hover { color:#09574c}


#banner { width:316px; height:68px; position:absolute; top:20px; left:665px; }

#facebook { width:119px; height:47px; position:absolute; left:871px; top:3px}

/* CENTRAL */
#central { width:100%; height:auto; background-color:#e5e3dc; }

#contenedor { width:980px; height:auto; background-color:#FFFFFF; margin:0 auto; padding-bottom:40px;box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.24);
    -moz-box-shadow:
        5px 0 5px -5px #666,
       -5px 0 5px -5px #666;
    -webkit-box-shadow:
        5px 0 5px -5px #666,
        -5px 0 5px -5px #666;
    box-shadow:
        5px 0 5px -5px #666,
        -5px 0 5px -5px #666;
}

/* FOOTER */
footer { width:100%; height:auto; background:url(../img/fondo-footer.jpg) repeat-x; background-position:top; }
#footer-wrap { width:980px; height:auto; margin:0 auto}
#footer-izq { width:600px; float:left} 
#footer-izq ul { list-style:none}
#footer-izq li { display:block;}
#footer-dcha { width:380px; height:100px; float:left} 
#footer-dcha ul { list-style:none}
#footer-dcha li { display:block; font-family:Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:13px; text-align:right}
.consultorios { font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#777368}
.bold { font-weight:bold}
.italic { font-style:italic}
.verde { color:#43a896}

/* ARTICLE */
article { width:610px; height:auto; padding:15px; margin-right:20px; margin-top:30px; margin-bottom:30px; float:left}
article h1 { font-family: Light, Arial, Helvetica, sans-serif; font-size:32px; color:#4fc6b1;}
article h2 { font-family:Arial, Helvetica, sans-serif; font-size:22px; color:#494949; margin-top:30px; margin-bottom:5px}
article h3 { font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#4fc6b1; margin-top:10px;}
article h4 { font-family: Light, Arial, Helvetica, sans-serif; font-size:19px; color:#494949;}
article p { font-family:Arial, Helvetica, sans-serif; color:#494949; font-size:13px; line-height:18px}

.video a {font-family:Arial, Helvetica, sans-serif; color:#494949; font-size:14px; line-height:16px; font-style:italic; text-decoration:none}
.video a:hover {color:#000000}

/* ASIDE */
aside { width:300px; height:auto; padding:5px; margin-top:30px; float:left}
.video { width:300px; height:auto; margin-top:30px; float:left}
.video h1 { font-family:Arial, Helvetica, sans-serif; font-size:18px; color:#494949; margin-top:10px; margin-bottom:5px}
#foto-dr { width:320px; height:auto; margin-top:30px; float:left}
.imagen { width:300px; height:auto; margin-top:30px; float:left}
.imagen p { height:20px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#666666; padding-top:10px; text-align:center}

/* ACCESOS*/
#accesos { width:980px; height:150px; }
.acceso-item { width:280px; height:130px; background:url(../img/acceso.png) no-repeat; float:left; padding:20px 20px 0 20px}
.acceso-item h1 { font-family: Light, Arial, Helvetica, sans-serif; font-size:24px; color:#4fc6b1; margin-bottom:5px; text-decoration:none}
.acceso-item-bold { font-family: Bold, Arial, Helvetica, sans-serif;}
.acceso-item  p { font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#a5a5a5; line-height:16px; text-decoration:none}
.acceso-item a { width:100%; height:100%; display:block; text-decoration:none}


/* FONT-FACE LIGHT */
@font-face {
    font-family: 'Light';
    src: url('../fonts/sansation_light.eot');
    src: url('../fonts/sansation_light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/sansation_light.woff') format('woff'),
         url('../fonts/sansation_light.ttf') format('truetype'),
         url('../fonts/sansation_light.svg#sansation_light') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* FONT-FACE BOLD */
@font-face {
    font-family: 'Bold';
    src: url('../fonts/sansation_bold.eot');
    src: url('../fonts/sansation_bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/sansation_bold.woff') format('woff'),
         url('../fonts/sansation_bold.ttf') format('truetype'),
         url('../fonts/sansation_bold.svg#sansation_bold') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* MENU DESPLEGABLE */
nav li ul {
	width:250px;
	margin:0;
	position: absolute;
	top:40px;
    left:300px;
	overflow:hidden; /* Para evitar Que se salgan los links */
	z-index:-1;/*El Submenu tiene que ir atras, para evitar que los 0 pixeles causen problema al :hover*/ 
	opacity: 0; 
	filter: alpha(opacity=0); /* Internet Explorer*/
	-webkit-transition: opacity 0.2s ease-in 0.3s, width 0.4s ease-in 0.3s;/* Chrome, Safari*/
	transition: opacity 0.2s ease-in  0.3s, width 0.4s ease-in 0.3s;/* Navegadores CSS3 */
	-moz-transition: opacity 0.2s ease-in  0.3s, width 0.4s ease-in 0.3s; /* Firefox 4 */
	-o-transition: opacity 0.2s ease-in 0.3s, width 0.4s ease-in 0.3s; /*Opera */
	display:block
}

.submenu { display:block; width:auto; clear:both}

nav li:hover ul {
	width: 250px; /*La animacion de 0 a 250px*/
	z-index:1000;
	opacity: 1;
	filter: alpha(opacity=100);/* Internet Explorer*/
	-webkit-transition: opacity 0.1s linear 0s, width 0.3s ease-out 0s;/* Chrome, Safari*/
	transition: opacity 0.1s linear 0s, width 0.3s ease-out 0s;/* Navegadores CSS3 */
	-moz-transition: opacity 0.1s linear 0s, width 0.3s ease-out 0s; /* Firefox 4 */
	-o-transition: oopacity 0.1s linear 0s, width 0.3s ease-out 0s; /* Opera */
}

/* SLIDER */
#slider { width:100%; height:280px; background-color:#FFFFFF}
#slider-central { width:980px; height:280px; background-color:#CCCCCC; margin:0 auto}

		
/* CONSULTORIO */
.consultorio { width:980px; height:240px; padding-top:50px }
.info-consultorio { width:550px; float:left; padding: 0 15px 0 15px}
.info-consultorio h1 { font-family: Light, Arial, Helvetica, sans-serif; font-size:32px; color:#4fc6b1; margin-bottom:10px}
.info-consultorio h2 { font-family: Light, Arial, Helvetica, sans-serif; font-size:19px; color:#494949;}
.info-consultorio p { font-family:Arial, Helvetica, sans-serif; color:#494949; font-size:13px; line-height:18px}
.bold-sansation { font-family: Bold, Arial, Helvetica, sans-serif; }

.img-consultorio { width:400px; float:left; }
.telefonos { font-family:Arial, Helvetica, sans-serif; font-size:20px; color:#4fc6b1}