/*---------------- reset  ------------------*/
@import url(https://fonts.googleapis.com/css?family=Open+Sans:700italic,300,600,800);
@import url(https://fonts.googleapis.com/css?family=Roboto:400,600,900,900italic);
@import url('https://fonts.googleapis.com/css?family=Spicy+Rice');
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, fieldset, legend, caption, .filters ul li p, figure { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; line-height: normal; line-height: 1.5em; -webkit-font-smoothing: antialiased;}

body{font-family:'Roboto'; color:#fff;  background: #902890 url("../graphics/body.png") no-repeat center -20px;}
html{overflow-x:hidden;height:100%}
.mano{width:100%}
ol,ul,li{list-style:none;font-weight:lighter}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
:focus{outline:0}
ins{text-decoration:none}
del{text-decoration:line-through}
table{border-collapse:collapse;border-spacing:0}
em{font-style:normal}
a{text-decoration:none;cursor:pointer; color:#444; font-weight:800}
.clear{clear: both}
*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.clearfix:before,.clearfix:after{content:" ";display:table}
.clearfix:after{clear:both}
.center{text-align:center}
button{text-decoration:none}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
.blur{opacity:0}
.pad10,nav li a{padding:10px}
h1{font-family: 'Open Sans',sans-serif; font-size: 1.8em; text-transform: uppercase;  font-weight: 600; -webkit-font-smoothing: antialiased;  letter-spacing: -1.5px; margin-bottom: 10px;}   
h2{font-family: 'Open Sans',sans-serif; font-size: 1.4em; text-transform: uppercase;  font-weight: 600;  -webkit-font-smoothing: antialiased; letter-spacing: -1.5px; margin-bottom: 10px;}
#slider{float:left; width:100%; padding-top:68px;}
#slider img{width:100%; display:block}
.titulos span{float: left; padding-left: 80px;  width:100%;  margin:200px auto 0;}
h4{font-size:46px; letter-spacing:-.5px;}
h5{font-size:82px; color: #FAB13F; line-height: 76px;}
#logo{position: absolute; top: 0px;  left: 0px;  z-index: 99999;}
#logo img{width:300px; }
header nav{position:absolute; width:100%; top:20px; right:0px;}
header nav a{float: right; font-weight: 600; padding:3px 60px 0px; margin: 2px 40px; background: #3b93d2; color: #fff; border-radius: 6px; font-size: .9em; border: 2px solid #8dc0e5; box-shadow: 0px 2px 10px #444; text-align:center	}
.maintit{font-size:56px; font-weight:bold;}
header nav a:hover{}  
header nav a p{  font-size: .8em; letter-spacing: .5px; font-weight: 400; line-height: 12px; margin-bottom: 5px;}
.half{width:50%; float:left;}
.cien{width:100%; float:left;}
.sesenta{width:60%; float:left; padding-right:40px}
.cuarenta{width:40%; float:left;}
.imagen{width:100%; float:left; padding:0 20px;}
.imagen p{text-align: center;  font-size: .9em; padding: 20px 0; line-height: 20px;}
.imagen img{width:100%; display:block}
.content{float:left; width:100%; padding:50px 80px 0px 80px;}
#denuncia, #llenar{float: left; padding: 10px 50px; background: #fab140; color: #ffffff; border-radius: 4px; margin-top: 12px;  box-shadow: 6px 12px 14px #353535; font-weight: bold; text-shadow: 1px 1px 3px #313030; font-size: 20px; border: 1px solid #7f4305fa;}
.leftcuarenta{padding-left:40px;}
#denuncia:hover, #llenar:hover{background:#e0a03e;}

@media (max-width: 1366px){
h4{font-size:33px;}
h5{font-size:58px;}
.titulos span{float: left; padding-left: 80px;  width:100%;  margin: 120px auto 0;}
}


@media (max-width: 1280px){
.titulos span{margin:150px auto 0}

}

/*
	TO PREVIEW ON THE DESKTOP, REPLACE THE QUERY WITH THE FOLLOW:
	@media (max-width: 885px) {  }
	@media (max-width:870px) and (orientation: landscape){}
*/
@media (max-width:1024px){
	h4{font-size:25px!important;}
	h5{font-size:44px!important;}
	.maintit{font-size:32px}
	.center{margin-bottom:20px}
	.leftcuarenta{text-align:justify}
	}

@media (max-width: 885px){
	.padleft, .pad{padding-left:0px; padding-right:0px}
	.sesenta, .cuarenta{float:left; }
	.imagen{display: none}
	#denuncia{float:none; display: block; width:400px; margin:20px auto 0; text-align:center;}
	}

@media (max-width: 768px){
	.padleft, .pad{padding-left:0px; padding-right:0px}
	.sesenta, .cuarenta{float:left; width:100%}
	.imagen{display: none}
	h4{font-size:40px!important; text-align:center; line-height:40px;}
	h5{font-size:49px!important; text-align:center;}
	.titulos span{padding-left:0px;}
	.wrapMano{float: right; width: 540px;}
	.leftcuarenta{margin-top:20px;}
	#llenar{text-align:center; width: 100%; margin:40px 0 80px}
	}
@media (max-width: 640px){
	.leftcuarenta{padding:0!important}
	}
/*
	TO PREVIEW ON THE DESKTOP, REPLACE THE QUERY WITH THE FOLLOW:
	@media (max-width: 885px) {  }
*/

@media (max-width:540px) {
.leftcuarenta{padding:0!important}
.sesenta h1, h2{letter-spacing: -.5px; font-size:1.8em; line-height:47px; margin-top:10px; text-align:center; font-weight:800}
p{font-size: .9em; text-align: justify}
.content{padding: 20px 30px 0px 30px}

.wrapMano{width: 320px;}
	}
}