@media screen{
	
	a, a:link, a:visited{
		font-family: Sans-serif;
		color:white;
		text-decoration:none;
		padding: 10px;
	}
	h2{
		font-family: Arial, serif;
		font-size:100%;
		color:white;
	}
	h3{
		font-family: Arial, serif;
		font-size:100%;
		color:#864f3f;
	}	
	ul{
		display: block;
		font-size:100%;
		padding: 0.0em;
		line-height: 2.5em;
		list-style-type:none;
		text-align: justify;
	}
	ul li{
		border-radius: 8px;
		color:white;
		background-color:#a05a2c;
		padding:0.5em;
		margin:0.5em;
		margin-left: 0.2em;
	}
	.liserv{
		border: 0px solid white;
		border-radius: 8px;
		font-size:120%;
		font-style: Italic;		
		opacity:1;
		width: 90%;
		line-height: 0.5em;
		background-color:#917c6f;
	}
	.disabled{
		border: 0px solid black;
		border-radius: 8px;
		font-size:120%;
		font-style: Italic;
		color:grey;
		opacity:1;
		width: 90%;
		line-height: 0.5em;
		background-color:#666666;
	}
    .liproc{
        border: 0px solid white;
        border-radius: 8px;
        font-size:120%;
        font-style: Italic;
        opacity:1;
        width: auto;
        line-height: 0.5em;
        background-color:#917c6f;
    }
    .liprocG{
        border: 0px solid white;
        border-radius: 8px;
        font-size:120%;
        font-style: Italic;
        opacity:1;
        width: auto;
        line-height: 0.5em;
        background-color:#364e59;
    }
    .liprocV{
        border: 0px solid white;
        border-radius: 8px;
        font-size:120%;
        font-style: Italic;
        opacity:1;
        width: auto;
        line-height: 0.5em;
        background-color:green;
    }
    .liprocE{
        border: 0px solid white;
        border-radius: 8px;
        font-size:120%;
        font-style: Italic;
        opacity:1;
        width: auto;
        line-height: 0.5em;
        background-color:#d76cff;
    }
	.li2{
		border: 0px solid green;
		border-radius: 8px;
		font-style: Italic;
		opacity:1;
		width: auto;
		color:black;
		margin-left: -3em;
		padding:1em;
	}
	.li3{
		border-radius: 4px;
		font-size:110%;
		font-style: Italic;
		color:white;
		background-color:#864F3F;
		opacity:1;
		width: auto;
		padding:0.5em;
		margin:0.1em;
		line-height: 1.5em;
	}
	.li4{
		border-radius: 5px;
		font-size:110%;
		font-style: italic;
		color:orange;		
		opacity:1;
		width: auto;
		padding: .2em;
		margin:0.2em;
		line-height: 1.5em;
	}
	.lip{
		font-size:120%;
		font-family: Sans-serif;
		color:white;
		width: auto;
		margin:0.1em;
		padding: 1em;
		line-height: 1.5em;
	}	
	p{
	    font-size:100%;
		padding:0.5em;
		color: black;
		font-family: sans-serif;
		line-height: 1.4em;
		align: center;
	}
	.p1{
		margin:0.3em;		
	}
	p.p2{
	    font-size:120%;
		padding:0.1em;
		color: black;
		line-height: 1.5em;
		text-align: justify;
	}
	p.p3{
	    font-size:90%;
		padding:0.2em;
		color: black;
		line-height: 1.5em;
		text-align: justify;
		margin-bottom:1%;
		margin-top:1%;
	}
    div.invi{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:110%;
		color:#864F3F;
    }
    div.invi2{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
		color:white;
		margin-left:5%;
		margin-bottom:2%;
		margin-top:1%;
    }
	.logo {
		width: 285px;
		height: 80px;
	}
    .icon {
        width: 25px;
        height: 25px;
    }
    .icon_mail {
        width: 28px;
        height: 17px;
    }
    .icon_s {
        width: 65px;
        height: 65px;
        margin-right:5px;
        margin-bottom:5px;
    }
    .logo_app {
        width: 85px;
        height:85px;
    }
    .logo_take {
        width: 123px;
        height:87px;
    }
    .take_open {
        width: 644px;
        height:425px;
    }
    .icon_logo {
        width: 125px;
        height: 25px;
		padding: 0.3em;
		align: center;
    }
	#edit1 {
		width: 150px;
		height: 150px;
	}
	#edit2 {
		width: 128px;
		height: 160px;
	}
	#edit3 {
		width: 230px;
		height: 150px;
	}	
	.intro{
		font-family: Arial, serif;
		font-style: Italic;
		font-size:105%;
		color:#864F3F;
	}
	#arb{
		display:none;		
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:100%;
		color:grey;
		background-color:#474747;
	}
	#sd{
		visibility: visible;
		font-family: sans-serif;
		font-size:100%;
		color:grey;
		padding:0.5em;
		background:grey
	}
	#sr{
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
		color:grey;
		padding: 5px;
	}
	#st{
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
		color:grey;
		padding: 5px;
	}
	#sc{
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
		color:grey;
		padding: 5px;
	}
	#pel{
		display:none;		
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
		color:white;
	}
	#instalacion{
		display:none;
		padding: 0.1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
	}
	#modulos{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
	}
	#inf_procesos{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
	}
	#features{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
	}
	#proyectos{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
		color:grey;
	}		
	#varios{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:110%;
		color:#864F3F;
	}
	#carac{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
		color:white;
		margin-left:5%;
		margin-bottom:2%;
		margin-top:1%;
	}
	#pantalla{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:110%;
		color:#864F3F;
	}
	#menus{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:110%;
		color:#864F3F;
	}
	#capas{
		display:none;
		padding:1em;
		visibility:visible;
		font-family:sans-serif;
		font-size:110%;
		color:#864F3F;
	}
    #procesos{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:110%;
		color:#864F3F;
	}
    #servicios{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:110%;
		color:#864F3F;
	}
    #jardines{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:110%;
		color:#864F3F;
	}
    #luz{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:110%;
		color:#864F3F;
	}
	#mapas{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:110%;
		color:white;
	}
	#requisitos{
		display:none;
		padding: 1em;
		visibility: visible;
		font-family: sans-serif;
		font-size:90%;
		color:white
	}
	grid-container	 {
		display: grid;
		grid-auto-flow: column;
		grid: auto / auto auto;
		grid-gap: 20px;
		font-size:100.0%;
		width: auto%;
		background-color:grey;
		padding: 0.1em;
	}
	.grid-container > div {
		background-color: white;
		text-align: left;
		font-size: 100.0%;
		padding: 1% 1% 1% 1%;
		align: center;
	}
	.grid-container-info	 {
		display: grid;
		grid-auto-flow: column;
		grid: auto / auto auto;
		grid-gap: 2px;
		font-size:100.0%;
		width: auto;
		background-color:grey;
		padding: 0.1em;
	}
	.grid-container-info > div {
		background-color: white;
		text-align: center;
		font-size: 100.0%;
		padding: 1% 1% 1% 1%;
		align: center;
	}
    .grid-container-info2	 {
		display: grid;
		grid-auto-flow: column;
		grid: auto / auto auto auto auto auto;
		grid-gap: 2px;
		font-size:85.0%;
		width: auto;
		background-color:grey;
		padding: 0.1em;
	}
	.grid-container-info2 > div {
		background-color: white;
		text-align: center;
		font-size: 90.0%;
		padding: 0.5% 0.5% 0.5% 0.5%;
		align: center;
	}
    .grid-container-info3	 {
		display: grid;
		grid-auto-flow: column;
		grid: auto / auto auto auto auto;
		grid-gap: 2px;
		font-size: 100.0%;
		width: auto;
		background-color:grey;
		padding: 0.1em;
	}
	.grid-container-info3 > div {
		background-color: white;
		text-align: center;
		font-size: 100.0%;
		padding: 0.5% 0.5% 0.5% 0.5%;
		align: center;
	}
	.item{
		font-style: bold;
		color:grey;
	}
    .value{
        font-style: italic;
        color:black;
    }
	.imagen{
	    margin-right:10px;
	    margin-bottom:5px;
	    align: center;
	}
	.hide{
		opacity: 0;
		height: 10px;
	}
    responsive {
      width: 100%;
      height: auto;
    }
    video {
      max-width: 100%;
      height: auto;
    }
	body{
		width:95%;
		height: auto;
		margin:auto;
		background-color:#f2f2f2;
	}
	footer{
		display:block;
		position:fixed;
        bottom:0.0em;
        width:100%;
        height:auto;
		text-align:center;
		font-family: sans-serif;
		font-size:80.0%;
		padding: 0em;
		background-color:#eac96a;
	}
}