@charset "ISO-8859-1";
/* -------------------
xxx-large = 2.75 rem
xx-large= 2.25
x-large = 1.75rem
large = 1.5rem
medium = 1.25rem
small = 1rem
x-small = .85rem
xx-small = .65rem
xxx-small= .5rem
---------------------*/
@media (orientation:landscape){
	form{
		display:block; padding:3px; 
		font-size: 1rem;
		width:40%;border: solid lightgrey thin; 	
	}	
	.div-services{
		display: flex; flex-direction:row; justify-content:center; width: 100%;	
	}	
	.service-box {
	 	vertical-align: top;		 	
	 	font-size: large;
	 	padding: 1%;
	} 	
	.service-box figure{
		margin:0 auto; display:block; 
		width: 250px; height:250px;
	}
	.service-box div{
		display:block; width: 100%;
	}	
	.gallery{
		margin:0 auto; display:block; 
		width: 450px; height:450px;
	}	
	.p-services{
		margin:0 auto;
		width:100%;
		text-align:center;
		font-size:1.25rem; font-weight:bold;
	}
	/* Set the size of the div element that contains the map */
	#map {
	  	width: 30vw;height: 40vh; 
	  	display: inline-block;
		padding: 4px 4px 4px 4px;
		border: solid silver thin;
	}
}

@media (orientation:portrait){
	form{
		display:block; padding:3px; 
		font-size: 1rem;
		width:95%;border: solid lightgrey thin; 	
	}
	.div-services{
		display: flex; flex-direction:column; justify-content:center; width: 100%;	
	}	
	.service-box {
	 	vertical-align: top;		 	
	 	font-size: large;
	 	padding: 1%;
	 	margin: 0 auto;
	} 	
	.service-box figure{
		margin:0 auto; display:block; 
		width: 250px; height:250px;
	}
	.service-box div{
		display:block; width: 100%;
	}	
	.p-services{
		margin:0 auto;
		width:100%;
		text-align:center;
		font-size:1.25rem; font-weight:bold;
	}
	/* Set the size of the div element that contains the map */
	#map {
	  	width: 95%; height: 40vh; 
	  	display: block;
		padding: 4px 4px 4px 4px;
		border:solid silver thin;
		margin: 0 auto;
	}
}
/****************************/
/*** Not oriented objects ***/
/****************************/
p {font-size:1rem;}

form.input{
	border: solid grey thin;	
	border-radius: 5px;						
}
input:hover{
	background-color:#92D050;
}
textarea{
	width:250px; height:100px; resize:none; border:none; 	
	font-size:.75rem;
}

.front-page{
	display:block;
 	width:100%; height: 100vh;
  	background-color: none;
}

.banner{
	text-align: center; color: white;
}

.working-area{
	display:block;
	/*Use class centered for horizontal alignment*/
	height:auto; /*use class partial-width for width*/
	background-color: white;
	padding-top: 5 px;	
}	

.properties-div{
	display: flex; justify-content:center; width:100%;	
}
.properties-button{
	width:250px; height: 50px; line-height:50px; 
	display:block; 
	text-align:center;
	border-radius: 15px; 
	background-color: #00245C; color:white; font-weight: bold; 	
}

.properties-button:hover{
	color:#92D050; 	
}


.frmlbl{
	display: inline-block;
	height: 25px; width: 85px;			
	padding: 4px 4px 4px 4px;
	font-size: .85rem;
}
.frminpt{
	display: inline-block;
	height: 25px; width: 250px;
	font-size: .85rem;
}

.icons{
	width:100%; height:auto; padding: 4px 4px 4px 4px;	
}

.icon-box{
	display:block;	
}
.icon-div{
	width:30px; height:30px; 
	display:inline-block; 
}
.icon-div-txt{
	display:inline-block; 
	width:auto; height:30px;
	vertical-align:top;
	/*width:300px; height: 30px;	
	vertical-align:top;*/
}
.icon-p{
	margin:0; padding:0px;
	line-height:30px;
}
