@font-face{
	font-family: Open Sans;
    src: url(../fonts/OpenSans-Regular.woff2),
         url(../fonts/OpenSans-Regular.woff),
	     url(../fonts/OpenSans-VariableFont_wdth,wght.ttf);
    font-weight: 400; font-display: swap;}
@font-face{
	font-family: Open Sans;
	src: url(../fonts/OpenSans-Bold.woff2),
         url(../fonts/OpenSans-Bold.woff),
	     url(../fonts/OpenSans-VariableFont_wdth,wght.ttf);
	font-weight: 700; font-display: swap;}
@font-face {
    font-family: PT Serif;
    src: url(../fonts/PTSerif-Regular.woff2),
         url(../fonts/PTSerif-Regular.woff);
    font-weight: normal;
    font-style: normal; font-display: swap;}
*{
	margin: 0; padding: 0;}
body{
	font-family: 'Open Sans', sans-serif; line-height: 1.8em; font-size: 1.1em;
	text-align: center; color: #333;}
img a, a, a img{
	text-decoration: none;}
img{
	height: auto;}
#imagen img, .izdo img, .dcho img{
	width: 100%; height: auto; display: block;}
#logo{
	font-family: 'PT Serif', serif;font-size: 30px; color: #d7006a; padding-top: 20px;}
#logo img{
	margin: 20px auto 0 auto; display: block;}
#menu ul li{
	list-style-type: none; text-align: center;}
#menu ul li a{
	color: #666; padding: 20px; display: block;}
#menu ul li a:hover{
	opacity: 0.5;}
h1, h3{
	margin: 60px auto 10px auto; display: table; padding-bottom: 10px; 
	border-bottom: 1px solid #ccc; color: #333;}
h1{
	font-family: 'PT Serif', serif; color: #d7006a;}
h2{
	font-family: 'PT Serif', serif; font-size: 34px; line-height: 45px; font-weight: normal;}
h4{
	margin: 80px 0 10px 0; font-size: 20px;}
h5{
	font-family: 'Lobster', cursive; font-weight: normal; font-size: 34px; color: #fff;
	border-bottom: 1px solid #fff; padding-bottom: 10px; margin-bottom: 10px;}
h6{
	font-size: 20px; font-weight: 700; text-transform: uppercase; color: #d7006a;
	font-family: 'PT Serif', serif;}
.top-60{
	margin-top: 60px;}
p{
	margin: 8px 0;}
.nota2{
	font-size: 0.8em;}
#presentacion{
	padding: 120px 0;}
#especialidades{
	padding-bottom: 70px; text-align: left;}
#especialidades ul li{
	margin: 0 0 0 20px; font-size: 1.1em; line-height: 2.1em;}
#especialidades ul li .what a{
	width: 22px; display: inline-block; padding: 0 8px; vertical-align: middle;}
#especialidades ul li .what a img{
	width: 22px;}
.logos{
	margin-top: 20px; }
.logos img{
	display: inline-block; margin-right: 30px; margin-bottom: 30px;}
.destacado{
	background: #efefef; border-radius: 25px; padding: 40px; margin-top: 50px;}
.taco{
	width: 360px; padding: 30px 50px; margin: 0 auto; background: #fff; opacity: 0.9;}
.horario{
	margin-top: 30px; padding-top: 20px; border-top: 1px solid #fff;}
footer{
	background: #cfced0; color: #666;}
footer .tel a, footer .what a{
	display: inline-block; color: #666; font-size: 24px; padding: 6px; }
footer .what img{
	margin: 0 7px 0 15px; display: inline-block;}
footer .tel a:hover, footer .what a:hover{
	font-weight: 700;}
footer .tel img, footer .what img{
	display: inline-block; border: 1px solid #fff; border-radius: 10px;}
footer .nota{
	font-size: 0.9em; border: 1px dashed #666; padding: 5px 15px; display: table;}
footer .container{
	padding-top: 100px;}
footer .redes ul li{
	list-style-type: none;}
footer .redes .face, footer .redes .insta{
	display: block; text-indent: -999em; width: 40px; height: 40px; padding: 5px;}
footer .redes .face{
	background: url(../imagenes/facebook2.png) no-repeat center center; }
footer .redes .insta{
	background: url(../imagenes/instagram2.png) no-repeat center center; }
footer .redes .face:hover{
	background: url(../imagenes/facebook.png) no-repeat center center; }
footer .redes .insta:hover{
	background: url(../imagenes/instagram.png) no-repeat center center; }
.borra{
	clear: both;}
#aviso{ 
	font-size: 0.7em; background: #222; color: #fff; }
#aviso a{
	color: #fff; display: inline-block; padding: 5px 0;}
iframe{
	border: none; width: 100%; display: inline-block; height: 500px;
	-webkit-filter: grayscale(100%); -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%);}

@media only screen 
and (max-width : 600px){
.pantallas, #menu, .horario .ocu{
	display: none;}
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 30px;}
#superior{
	display: block;}
#cabecera{
	position: relative;}
#logo{
	font-size: 30px; padding: 40px 0;}
#logo img{
	width: 30%; max-width: 350px;}
h1, h3{
	margin: 10px auto 10px auto; }
h2{
	font-size: 28px}
.dcho{margin: 50px auto 0 auto;}
.izdo img, .dcho img{
	width: 90%; margin: 0 auto;}
#fondo1{
	background: url(../imagenes/especialidades-m.jpg) no-repeat center center; 
	background-size: cover; padding: 200px 0;}
.taco{
	width: 90%; padding: 5%;}
.taco h2{
	font-size: 22px; line-height: 35px;}
.marcas, .des, .logos{
	text-align: center;}
#especialidades{
	margin: 30px auto;}
#especialidades ul li {
    margin: 0 0 0 40px; font-size: 1.1em; line-height: 1.8em;}
#especialidades h5{
	font-size: 28px;}
#especialidades .serv{
	margin-left: 30px;}
.logos img{
	margin:0 1px 10px 10px; width: 110px; height: auto;}
.destacado img{
	width: 100%; max-width: 300px;}
iframe{
	width: 100%; height: 300px;}
footer .container{padding-top: 60px;}
footer .todo{
	margin: 0 20px;}
footer .nota{
	margin: 20px auto;}
footer .redes{
	width: 140px; margin: 0 auto 40px auto;}
footer .redes ul li{
	display: inline-block;}
footer .horario{
	margin-bottom: 20px;}
footer .horario span, footer .br{
	display: block;}
}

@media only screen 
and (min-width : 601px)
and (max-width : 750px) {
.movil{
	display: none;}
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 3%;}
#cabecera{
	width: 94%;}
#logo{
	margin: 20px auto; font-size: 36px;}
#menu{
	font-size: 0.9em; margin: 0 auto; width: 100%; max-width: 370px;}
#menu ul li{
	float: left; display: inline-block;}
#menu ul li a {
    padding: 15px;}
.izdo{width: 500px; margin: 0 auto;}
.dcho{width: 500px; margin: 50px auto 0 auto;}
.izdo img, .dcho img{
	width: 90%; margin: 0 auto;}
h1{
	margin-top: 10px;}
#fondo1{
	background: url(../imagenes/especialidades-t.jpg) no-repeat center center; 
	background-size: cover; padding: 150px 0;}
#fondo1 h2{
	font-size: 27px;}
.marcas, .des, .logos{
	text-align: center;}
#especialidad{
	margin-top: 40px;}
#especialidades{
	width: 500px; margin: 30px auto;}
#especialidades h5{
	font-size: 24px;}
iframe{
	width: 100%;}
footer .container{padding-top: 60px;}
footer .todo{
	margin: 0 20px;}
footer .nota{
	margin: 20px auto;}
footer .redes{
	width: 140px; margin: 0 auto 40px auto;}
footer .redes ul li{
	display: inline-block;}
}
@media only screen 
and (min-width : 751px)
and (max-width : 1149px) {
.movil, .horario .ocu{
	display: none;}
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 60px;}
#cabecera{
	width: 100%;}
#logo{
	margin: 20px auto; font-size: 44px;}
#menu{
	font-size: 0.9em; margin: 0 auto; width: 400px;}
#menu ul li{
	float: left; display: inline-block;}
.izdo{width: 500px; margin: 0 auto;}
.dcho{width: 500px; margin: 50px auto 0 auto;}
.izdo img, .dcho img{
	width: 90%; margin: 0 auto;}
#fondo1{
	background: url(../imagenes/especialidades.jpg) no-repeat center center; 
	background-size: 100% auto; padding: 150px 0;}
#fondo1 h2{
	font-size: 30px;}
#especialidades .todo{
	margin: 0;}
#especialidad{
	margin-top: 40px;}
#especialidad img{
	width: 100%; height: auto;}
#especialidades{
	width: 520px; margin: 30px auto;}
#especialidades h5{
	font-size: 24px;}
.marcas, .des, .logos{
	text-align: center;}
.logos img{
	margin:0 15px 30px 15px;}
iframe{
	width: 50%; float: left; }
footer .container{width: 50%; float: right; text-align: left;}
footer .todo{
	margin: 0 50px;}
footer .redes{
	width: 50px; background: #fff; position: fixed; bottom: 230px; right: 0; z-index: 5;
	border-radius: 15px 0 0 15px; padding: 5px 0; box-shadow: 1px 1px 10px #999;}
#aviso{
	clear: both;}
footer .br{display: block;}
}

@media only screen 
and (min-width : 1150px)
and (max-width : 1299px) {
.movil{
	display: none;}
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 60px;}
#cabecera{
	width: 100%;}
#logo{
	margin: 20px auto;}
#menu{
	font-size: 0.9em; margin: 0 auto; width: 400px;}
#menu ul li{
	float: left; display: inline-block;}
.izdo{width: 47%; float: left;}
.dcho{width: 47%; float: right;}
.izdo img, .dcho img{
	width: 90%; margin: 0 auto;}
#fondo1{
	background: url(../imagenes/especialidades.jpg) no-repeat center center; 
	background-size: cover; background-attachment: fixed; padding: 150px 0;}
#especialidad{
	margin-top: 100px;}
#especialidades h5{
	font-size: 30px;}
.destacado img{
	float: left; width: 30%; }
.destacado p{
	float: right; width: 65%; margin-top: 20px; font-size: 16px;}
iframe{
	width: 50%; float: left;}
footer .container{width: 45%; float: right; text-align: left;}
footer .redes{
	width: 50px; background: #fff; position: fixed; bottom: 230px; right: 0; z-index: 5;
	border-radius: 15px 0 0 15px; padding: 5px 0; box-shadow: 1px 1px 10px #999;}
#aviso{
	clear: both;}
}
	
@media only screen 
and (min-width : 1300px){ 
.movil{
	display: none;}
.container {
	width: 1300px; margin: 0 auto;}
.todo {
	margin: 0 50px;}
#cabecera{
	width: 1200px;}
#logo{
	margin: 20px auto;}
#menu{
	font-size: 0.9em; margin: 0 auto; width:  400px;}
#menu ul li{
	float: left; display: inline-block;}
.izdo{width: 47%; float: left;}
.dcho{width: 47%; float: right;}
.izdo img, .dcho img{
	width: 90%; margin: 0 auto;}
#fondo1{
	background: url(../imagenes/especialidades.jpg) no-repeat center center; 
	background-size: cover; background-attachment: fixed; padding: 300px 0;}
#especialidad{
	margin-top: 120px;}
.taco {
	width: 600px;}
.destacado img{
	float: left; width: 30%; }
.destacado p{
	float: right; width: 62%; margin-top: 30px;}
iframe{
	width: 50%; float: left; }
footer .container{width: 45%; float: right; text-align: left;}
footer .redes{
	width: 50px; background: #fff; position: fixed; bottom: 230px; right: 0; z-index: 5;
	border-radius: 15px 0 0 15px; padding: 5px 0; box-shadow: 1px 1px 10px #999;}
#aviso{
	clear: both;}
}