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

	body {
	background-image: url(/unionite/newsite/images/background.png);
	background-repeat: repeat-x; 
	background-color: #efece4;
	font-family: PeriodicoText-Lg;
	font-weight: normal;
	font-style: normal;
	font-size: smaller;
	margin: 0 auto;
	}
	h1 {font-size: 250%; text-transform: uppercase; margin-bottom: .5em;}
	h2 {font-size: 230%; line-height: 150%;}
	h3 {font-size: 160%; line-height: 160%;}
	h4 {font-size: 140%; line-height: 140%;}
	p {font-size: 110%; line-height: 130%;}
	li {font-size: 110%; line-height: 130%;}
	i {font-family: PeriodicoText-LgIt; font-style: normal;}
	strong {font-family: PeriodicoText-SmBd; font-style: normal;}
	
	.sixcol img {padding-top: 10px; margin-left: 7px;}
	.sixcol h2 {padding-top: 3.25em; font-size: 150%; line-height: 130%; text-align: center; font-family: PeriodicoText-SmBdIt; color: black; font-weight: normal; text-transform: uppercase; /*text-shadow: black 1px 1px 0px, rgba(211,211,211,0.7) 5px 5px 10px;*/}
	
	.nomobile {display: block;}
	.yesmobile {display: none;}
	.exclusives {background-color: #7dbfe1; width: 100%; text-align: center; }
	.navbar, .navbar2 {background-color: white; padding: 15px; margin-bottom: 25px; 
		-moz-box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
		-webkit-box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
		box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
		}
	.navbar2 {margin-right: 7px; margin-top: 7px;}
	.navbar {margin-left: 7px; margin-top: 7px;}	
	.navbar hr {border-bottom: 10px solid gray;}
	.navbar h4, .navbar2 h4 {text-transform: uppercase; color: gray; margin: 20px 0 10px 0; font-family: PeriodicoText-MdIt;}
	.navbar2 h5 {margin-bottom: 3px;}
	.navbar .president a, .navbar .fullissue a, .navbar2 a, .story a {color: #990000;}
	.navbar img, .navbar2 img {float: left; padding-right: 5px; clear: left;}
	nav ul {font-family: PreloSlab-Black; font-size: 140%;}
	nav ul li {list-style: none; border-bottom: 4px double black; padding: 9px 4px;}
	/* nav ul li:last-child {list-style: none; border-bottom: none;} */
	nav ul li a {line-height: 120%;	text-decoration: none; color: black;}
	nav ul li.current {background-color: silver; }
	nav ul li:hover {background-color: silver;}
	
	.rightnavbar {font-family: PreloSlab-SemiBold; font-size: 100%; margin-left: 15px; line-height: 160%;}
	.rightnavbar a:link, .archives a:link, .news p a:link {color: #990026; text-decoration: underline;}
	.rightnavbar a:visited, .archives a:visited, .news p a:visited {color: #990026; text-decoration: underline;}
	.rightnavbar a:hover, .archives a:hover, .news p a:hover {color: silver; text-decoration: underline;}
	.rightnavbar a:active, .archives a:active, .news p a:active {color: silver; text-decoration: underline;}
	
	.featureimage {background-color: white; padding: 10px 10px 40px 10px; margin-bottom: 25px; margin-right: 7px; margin-top: 7px; 
		-moz-box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
		-webkit-box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
		box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;}
	.features, .story, .archives, .news, .classnotes {background-color: white; padding: 10px; margin-bottom: 25px;  margin-right: 7px; margin-top: 7px;
		-moz-box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
		-webkit-box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
		box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;}
	.story, .news, .classnotes {margin-left: 7px;}
	.featureimage a {color: #990000; text-decoration: none;}
	.features a:link, .firstcolumn a:link, .secondcolumn a:link, .news a:link, .classnotes a:link {color: #990026; text-decoration: underline; }
	.features a:visited, .firstcolumn a:visited, .secondcolumn a:visited, .news a:visited, .classnotes a:visited {color: #990026; text-decoration: underline;}
	.features a:hover, .firstcolumn a:hover, .secondcolumn a:hover, .news a:hover, .classnotes a:hover {color: #990026; text-decoration: underline;}
	.features a:active, .firstcolumn a:active, .secondcolumn a:active, .news a:active, .classnotes a:active {color: #990026; text-decoration: underline;}
		
	.features h3, .archives h3 {font-family: PreloSlab-SemiBold; color: white; background-color: #83806f;	padding: 7px; margin-bottom: 7px;}
	.features li {display: block; width: 43.5%; float: left; padding: 15px;}
	.features li img {float: left; padding-right: 10px; }
	.features li strong {display: block; font-size: 110%; text-transform: uppercase; }	
	
	.subpage li {width: 95%}
	
	.story {padding: 25px}
	.story p, .story img, .story h3, .story h2, .story h6 {margin-bottom: 15px}
	.story .caption img, .news .caption img, .classnotes .caption img {margin-bottom: 0px;}
	.story .caption, .news .caption, .classnotes .caption, .features .caption, .navbar .caption, .navbar2 .caption {font-family: Argumentum-LightItalic; font-size: 95%; margin-bottom: 15px; line-height: 100%;}
	.news p, .classnotes p, .news h4, .classnotes h4, .news h2, .classnotes h2, .archives p, .news .caption, .classnotes .caption {margin: 5px 15px 15px 15px;}
	.story img.right, .classnotes img.right, .news img.right {float: right; margin-left: 10px; clear: right;}
	.story img.left, .classnotes img.left, .news img.left {float: left; margin-right: 10px; clear: left;}
	.story img.half {width: 66%;}
	.story ul {margin-left: 35px; margin-bottom: 25px;}
	
	.story h2, .story h3, .news h2, .news h3, .news h4, .news h6, .classnotes h2, .classnotes h3, .classnotes h4, .archives h3, .secondcolumn h3, .firstcolumn h3 {font-family: PreloSlab-SemiBold;}
	.story em {color: #990000; font-style: normal;}
	.story h2 {font-size: 280%; line-height: 100%;}
	.story h3 {font-weight: normal; line-height: 100%;}
	.story h4 {text-transform: uppercase; font-weight: normal; font-family: PeriodicoText-Bd; font-size: 120%;}
	.story h4 i {font-family: PeriodicoText-BdIt}
	.story h5 {border-bottom: 6px double black; padding: 10px 0; margin-bottom: 10px; text-transform: uppercase; font-family: arial, helvetica, san-serif;}
	.story h6, .news h6, .classnotes h6 {text-transform: uppercase; font-weight: normal; font-size: 100%;}
	.story .sidebar {width: 33%; float: right; background-color: #ddd; padding: 20px; margin-left: 10px; margin-bottom: 10px;}
	.story .halfbar {width: 50%; float: right; background-color: #ddd; padding: 20px; margin-left: 10px; margin-bottom: 10px;}
	.story .subfirstcolumn {width: 46.5%; float: left; padding-right: 5%;}
	.story .subsecondcolumn {width: 46.5%; float: left;}
	.news .sidebar, .classnotes .sidebar {width: 33%; float: right; background-color: #fff; padding: 0 20px; margin-left: 10px; margin-bottom: 10px;}
	.fullbar {width: 95%; background-color: #ddd; padding: 20px;}
	.floater {width: 30%; float: left; margin-right: 15px;}
	.story .sidebar img, .news .sidebar img, .classnotes .sidebar img {width: 100%;}
	.story .sidebar h4 i {font-size: 80%; margin-bottom: 20px;}
	.story blockquote, .news blockquote, .classnotes blockquote {margin: 0 30px; font-family: PeriodicoText-LgIt;}
	.story .doublebox img {float: left; width: 48%; margin-right: 10px;}
	.story ol li {padding-bottom: 15px;}
	
	.floatright {float: right; width: 300px; margin-left: 10px;}
	
	.news h3 {background-color: #4097c4; color: white; padding: 7px; margin-bottom: 7px;}
	.news h3 a:link, .news h3 a:visited, .classnotes h3 a:link, .classnotes h3 a:visited {color: white;}
	.classnotes h3 {background-color: #990000; color: white; padding: 7px; margin-bottom: 7px;}
	.news h4, .news h2, .classnotes h4, .classnotes h2 {margin-bottom: 15px; line-height: 100%;}
	
	.news h5, .classnotes h5 {margin-bottom: 10px; text-transform: uppercase; font-family: arial, helvetica, san-serif; padding: 5px 0; }
	
	.classnotes img.bullpup {width: 100%}
	.classnotes div.bullpupleft {float:left; width: 50%}
	.classnotes div.bullpupright {width: 50%; float:right}
	.classnotes p em {color: #990000; font-style: normal; font-weight: bold;}
	.classnotes strong, .news strong {font-family: Argumentum-Bold; font-weight: normal; font-size: 110%;}

	.classnotes h4 em {color: #990000; font-style: normal; font-size: 180%;}
	
	.mainpage img {width: 40%;}
	
	.archives .figure {float: left; padding: 10px 20px;}
	.archives ul {list-style: none; margin-left: 35px; margin-top: 25px; margin-bottom: 25px;}
	.archives em {color: #990000; font-style: normal;}
	.archives ul.normal {list-style: disc;}
	
	.firstcolumn, .secondcolumn {background-color: white; width: 48%; vertical-align: top; padding-bottom: 10px; margin-right: 7px; 
		-moz-box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
		-webkit-box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
		box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;}
		
	hr {border: 1px solid #ddd; width: 75%; margin: 25px auto;}
	.news hr, .classnotes hr {width: 95%; margin: 25px 15px;}
		
	.firstcolumn ul, .secondcolumn ul, .classnotes ul, .news ul {margin-left: 15px; list-style: none;}
	.firstcolumn ul li, .secondcolumn ul li, .classnotes ul li, .news ul li {line-height: 120%; border-bottom: 1px solid silver; width: 95%; padding: 8px 0; }
	
	.firstcolumn ul li em, .secondcolumn ul li em, .archives p strong, .navbar p em, .navbar p em {font-family: Argumentum-Bold; font-weight: normal; font-size: 110%; font-style: normal;}
	.news h4.divider, .classnotes h4.divider {line-height: 130%; border-top: 1px solid silver; width: 95%;}
	.classnotes p.divider {border-top: 1px solid silver; width: 95%;}
	.firstcolumn h3 {color: white; background-color: #4097c4; padding: 7px; margin: 10px;}
	.secondcolumn h3 {color: white;	background-color: #990000; padding: 7px; margin: 10px;}
	
	.footerparent {background-color: #666666; margin: 0; padding: 0;}
	.footer {background-color: #666666; clear: both; margin-top: 20px; color: #e6e6e6; padding: 0;}
	.footer .threecol, .footer .sixcol {margin: 10px;}
	.footer a {color: #e6e6e6; text-decoration: none;}
	.footer a:hover {color: #222222;}
	.footer h4 {text-transform: uppercase;}
		
	.footer ul.pastissues li {display: block; float: left; padding: .75em;}
	.footer ul.footernav li {list-style: none; line-height: 120%; clear: both; margin: 5px 0;}
	.footer ul.unioninfo li {list-style: none; line-height: 120%; clear: both; margin: 5px 0;}
	
	.subfooter {padding: 2em; font-size: 130%; text-align: center; font-family: PeriodicoText-LgIt; color: gray; font-weight: normal; text-transform: uppercase;}

/* added for three column presentation in story */	
@media handheld, only screen and (max-width: 1100px) {		
	.story .row .fourcol {
	width: auto;
	float: none;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 20px;
	padding-right: 20px;
}	
	
	
/* ============================= */
/* ! Layout for iPad vertical   */
/* ============================= */	
@media handheld, only screen and (max-width: 1000px) {	
	.features li {width: 95%; }
	.features li img {width: 50%}
	
	}
}	
	
/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 767px) {

	body {background-color: #efece4; background-image: none; font-family: PeriodicoText-Lg;}
	
	.navbar nav ul {font-family: PreloSlab-SemiBold; }
	.navbar {background-color: white; width: 90%; padding: 20px 0px 20px 0px; margin: 0px 25px 25px 25px;}
	.navbar2 {margin-left: 7px;}
	
	.flex-caption {display: none;}
	
	.sixcol img {padding-bottom: 0;}
	.sixcol h2 {padding: 0 0 1em 0; font-size: 120%; margin-top: 0;}
	h1 {padding-bottom: 0}
	.nomobile {display: none;}
	.yesmobile {display: block;}
	.features li {width: 95%;}
	
	.floatright {width: 100%;}

	.story .sidebar, .classnotes .sidebar, .news .sidebar, .story .halfbar {width: 95%; float: none; margin-left: 0; padding: 10px;}
	.story .subfirstcolumn, .story .subsecondcolumn {width: 100%; float: none; padding-right: 0;}
	.floater {float: none; width: 90%}
	.fullbar {width: 90%;}
	.story img.half {width: 100%;}
	.story .doublebox img {width: 100%; float: none; margin-right: 0;}
	.classnotes div.bullpupleft {float:none; width: 100%}
	.classnotes div.bullpupright {width: 100%; float:none}
	.news img, .classnotes img {width: 100%; margin-bottom: 10px;}
	.news hr, .classnotes hr {width: 90%;}
	
	.footer {padding: 10px 0;}
	.footer ul.footernav li {font-size: 180%}
	.footer .unioninfo img {margin-top: 15px;}
	.footer ul.pastissues li {padding: 0 5px;}
	.footer ul.pastissues {margin-bottom: 10px;}
	.footerparent {margin: 0; padding: 0}
	.subfooter {font-size: 100%;}
	

}


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

@media only screen and (-webkit-min-device-pixel-ratio: 2) { 

	body {background-color: #ebe8de; font-family: PeriodicoText-Md;}
	.sixcol h2 {padding-top: 0;}
	.nomobile {display: none;}
	.yesmobile {display: block;}
	.features li img {width: 95%;}
	.features li {width: 95%; }
	.features li img {width: 50%}
	
/*	.logo {
		background: url(logo2x.jpg) no-repeat;
		background-size: 212px 303px;
	}*/

}