* {
	margin: 0;
	padding: 0;
}

body {
	background: #fff;
}

#contenedor-general {
	margin: 0 auto;
	position:relative;
	width: 100%;
	clear: both;
}

#linea {

	background:#ed6506;
	height: 20px;
	width: 100%;
}

#fondo {
	background-image:url(img/franja.png);
	background-repeat: repeat-x;
	height: 122px;
	width:100%;
	margin-bottom: 10px;	
}

#logo {
	background:url(img/logo.png);
	background-repeat: no-repeat;
	height:68px;
	width:528px;
	margin-left:100px;
	margin-top:22px;
	float:left;
}

nav {
	float:right;
}

nav ul {
	list-style-type:none;
	margin-top:40px;
	margin-right:100px;
}

nav ul li {	
	padding:5px 9px 10px 0px;
	display: inline-block;
}

nav  ul li a {
	color:#0056a8;
	font-family:'Century Gothic', helvetica, lucida;
	font-weight: bold;
	font-style: oblique;
	font-size:17px;
	text-decoration:none;
	padding:9px 9px 9px 9px;
}

nav ul li a:hover {
	background:#dcdcdc;
	color:#ec680c;
	border-radius: 5px;
	border-bottom: 3px solid #b4b4b4;	
}

.activo a {
	background: #f2f1f1;
	color:#ec680c;
	border-radius: 5px;
	border-bottom: 3px solid #b4b4b4;
	border-left: 1px solid #b4b4b4; 
	border-right: 1px solid #b4b4b4;
	border-top: 1px solid #b4b4b4; 
	box-shadow: 0px 0px 0 0 #dcdcdc inset;
}


	 /*cajas */ 
section {
	width:1200px;
	margin: 30px auto 0;
	} 

#frase h2{ 
	color: #c63;
	text-align: center;
	font-family:'Century Gothic', helvetica, lucida;
	font-weight: bold;
	font-style: oblique;
	font-size:18px;
 }
 
 #cajas {
	 padding-top:20px;
	 width:1170px;
	 margin: 0 auto 30px;
}

#caja1 {background: url(img/caja-1.png);
	background-repeat:no-repeat;
	width:300px;
	height:390px;
	margin-top:30px;
	display:inline-block;
	margin-left:75px;

	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}
 

#caja1:hover { background:url(img/caja-1-hover.png);
 background-repeat:no-repeat;
}

#caja2 {
	background: url(img/caja-2.png);
	width:300px;
	height:390px;
	margin-top:30px;
	display:inline-block;
	margin-left:70px;

	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}


#caja2:hover {background:url(img/caja-2-hover.png);
background-repeat:no-repeat;
}
	 

#caja3 {
	background: url(img/caja-3.png);
	background-repeat:no-repeat;
	width:300px;
	height:390px;
	margin-top:30px;
	display:inline-block;
	margin-left:70px;


-moz-transition: all 1s;
-ms-transition: all 1s;
-o-transition: all 1s;
-webkit-transition: all 1s;
transition: all 1s;	  
}


#caja3:hover {
	background:url(img/caja-3-hover.png);
	background-repeat: no-repeat;
}	 

 #contenido {
	 border:1px;
	 margin:auto;
	 background:#F0F1F2;
	 width:955px;
	 height:250px;
	 border-radius:8px ;
	 padding:40px 30px 0px 50px;
	 
	 }
	 
#caja h4 { font-family:'Century Gothic', helvetica, lucida;
	color:#996633;
	font-size:18px;
	font-weight: bold;
	font-style: oblique;
}

#caja h1 { font-family:'Century Gothic', helvetica, lucida;
	color:#CC6600;
	font-size:18px;
	margin-top:30px;
	font-weight: bold;
	font-style: oblique;
}

#caja p {
	width:935px;
	font-family:'Century Gothic Bold Italic', helvetica, lucida;
	font-size:14px;
	line-height:22px;
	font-weight: normal;
	margin-top:18px;
	}
	
footer  {
	margin-top: 50px;
	background:#ed6506;
	height: 150px;
	width: 100%;
}

#cont {
	width: 705px;
	margin:auto;
	} 
	
#separador {
	clear:both;}

#texto2{
	width: 500px;
	float:left;
    margin-left:100px;
}
#texto2 p {

margin:auto;
	margin-top: 5px;
	font-family:'Century Gothic',arial, helvetica, lucida;
	font-weight: normal;
	font-style: oblique;
	font-size:13px;
	color: #7b3301;
	text-align: center;
	
}

#texto2 p#arriba {
text-align: center;
	
}
#texto1 {
	float: right;
	margin-left: 150px;
	text-align: center;
	width: 683px;
	background:#f3761e;
	color:#fff;
	font-family:'Century Gothic',arial, helvetica, lucida;
	font-weight: bold;
	font-style: oblique;
	font-size:12px;
	border-radius: 8px;
	padding:9px 9px 9px 9px;
	border-bottom: 2px solid #8b3a03;
	border-left: 2px solid #8b3a03;
	border-right: 2px solid #8b3a03;
	margin-top: 30px; 	
}







/*960*/

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


#fondo {
	background-image:url(img/franja.png);
	background-repeat: repeat-x;
	height: 122px;
	width:100%;
	margin-bottom: 10px;	
}

#logo {
	
	height:60px;
	width:300px;
	background-size: 100%;
	margin-left:85px;
	margin-top:30px;
	}



nav ul {
	list-style-type:none;
	margin-top:40px;
	margin-right:40px;
}

section {
	width:810px;
	margin-top:30px;
	} 

#frase {
	text-align: center;
	}

#frase h2{ 
	color: #c63;
	text-align:center;
	font-family:'Century Gothic', helvetica, lucida;
	font-weight: bold;
	font-style: oblique;
	font-size:18px;
}
 
#cajas {
	 padding-top:20px;
	 width:810px;
	 margin:auto;
	 margin-bottom:-70px;
	 margin-left:10px;
}

 #caja1 {background: url(img/caja-1.png);
 background-repeat:no-repeat;
width:220px;
height:400px;
background-size:100%;
margin-top:30px;
display:inline-block;
margin-left:20px;

-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}
 

#caja1:hover { background:url(img/caja-1-hover.png);
 background-repeat:no-repeat;
width:220px;
height:400px;
background-size:100%;
display:inline-block;
transition-duration:1s;
-moz-transition-duration:1s;
-ms-transition-duration:1s;
}




 #caja2 {
	background: url(img/caja-2.png);
	background-repeat:no-repeat;
width:220px;
height:400px;
background-size:100%;
 margin-top:30px;
 display:inline-block;
 margin-left:50px;
 
 -moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}


#caja2:hover {background:url(img/caja-2-hover.png);
background-repeat:no-repeat;
width:220px;
height:400px;
background-size:100%;
	 margin-top:30px;
	 transition-duration:1s;}
	 
 #caja3 {
width:220px;
height:400px;
background-size:100%;
margin-top:30px;
	 display:inline-block;
	  margin-left:50px;
	  
	  -moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;}


#caja3:hover {background:url(img/caja-3-hover.png);
width:220px;
height:400px;
background-size:100%;
margin-top:30px;
background-repeat: no-repeat;
transition-duration:1s;}



/* texto*/ 

 #contenido {
	 border:1px;
	 margin:auto;
	 background:#F0F1F2;
	 width:695px;
	 height:310px;
	 border-radius:8px ;
	 padding:10px 30px 0px 50px;
	 
	 }
	 
#caja h4 { font-family:'Century Gothic Bold Italic',arial, helvetica, lucida;
color:#996633;
font-size:15px;
margin-top:30px;
line-height:22px;
font-weight: bold;
font-style: oblique;
}

#caja p {
	width:685px;
	font-family:'Century Gothic Bold Italic', helvetica, lucida;
	font-size:12px;
	line-height:22px;
	font-weight: normal;
}
	
#separador {
	clear:both;}
	
footer  {
	margin-top: 50px;
	background:#ed6506;
	height: 150px;
	width: 100%;
}

#cont {
	width: 705px;
	margin:auto;
	} 
	
#separador {
	clear:both;}
	
#texto2{
	width: 500px;
	float:left;
	margin-left: 90px;
	margin-top: 10px;
}
#texto2 p {

	margin:auto;
	margin-top: 5px;
	font-family:'Century Gothic',arial, helvetica, lucida;
	font-weight: normal;
	font-style: oblique;
	font-size:13px;
	color: #7b3301;
	text-align: center;
	
}

#texto2 p#arriba {
text-align: center;
	
}
#texto1 {
	float: right;
	margin-left: 10px;
	text-align: center;
	width: 683px;
	background:#f3761e;
	color:#fff;
	font-family:'Century Gothic',arial, helvetica, lucida;
	font-weight: bold;
	font-style: oblique;
	font-size:12px;
	border-radius: 8px;
	padding:9px 9px 9px 9px;
	border-bottom: 2px solid #8b3a03;
	border-left: 2px solid #8b3a03;
	border-right: 2px solid #8b3a03;
	margin-top: 30px; 	
}



} 







/*768*/

@media only screen and (min-width: 481px) and (max-width: 768px) {
	
#fondo {
	background-image:url(img/franjancha.png);
	background-repeat: no-repeat;
	background-size: 100%;
	width:760px;
	height: 300px;
	margin-bottom: 20px;	
}

#logo {
	
	height:100px;
	width:600px;
	background-size: 100%;
	margin-left:80px;
	margin-top:60px;
	
	
}



nav ul {
	list-style-type:none;
	margin-top:30px;
	margin-right:150px;

}


	section {
	width:700px;
	margin-top:10px;
	} 

#frase h2{ color: #c63;
width:600px;
font-family:'Century Gothic', helvetica, lucida;
font-weight: bold;
font-style: oblique;
font-size:18px;
text-align:center;
margin-left:45px;
 }
 
 #cajas {
	 padding-top:20px;
	 width:700px;
	 margin:auto;
	 margin-bottom:50px;
	 margin-left:0px;
}

 #caja1 {background: url(img/caja-1.png);
 background-repeat:no-repeat;
width:180px;
height:239px;
background-size:100%;
margin-top:30px;
display:inline-block;
margin-left:45px;

-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}
 

#caja1:hover { background:url(img/caja-1-hover.png);
 background-repeat:no-repeat;
width:180px;
height:239px;
background-size:100%;
display:inline-block;
}




 #caja2 {
	background: url(img/caja-2.png);
	background-repeat:no-repeat;
width:180px;
height:239px;
background-size:100%;
 margin-top:30px;
 display:inline-block;
 margin-left:30px;
 
 -moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}


#caja2:hover {background:url(img/caja-2-hover.png);
background-repeat:no-repeat;
width:180px;
height:239px;
background-size:100%;
	 margin-top:30px;
	 }
	 

 #caja3 {
width:180px;
height:239px;
background-size:100%;
margin-top:30px;
	 display:inline-block;
	  margin-left:30px;
	  
	  -moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s; }


#caja3:hover {background:url(img/caja-3-hover.png);
width:180px;
height:239px;
background-size:100%;
margin-top:30px;
background-repeat: no-repeat;
transition-duration:1s;}

 

 #contenido {
	 border:1px;
	 margin:auto;
	 background:#F0F1F2;
	 width:540px;
	 height:400px;
	 border-radius:8px ;
	 padding:10px 30px 0px 50px;
}

#caja h1 { font-family:'Century Gothic', helvetica, lucida;
	color:#CC6600;
	font-size:16px;
	margin-top:30px;
	font-weight: bold;
	font-style: oblique;
}
	 
#caja h4 { font-family:'Century Gothic', helvetica, lucida;
	color: #996633;
	font-size:16px;
	margin-top:30px;
	font-weight: bold;
	font-style: oblique;
	line-height:22px;
}

#caja p {
	width:530px;
	font-family:'Century Gothic Bold Italic',arial, helvetica, lucida;
	font-size:14px;
	line-height:22px;
	font-weight: normal;
		}
	
#separador {
	clear:both;}
	


footer  {
	margin-top: 30px;
	background:#ed6506;
	height: 150px;
	width: 100%;
}

#cont {
	width: 600px;
	margin:auto;
	} 
	
#separador {
	clear:both;}
	

#texto2{
	width: 500px;
	float:left;
	margin-top: 10px;
	margin-left: 50px;
}
#texto2 p {

margin:auto;
	margin-top: 5px;
	font-family:'Century Gothic',arial, helvetica, lucida;
	font-weight: normal;
	font-style: oblique;
	font-size:13px;
	color: #7b3301;
	text-align: center;
	
}

#texto2 p#arriba {
text-align: center;
	
}
#texto1 {
	float: right;
	margin-left: 10px;
	text-align: center;
	width: 570px;
	background:#f3761e;
	color:#fff;
	font-family:'Century Gothic',arial, helvetica, lucida;
	font-weight: bold;
	font-style: oblique;
	font-size:12px;
	border-radius: 8px;
	padding:9px 9px 9px 9px;
	border-bottom: 2px solid #8b3a03;
	border-left: 2px solid #8b3a03;
	border-right: 2px solid #8b3a03;
	margin-top: 30px; 	
}	
}







/*480*/

@media only screen and (min-width: 321px) and (max-width: 480px) {
	

#fondo {
	background-image:url(img/franja480.png);
	background-repeat: no-repeat;
	background-size: 100%;
	width:480px;
	height: 200px;
	margin-bottom: 20px;	
}

#logo {
	
	height:70px;
	width:350px;
	background-size: 100%;
	margin-left:55px;
	margin-top:40px;
	
	
}




nav ul {
	list-style-type:none;
	margin-top:15px;
	margin-right:70px;
}

nav ul li {	
	padding:5px 9px 10px 0px;
	display: inline-block;
}

nav  ul li a {
	
	font-size:12px;
	
	padding:8px;
}

	
	
section {
	width:400px;
	margin:auto;
	margin-top:0px;
	} 

#frase h2{ 
	color: #c63;
	width:400px;
	text-align: center;
	margin:auto;
	font-family:'Century Gothic', helvetica, lucida;
	font-weight: normal;
	font-style: oblique; 
	margin-top:50px;
}
 
 #cajas {
	 padding-top:10px;
	 width:300px;
	 margin-bottom:50px;
	 
}

#caja1 {
	background: url(img/caja-1.png);
	background-repeat:no-repeat;
	width:300px;
	height:390px;
	position: absolute;
	left: 50%;
	margin-left: -150px;
	top: 345px;
	
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;

}
 

#caja1:hover { 
	background:url(img/caja-1-hover.png);
 	background-repeat:no-repeat;
	width:300px;
	height:390px;

}

#caja2 {
	background: url(img/caja-2.png);
	background-repeat:no-repeat;
	width:300px;
	height:390px;
	position: absolute;
	left: 50%;
	margin-left: -150px;
	top: 780px;
	
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;

}


#caja2:hover {
	background:url(img/caja-2-hover.png);
	background-repeat:no-repeat;
	width:300px;
	height:390px;
	margin-top:30px;
	transition-duration:1s;}
	 
 #caja3 {
	background: url(img/caja-3.png);
	background-repeat:no-repeat;
	width:300px;
	height:390px;
	position: absolute;
	left: 50%;
	margin-left: -150px;
	top: 1210px;
	
	
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}


#caja3:hover {background:url(img/caja-3-hover.png);
	width:300px;
	height:390px;
	margin-top:30px;
	background-repeat: no-repeat;
	transition-duration:1s;
}

#contenido {
	 width: 310px;
	 height: 530px;
	 border-radius: 0px;
	 margin-left:40px;
	 position: absolute;
	 top: 1660px;
	 padding:0px 40px 0px 30px;
}
#caja h1 { font-family:'Century Gothic', helvetica, lucida;
	color:#CC6600;
	font-size:15px;
	margin-top:30px;
	font-weight: bold;
	font-style: oblique;
}

#caja h4 { font-family:'Century Gothic', helvetica, lucida;
	color: #996633;
	font-size: 15px;
	margin-top:30px;
	font-weight: bold;
	font-style: oblique;
}

#caja p {
	width:330px;
	font-family:'Century Gothic Bold Italic',arial, helvetica, lucida;
	font-size:13px;
	line-height:22px;
	font-weight: normal;
}
	

footer  {
	margin-top: 1870px;
	background:#ed6506;
	height: 200px;
	width: 100%;
	position:absolute;
}

#cont {
	width: 300px;
	margin:auto;
	} 
	
#separador {
	clear:both;}
	

#texto2{
	width: 300px;
	float:left;
	margin-left: 2px;
	margin-top: 10px;
}
#texto2 p {

margin:auto;
	margin-top: 5px;
	font-size:13px;
	color: #7b3301;
	text-align: center;

	
}

#texto2 p#arriba {
text-align: center;
	
}
#texto1 {
	
	margin-right: 0px;
	text-align: center;
	width: 290px;
	font-size:12px;
	border-radius: 8px;
	padding:5px;
	margin-top: 30px; 	
}
}



/*320*/
@media only screen and (max-width: 320px) {
	
#fondo {
	background-image:url(img/franja480.png);
	background-repeat: no-repeat;
	width:320px;
	height: 200px;
	margin-bottom: 20px;	
}

#logo {
	height:70px;
	width:250px;
	background-size: 100%;
	margin-left:25px;
	margin-top:25px;
}

nav ul {
	list-style-type:none;
	margin-top:0px;
	margin-right:15px;
	text-align: center;
	width: 290px;
}

nav ul li {	
	margin-top: 5px;
	padding:5px 25px 10px 20px;
	display: inline-block;
}

nav  ul li a {
	font-size:12px;
	padding:9px;
}


section {
	width:250px;
	margin:auto;
	margin-top:30px;
} 

#frase h2{ 
	color: #c63;
	width:230px;
	text-align: center;
	margin:auto;
	font-family:'Century Gothic', helvetica, lucida;
	font-weight: normal;
	font-style: oblique;
}
 
#cajas {
	width:250px;
	margin-bottom:50px;
	margin-top:-20px; 
}

#caja1 {
	background: url(img/caja-1.png);
	background-repeat:no-repeat;
	width:210px;
	height:270px;
	margin-top:50px;
	display: block;
	margin-left:17px;
	background-size:100%;
	
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}
 

#caja1:hover { 
	background:url(img/caja-1-hover.png);
 	background-repeat:no-repeat;
	width:210px;
	height:270px;
	background-size:100%;
}

#caja2 {
	background: url(img/caja-2.png);
	background-repeat:no-repeat;
	width:210px;
	height:270px;
	position: absolute;
	left: 10.5%;
	margin-left: -150px;
	top: 660px;
	background-size:100%;
	margin-left:20px;

	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}

#caja2:hover {
	background:url(img/caja-2-hover.png);
	background-repeat:no-repeat;
	width:210px;
	height:270px;
	margin-top:30px;
	transition-duration:1s;
	background-size:100%;
}
	 
 #caja3 {
	background: url(img/caja-3.png);
	background-repeat:no-repeat;
	width:210px;
	height:270px;
	position: absolute;
	left: 62%;
	margin-left: -146px;
	top: 960px;
	background-size:100%;
	
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	-webkit-transition: all 1s;
	transition: all 1s;
}


#caja3:hover {
	background:url(img/caja-3-hover.png);
	width:210px;
	height:270px;
	margin-top:30px;
	background-repeat: no-repeat;
	transition-duration:1s;
	background-size:100%;
}


#contenido {
	width: 170px;
	height: 790px;
	border-radius: 0px;
	margin-left:43px;
	position: absolute;
	top: 1290px;
	padding:0px 40px 15px 18px;
}

#caja h1 { font-family:'Century Gothic', helvetica, lucida;
	color:#CC6600;
	font-size:15px;
	margin-top:30px;
	font-weight: bold;
	font-style: oblique;
}

#caja h4 { font-family:'Century Gothic', helvetica, lucida;
	color: #996633;
	font-size: 15px;
	margin-top:30px;
	font-weight: bold;
	font-style: oblique;
}

#caja p {
	width:200px;
	font-family:'Century Gothic Bold Italic', helvetica, lucida;
	font-size:13px;
	line-height:22px;
	transition-duration:3s;
	margin-top:20px;
	font-weight: normal;
}
	
footer  {
	margin-top:1490px;
	height: 200px;
	width: 100%;
}

#cont {
	width: 300px;
	margin:auto;
} 
	
.separador {
	clear:both;
}
	
#texto2{
	width: 250px;
	float:left;
	margin-left: 25px;
	margin-top: 10px;
}

#texto2 p {
	margin:auto;
	margin-top: 5px;
	font-size:13px;
	color: #7b3301;
	text-align: center;
}

#texto2 p#arriba {
	text-align: center;
}

#texto1 {
	margin-right: 20px;
	text-align: center;
	width: 250px;
	font-size:12px;
	border-radius: 8px;
	padding:5px;
	margin-top: 30px; 	
}
		
}