
/* author Nadeem Elai
 * email : nad@3deem.com
 * tel : 343-596-8373
 * socials : nadeem.elahi@gmail.com
 * youtube.com/@nadeemelahi593
 * github.com/nadeemelahi
 * linkedin.com/in/nadeemelahi
 * Date: Aug 18th 2026
 *
 * w3schools/css/css_font.html
 *
 */

h1 , h2 , h3 , h4 , h5 , h6 {

	font-family : Arial , Helvetica , sans-serif ; 
}
p { 
	font-family: "Times New Roman" , Times , serif ; 
}
button , input {

	font-family: "Lucida Console" , "Courier New" , monospace ; 
}
/*
 * w3schools/css/css_font.html
 *
 */
main , header , article , aside , section , footer , canvas {
	
	display: block;
}
a { text-decoration : none ; }
img { max-width : 100% ; }
header , footer { text-align : center }
footer { clear : both }

a.activeLink { color : gray }
.linksbar { 
	text-align : center ;
}
.linksbar > a { 
	padding: 0 5px ;
}
.clear { clear : both }

#threeColumnRowH2Pg {
	text-align: center ;
	width: 100%;
}

@media ( min-width : 600px ) {
	#threeColumnRowH2Pg {
		width: 570px ; 
		margin: 0 auto ;
	}
	#threeColumnRowH2Pg > section {
		display : inline-block;
		width : 160px ;
		padding: 5px ;
		margin: 5px ;
	}
}

/*
 * about pg
 *
 * section -> article -> imgAside , txtAside
 */
#aboutArticle {
	max-width : 600px ;
	margin : auto ;
	box-sizing : border-box ;
	padding : 20px ; 
	background : #fafafa ;
}
#aboutArticle > aside:first-child { 
	text-align : center ;
}
#aboutArticle > aside:last-child { 
	margin : auto ;
}

@media ( min-width : 550px ) {

	#aboutArticle { 
	}
	#aboutArticle > aside:first-child { 
		float: left ;
	}
	#aboutArticle > aside:last-child { 
	}
}

/*
 * contact pg 
 *
 * section -> article -> imgAside , txtAside  
 */
#contactArticle { 
	width : 100% ;
	margin : auto ;
	padding : 20px ;
	background : #fafafa ;
}
#contactArticle > aside:first-child { 
	text-align : center ;
}
#contactArticle > aside:last-child { 
	max-width : 220px ;
	margin : auto ;
}

@media ( min-width : 550px ) {

	#contactArticle { 
		width : 520px;
	}
	#contactArticle > aside:first-child { 
		float: right ;
	}
	#contactArticle > aside:last-child { 
		margin-right : 300px ;
		text-align : right ;
	}
}

/*
 * school list 
 */
#schoolArticle ,
#shopArticle {
	max-width: 600px;
	margin: auto;
	padding : 20px ;
	background : #fafafa ;
}

#alignRight { 
	text-align : right ;
	clear : right ;
}
@media ( min-width: 500px ) {
	#floatListRight {

		float : right ;
		padding-right : 50px ;
	}
}

