/*** CSS BY SCREEN SIZE ***/
/*** Styles for ads are in styles.php ***/
/* Small Devices */
@media only screen and (min-width : 320px) and (max-width : 479px) {
	body {
		width: 98%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead {
		position: relative;
		top: 0;
	}
	#masthead th {
		font-size: 1.5em;
		width: 90px;
	}
	#masthead th:first-child {padding-right: 5%;}
	#masthead th:last-child {padding-left: 5%;}
	#masthead img {
		width: 50px;
		height: auto;
	}
	#appbanner {width: 98% !important;}
	/*** FOOTER STYLES ***/
	#connect #contact #phone {display: none;}
	#connect #contact a img, #connect #social a img {height: 2.0em;}
	#connect #contact a {margin: 1em 0.5em auto 0;}
	#connect #social a {margin: 1em 0 auto 0.5em;}
	.footerad {
		width: auto;
		max-height:20% !important;
	}
	/*  FOOTER MENU  */
	#nav-btm {
		line-height: 2.0em;
		font-size: 1.0em;
	}
	/*** DOCUMENT STYLES ***/
	.customcolumnMain {
		margin: 0 auto;
		width: 98%;
		padding: 5%;
	}
	#thumbnailshare{max-width: 100% !important;}
}

/* Small Devices, Phones */
@media only screen and (min-width : 480px) and (max-width : 579px) {
	body {
		width: 94%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead {
		position: relative;
		top: 0;
	}
	#masthead th {
		font-size: 1.7em;
		width: 100px;
	}
	#masthead th:first-child {padding-right: 5%;}
	#masthead th:last-child {padding-left: 5%;}
	#masthead img {
		width: 50px;
		height: auto;
	}
	#appbanner {width: 98% !important;}
	/*** FOOTER STYLES ***/
	#connect #contact #phone {display: none;}
	#connect #contact a img, #connect #social a img {height: 2.2em;}
	#connect #contact a {margin: 1em 0.8em auto 0;}
	#connect #social a {margin: 1em 0 auto 0.8em;}
	.footerad {
		width: auto;
		max-height:20% !important;
	}
	/*  FOOTER MENU  */
	#nav-btm {
		line-height: 2.2em;
		font-size: 1.0em;
	}
	/*** DOCUMENT STYLES ***/
	.customcolumnMain {
		margin: 0 auto;
		width: 98%;
		padding: 5%;
	}
	#thumbnailshare{max-width: 80% !important;}
}

/* Small Devices, Phones */
@media only screen and (min-width : 580px) and (max-width : 899px) {
	body {
		width: 94%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead {
		position: relative;
		top: 0;
	}
	#masthead th {
		font-size: 1.8em;
	}
	#masthead img {
		width: 60px;
		height: auto;
	}
	#appbanner {
		width: 98% !important;
	}
	/*** FOOTER STYLES ***/
	#connect #contact #phone {display: none;}
	#connect #contact a img, #connect #social a img {height: 2.2em;}
	#connect #contact a {margin: 1em 0.8em auto 0;}
	#connect #social a {margin: 1em 0 auto 0.8em;}
	.footerad {
		width: auto;
		max-height:20% !important;
	}
	/*  FOOTER MENU  */
	#nav-btm {
		line-height: 2.2em;
		font-size: 1.0em;
	}
	/*** DOCUMENT STYLES ***/
	.customcolumnMain {
		margin: 0 auto;
		width: 98%;
		padding: 5%;
	}
	#thumbnailshare{max-width: 80% !important;}
}

/* Medium Devices, Tablets and Small Desktops */
@media only screen and (min-width : 900px) and (max-width : 1199px) {
	body {
		width: 90%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead th {font-size: 2.4em;}
	#masthead img {
		width: 70px;
		height: auto;
	}
	#appbanner {
		max-width: 70% !important;
	}
	/*** FOOTER STYLES ***/
	/* 
	##### USED ONLY WHEN PHONE NUMBER/ICON IS IN FOOTER
	#connect #contact a:last-child {
		pointer-events: none;
		cursor: default;
		color: #000000;
		text-decoration: none;
	}
	*/

	#thumbnailshare{width: 70% !important;}
}

/* Large Desktops */
@media only screen and (min-width : 1200px) {
	body {
		width: 90%;
		font-size: 18px;
	}
	/*** HEADER STYLES ***/
	#masthead th {
		font-size: 2.5em;
	}
	#masthead img {
		width: 80px;
		height: 101px;
	}
	#appbanner {
		max-width: 60% !important;
	}

	/*** FOOTER STYLES ***/
	/* 
	##### USED ONLY WHEN PHONE NUMBER/ICON IS IN FOOTER
	#connect #contact a:last-child {
		pointer-events: none;
		cursor: default;
		color: #000000;
		text-decoration: none;
	}
	*/

	#thumbnailshare{width: 60% !important;}
}

