﻿/*-----------------------------------------------------------------------------
		STANDARD - BigDiv3-grid (3 columns) updated-2024
------------------------------------------------------------------------------*/	


/*=================================================================
	PAGES:
	Contact
==================================================================*/	


/*--------------------BIG DIV (1 Row)---------------------*/	


/*********************
		DESKTOP
**********************/	

.BigDiv3-grid {   
	display: grid;
	width: 90%;
	height: auto;
	margin: 0 auto;
	padding:0; 
	grid-template-columns: 30% 30% 30%;
	box-sizing: border-box;
	justify-content: center;
}


.BigDiv3-grid-standard {
	margin: 0 2%;
	padding: 30px 0;
	text-align: center;  
	overflow: hidden;
	background-color: var(--body_color);
	box-sizing: border-box;
}


.BigDiv3-grid-standard img {
	width: 25%;
	height: auto;
	background: none; 

}


.BigDiv3-grid-standard h3 {
	text-align: center;
	line-height: normal;
	margin: 0;
	padding: 0;
}

.BigDiv3-grid-standard p {
	margin: 0;
	padding: 0 5%;
	text-align: center;
	line-height: normal;

}




/*---------------------------------
	--OPTIONALS --
	Rounded Corners
	Shadows
	Separation Lines
----------------------------------*/

.BigDiv3-RoundedC {
	border-radius: 20px;
}

.Shadows {
	box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.2);
}

.BigDiv3-SLine {
	border-right: solid 1px #eeefef;
}



/*************************
		iPad Air & Mini
**************************/	

@media screen and (max-width: 820px) {
 	
	.BigDiv3-grid {    
		width: 100%;		
		margin: 0 auto;
		overflow: hidden;   
	}


}


/***************************
		iPhone
****************************/	

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

	.BigDiv3-grid {   
		display: grid;
		width: 100%;
		height: auto;
		margin: 0 auto;
		padding: 0; 
		grid-template-columns: 90%;
		box-sizing: border-box;

	}
	
	
	.BigDiv3-grid-standard {		
		border-radius: 0;
		width: 100%;
		padding: 10px 0 30px 0;
		margin: 0;
		box-sizing: border-box;	
		text-align: center;
	}

	
	.BigDiv3-grid-standard h1 {
		text-align: center;
		margin: 5px 5%;
	}

	.BigDiv3-grid-standard h2 {
		text-align: center;
		margin: 5px 2%;
	}


	.BigDiv3-grid-standard h4 {
		text-align: center;
		margin: 5px 5%;
	}

	
	.BigDiv3-grid-standard p {
		margin: 0 5%;
		margin-bottom: 50px;
	}
	
	.BigDiv3-RoundedC {
		margin-bottom: 5%;
	}

	.BigDiv3-SLine {
		border-right: none;
		border-bottom: solid 1px #eeefef;
		margin:3 0px 0;
	}

}





/*--------------------BIG DIV (2 Rows) (NOT USED)---------------------*/	

/*********************
		DESKTOP
**********************/	

.BigDiv3x2-grid {   
	display: grid;
	width: 90%;
	height: auto;
	margin: 0 auto;
	padding: 0; 
	grid-template-columns: 32% 32% 32%;
	box-sizing: border-box;
	justify-content: center; 
	align-items: center;
}


.BigDiv3x2-grid-standard {
	margin: 0 1%;
	padding: 0;
	text-align: center;	   
	overflow: hidden;
}


.BigDiv3x2-grid-standard img {
	max-width: 100%;
	height: auto;
}


.BigDiv3x2-grid-standard h3 {
	text-align: center;
	margin: 5px auto;
}

.BigDiv3x2-grid-standard p {
	margin: 0;
	padding: 0 5%;
	text-align: left;
}




/*************************
		iPad 
**************************/	

@media screen and (max-width: 768px){
 	
	.BigDiv3x2-grid {    
		width: 90%;
		grid-template-columns: 35% 35% 35%;
	}

	.BigDiv3x2-grid-standard {
		margin: 1%;

	}

}


/***************************
		iPhone
****************************/	

@media screen and (max-width: 470px) {
 
	.BigDiv3x2-grid {
		width: 90%;
		grid-template-columns: 100%;
	}
	
	.BigDiv3x2-grid-standard {
		margin: 1%;

	}

	.BigDiv3x2-grid-standard h1{
		text-align: center;
		margin: 5px 5%;
	}

	.BigDiv3x2-grid-standard h2 {
		text-align: center;
		margin: 5px 5%;
	}

	.BigDiv3x2-grid-standard h3 {
		text-align: center;
		margin: 5px 5%;
	}

	.BigDiv3x2-grid-standard h4 {
		text-align: center;
		margin: 5px 5%;
	}
	
	.BigDiv3x2-grid-standard p {
		margin: 0 5%;
		margin-bottom: 50px;
	}
	
}













