*{
	margin:0;
	padding:0;
	font-family: 'Inconsolata', monospace; 
	box-sizing:border-box; 
}

html, body{
	height:100%;
}

a{

	text-decoration:none; 

} 

#side2-PC{
	background-color:#006600; 
	float: left;
	display:inline-block;  
	width:22%;
	height:100%;
	position:absolute;
	left: 78%;
	top:0%;

}

#side1-PC{
	background-color: white; 
	float: left;
	display:inline-block;  
	width:78%;
	height:100%;
	position:absolute;
	left: 0%;
	top:0%;
	overflow-y: scroll;
}

#title-link-PC{
	background-color: black ;
    position:absolute;
	top:2.3%;
	left:5%;
	width:90%;
	height:10%;
    border: 5px solid white;
}


#cross-perfil-PC{

	border: 5px solid #003300;
	border-radius:50%; 
	position:absolute;
	top:16%;
	left:7.5%;
	width:80%;
	height:36%;

}

#letter-box-PC{

    position:absolute;
	top:55.2%;
	left:7%;
	width:86%;
	height:42%;

}

#box-link-1-PC{

	background-color: black ;
    position:absolute;
	top:5%;
	left:5%;
	width:90%;
	height:22%;
    border: 5px solid white;


}


#box-img-1-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:0%;
	width:27%;
	height: 100%;
    
}


#box-texto-2-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:27%;
	width:73%;
	height: 100%;

}


#box-link-2-PC{

	background-color: black ;
    position:absolute;
	top:36.5%;
	left:5%;
	width:90%;
	height:22%;
    border: 5px solid #003300;
	
}

#box-img-3-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:0%;
	width:27%;
	height: 100%;
    
}

#box-texto-4-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:27%;
	width:73%;
	height: 100%;

}

#box-link-3-PC{

	background-color: black ;
    position:absolute;
	top:69%;
	left:5%;
	width:90%;
	height:22%;
    border: 5px solid white;

}

#box-img-5-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:0%;
	width:27%;
	height: 100%;
    
}

#box-texto-6-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:27%;
	width:73%;
	height: 100%;

}



#box-link-4-PC{

	background-color: black ;
    position:absolute;
	top:89%;
	left:79%;
	width:20%;
	height:8%;
    border: 5px solid #003300;

}


#box-img-7-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:0%;
	width:27%;
	height: 100%;
    
}

#box-texto-8-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:27%;
	width:73%;
	height: 100%;

}


#img-PC{


    position:absolute;
	top:0%;
	left:0%;
	width:100%;
	height: 100%;


}
#img-2-PC{


    position:absolute;
	top:0%;
	left:0%;
	width:100%;
	height: 100%;


}

#box-link-1-PC:hover , #box-link-2-PC:hover, #box-link-3-PC:hover, #title-link-PC:hover{
border: 5px solid #003300;
}
#box-link-4-PC:hover, #box-1:hover, #box-2:hover, #box-3:hover, #box-4:hover, #box-5:hover, #box-6:hover,#box-7:hover, #box-8:hover, #box-9:hover{
	width:30%;
    height:30%;
    border: 5px solid black;
}




#box-link-5-PC{

	background-color: black ;
    position:absolute;
	top:4.2%;
	left:38.5%;
	width:20%;
	height:8%;
    border: 5px solid #003300;	

}

#box-img-9-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:0%;
	width:27%;
	height: 100%;	

}

#box-texto-10-PC{

	background-color: #006600 ;
    position:absolute;
	top:0%;
	left:27%;
	width:73%;
	height: 100%;

}







#box-1{
	position: absolute;
	margin-left:1.75%;
	top:17%;
    width:27%;
    height:39%;
    left:2%;
    background-color: #006600; 
    min-width:207px; 
}



#box-2{
	position: absolute;
	margin-left:1.75%;
	top:17%;
    width:27%;
    height:39%;
    background-color: #006600;
    left:33%; 
    min-width:207px; 
}


#box-3{
	position: absolute;
	margin-left:1.75%;
	top:17%;
    width:27%;
    height:39%;
    background-color: #006600;
    left:66%; 
    min-width:207px; 
}

#box-4{
	position: absolute;
	margin-left:1.75%;
	top:58%;
    width:27%;
    height:39%;
    background-color: #006600;
    left:2%; 
    min-width:207px; 
}

#box-5{
	position: absolute;
	margin-left:1.75%;
	top:58%;
    width:27%;
    height:39%;
    background-color: #006600;
    left:33%; 
    min-width:207px; 
}

#box-6{
	position: absolute;
	margin-left:1.75%;
	top:58%;
    width:27%;
    height:39%;
    background-color: #006600;
    left:66%;
    min-width:207px; 
}

#box-7{
	position: absolute;
	margin-left:1.75%;
	top:99%;
    width:27%;
    height:39%;
    background-color: #006600;
    left:2%;
    min-width:207px; 
}

#box-8{
	position: absolute;
	margin-left:1.75%;
	top:99%;
    width:27%;
    height:39%;
    background-color: #006600;
    left:33%;
    min-width:207px; 
}

#box-9{
	position: absolute;
	margin-left:1.75%;
	top:99%;
    width:27%;
    height:39%;
    background-color: #006600;
    left:66%;
    min-width:207px; 
}

#title-img{

	position: absolute;
	margin-left:5%;
	margin-top:5%;
    width:90%;
    height:70%;
    background-color: #006600; 

}

#icon-img{

	position: absolute;
	margin-left:5%;
	margin-top:1.5%;
    width:15%;
    height:16.5%;
    top:78%;
    background-color: #006600; 

}

#about-img{

	position: absolute;
	margin-left:5%;
	margin-top:1.5%;
    width:68.6%;
    height:16.5%;
    top:78%;
    left:21%;
    background-color: #006600; 
	
}



@media screen and (max-width: 762px) {


	#side1-PC{
	
		display:block;
		top:0%;
		width:100%;
	}

	#side2-PC{
	
		display:block;
		top:100%;
		left:0%;
		width:100%;
	}

    #box-1{

    min-width:207px;
    left:13px; 
    
    }
}

@media screen and (max-width: 962px) {

	#box-1{
		left:2.5%;
	}

	#box-2{
	    left:51.8%;
	}

	#box-3{
		top:58%;
	    left:2.5%; 
	    
	}
    
    #box-4{
		top:58%;
	    left:51.8%; 
	    
	}

	#box-5{
		top:99%;
	    left:2.5%; 
	    
	}
    
    #box-6{
		top:99%;
	    left:51.8%; 
	    
	}

	#box-7{
		top:140%;
	    left:2.5%; 
	    
	}
    
    #box-8{
		top:140%;
	    left:51.8%; 
	    
	}
    
    #box-9{
		top:181%;
	    left:2.5%; 
	    margin-bottom: 2%; 
	}

}

@media screen and (max-width: 400px) {

	#box-1{
		left:20.5%;
	}
	#box-2{
		top:58%;
	    left:20.5%;
	}
	#box-3{
		top:99.5%;
	    left:20.5%; 
	    
	}

	#box-4{
		top:141%;
	    left:20.5%; 
	    
	}
	#box-5{
		top:182.5%;
		left:20.5%;
	}
	#box-6{
		top:224%;
	    left:20.5%;
	}
	#box-7{
		top:265.5%;
	    left:20.5%; 
	    
	}

	#box-8{
		top:307%;
	    left:20.5%; 
	    
	}

	#box-9{
		top:348.5%;
	    left:20.5%; 
	    
	}
	#box-link-5-PC{
		  
		left:40%;
	}

	#side2-PC{
	
		display:block;
		top:100.5%;
		left:0%;
		width:100%;
	}

}