/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Hanlding Updates
-----------------------------------------------------------------*/
@font-face {
	font-family: 'Gotham-Light';
	 src: url('gotham/Gotham-Light.otf') ;
	}

	@font-face {
	font-family: 'Gotham-Bold';
	 src: url('gotham/Gotham-Bold.otf') ;
	}

	@font-face {
	font-family: ‘Gotham-XLight’;
	 src: url('gotham/Gotham-XLight.otf') ;
	}

	body {
	  font-family:'Gotham-Light';
	}

	p {
	  font-family:'Gotham-Light';
	}

	 #primary-menu > ul > li > a:hover  {
		background-color: #343434;
	}

	.heading-block h1,
	.heading-block h2,
	.heading-block h3,
	.heading-block h4,
	.heading-block h5,
	.heading-block h6 {
		 font-family:‘Gotham-Bold’;
	}

	h1, h2, h4, h5, h6 {
		 font-family:‘Gotham-Bold’;
	}

  h3 {
		font-family:‘Gotham-XLight’;
		text-align:center;
	}

 form > label {
	 	 font-family:‘Gotham-XLight’;
 }

	.feature-box > .fbox-desc > h3
	 {
		 font-family:‘Gotham-XLight’;
	}

	div #email-result {
		background-color:#efc031;
		color:#848484;
	}

	@media only screen and (max-width: 770px) {
    div #div-forma {
      background-color: #fff;
			position:relative;
			z-index:0;
			left:0px;
    }
	}

		@media only screen and (min-width: 770px) {
			div #div-forma {
				background-color: #fff;
				position:absolute;
				left:25%;
				z-index:2;
			}
    }


			  @keyframes show-tablet {
					 from { transform: translate(0px, 500px); }
					 to{transform: translate(0px, 0px);	 }
				}
				@-webkit-keyframes show-tablet {
					 from { -webkit-transform: translate(0px, 500px); }
					 to{ -webkit-transform: translate(0px, 0px); }
				}

				@keyframes baja-persiana {
						 from { transform: translateY(0px); }
						 to{ transform: translateY(360px); }
					}
					@-webkit-keyframes baja-persiana {
						from { transform: translateY(0px); }
				    to{ transform: translateY(360px); }
					}

					@keyframes baja-persiana-reverse {
							 from { transform: translateY(360px); }
							 to{ transform: translateY(0px); }
						}
						@-webkit-keyframes baja-persiana-reverse {
							from { transform: translateY(360px); }
							to{ transform: translateY(0px); }
						}

					@keyframes abre-tv {
							 from { transform: translateX(0px); }
							 to{transform: translateX(135px); }
						}
					@-webkit-keyframes abre-tv {
						from { transform: translateX(0px); }
						to{transform: translateX(135px); }
					}

					@keyframes abre-tv-reverse {
							 from { transform: translateX(135px); }
							 to{transform: translateX(0px); }
						}
					@-webkit-keyframes abre-tv-reverse {
						from { transform: translateX(135px); }
						to{transform: translateX(0px); }
					}

					@keyframes abre-cafetera {
							 from { transform: translateY(-105px);}
							 to{ transform: translateY(0px);}
						}
					@-webkit-keyframes abre-cafetera {
						 from {-webkit-transform: translateY(-105px); }
						 to{-webkit-transform: translateY(0px);}
					}

					@keyframes abre-cafetera-reverse {
							 from { transform: translateY(0px); }
							 to{transform: translateY(-105px); }
						}
					@-webkit-keyframes abre-cafetera-reverse {
						 from { -webkit-transform: translateX(0px);}
						 to{-webkit-transform: translateX(-105px);}
					}

					@keyframes abre-tapa {
							 from { transform: translateY(-80px); }
							 to{transform: translateY(0px);}
						}
					@-webkit-keyframes abre-tapa {
						 from {-webkit-transform: translateY(-80px);}
						 to{-webkit-transform: translateY(0px);}
					}

					@keyframes abre-tapa-reverse {
							 from {
								 transform: translateY(0px);
							 }
							 to{
								 transform: translateY(-80px);
							 }
						}
					@-webkit-keyframes abre-tapa-reverse {
						 from {
							 -webkit-transform: translateX(0px);
						 }
						 to{
							 -webkit-transform: translateX(-80px);
						 }
					}


				.persiana {
					-webkit-animation-name: baja-persiana;
          -webkit-animation-duration: 5s;
					-webkit-animation-timing-function:ease-out;
					-webkit-animation-fill-mode: forwards;

					animation-name:baja-persiana;
          animation-duration: 5s;
					animation-timing-function:ease-out;
					animation-fill-mode: forwards;
				}

				.persiana-reverse {
					-webkit-animation-name: baja-persiana-reverse;
          -webkit-animation-duration: 5s;
					-webkit-animation-timing-function:ease-out;
					-webkit-animation-fill-mode: forwards;

					animation-name:baja-persiana-reverse;
          animation-duration: 5s;
					animation-timing-function:ease-out;
					animation-fill-mode: forwards;
				}

				.cuadro {
					-webkit-animation-name: abre-tv;
          -webkit-animation-duration: 5s;
					-webkit-animation-timing-function:ease-out;
					-webkit-animation-fill-mode: forwards;

					animation-name:abre-tv;
          animation-duration: 5s;
					animation-timing-function:ease-out;
					animation-fill-mode: forwards;
				}

				.cuadro-reverse {
					-webkit-animation-name: abre-tv-reverse;
          -webkit-animation-duration: 5s;
					-webkit-animation-timing-function:ease-out;
					-webkit-animation-fill-mode: forwards;

					animation-name:abre-tv-reverse;
          animation-duration: 5s;
					animation-timing-function:ease-out;
					animation-fill-mode: forwards;
				}

				.luces-off {
					display:none;
				}
				.luces-on{
					display:block;
				}

				.cafetera {
					-webkit-animation-name: abre-cafetera;
					-webkit-animation-duration: 5s;
					-webkit-animation-timing-function:ease-out;
					-webkit-animation-fill-mode: forwards;

					animation-name:abre-cafetera;
					animation-duration: 5s;
					animation-timing-function:ease-out;
					animation-fill-mode: forwards;
				}

				.cafetera-reverse {
					-webkit-animation-name: abre-cafetera-reverse;
					-webkit-animation-duration: 5s;
					-webkit-animation-timing-function:ease-out;
					-webkit-animation-fill-mode: forwards;

					animation-name:abre-cafetera-reverse;
					animation-duration: 5s;
					animation-timing-function:ease-out;
					animation-fill-mode: forwards;
				}

				.tapa {
					-webkit-animation-name: abre-tapa;
					-webkit-animation-duration: 5s;
					-webkit-animation-timing-function:ease-out;
					-webkit-animation-fill-mode: forwards;

					animation-name:abre-tapa;
					animation-duration: 5s;
					animation-timing-function:ease-out;
					animation-fill-mode: forwards;
				}

				.tapa-reverse {
					-webkit-animation-name: abre-tapa-reverse;
					-webkit-animation-duration: 5s;
					-webkit-animation-timing-function:ease-out;
					-webkit-animation-fill-mode: forwards;

					animation-name:abre-tapa-reverse;
					animation-duration: 5s;
					animation-timing-function:ease-out;
					animation-fill-mode: forwards;
				}

				#cocina {
					display:none;
				}

				.vertical-center {
					position:absolute;
					top:0;
					bottom:0;
					left:0;
					right:0;
					margin: auto;
				}

.box {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items:center;
	flex-wrap: wrap;
	row-gap: 10px;
  	column-gap: 20px;
	}


#footer .footer-widgets-wrap {
    position: relative;
    padding: 30px 30px;
}

footer#footer {
	font-size:20px !important
}



