@media
only screen and (min-width: 640px) and (max-width: 800px) {
@charset "utf-8";
/* CSS Document */

/* === GETTING THE NEW TAG TO BEHAVE === */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {
display: block;
}
mark, rp, rt, ruby, summary, time {
display: inline
}
#swfplayer{
	height: 141px;
    width: 233px;
}
.youtube{ margin: 275px 0 0 413px; position: absolute;  z-index: 0; width:235px; height:142px;}
#draws{ position:absolute; top:170px; left:67px; margin:0px auto;}
#world{ position:absolute; z-index:0; margin: 145px 0 0 130px; width:200px; }
#logo{ width:325px;}
.bub p{ font-weight: bold;
    line-height: 1.3em;
    margin-left: 20px;
    padding: 15px 0 0; }
.controlBut{ margin: 0 0 0 200px; top: 250px;}
ul#h_nav.ftr_nav li{
	right:96px;
}
#ftr_link{
    padding: 45px 0 0;
	float:left;
}
#ftr_link a{
	color:#479B00;
	font-size:.8em;
}
#robo{
	position:absolute;
	top:180px;
	margin: 0 0 0 -215px;
	width:80px;
}
#robo_shadow{
	position:absolute;
	top:345px;
	margin: 0 0 0 -215px;
}
#water_enter{ position:absolute; margin: 332px 0 0 -128px; z-index:0;}
#water_bg{ position:absolute; margin: 332px 0 0 -128px; z-index:0;}
.bubble_bottom{
	background: url("../../images/tablet/bubble_bottom.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 121px;
    position: absolute;
    right: 170px;
    top: -500px;
    width: 226px;
    z-index: 99;
}
.coords{
	cursor: pointer;
    height: 70px;
    margin: 0 0 0 -295px;
    position: absolute;
    top: 335px;
    width: 120px;
}
.click_video{
	cursor: pointer;
    height: 65px;
    position: absolute;
    right: 280px;
    top: 295px;
    width: 80px;
}
.bubble_recicle {
    background: url("../../images/tablet/bubble_bottom.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 121px;
    left: 35%;
    position: absolute;
    top: -172%;
    width: 226px;
    z-index: 99;
}
.bubble_bottom_21 {
    background: url("../../images/tablet/bubble_bottom.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 121px;
    position: absolute;
    right: 232px;
    top: -465px;
    width: 226px;
    z-index: 99;
}
.bubble_center{
	background: url("../../images/tablet/bubble_bottom.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 121px;
    left: 34%;
    position: absolute;
    top: -54%;
    width: 226px;
    z-index: 99;
}
.bubble_bottom_left{
	background: url("../../images/tablet/bubble_bottom.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 121px;
    left: -10px;
    position: absolute;
    /*top: -151%;*/
	top: -140%;
    width: 226px;
    z-index: 99;
}
#top_3color{
	top:0px;
	margin:0 0 0 -112px;
	position:absolute;
	cursor:pointer;
}
.block li .cu{
	background:url("../../images/tablet/cuenta.png");
	width:112px;
	height:98px;
	display:block;
}
.block li .re{
	background:url("../../images/tablet/reciclart.png");
	width:100px;
	height:98px;
	display:block;
}
.block li .me{
	background:url("../../images/tablet/material.png");
	width:100px;
	height:98px;
	display:block;
}
i{
	background:url("../../images/tablet/sprite.png") no-repeat scroll 0 0 transparent;
	
}
/* === GLOBAL PROPERTIES === */
html, body{
	height: 100%;
}
body{
	background: url("../../images/tablet/global_bg.jpg") no-repeat top center #faf2e4;
	background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	color: #564f41;
	font: 13px Arial, Helvetica, sans-serif;
	line-height: 1.2em;
	position: relative;
	overflow-x:hidden; 
}
.bg_left{
	background: url("../../images/tablet/global_bg_left.png") repeat-y scroll left top transparent;
	
}
.bg_right{
	background: url("../../images/tablet/global_bg_right.png") repeat-y scroll right top transparent;
	
}
.ftr_bg{
	background: url("../../images/tablet/ftr_bottom_grass.png") repeat-x scroll bottom center transparent;
	display: block;
}
.header_bg{
	background:url("../../images/tablet/home_banner.jpg") no-repeat scroll center 44px transparent;
	display: block;
	height: 480px;
	
	
}
.subpage_banner{
	background: url("../../images/tablet/banner-2.png") no-repeat scroll center 55px transparent;
	display:  block;
	height: 615px;
	width: 100%;
}
.menu_title{
	 background: url("../../images/tablet/top-menu-1.png") no-repeat scroll right top transparent;
    display: inline-block;
    height: 112px;
    position: absolute;
    top: 14px;
    width: 226px;
	margin:0;
}
.menu_title_16 {
    background: url("../../images/tablet/top-menu-2.png") no-repeat scroll right top transparent;
    display: inline-block;
    height: 80px;
    position: absolute;
	margin:0 250px 0 0;
    top: 35px;
    width: 175px;
	right:0px;
}
.menu_title_17 {
    background: url("../../images/tablet/top-menu-3.png") no-repeat scroll right top transparent;
    display: inline-block;
    height: 80px;
    position: absolute;
	margin:0 250px 0 0;
    top: 35px;
    width: 175px;
	right:0px;
}
.menu_title_18 {
    background: url("../../images/tablet/top-menu-4.png") no-repeat scroll right top transparent;
    display: inline-block;
    height: 80px;
    position: absolute;
	margin:0 250px 0 0;
    top: 35px;
    width: 175px;
	right:0px;
}
.menu_title_19 {
    background: url("../../images/tablet/top-menu-1.png") no-repeat scroll right top transparent;
    display: inline-block;
    height: 80px;
    position: absolute;
	margin:0 250px 0 0;
    top: 35px;
    width: 175px;
	right:0px;
}
.menu_title_20 {
    background: url("../../images/tablet/top-menu-3.png") no-repeat;
    display: inline-block;
    height: 80px;
    position: absolute;
	margin:0 250px 0 0;
    top: 35px;
    width: 175px;
	right:0px;
}
.menu_title_21 {
    background: url("../../images/tablet/top-menu-2.png") no-repeat;
    display: inline-block;
    height: 80px;
    position: absolute;
	margin:0 250px 0 0;
    top: 35px;
    width: 175px;
	right:0px;
}
.color_img{
	position: absolute;
	top: -10px;
	/*background:url("../../images/tablet/3color.png") no-repeat scroll 0 0 transparent;*/
	background:url("../../images/tablet/3color%20copy.png") no-repeat scroll 0 0 transparent;
	display: block;
	width: 195px;
	height: 215px;
	z-index: 9999;
	right: 116px;
}
#bubble{
	background: url("../../images/tablet/bubble.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 90px;
	margin: 0 0 0 85px;
    position: absolute;
    top: 100px;
    width: 230px;
	z-index: 99;
}
#bubble p{
	font-weight: bold;
	line-height: 1.5em;
	margin-left: 15px;
	padding:0px;
}
section{
	z-index: 9999;
}
.content {
  margin-top: -95px;
}
:focus{
	outline: medium none;
}
img{
	display: inline-block;
	border: medium none;
}
p{
	font: 13px Arial, Helvetica, sans-serif;
	padding: 10px 0px;
}
a{
	text-decoration: none;
	color: #474541;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
a:hover{
	text-decoration: none;
	color: #479B00;
}
.clr{
	clear: both;
	height: 0px;
}
.clearFix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
.f_left{
	float: left;
}
.f_right{
	float: right;
}
input, textarea, select
{
	font-size: 100%;
	font: 13px/20px "DroidSansRegular", sans-serif;	
	padding: 5px;
	width: 200px;
	border: 1px solid #CCC;
  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
  -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
  -ms-transition: border linear 0.2s, box-shadow linear 0.2s;
  -o-transition: border linear 0.2s, box-shadow linear 0.2s;
  transition: border linear 0.2s, box-shadow linear 0.2s;
}
select{
	width: 212px;
}
input:focus, textarea:focus
{
  border-color: rgba(82, 168, 236, 0.8);
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
  outline: 0;
  outline: thin dotted \9;
  /* IE6-9 */
}
input[type="checkbox"]{
	width: auto;
}
input[type="button"]{
	border: 1px solid #CCCCCC;
	border-radius:0px;
	background:#69551A;
	border-radius:3px;
	padding:2px;
	color:#FFF;
	font-weight:bold;
	cursor:pointer;
	box-shadow:1px 1px 7px #888;
	margin:0 1px;
	width:auto;
}
input[type="button"]:hover{
	color: #FFFFFF;
}
input[type="radio"]{
	width: auto;
	padding: 0px;
}
h3{
	font-size: 14px;
	color: #141414;
	font-weight:normal;
	padding: 12px 0px;
}
dl dt, dl dd{
	float: left;
	position: relative;
}
/* === MAIN GLOBAL STYLE  === */

.main{
	width: 800px;
	margin: 0 auto;
	position: relative;
}
/* === HEADER === */
.row-top{
	background: #141414;
	padding: 15px 0px;
}
.global_header_left{
	display: inline-block;
}
h1{
	display: inline-block;
	position: relative;
	z-index: 99;
	padding: 0 0 0 25px;
	overflow: hidden;
}
h1 a{
	display: block;
	background:url("../../images/tablet/site_logo.png") no-repeat scroll 0 0 transparent;
	text-indent: -9999px;
	width: 325px;
	height: 111px;
}
i.fixed{
	background:url("../../images/tablet/sprite1.png") no-repeat scroll 0 0 transparent;
	/*background-position: 0 -534px;*/
    display: block;
    height: 93px;
    left: 10px;
	z-index: 999;
    position: absolute;
    top: -2px;
    width: 100px;
}
.global_header_right{
	display: inline-block;
}
.sponser_logo{
	display: inline-block;
}
.h_li_top{
	margin-top: 8px;
}
.h_li_margin{
	margin-left: 52px;
}
.h_li_margin1{
	margin-left: 38px;
	margin-right: 0px !important;
}
ul#h_nav{
	
}
ul#h_nav li{
	display: inline-block;
	position: relative;
	margin-right: 3px;
	right:220px;
	font-size:.8em;
}
ul#h_nav li a.blog{
	background:url("../../images/tablet/blog.png") no-repeat scroll left center transparent;
	/*background: url("../../images/tablet/blog.png") no-repeat scroll left center transparent;*/
	display: block;
	padding-left: 30px;
	padding-right: 0;
	color: #479b00;
}
ul#h_nav li a.contact{
	background: url("../../images/tablet/contact.png") no-repeat scroll left center transparent;
	display: block;
	padding-left: 24px;
	padding-right: 0;
	color: #479b00;
}

/* === SECTION === */
.home_grid{
	margin-bottom: 30px;
}
.grid{
	display: inline-block;
	width: 150px;
	margin-top: -97px;
	/*margin-right: 2px;
*/	
	
}
.grid_title1{
	background: url("../../images/tablet/title-1.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 71px;
    width: 150px;
}
.grid_title2{
	background: url("../../images/tablet/title-2.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 71px;
    width: 150px;
}
.grid_title3{
	background: url("../../images/tablet/title-3.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 71px;
    width: 150px;
}
.grid_title4{
	background: url("../../images/tablet/title-4.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 71px;
    width: 150px;
}
.grid_title h4{
	padding: 23px 0 0 30px;
}
#content h2{
	font-size:1.1em;
	font-weight: bold;
    line-height: 22px;
    margin-bottom: 2px;
}
.submain{
	/*width: 750px;
	margin: 0 auto;*/
}
.icon1{
	background: url("../../images/tablet/icon1.png") no-repeat scroll 0 0 transparent;
	display: block;
	height: 31px;
	width: 30px;
}
.icon2{
	background: url("../../images/tablet/icon2.png") no-repeat scroll 0 0 transparent;
	display: block;
	height: 31px;
	width: 30px;
}
.icon3{
	background: url("../../images/tablet/icon3.png") no-repeat scroll 0 0 transparent;
	display: block;
	height: 31px;
	width: 30px;
}
.icon4{
	background: url("../../images/tablet/icon4.png") no-repeat scroll 0 0 transparent;
	display: block;
	height: 31px;
	width: 30px;
}
.clearFix span{
	float: left;
}
.clearFix h2{
	font-size: 16px;
	line-height: 1.2em;
	color: #479B00;
	margin-left: 40px;
}
.title_hr{
	background: url("../../images/tablet/border-title.png") repeat-x scroll 0 0 transparent;
	border: 0px !important;
	position: static;
	height: 18px;
	}
.more{
	text-align: right;
	margin: 25px 0 0 -35px;
	font-weight: bold;
	color: #000;
	background: url("../../images/tablet/m_icon_hover.png") no-repeat scroll 20% center transparent;
}
.more:hover{
	background: url("../../images/tablet/m_icon.png") no-repeat scroll 20% center transparent;
}
.more a
{
	color: #474541;
	text-decoration: underline;
}
.more a:hover{
	color: #479B00;
	text-decoration: underline;
}
/* === FOOTER === */
footer{
	padding:0 0 60px 0;
}
.ftr{
	margin: 20px 0 0 0;
}
.ftr_top_border{
	background: url("../../images/tablet/scissor.png") no-repeat scroll left center transparent;
	height: 13px;
}
hr{
	border: 1px dashed #CEC7BA;
    left: 45px;
    margin-top: 9px;
    position: absolute;
    right: 0;
}
.sponsers{
	display: inline-block;
	margin-left: 70px;
}
.sponsers img{
	display: inline-block;
	float: left;
	clear: right;
	width:330px;
}
.copyrights{
	display: inline-block !important;
	float: right;
	margin:7px 30px 0 0;
}

/* === SUB PAGES === */
.region-content ul, .region-content ol{
	padding:0px;
	margin:1em 0;
}
.page_content_icon{
	display: inline-block;
	width: 185px;
	margin-left: 30px;
	background: url("../../images/tablet/left_border.png") repeat-y scroll right center transparent;
}
.page_content_cont{
	width: 410px;
	display: inline-block;
}
.page_content_icon_inline{
	width: 275px;
	background: url("../../images/tablet/left_border.png") repeat-y scroll right center transparent;
	display: inline-block;
	margin:0;
}
h5{
	color: #479B00;
	font-weight: bold;
	font-size: 16px;
}
.page_content_cont_inline{
	display:inline-block;
	width: 350px;
	text-align:justify;
}
.block{
	margin-top: 20px;
}
ul.block li{
	display: inline;
	float:left;
}
.title h2{
	background:url("../../images/tablet/m_icon.png") no-repeat scroll left -1px transparent;
	display: block;
	font-size: 30px;
	color: #479B00;
	font-weight: bold;
	padding-left: 35px;
	line-height: 20px;
}
h2 span{
	display: block;
	font-weight: normal !important;
	font-size: 13px !important;
	margin-top: 5px;
	color: #000;
}
.li_icon{
	display: inline-block;
	width: 100px;
}
.P_icon-1{
	background: url("../../images/tablet/p_icon-1.png") no-repeat scroll left center transparent;
	display: block;
	height: 90px;
	float: left;
}
.P_icon-2{
	background: url("../../images/tablet/p_icon-2.png") no-repeat scroll left center transparent;
	display: block;
	height: 90px;
	float: left;
}
.P_icon-3{
	background: url("../../images/tablet/p_icon-3.png") no-repeat scroll left center transparent;
	display: block;
	height: 90px;
	float: left;
}
.cont-1{
	margin-top:10px;
}
.cont{
	float: left;
    width: 310px;
}
h3{
	color: #45aad5;
	font-weight: bold;
	font-size: 19px;
	padding: 0;
	line-height: 20px;
}
.cont p{
	padding: 5px 0 10px 0;
}
.width_video{
	width: 210px;
}
.width_video_cont{
	width: 275px;
}
.red_rope{
	display: inline-block;
    position: absolute;
    right: 206px;
    top: 105px;
}
.green_rope{
	display: inline-block;
    position: absolute;
    right: 98px;
    top: 111px;
}
.water_home{
    position: absolute;
    height: 121px;
	width:94px;
   /*right: 55px;*/
	right:74px;
	top: 94px;
    z-index: 1;
	background:url("../../images/tablet/water_home.png") no-repeat scroll 0 0 transparent;
}
.water_pump{ position:absolute; z-index:1;
background:url("../../images/tablet/water_pump.png") no-repeat scroll 0 0 transparent;
width:99px; height:76px; top: 158px; margin: 0 0 0 329px;
}
nav{
	background: url("../../images/tablet/menu_bg.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 76px;
    position: absolute;
	margin: 105px 0 0 80px;
    width: 260px;
	z-index:3;
}
nav ul li{
	display: inline;
	float: left;
}
nav ul li a.menu_1{
	background: url("../../images/tablet/menu-1.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 50px;
    left: -17px;
    position: absolute;
    text-indent: -5000px;
    top: 16px;
    width: 50px;
}
nav ul li a.menu_1:hover{
	background: url("../../images/tablet/menu_1_hover.png") no-repeat scroll 0 0 transparent;
	width: 45px;
	height: 45px;
}
nav ul li a.menu_2{
	background: url("../../images/tablet/menu-2.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 50px;
    left: 28px;
    position: absolute;
    text-indent: -5000px;
    top: 43px;
    width: 50px;
}
nav ul li a.menu_2:hover{
	background: url("../../images/tablet/menu_2_hover.png") no-repeat scroll 0 0 transparent;
	width: 45px;
	height: 45px;
}
nav ul li a.menu_3{
	background: url("../../images/tablet/menu-3.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 50px;
    left: 85px;
    position: absolute;
    text-indent: -5000px;
    top: 45px;
    width: 50px;
}
nav ul li a.menu_3:hover{
	background: url("../../images/tablet/menu_3_hover.png") no-repeat scroll 0 0 transparent;
	width: 45px;
	height: 45px;
}
nav ul li a.menu_4{
	background: url("../../images/tablet/menu-4.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 50px;
    position: absolute;
    right: 72px;
    text-indent: -5000px;
    top: 42px;
    width: 50px;
}
nav ul li a.menu_4:hover{
	background: url("../../images/tablet/menu_4_hover.png") no-repeat scroll 0 0 transparent;
	width: 45px;
	height: 45px;
}
nav ul li a.menu_5{
	background: url("../../images/tablet/menu-5.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 50px;
    position: absolute;
    right: 28px;
    text-indent: -5000px;
    top: 20px;
    width: 50px;
}
nav ul li a.menu_5:hover{
	background: url("../../images/tablet/menu_5_hover.png") no-repeat scroll 0 0 transparent;
	width: 45px;
	height: 45px;
}
}
