/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on July 26, 2017 */

@font-face {
    font-family: 'HTregular';
    src: url('../fonts/ht/heatherthomas.eot');
    src: url('../fonts/ht/heatherthomas.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ht/heatherthomas.woff2') format('woff2'),
         url('../fonts/ht/heatherthomas.woff') format('woff'),
         url('../fonts/ht/heatherthomas.ttf') format('truetype'),
         url('../fonts/ht/heatherthomas.svg#HT_regular') format('svg');
    font-weight: normal;
    font-style: normal;  
	}

@font-face {
    font-family: 'Narkisim';
    src: url('../fonts/nk/nrkis.eot');
    src: url('../fonts/nk/nrkis.eot?#iefix') format('embedded-opentype'),
         url('../fonts/nk/nrkis.woff2') format('woff2'),
         url('../fonts/nk/nrkis.woff') format('woff'),
         url('../fonts/nk/nrkis.ttf') format('truetype'),
         url('../fonts/nk/nrkis.svg#HT_regular') format('svg');
    font-weight: normal;
    font-style: normal;  
	}

@font-face {
    font-family: 'CG';
    src: url('../fonts/cg/regular/CenturyGothic.eot');
    src: url('../fonts/cg/regular/CenturyGothic.eot?#iefix') format('embedded-opentype'),
         url('../fonts/cg/regular/CenturyGothic.woff2') format('woff2'),
         url('../fonts/cg/regular/CenturyGothic.woff') format('woff'),
         url('../fonts/cg/regular/CenturyGothic.ttf') format('truetype'),
         url('../fonts/cg/regular/CenturyGothic.svg#HT_regular') format('svg');
	}

@font-face {
    font-family: 'CG';
    src: url('../fonts/cg/bold/CenturyGothic-Bold.eot');
    src: url('../fonts/cg/bold/CenturyGothic-Bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/cg/bold/CenturyGothic-Bold.woff2') format('woff2'),
         url('../fonts/cg/bold/CenturyGothic-Bold.woff') format('woff'),
         url('../fonts/cg/bold/CenturyGothic-Bold.ttf') format('truetype'),
         url('../fonts/cg/bold/CenturyGothic-Bold.svg#HT_regular') format('svg');
    font-weight: bold;
 	}

body {
	margin: 0;
	font-size: 16px;
	min-width: 320px;
	width: auto;
	overflow-x: hidden;
	background-color: black;
	}

header {
	z-index: 2;
	position: fixed;

	left:50%;
	transform: translateX(-50%);
	margin-right: auto; 
	margin-left: auto;

	padding: 0 0 0 0;
	width: 100%;
	height: auto;
	min-width: 320px;
	}

nav {
	width: 100%;
	padding: 0 0 0 0;
	}

nav ul{
	position: relative;
	padding: 0 0 0 0;
	width: 100%;
	top:90px;
	
	list-style: none;
	margin: 0;
	background: black;
	text-align: center;
	}

nav ul li a{
	display: block;
	width: 100%;
	font-size: 0.9em;
	color: #a6a6a6;
	padding: 1em 0em 1em 0em;
	border-bottom: 1px solid #545454;

	font-family: 'CG';
	letter-spacing: 0.05em;	
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	transition: all 0.3s ease;
	}

nav ul li a:hover{
	background: #1c1c1c;
	color: #e2e2e2;
	}

.BANNER {
	width:100%;
	position: fixed;
	z-index: 0;
	background-image: url(../../Comun/images/logo-cabecera-ECCO.png);
	background-color: black;
	background-repeat: no-repeat;
	}


.BAN_ECCO {
	position:absolute;
	right:50%;
	font-family: 'HTregular';
	font-weight: normal;
	background: none;
	letter-spacing: 0.2em;	
	color: white;
	}

.BAN_ODONTO {
	position:absolute;
	left: 50%;
	font-family: 'CG';
	font-weight: bold;
	background: none;
	letter-spacing: 0.2em;
	color: white;
	}

.BAN_Especialistas {

	font-size: 0.62em;
	color: #dbdbdb;
	z-index: 3; 

	letter-spacing: 0.29em;	
	position:fixed;
	display: block;
	text-align: center;
	width: 100%;
	font-family: 'CG';
	font-style: italic;
	font-weight: bold;
	background: none;
	letter-spacing: 0.29em;	
	}
	

.BAN_Clara_Garcia {
	display: none;
	position:absolute;
	left: 50%;
	font-family: 'CG';
	font-weight: bold;
	background: none;
	letter-spacing: 0.2em;
	color: #b2b2b2;
	}

#BAN_Hamburguesa_A {
	position:fixed;
	right: 10px;
	top: 12px;
	width: 25px;
	height: 4px;
	border-top:3px solid #4e4e4e;
	border-bottom: 10px double #4e4e4e;
	}

.BAN_Tfno_A{
	position: fixed;

	color:white;
	text-decoration: none;
	background-color: rgba(1,1,1,0.9);
	text-align: center;
	font-family: 'CG';
	font-weight: bold;
	border-radius: 0.8em;
	letter-spacing: 0.29em;	
	font-size: 1.1em;
	padding:1px 3px 2px 3px;

	width: 10.5em;
	left: 50%;
	transform: translateX(-50%);
	bottom: 5px;
	}

#CONT_texto_A{

	font-family: 'CG';
	font-size: 0.92em;
	color:black;
	background-color: none;
	font-weight: normal;

	text-align: justify;

	padding:1.2em 0em 0.8em 0em;
	margin:0;
	}

#CONT_fachada_A{

	width: 100%;
	}

.CC_Principal{

	z-index: -1;
	padding-bottom:20px;
	background-color: #f3f3f3;	
	}

.CC_Apartado_A{
	margin:0em;
	background-color: none;	
	margin-left:1.8em;
	margin-right:1.8em;
	}

.CC_Titulo_A{
	font-family: 'CG';
	letter-spacing: 0.05em;	
	font-size: 1.2em;
	text-align: left;
	font-weight: bold;
	color:  rgba(110,110,110,1);
	background-color: none;
	border-bottom: 0.15em solid rgba(110,110,110,1);

	font-size: 1.2em;
	margin:0em;
	padding:1.2em 0em 0em 0em;
	}

.CC_Titulo_B{
	font-family: 'CG';
	letter-spacing: 0.05em;	
	font-size: 1.2em;
	text-align: left;
	font-weight: bold;
	color:  black;
	background-color: none;
	border-bottom: 0.15em solid black;

	font-size: 1.2em;
	margin:0em;
	padding:1.2em 0em 0em 0em;
	}

.CC_Titulo_C{
	border-bottom: 0.14em solid rgba(180,180,180,1);

	font-size: 1.2em;
	margin:0em;
	padding:1.2em 0em 0em 0em;

	}

.CC_Imagenes_B{
	width:100%;
	margin:2em 0em 0.5em 0em;
	}

.CC_Imagenes_C{
	/*display: block;*/
	width:100%;
	margin:1em 0em 0.5em 0em;
	}

.CC_Parrafo_A{

	font-family: 'CG';
	font-size: 0.95em;
	color: rgba(150,150,150,1);
	background-color: none;
	font-weight: normal;

	text-align: left;
	line-height: 1.4;

	padding:1.2em 0em 0.8em 0em;
	margin:0;
	}

.CC_Parrafo_B{

	font-family: 'CG';
	font-size: 0.92em;
	color:black;
	background-color: none;
	font-weight: normal;

	text-align: center;

	padding:0em;
	margin:0em;
	}

.CC_Parrafo_C{

	font-family: 'CG';
	font-size: 1.2em;
	color: rgba(150,150,150,1);
	background-color: none;
	font-weight: normal;

	text-align: left;
	line-height: 1.6;
	margin-top:3em;
	}

ul.CC_link_xtra_movil {
	text-align: center;
	line-height: 3.4;
	list-style: none;
	padding: 1em 0 0 0;
}

ul.CC_link_xtra_movil li a{
	
	font-family: 'CG';
	font-size: 1.45em;
	color: rgba(150,150,150,1);
	text-decoration: none;
	font-weight: normal;
	}

.CC_link_volver{
	
	font-family: 'CG';
	width: 100%;
	background-color: none;
	font-weight: normal;

	text-align: center;

	padding:0em;
	margin-top:2em;
	
	}

.CC_link_volver a{

	font-size: 1.1em;
	text-decoration: none;
	color: rgba(0,100,200,1);
	}

.CC_logo_link {
	width:30px;
	padding: 1em 0.4em 0.5em 0em;
	}

/*TAMAÑO HASTA 450 ------------------------------------------------------ */

	@media screen and (max-width: 450px){
	
	nav ul{
	display: none;
	}


.BANNER {

	height: 95px;
	background-size: 55px 55px;
	background-position: calc(50% - 15px) 15px;
	}

.BAN_ECCO {
	transform: translate(-45px,32px);
	font-size: 1.38em;
	}

.BAN_ODONTO {
	transform: translate(14px,33px);
	font-size: 0.90em;
	}
	
.BAN_Especialistas {
	
	transform: translate(0px,75px);

	}

#BAN_Hamburguesa_A {
	display: active;
	}

.CC_Principal{
	margin-top: 80px;
	}

#CONT_maps{
	padding:1em 0em 0.8em 0em;
	}

#Google_maps{
	padding:1em 0em 0.8em 0em;
	}

.CC_link_volver a{
	font-size: 1.1em;
	}
}

/*SALTO ARRIBA 450 ------------------------------------------------------ */

@media screen and (min-width: 450px){

nav ul{
	display: active;
	position:fixed;
	padding-top: 1em;
	padding-bottom: 0.2em;
	}

nav ul li a{
	display: inline-block;
	width: 48%;
	font-size: 0.85em;
	color: #979797;
	padding: 0.55em 0em 0.55em 0em;
	margin:0.5%;
	border: 0.1em solid #525252;
	border-radius: 0.25em;
	} 

.BANNER {

	height: 105px;
	background-size: 75px 75px;
	background-position: center 10px;
	}

#BAN_Hamburguesa_A {
	display: none;
	}

.BAN_ECCO {
	transform: translate(-53px,34px);
	font-size: 1.9em;
	}

.BAN_ODONTO {
	transform: translate(50px,38px);
	font-size: 1.0em;
	}

.BAN_Especialistas {
	transform: translate(0,87px);
	font-size: 0.7em;
	}

#CONT_maps{
	padding:1.5em 0em 1.2em 0em;
	}
	
.CC_Apartado_A{
	padding-top:2em;
	}

.CC_Parrafo_A{
	font-size: 0.97em;
	}

.CC_Parrafo_C{
	font-size: 1.2em;
	}

.CC_Principal{
	margin-top: 200px;
	}

#link_xtra_movil{
	display:none;
}

#Google_maps{
	padding:1.5em 0em 1.2em 0em;
	}
}

/*INICIO SALTO ARRIBA 650 ------------------------------------------------------ */

@media screen and (min-width: 650px){

/* COMUN */ 

nav ul li a{

	width: 30%;
	font-size: 0.85em;
	padding: 0.55em 0em 0.55em 0em;
	margin:0.5%;
	} 

.CC_Principal{
	margin-top:150px;
	/*margin-right:0px;
	margin-left:0px;*/
	}

.CC_Titulo_A{
	clear: both;
	font-size: 1.3em;
	}

.CC_Titulo_B{
	clear: both;
	font-size: 1.3em;
	}


.CC_Parrafo_A{
	line-height: 2.2;
	}

#CONT_texto_A{
	width:260px;
	display: inline-block;
	font-size: 0.85em;
	vertical-align: top;
	color:black;
	text-align: right;
	padding:1.5em 0em 0.8em 0em;
	margin:0em 1.1em 0em 0em;
	}

#CONT_fachada_A{
	display: inline-block;
	width: calc(100vw - 355px);
	padding:1.5em 0em 0.8em 0em;
	}

#CONT_maps{
	display:block;
	width: calc(100vw - 355px);
	padding:1em 0em 0.8em 0em;
	margin: 0em 0em 30px auto;
	}

#Google_maps{
	width: calc(100vw - 350px);
	padding:1em 0em 0.8em 285px;
	}

.CC_link_volver a{
	font-size: 1.4em;
	}

.CC_logo_link {
	width:30px;
	padding: 1.2em 0em 0.5em 0.5em;


	}

}

/*INICIO SALTO ARRIBA 700 ------------------------------------------------------ */

@media screen and (min-width: 700px){

.CC_Apartado_A{
	padding-top:2em;
	}

.CC_Parrafo_A{
	display: inline-block;
	vertical-align: top;
	line-height: 2.4;
	width:50%;
	font-size: 0.92em;
	padding:0em 0em 0em 0em;
	margin:2em 0em 0em 0em;
	}

.CC_Parrafo_B{
	font-size: 0.92em;
	}

.CC_Parrafo_C{
	font-size: 1.4em;
	line-height: 1.8;
	}

.CC_Imagenes_B{
	display:block;
	width:70%;
	margin:2em auto 0.5em auto;
	}

.CC_Imagenes_C{
	float:right;
	width:45%;
	margin:2em auto 0.5em auto;
	}
}

/*SALTO ARRIBA 960 ------------------------------------------------------ */

@media screen and (min-width: 960px){

header {
	max-width:1305px;
	}

nav {
	max-width:1300px;
	margin-right: auto; 
	margin-left: auto;
	}

nav ul{
	top:120px;
	}


nav ul li a{
	width: auto;
	padding-left: 1.5em;
	padding-right:1.5em;
	font-size: 1.05em;
	margin: 0em 0em 0.5em 0em;
	border: 0em solid #525252;
	} 

.BANNER {

	height: 120px;
	background-size: 110px 110px;
	}

.BAN_ECCO {
	transform: translate(-55px,38px);
	font-size: 3em;
	}

.BAN_ODONTO {
	transform: translate(55px,37px);
	font-size: 1.8em;
	}

.BAN_Especialistas {
	bottom: 5.6em;
	font-size: 1em;
	background: black;
	padding: 0.1em 0 0.31m 0em;
	}

.BAN_Clara_Garcia {

	display: block;
	transform: translate(58px,72px);
	font-size: 0.85em;
	}

.BAN_Tfno_A{

	font-size: 1.2em;
	bottom: 27px;
	}

#CONT_texto_A{
	font-size: 1.2em;
	width:400px;
	}

#CONT_fachada_A{
	width: calc(100vw - 500px);
	}

#CONT_maps{
	width: calc(100vw - 500px);
	height: calc((100vw - 475px)/1.5); 
	padding:1em 0em 30px 0em;
	}

.CC_Apartado_A{
	padding-top:3em;
	}

.CC_Titulo_A{
	font-size: 1.6em;
	}

.CC_Titulo_B{
	font-size: 1.6em;
	}

.CC_Principal{
	max-width: 1300px;
	margin: 100px auto 10px auto;
	padding:0 0 20px 0;
	}

.CC_Parrafo_A{
	width:45%;
	font-size: 1.2em;
	padding:0em 0em 0em 0em;
	margin:2em 0em 0em 0em;
	}

.CC_Parrafo_B{
	font-size: 1.2em;
	}

.CC_Imagenes_B{
	width:50%;
	margin:2.5em auto 0.5em auto;
	}

.CC_Imagenes_C{
	width:50%;
	margin:2.5em 1em 0.5em 1em;
	}

#Google_maps{
	width: calc(100vw - 475px);
	height: calc((100vw - 475px)/2); 
	max-width: 950px;
	max-height: 475px;
	margin-bottom: 50px;
	margin-top: 20px;
	padding:1em 0em 0.8em 420px;
	}

.CC_link_volver a{
	font-size: 1.6em;
	}

.CC_logo_link {
	width:35px;
	padding: 1.2em 0em 0.5em 0.5em;


	}


}

/*  SALTO ARRIBA 1100 ------------------------------------------------------ */

@media screen and (min-width: 1100px){

.CC_Parrafo_A{
	
	font-size: 1.3em;
	p
	}

#CONT_texto_A{
	width:calc(100vw - 703px);
	color:black;
	}

#CONT_fachada_A{
	width: 600px;
	}

#CONT_maps{
	width: 600px;
	height: 400px; 
	padding:1em 0em 30px 0em;
	}

}

/*  SALTO ARRIBA 1300 ------------------------------------------------------ */

@media screen and (min-width: 1320px){

nav ul li a{

	margin: 0em 0em 0.5em 0em;
	padding-left: 3em;
	padding-right:3em;
	} 


#CONT_texto_A{
	width:617px;
	}

}