/* ============================== */
/* ! Layout for desktop version   */
/* ============================== */

	body {
	background-color: #fff;
	font-family: Geneva, Helvetica, Arial, sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: smaller;
	margin: 0 auto;
	}
	h1 {font-size: 300%; line-height: 100%; }
	h2 {font-size: 250%; line-height: 100%; font-family: PeriodicoText-Lg; font-style: normal; color: #333}
	h3 {font-size: 170%; line-height: 100%;}
	h4 {font-size: 140%; line-height: 100%;}
	h5 {font-size: 120%; line-height: 130%;}
	p {font-size: 110%; line-height: 130%;}
	li {font-size: 110%; line-height: 130%;}
	/* i {font-family: PreloSlab-ExtraLightItalic; font-style: normal;}
	strong {font-family: PreloSlab-SemiBold; font-style: normal;}
	
	.twelvecol, .threecol, .ninecol {
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	margin-top: 20px;
	}
	 */
	 
	.theheader {background-color: #fff; background-image: url(/events/colsonlegacy/images/SaltLightConf_header-1140.jpg)}
	.threecol {background-color: #fff; background: url(/events/colsonlegacy/images/SaltLightConf_bluetexture2.jpg) no-repeat center top;}
	.ninecol {background-color: #fff; background-image: url(/events/colsonlegacy/images/SaltLightConf_churchbg.jpg)}
	
	.nomobile {display: block;}
	.yesmobile {display: none;}
	
	.header {padding: 25px; color: white; height: 270px;}
	.header img {float: right; width: 50%; clear: both; margin-top: 2%;}
	.header h1, h2 {padding-bottom: 10px; color: white;}
	.header h3, p {color: white;}
	.header p strong {font-family: PreloSlab-SemiBoldItalic; font-style: normal;}
	.header p i {font-family: PreloSlab-ExtraLightItalic; font-style: normal; color: white;}
	.header a {text-decoration: none;}
	
	.nav {padding: 15px 25px; color: white;}
	.nav ul {font-size: 140%; padding: 15px 0;}
	.nav ul li {list-style: none; padding: 9px 4px;}
	/* nav ul li:last-child {list-style: none; border-bottom: none;} */
	.nav ul li a {line-height: 120%; text-decoration: none; letter-spacing: 1px;}
	.nav ul li.current {background-color: black; }
	.nav ul li a:link {color: white;}
	.nav ul li a:visited {color: white;}
	.nav ul li a:hover {color: #d8c393;
	/* -moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px; */}
	.nav ul li a:active {color: #d8c393;}
	.nav p {color: black;}
	.nav p a:link {color: white; text-decoration: none}
	.nav h4 {text-align: center}
	.nav h4 a {line-height: 120%; text-decoration: none; letter-spacing: 1px;}
	.nav h4 a:link {color: white;}
	.nav h4 a:visited {color: white;}
	.nav h4 a:hover {color: #999999;}
	
	.section {padding: 20px 40px; color: black;}
	.section img.headshot {float: right; width: 200px; clear: both; margin-left: 10px; margin-bottom: 10px; border: 1px solid white;
	/* -moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px; */}
	.section img.regular {float: right; width: 50%; clear: both; margin-left: 10px; margin-bottom: 10px; border: 1px solid white;}
	.section h2, h3, p {padding-bottom: 10px; color: black;}
	.section h2 {text-transform: uppercase; margin: 0 0 20px 0; color: #4f686c;}
	.section h3 {margin: 10px 0 0 0;}
	.section h3.divider {border-bottom: 2px solid black;}
	.section h4 {margin: 0 0 10px 0;}
	.section h5 {}
	.section a:link {text-decoration: none; color: #536e7b; font-weight: bold;}
	.section a:visited {text-decoration: none; color: #536e7b; font-weight: bold;}
	.section a:hover {text-decoration: none; color: #990000; font-weight: bold;}
	.section a:active {text-decoration: none; color: #990000; font-weight: bold;}
	/* .section img.figure {float: none; width: 30%; margin-left: 0; margin-bottom: 0; margin-top: 30px; border: 1px solid white; }
	.section img.figure2 {float: none; width: 60%; margin-left: 0; margin-bottom: 0; margin-top: 30px; border: none;}*/
	.section .figure {float: left; width: 19%; margin-left: 5%; margin-top: 0; margin-bottom: 30px; margin-top: 30px;  color: black; }
	.section ul {list-style: none; padding-bottom: 10px; padding-left: 10px;}
	.section ul li {padding-bottom: 5px;}
	
	.footer {padding: 25px 40px; color: white; text-align: left; }
	.footer p {color: white; font-size: 110%; }
	.footer img {float: right; margin-top: -10px;}	
	.footer a:link {text-decoration: none; color: #9fd4df; font-weight: bold;}
	.footer a:visited {text-decoration: none; color: #9fd4df; font-weight: bold;}
	.footer a:hover {text-decoration: none; color: #f0533b; font-weight: bold;}
	.footer a:active {text-decoration: none; color: #f0533b; font-weight: bold;}
	.footer #corevalues {font-size: 75%; color: #d8c393;}
	.thefooter {background-color: #fff; background: url(/events/colsonlegacy/images/SaltLightConf_footer-1140.jpg) no-repeat center bottom;}
	
/* ============================= */
/* ! Layout for iPad vertical   */
/* ============================= */	
@media handheld, only screen and (max-width: 1000px) {	
	.theheader {background-color: #fff; background: url(/events/colsonlegacy/images/SaltLightConf_header-1140.jpg) no-repeat center bottom;}
	
	.header img { width: 65%; margin-top: 5%;}
}	
	
/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 767px) {
.theheader {background-color: #fff; background: url(/events/colsonlegacy/images/SaltLightConf_header-1140.jpg) no-repeat right bottom;}

.threecol {background-color: #fff; background: url(/events/colsonlegacy/images/SaltLightConf_bluetexture3.jpg) no-repeat center top;}
.ninecol {background-color: #fff; background-image: url(/events/colsonlegacy/images/SaltLightConf_churchbg.jpg)}
/* .section img {float: none; width: 100%; } */
.header {height: 200px;}
.header img {float: none; width: 100%; margin: 3% 0;}
.nav {margin: 0 auto; text-align: center;}
.nav ul {font-size: 140%;}
.nav ul li {display: inline-block; padding: 0 15px;}
.nomobile {display: none;}
.yesmobile {display: block;}
.section img.headshot {margin-left: 0px; margin-bottom: 10px;}
.section img.regular {float: none; width: 100%; clear: both; margin-left: 0;}
/* .section img.figure2 {width: 90%;}
.section img.figure {float: none; width: 100%; margin-left: 0; margin-bottom: 0; margin-top: 10px;} */
.footer {height: auto; text-align: center;}
.footer img {float: none; }	
.section .figure {float: none; width: 75%;}
}


/* ============================= */
/* ! Layout for iPhone version   */
/* ============================= */

@media handheld, only screen and (max-width: 479px) {
.section img.headshot {float: none; width: 100%; margin-left: 0; margin-bottom: 0; margin-top: 10px;}	
.header {height: 100px;}
.nav ul {font-size: 110%;}
.nav ul li {padding: 10px 20px 5px 0}
h1 {font-size: 250%; line-height: 100%; }
	h2 {font-size: 180%; line-height: 100%;}
	h3 {font-size: 150%; line-height: 100%;}
	h4 {font-size: 120%; line-height: 100%;}
	h5 {font-size: 100%; line-height: 130%;}
	p {font-size: 100%; line-height: 130%;}
	li {font-size: 110%; line-height: 130%;}
	
.section h2, h3, p {padding-bottom: 10px; color: black;}
	.section h2 {text-transform: uppercase; margin: 10px 0 10px 0;}
	.section h3 {margin: 10px 0 0 0;}
	.section h4 {margin: 0 0 10px 0;}
	.section h5 {}	
.section .figure {float: none; width: 90%; }

}


/* ========================================== */
/* ! Provide higher res assets for iPhone 4   */
/* ========================================== */

@media only screen and (-webkit-min-device-pixel-ratio: 2) { 
.nav ul {font-size: 100%;}
.section img.headshot {float: right;}
.header img {width: 120%; text-align: center; margin: 0 auto;}

}