*{
	border:0;
	margin:0;
	padding:0;
}

body{
	background: #ccc ;
}

#imagen>div
{
			position: relative;
			bottom:39px;
			color:#fff;
			background-color:#000;
			padding:2px 91px;
			opacity:0.5;
			font-weight:bold;
			width:27%;
			
			
}
#imagen img{
-webkit-transition:all 0.8s ease; /* Safari y Chrome */
-moz-transition:all 0.8s ease; /* Firefox */
-o-transition:all 0.8s ease; /* IE 9 */
-ms-transition:all 0.8s ease; /* Opera */


}
#imagen:hover img {
-webkit-transform:scale(1.02);
-moz-transform:scale(1.02);
-ms-transform:scale(1.02);
-o-transform:scale(1.02);
transform:scale(1.02);
}
#imagen {/*Ancho y altura son modificables al requerimiento de cada uno*/
width:245px;
height:245px;
overflow:hidden;
border-radius: 5px;
}
		
#contenedor{
	height: 50%;
	width: 50%;
	padding: 5%;
	margin-right: auto;
	margin-left: auto;
	
}
header, #sistema {
	background: #fff;
	width: 104%;
	height: 120px;
	border-radius: 5px;
}
#banner{
	background: #666;
	height: 20%;
	width: 89%;
	padding-left: 13% ;
	padding-right: 2%;
	padding-top: 5px;
	border-radius: 5px;
	
}
#bloque1{
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
	
	
}
#bloque2 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
	
}
#bloque3 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
}
#bloque4 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
}
#bloque5 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
}
#bloque6 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
}
#sistema{
	
	height: 100px;
	}
h1 {
	font: 550% sans-serif;
	color: #00a650;
	text-shadow: 0 2px 2px #333, 0 -1px 2px #EAEAEA;
	position: relative;
	top: -120px;
	text-align:center;
	
}
#imagen1{
	height: 100%;
	width: 100%;
	border-radius: 5px;
}

#logo{
	
	border-radius: 5px;
}
h2 {
	font: 150% sans-serif;
	text-align:center;
	font: oblique 220% cursive;
	color: #00a650;
	
}
#imagen2{
    height: 100%;
	width: 100%;
	border-radius: 5px;
	
}

@media (max-width: 1810px) { 

h1 {
	font: 450% sans-serif;
	color: #00a650;
	text-align:center;
}
}
@media (max-width: 1180px) { 

h1 {
	font: 350% sans-serif;
	color: #00a650;
	text-align:center;
}
}

@media (max-width: 1000px) { 
#contenedor{
	height: 330%;
	width: 100%;
	padding: 5%;
	
	margin-right: 1px;
	margin-left: 1px;
	
}
header, #sistema {
	background: #fff;
	width: 104%;
	height: 120px;
	border-radius: 5px;
}
#banner{
	background: #666;
	height: 20%;
	width: 89%;
	padding-left: 13% ;
	padding-right: 2%;
	padding-top: 5px;
	border-radius: 5px;
	
}
#sistema{
	
	height: 50px;
	}
h1 {
	font: 350% sans-serif;
	color: #00a650;
	text-align:center;
}
h2 {
	text-align:center;
	font: oblique 150% cursive;
	color: #00a650;
	}
#bloque1{
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
	
	
}
#bloque2 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
	
}
#bloque3 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
}
#bloque4 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
}
#bloque5 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
}
#bloque6 {
	background: #666 ;
	height: 250px;
	width: 245px;
	display: inline-block;
	padding-right: 2%;
}
}