html{
	background-image: url("images/fondo2.jpg");
	background-repeat: no-repeat;
	font-family: 'Noto Sans', sans-serif;
    background-position: center top;
    background-attachment: fixed;
    background-size: cover;
    background-attachment: scroll;
    margin-top: -100px;
    margin-bottom: 90px;
}

img {
margin: auto;
display: block;
}

.animales {
	margin-top: 180px;
	margin-bottom: 60px;

}

#animales {
	width: 30%;
}

.store {
  padding: 0px 5px 5px 5px;
  margin: 5px;
  display: inline-block;
}

#store2 {
	width: 90%;
}

#margin {
	margin-top: 30px;
	font-family: 'Titan One', cursive;
	color: #ffffff;
	font-size: 40px;
	text-decoration: none;
	text-align: center;
}


.footer__top {
	text-align: center;
	position: relative;
	margin: auto;
	}

.redes{
	margin-top: 0px;
	text-decoration: none;
}

#buttonSection1 {
	-webkit-transition: margin 0.5s ease-out;
	-moz-transition: margin 0.5s ease-out;
	-ms-transition: margin 0.5s ease-out;
	transition: margin 0.5s ease-out;
	padding: 20px 10px 5px 10px;
	margin: 20px;
    display: inline-block;
}

#buttonSection1:hover {
	filter: opacity(.8);
	transition:all .5s ease-in-out;
}

.politica{

	text-decoration: none;
	color: #000000;
	font-family: 'Noto Sans', sans-serif;
	font-weight: 700;
}

.contact{
	font-family: 'Titan One', cursive;
	color: #ffffff;
	font-size: 40px;
	text-decoration: none;
}

#mobil {
	margin-top: 200px;
	}

#mobil2{
	margin-top: 20px;
	}


/*la parte responsive del Tablet*/
@media (max-width: 850px){

#buttonSection1 {
		width: 4% !important;
		padding: 1px 0px 5px 0px !important;
		margin: 5px !important;
    	display: inline-block !important;
	}

#animales{
	width: 30% !important;
}

.animales{
		margin-top: 80px !important;
		margin-bottom: 10px !important;
	}

.store {
		padding: 0px 0px 0px 0px !important;
		display: block !important;;
	}

#store2{
	width: 15% !important;
}

.redes{
		margin-top: 50px !important;
	}

.footer__top {
	padding: 0px !important;
	padding-top: 0px !important;
	}

.contact{
		font-size: 18px !important;
	}


html{
	background-image: url("images/fondo.jpg") !important;
	background-repeat: no-repeat !important;
	background-size: 100% !important;
	margin-top: 0px !important;
	margin-bottom: 0px !important;
	}

#margin{
	margin-top: 20px !important;
	font-size: 20px !important;
	width: 100% !important;
	}



#mobil {
	margin-top: 10px !important;
	font-size: 5px !important;
	}

#mobil2{
	margin-top: 60px !important;
	}
}

/*dispositivos muy mobil grandes*/
@media (max-width: 550px) {
	#buttonSection1 {
		width: 25% !important;
		margin: 20px !important;
    	display: inline-block !important;
	}
	.redes{
		margin-top: 25px !important;
	}

	.animales img {
		width: 80% !important;
	}

	.animales{
		margin-top: 170px !important;
		margin-bottom: 40px !important;
	}

	.store {
		width: 70% !important;
		padding: 20px 0px 0px 0px !important;
		margin: auto !important;
		display: block !important;
	}

	.contact{
		font-size: 40px !important;
	}


	html{
	background-image: url("images/mobil.jpg") !important;
	background-repeat: no-repeat !important;
	background-size: 100% !important;
	height: 850px;
	margin-top: 0px !important;
	margin-bottom: 0px !important;
	}

	#margin {
		margin-top: 10px !important;
		font-size: 30px !important;
		width: 100% !important;
	}

	#mobil {
	margin-top: 440px !important;
	padding-bottom: 20px !important;
	font-size: 15px !important;
	}

	#mobil2{
	margin-top: 0px !important;
	}
}




/*dispositivos muy mobil chicos*/
@media (max-width: 450px) {
	#buttonSection1 {
		width: 18% !important;
		margin: 10px !important;
    	display: inline-block !important;
	}
	.redes{
		margin-top: 10px !important;
		padding: 80px 10px 5px 10px !important;
		margin: 0px !important;
	}


	.animales{
		margin-top: 90px !important;
		margin-bottom: 40px !important;
	}

	#animales{
		width: 80% !important
	}

	.store {
		width: 80% !important;
		padding: 25px 0px 0px 0px !important;
		margin: auto !important;
		display: block !important;
	}

	#store2{
		width: 60% !important;
	}

	.contact{
		font-size: 40px !important;
	}


	html{
	background-image: url("images/mobil.jpg") !important;
	background-repeat: no-repeat !important;
	background-size: 100% !important;
	margin-top: 0px !important;
	margin-bottom: 0px !important;
	}

	#margin {
		font-size: 40px;
		width: 100% !important;
		margin: 0px !important;
	}

	#margin p{
		margin-top: 20px !important;
	}

	#mobil {
	margin-top: 500px !important;
	padding-bottom: 10px !important;
	font-size: 14px !important;
	}

	#mobil2{
	margin-top: 80px !important;
	}


}