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

*{
	margin:0px;
	padding:0;} 

@font-face {
	src:url(centuryGothicBold.ttf);
	font-family:centuryGothicBold;}

@font-face {
	src: url(centuryGothicRegular.ttf);
	font-family:centuryGothicRegular;}

@font-face {
	src:url(calibri.ttf);
	font-family:calibri;}

@font-face {
	src:url(gothamBook.otf);
	font-family:gothamBook;}

@font-face {
	src:url(gothamMedium.otf);
	font-family:gothamMedium;}

@font-face {
	src:url(gloriahallelujah.ttf);
	font-family:gloriahallelujah;}
	
body {
	margin:0 auto;
	background:rgba(30,30,30,1.00);
	background-image:url(../images/fondo_servicios_vida_canina_3.jpg);
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

header {
	position: fixed;
	float: left;
	width: 24%;
	height: 200vh;
	padding-top: 4%;
	left:6%;
	text-align: center;
	z-index:5;
	background-color: rgba(255,255,255,0.00);
	border-right: 2px solid rgba(255,158,21,1.00);
}

#logo {
	width: 50%;
	max-width: 300px;
}

h1 {
	font-size:calc(1.0em + 1vw);
	font-family:centuryGothicBold;
	color:rgba(255,255,255,1.00);
	text-align: center;
	margin: 0;
}

h2 {
	font-size:calc(.11em + 1vw);
	font-family:centuryGothicRegular;
	color:rgba(255,255,255,1.00);
	text-align: center;
	margin: 0;
}

span {
	color:rgba(255,158,21,1.00);
}

#navPrincipal {
	bottom:80px;
	position:fixed;
	background-color:rgba(51,51,51,1.00);
	width:100%;
	height:auto;
	text-align: right;
	-webkit-box-shadow: 0 0 30px 15px rgba(0,0,0,1);
	box-shadow: 0 0 30px 15px rgba(0,0,0,1);
	z-index:6;
}

#navPrincipal ul {
	margin-top:0px;
	float:right;
	padding-right: 4%;
	width: 80%;
}

#navPrincipal ul li {
	display:inline-block;
} 

#navPrincipal ul li a {
	color: rgba(204,204,204,1);
	font-size:16px;
	text-decoration:none;
	font-family:calibri;
	padding: 9px 12px 9px 12px;
}

#navPrincipal ul li a:hover {
	background:rgba(255,158,21,0.50);
	color: rgba(255,255,255,1.00);
	-webkit-transition: background 1s ease;
	-moz-transition: background 1s ease;
	-ms-transition: background 1s ease;
	-o-transition: background 1s ease;
	transition: background 1s ease;}

	
/* Estilos #nav-mobile y lo ocultamos */
    #nav-mobile{
        display: none;
        background:url(../images/menu_vidaCanina.png);
		background-size:cover;
        float: right;
        width: 39px;
        height: 33px;
        position: absolute;
        right: 30px;
        top:13px;
		opacity: 1;
    }   
        /* Agregaremos esta clase a #nav-mobile, cuando el menu mobile haya sido desplegado */
        #nav-mobile.nav-active{
            opacity: 1;
        }

#marcaRegistrada {
	font-size:14px;
	color:rgba(80,80,80,1.00);
	font-family:centuryGothicBold;
	}

#redesSociales {
	position: fixed;
	bottom:180px;
	left:25%;
	margin: 0 auto;
	text-align: center;
	z-index: 7;
}

#redesSociales ul {
	padding: 0;
}

#redesSociales li {
	display:block;
	padding:5px 0;

}

#redesSociales img {
	height: 28px;
}

#plecaNayeli {
	width: 100%;
	height:80px; 
	bottom:0;
	left:0;
	position:fixed;
	background:rgba(255,158,21,1.00);
	background-image:url(../images/plecaAbajo.jpg);
	z-index:7;
}

#pitbull {
	position: fixed;
	left:2%;
	bottom:0px;
	width: 18%;
	max-width: 300px;
	z-index:7;
}

footer {
	position: fixed;
	right:5%;
	bottom:15px;
	text-align: right;
	float:right;
	z-index: 7;
 }

#pie {
	z-index: 9;
	width: 250px;
	font-size:13px;
	text-align: right;
	color:rgba(80,80,80,1.00);
	font-family: gothamMedium;
}



/*-----------SERVICIOS-----------*/

#content {
	width: 100%;
	position: absolute;
	float: left;
	height: 100%;
}

h3 {
	margin-left: 42%;
	margin-top: 8%;
	font-size: 30px;
	font-family:gloriahallelujah;
	font-weight: bold;
	color:rgba(255,158,21,1.00);
	text-align: left;
}

h4 {
	font-size: 24px;
	font-family: gothamMedium;
	font-weight: bold;
	color:rgba(255,158,21,1.00);
	text-align: left;
}

h5 {
	font-size: 18px;
	font-family: gothamMedium;
	font-weight: bold;
	color:rgba(255,158,21,1.00);
	text-align: left;
}

p {
	font-family: gothamBook;
	font-size: 18px;
	color: rgba(204,204,204,1.00);
	text-align: justify;
	line-height: 26px;
}

a {	clear: both;
	display: block;
	font-family: gothamBook;
	font-size: 15px;
	color:rgba(255,158,21,1.00);
	text-align: center;
	margin: 0 auto;
}

a:hover {
	color:rgba(153,153,153,1.00);
}

#guarderia ul, #pension ul, #nuevo ul, #consultas ul, #entrenamiento ul, #paseos ul, #refresh ul, #one ul {
	padding-left: 40px; 
}

#guarderia ul, #pension ul, #nuevo ul, #consultas ul, #entrenamiento ul, #paseos ul, #refresh ul, #one ul {
	font-family: gothamBook;
	font-size: 18px;
	color: rgba(204,204,204,1.00);
	text-align: justify;
	line-height: 26px;
}

#navServicios {
	position: absolute;
	background-color:rgba(51,51,51,1.00);
	right:11%;
	width:47%;
	height:auto;
	text-align: left;
	border-bottom: 5px solid rgba(255,158,21,1.00);
	}

#navServicios ul {
	margin-top:16px;
	text-align: left;
}

#navServicios ul li {
	display:inline-block;
} 

#navServicios ul li a {
	color: rgba(204,204,204,1);
	font-size:16px;
	text-decoration:none;
	font-family:calibri;
	padding: 5px 0px 18px 30px;
}

#navServicios ul li a:hover {
	color: rgba(255,158,21,1.00);
	}

#scroll {
	position: absolute;
	display: block;
	clear:both;
	left: 42%;
	top:110px;
	width: 18%;
}

#espacio {
	height: 25%;
	width: 100%;
}

#consultas {
	width: 47%;
	text-align:justify;
	padding: 5% 11% 5% 42%;
	background-image:url(../images/fondo_servicios_vida_canina_5.jpg);
	background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;}

#entrenamiento  {
	width: 47%;
	text-align:justify;
	padding: 5% 11% 5% 42%;
	background-image:url(../images/fondo_servicios_vida_canina_4.jpg);
	background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;}

#refresh  {
	width: 47%;
	text-align:justify;
	padding: 5% 11% 5% 42%;
	background-image:url(../images/fondo_servicios_vida_canina_4.jpg);
	background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;}

#one  {
	width: 47%;
	text-align:justify;
	padding: 5% 11% 5% 42%;
	background-image:url(../images/fondo_servicios_vida_canina_4.jpg);
	background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;}

#guarderia {
	width: 47%;
	text-align:justify;
	padding: 8% 11% 5% 42%;
	background-image:url(../images/fondo_servicios_vida_canina_3.jpg);
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;}

#pension  {
	width: 47%;
	text-align:justify;
	padding: 5% 11% 5% 42%;
	background-image:url(../images/fondo_servicios_vida_canina_1.jpg);
	background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;}


#nuevo  {
	width: 47%;
	text-align:justify;
	padding: 5% 11% 5% 42%;
	background-image:url(../images/fondo_servicios_vida_canina_6.jpg);
	background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;}


#paseos  {
	width: 47%;
	text-align:justify;
	padding: 5% 11% 5% 42%;
	background-image:url(../images/fondo_servicios_vida_canina_6.jpg);
	background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;}


.parallax1 {
    background-image:url(../images/fondo_servicios_vida_canina_3b.jpg);
    height: 50%;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
	background-position: center;
}

.parallax2 {
    background-image:url(../images/fondo_servicios_vida_canina_1b.jpg);
    height: 50%;
	
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
	background-position: center;
	}

.parallax3 {
    background-image:url(../images/fondo_servicios_vida_canina_4b.jpg);
    height: 50%;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
	background-position: center;
	}

.parallax4 {
    background-image:url(../images/fondo_servicios_vida_canina_5b.jpg);
    height: 50%;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
	background-position: center;
	}

.parallax5 {
    background-image:url(../images/fondo_servicios_vida_canina_6b.jpg);
    height: 50%;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
	background-position: center;
	}

table {
	width: 100%;
	border-collapse: collapse;
	text-align: center;
}

td {
	border: rgba(255,255,255,0.50) 1px solid;
	padding: 20px;
	font-family: gothamBook;
	font-size: 17px;
	color: rgba(204,204,204,1.00);
	text-align: left;
	line-height: 26px;
}

#videoEntrenamiento {
	width: 100%;
	}

#videoEntrenamiento iframe
{
	width: 560px;
	height: 315px;
	display: block;
	margin: 0 auto;
	
	}

/*-----------------------------------------*/

/*RESPONSIVE*/

	


@media only screen and (min-width: 737px) and (max-width: 1280px) {

#videoEntrenamiento iframe {width: 370px;height: 315px;}

}




@media only screen and (min-width: 320px) and (max-width: 736px) {

	
header {position: fixed;width: 100%;height: 60px;padding:0 0 0 0;left:0;text-align: left; z-index: 10;background-color: rgba(51,51,51,1.00);border-right: none;top:0px;}
#logo {width: 0; opacity: 0;}
h1 {text-align: left;margin: -34px 0 0 5%;font-size:23px;}
h2 {text-align: left;margin: 0px 0 0 5%;font-size:12px;}
p {font-size: 16px; }
h3 {position: relative; font-size: 25px;margin: 120px 5% 35px 5%;text-align: center;line-height: 33px;}
h4 {font-size: 22px;z-index: 1;text-align: center;}
#content {right:0;width: 100%;} 

	
#nav-mobile{display: block;}
#navPrincipal li:last-child{ border-bottom: 0;}
#navPrincipal ul.open-menu{max-height: 400px;-webkit-transition: max-height .4s;-moz-transition: max-height .4s;-ms-transition: max-height .4s;-o-transition: max-height .4s;transition: max-height .4s;}
	
#navPrincipal {bottom:auto;top: 0px;background-color:transparent;height:auto;-webkit-box-shadow:none;box-shadow: none;z-index:10;}
#navPrincipal ul{max-height: 0;overflow: hidden; background-color: rgba(255,255,255,0.90);margin-top:60px;padding-right: 0;text-align: center;height: 100vh;}	
#navPrincipal ul li {width: 80%; margin:0 auto; display:block;padding:15px 0;border-right:none;border-bottom:rgba(51,51,51,1.00) 1px solid;;z-index:18;} 	
#navPrincipal ul li a {color: rgba(51,51,51,1.00);font-size:17px;font-family:gothamMedium;padding: 0px 12px 0px 12px;}
#navPrincipal ul li a:hover {background:none;color: rgba(255,158,21,1.00);-webkit-transition:none;-moz-transition: none;-ms-transition: none;-o-transition: none;transition: none;}
		
#plecaNayeli {height:30px;}
#pitbull {width: 20%;}
footer {right:5%;bottom:-29px;z-index: 7;}
#pie {z-index: 9;width: 230px;font-size:13px;}
address {opacity: 0;}	
	
#redesSociales {opacity:0;z-index: 1;}
	
/*-----------SERVICIOS-----------*/


body {background-image:none;}
p {text-align: left;}	
	
#scroll {clear:both;left: 41%; top:auto;margin: 20px auto 0;width: 70px;}
#espacio {height: 50%;}
	
#navServicios {right:0;width:100%;border-bottom: 3px solid rgba(255,158,21,1.00);z-index: 1;}
#navServicios ul {margin-top:0;text-align: center;}
#navServicios ul li {display:block;} 
#navServicios ul li a {padding: 12px 15px 12px 15px;border-bottom: 1px solid rgba(255,158,21,0.30);}

#guarderia, #pension, #nuevo, #entrenamiento, #consultas, #refresh, #one, #paseos {width: 80%;margin: 0 auto;padding: 70px 10% 35px 10%;z-index: 1;background-image:none;}
#guarderia li, #pension li, #nuevo li, #entrenamiento li, #consultas li, #refresh li, #one li, #paseos li {padding-left: 20px;text-align: left; }
#guarderia ul, #pension ul, #nuevo ul, #entrenamiento ul, #consultas ul, #refresh ul, #one ul, #paseos ul {font-size: 16px;z-index: 1;text-align: left;}
.parallax1, .parallax2, .parallax3, .parallax4, .parallax5 {height: 50%;width: 100%;background-attachment:inherit;}

table {width: 100%;border-collapse: collapse;text-align: center;}
td {padding: 10px;font-size: 16px;line-height: 26px;}
	
#videoEntrenamiento iframe {width: 370px;height: 315px;}




	
	
	
	
	
	}