@font-face { font-family: 'Square'; src: url('square.ttf') format('truetype'); font-style: normal; font-weight: normal; }
@font-face { font-family: 'Swiss Condensed'; src: url('swiss_condensed.ttf') format('truetype'); font-style: normal; font-weight: normal; }
html { height:100%; font-size:62.5%; font-family:arial; color:#000000; }
body { width:100%; font-size:1.5rem; overflow-x:hidden; background:#FFFFFF; margin-top:0px; margin-left:0px; margin-right:0px; margin-bottom:0px; }

#header { width:100%; height:140px; background:#000000; z-index:5; display:block; margin: 0 auto; left:0 auto; color:#FF0000; font-family:'Square', arial; font-size:1.4rem; text-align:left; }
#header .content { width:1100px; height:140px; background:#000000; z-index:5; display:block; margin: 0 auto; left:0 auto; color:#FF0000; font-family:'Square', arial; font-size:1.4rem; text-align:left; }
#marca { display:block; background-image:url(images/logo.png); width:200px; height:74px; }
#wave { display:block; background-image:url(images/wave.png); width:436px; height:140px; float:right; }
#content { position:relative; width:1100px; /*min-height:100%;*/ min-height:1000px; margin: 0 auto; left:0 auto; text-align:center; margin-top:0px; padding-top:10px; background-image: url("images/bg.jpg"); }
#text { color:#000000; font-family:'Square', arial; font-size:16px; text-align:left; margin:0 80px; line-height:26px; }
#footer { background:#FF0000; margin:0 auto; bottom:0; height:390px;  }
#footer .content { width:1100px; height:100%; margin: 0 auto; left: 0 auto;  }
#footer .wave { display:block; background-image:url(images/wave-footer.png); width:740px; height:262px; float:right; margin-top:0px; }
#footer .box1 { width:320px; float:left; margin-top:0px; margin-left:30px; font-family:'Swiss Condensed', arial; font-size:13px; color:#FFFFFF; line-height:17px; padding:0; }
#footer A { color: #6E6E6E; text-decoration:none; }
#footer A:hover {COLOR: #000; text-decoration: none;}
#wasap { float:right; z-index:100; text-align:right; margin:20px 20px; width:100%; bottom: 180px; }

A { color:#808000; text-decoration: underline; }
A:hover { color:#000; }
A.menu { color: #FFFFFF; font-size: 1.8rem; font-family:'Square', Arial; text-decoration: none; padding:10px 15px 0 15px; }
A.menu:hover { color:#000; /*background:#1E90FF; padding:10px 15px 50px 15px;*/  }
.box1 { float:left; padding:30px; }
.box2 { float:left; padding:30px 80px; }
#home { width:100%; padding:0px; }
.pichome { margin:20px; width:400px; height:374px; }
.staff { width:500px; height:773px; }
.b1 { border:1px solid #CCCCCC; }
.mini { color:#FFF; font-size: 1.3rem; font-family:'Square', arial; letter-spacing: 0em; line-height:18px; text-align:justify;  }
.title1 { color:#000000; font-family:'Square', arial; font-size:1.2em; font-weight:bold;  }
.form { background: #FFF; border:1px solid #CCC; padding:5px; font-family:'Square', arial; font-size: 1.6rem; color: #000; width:400px; height:32px; }
.obligado { border:1px solid #FFD700;  }
.formtextarea{ background: #FFF; border:1px solid #CCC; padding:5px; font-family:arial; font-size: 1.6rem; color: #000; width:400px; height:180px; }
INPUT.Boton1 { border: none; background: #005AA3; color: #f2f2f2; padding:8px 20px 8px 20px; font-size: 14px; position: relative; box-sizing: border-box; transition: all 200ms ease; }
INPUT.Boton1:hover { background: rgba(0,0,0,0); color: #000; box-shadow: inset 0 0 0 1px #FF0000; }
A.Boton1 { border: none; background: #005AA3; color: #f2f2f2; padding:8px 20px 8px 20px; font-size: 14px; position: relative; box-sizing: border-box; transition: all 200ms ease; text-decoration: none; }
A.Boton1:hover { background: rgba(0,0,0,0); color: #000; box-shadow: inset 0 0 0 1px #FF0000; }

#menuToggle { display: none; }
#menu { width:100%; height:40px; background:#FF0000; text-align:center; margin-top:-15px; }
ul, ol { list-style:none; }
.nav { width:100%; display:flex; align-items: center; justify-content: center; }
.nav > li { float:left; }
.nav li a { color:#fff; text-decoration:none; padding:10px 12px; display:block; 	}
.nav li a:hover { background-color:#FFFFFF; }
.nav li ul { display:none; position:absolute; min-width:140px; 	}
.nav li:hover > ul { display:block; z-index:10; background-color:#FF0000; text-align:left; }
.nav li ul li { position:relative; }
.nav li ul li ul { right:-140px; top:0px; }
	

	
	
	
@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 800px) {
	#content { width:780px; padding-top:5px; background-image:none; }
	#text { font-size:16px; margin:0 40px; line-height:26px; }
	#header .content { width:780px; }
	.box1 { padding:30px; }
	.box2 { padding:20px 30px; }
	#menu {  visibility:none; display:none; }	
	#menuToggle { display: block; position: absolute; top: 50px; right: 50px; z-index: 50; -webkit-user-select: none; user-select: none; }
	#menuToggle input { display: block; width: 40px; height: 32px; position: absolute; top: -7px; left: -5px; cursor: pointer; opacity: 0; z-index: 2; -webkit-touch-callout: none; }
	#menuToggle span { display: block; width: 33px; height: 4px; margin-bottom: 5px; position: relative; background: #FFFFFF; border-radius: 3px; z-index: 1; transform-origin: 4px 0px; transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease; }
	#menuToggle span:first-child { transform-origin: 0% 0%; }
	#menuToggle span:nth-last-child(2) { transform-origin: 0% 100%; }
	#menuToggle input:checked ~ span {  opacity: 1; transform: rotate(45deg) translate(-2px, -1px); background: #444444; }
	#menuToggle input:checked ~ span:nth-last-child(3) { opacity: 0; transform: rotate(0deg) scale(0.2, 0.2); }
	#menuToggle input:checked ~ span:nth-last-child(2) { opacity: 1; transform: rotate(-45deg) translate(0, -1px); }
	#menu2 { position: absolute; width: 300px; margin: -100px 0 0 0; padding: 50px; padding-top: 125px; right: -100px; background: #000000; list-style-type: none; -webkit-font-smoothing: antialiased; transform-origin: 0% 0%; transform: translate(100%, 0); transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0); }
	#menu2 li { padding: 10px 0; font-size: 18px; text-decoration: none; }
	#menuToggle input:checked ~ ul { transform: scale(1.0, 1.0); opacity: 1; }
	#menu2 A { color: #FFFFFF; text-decoration:none; }
	#menu2 A:hover {COLOR: #FF0000; }
}

@media screen and (max-width: 640px) {
	#content { width:620px; }
	#header .content { width:620; height:140px; }
	.box1 { padding:8px; }
	.box2 { padding:20px 100px; }
	.pic_contacto { display:none; }
}

@media screen and (max-width: 480px) {
	#content { width:480px;  }
	#header .content { width:460; height:140px; }
	.box1 { padding:20px 70px; }
	.box2 { padding:20px 60px; }
	.staff { width:400px; height:auto; }
	#footer { height:620px;  }
	#footer .content { width:480px; }
}

/* iPhone 414 x 736 and 414 x 896: 6+, 6s+, 7+, 8+, Xs Max, Xr, 11 y 11 Pro Max */
@media screen and (max-width: 414px) {
	#content { width:412px; padding-top:0px; }
	#header .content { width:412px; }
	#wave { display:none; }
	.box1 { padding:15px 45px; }
	.box2 { padding:20px 24px; }
	.pichome { margin:20px; width:380px; height:auto; }
	.staff { width:340px; height:auto; }
	#footer { height:650px;  }
	#footer .content { width:412px; }
	#footer .box1 { font-size:15px; line-height:20px; }
	.form { padding:4px; font-size: 1.4rem; width:280px; height:32px; }
	.formtextarea{ padding:4px; font-size: 1.4rem; width:280px; height:100px; }
}

/* iPhone 375 x 667 and 375 x 812: 6, 6s, 7, 8, X, Xs, 11 Pro */
@media screen and (max-width: 375px) {
	#content { width:368px; }
	#header .content { width:368px; }
	#text { font-size:14px; margin:0 20px; line-height:26px; }
	.box1 { padding:15px 45px; }
	.box2 { padding:20px 20px; }		
	.staff { width:330px; height:auto; }
	#footer { height:640px;  }
	#footer .content{ width:368px;   }
}

/* Samsung Galaxy J y S7 edge */
@media screen and (max-width: 360px) {
	#content { width:358px; }
	#header .content { width:358px; height:140px; }
	.box1 { padding:15px 15px; }
	.box2 { padding:20px 0px; }
	.pichome { margin:20px; width:330px; height:auto; }
	.staff { width:300px; height:auto; }
	#footer { height:640px;  }
	#footer .content{ width:358px;   }
}