/* ===== SHELL ===== */

	body { background: #FFFFFF; }

	h1 {
		font-family: Roboto, Arial, sans-serif;
		font-weight: 500;
		font-size: 3rem;
		letter-spacing: 0;
		line-height: 1.25em;
		margin: 0 0 1em 0;
		text-transform: none;
		}
		
	h2 {
		font-family: Roboto, Arial, sans-serif;
		font-weight: 500;
		font-size: 2.4rem;
		letter-spacing: 0;
		line-height: 1.25em;
		margin: 0 0 1em 0;
		text-transform: none;
		}
		
	h3 {
		font-family: Roboto, Arial, sans-serif;
		font-weight: 500;
		font-size: 1.6rem;
		letter-spacing: 0;
		line-height: 1.25em;
		margin: 1.5em 0 1.5em 0;
		text-transform: none;
		}
		
	h4 {
		font-family: Roboto, Arial, sans-serif;
		font-weight: 500;
		font-size: 1.5rem;
		letter-spacing: 0;
		line-height: 1.25em;
		margin: 0 0 1em 0;
		text-transform: none;
		}

	details summary {
		background: #ededed url('../images/trigger_collapsed.svg') right 15px center no-repeat;
		cursor: pointer;
		margin-bottom: 10px;
		padding: 15px;
		}
		
		details[open] summary {
			background: #ededed url('../images/trigger_expanded.svg') right 15px center no-repeat;
			}
		
		details summary::-webkit-details-marker { display:none; }
		
			details summary h3 { margin: 0; }
			details p { margin-left: 15px; }

		/* Pre-webkit Edge polyfill. Forces some elements inside the summary to take less room. */
		details summary h3,
		details summary h4,
		details summary div { display: inline; }
		
	figure {
		margin: 0 0 20px 0;
		}

		figure figcaption {
			color: #555555;
			font-size: 1.2rem;
			margin: 10px 0 0 0;
			text-align: left;
			}
		
	ul.unstyled {
		list-style-type: none;
		margin: 0;
		padding: 0;
		}
		
	.hero { background: url('../images/banner.jpg'); }

	#StartofContent p { 
		line-height: 1.5em;
		margin-bottom: 1.5em;
		}

	.gray {
		background: #F2F2F2;
		padding: 60px 0;
		}

	#ce-hoc-footer { margin-top: 0; }
	
	.container img { width: 100%; }
	
	.padded { padding: 30px; }

/* ===== NAVIGATION ===== */

	.subsite-nav {
		background: #FFFFFF;
		border: 0;
		margin: 15px 0 40px 0;
		}

		.subsite-nav .trigger { display: none; }

		.subsite-nav li a {
			margin: 0 1em;
			padding: 1em 0 0.25em 0;
			}

			.subsite-nav li a:link,
			.subsite-nav li a:visited {
				background-color: transparent;
				color: #437A26;
				}

			.subsite-nav li a:hover,
			.subsite-nav li a:active {
				background-color: transparent;
				color: #333333;
				}

			#page_home #nav_home,
			#page_history #nav_history,
			#page_working #nav_working,
			#page_become #nav_become,
			#page_current #nav_current,
			#page_faq #nav_faq,
			#page_contact #nav_contact {
				color: #333333;
				font-weight: 500;
				border-bottom: 1px solid #EDEDED;
				}

	/*@media only screen and (max-width: 600px) {
		
		.subsite-nav .trigger ( display: block; )

		.subsite-nav {
			display: none;
			padding-top: 20px;
		}
	}*/
			
/* ===== BUTTONS ===== */

	.button {
		background: #437A26;
		color: #FFFFFF;
		display: inline-block;
		font-weight: 500;
		margin: 1.5rem 0;
		padding: 1.5rem;
		text-align: center;
		width: 100%;
		}
		
		.button:hover,
		.button:active {
			background-color: #35611E;
			color: #FFFFFF;
			text-decoration: none;
			}
		
		.arrow {
			background-image: url('../images/button_arrows.svg');
			background-repeat: no-repeat;
			background-position: right 1.5rem center;
			text-align: left;
			}

/* ===== SOCIAL BAR ===== */

	footer.social {
		border-top: 5px solid #DCDCDC;
		}
		
		footer.social .container {
			padding: 30px 0;
			}
			
		footer.social ul {
			list-style-type: none;
			margin: 0;
			text-align: right;
			}

			footer.social li {
				display: inline;
				margin-left: 30px;
				}
				
				footer.social li a { 
					color: #333333;
					display: inline-block;
					}
				
					.social .instagram { background: url('../images/social_instagram.svg') right no-repeat; padding-right: 30px; }
					.social .facebook { background: url('../images/social_facebook.svg') right no-repeat; padding-right: 30px; }
			
		footer.social strong { font-weight: 500; }
			
/* ===== PAGE > HOME ===== */

	.quotes {
		background: #FFFFFF;
		float: none;
		padding: 30px;
		margin: 0 auto;
		}

		.quotes blockquote {
			border: 0;
			font-size: 1.8rem;
			line-height: 1.5em;
			margin: 0 auto;
			width: 98%;
			}
			
			.quotes blockquote footer {
				color: #333333;
				text-align: right;
				font-size: 1.5rem;
				font-weight: 500;
				}
				
	.carousel-cell { width: 100%; }
				
/* ===== PAGE > WORKING ===== */	
		
	.working {
		background: url('../images/working_bullet.svg') left top no-repeat;
		margin: 30px 0;
		padding: 0 0 0 60px;
		}

	.cardrow { display: flex; }
	
	.card {
		background: #FFFFFF;
		flex-wrap: wrap;
		margin: 15px;
		padding: 90px 30px 30px 30px;
		}
		
		.card h3 { margin-top: 0; }
		
		.card.calendar { background: #FFFFFF url('../images/card_calendar.svg') top 30px left 30px no-repeat; }
		.card.salary { background: #FFFFFF url('../images/card_salary.svg') top 30px left 30px no-repeat; }
		.card.chamber { background: #FFFFFF url('../images/card_chamber.svg') top 30px left 30px no-repeat; }
		.card.friendship { background: #FFFFFF url('../images/card_friendship.svg') top 30px left 30px no-repeat; }
		
		@media (max-width: 940px) {
			  .cardrow {
				display: flex;
				flex-wrap: wrap;
			  }
			}			

/* ===== PAGE > BECOME ===== */

	.requirements {
		list-style-type: none;
		padding: 0;
		}
		
		.requirements li {
			background: #F2F2F2 url('../images/check.svg') top 18px left 20px no-repeat;
			margin-bottom: 10px;
			padding: 14px 14px 14px 60px;
			}

		.process { margin: 10px 0px 0px 0px; }

			.process h3 {
				font-size: 2.2rem;
				font-weight: 500;
				}
				
			.process h4 {
				margin-bottom: 5px;
				}
				
			.process .col-sm-10	{ margin: 20px 0; }
				
			.process p { margin-left: 0; }
				
			.process details summary {
				background: #FFFFFF url('../images/trigger_collapsed.svg') right 30px center no-repeat;
				cursor: pointer;
				margin: 0 0 5px 0;
				padding: 15px 15px 5px 15px;
				}
		
				.process details[open] summary {
						background: #FFFFFF url('../images/trigger_expanded.svg') right 30px center no-repeat;
						}
						
/* ===== PAGE > ALUMNI ===== */

	.alumni {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-top: 30px;
		}
		
		.photo {
			flex-grow: 0;
			flex-shrink: 0;
			flex-basis: 24%;
			/*margin: 0 10px 10px 0;*/
			}
			
/* ===== PAGE > FAQ ===== */

	#page_faq dt { clear: both; float: left; width: 40%; padding: 30px 30px 0 15px; border-top: 2px solid #F2F2F2; font-size: 1.5rem; font-weight: 500; }
	#page_faq dd { float: right; width: 60%; padding-top: 30px; border-top: 2px solid #F2F2F2; font-weight: normal; }
	
	#page_faq details summary {
		background: none;
		margin: 10px 0 0 0;
		padding: 15px;
		}
			
		#page_faq details summary { background: #F2F2F2 url('../images/trigger_collapsed.svg') right 30px center no-repeat; clear: both; display: block; }
		#page_faq details[open] summary { background: #F2F2F2 url('../images/trigger_expanded.svg') right 30px center no-repeat; }

	#page_faq h2 { 
		background: #F2F2F2;
		clear: both;
		display: inline-block;
		margin: 0;
		}
		
/* ===== PAGE > CONTACT ===== */

	.contact_box {
		background: url('../images/contact.png') top no-repeat;
		background-size: contain;
		padding: 260px 0 120px 0;
		}
		
		.contact_box .button { width: 50%; }
		
/* ===== PAGE > UNIVERSITY INFORMATION ===== */

	.uni {
		background: #FFFFFF;
		margin: 15px 0 0 15px;
		padding: 30px 30px 15px 30px;
		}
		
		.uni h3 { margin-bottom: 0; }
		
		.uni .col-sm-4 {
			}
			
/* ===== PAGE > LOUNGE ===== */

	table.events td,
	table.events th	{
		padding: 10px;
		vertical-align: top;
		}
		
		table.events tr { border-top: 1px solid #F2F2F2; }
		
	.supervisors h3 { 
		font-size: 2em;
		margin: 0 0 0.5em 0;
		}
		
	.supervisors .profile { 
		margin-top: 40px;
		}

/* ===== MOBILE VIEW FIXES ===== */

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

	/* Contact */
	.contact_box { margin-top: 20px; margin: 20px 15px 0 15px; }
	.contact_box .button { display: block; width: 100%;  }

}

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

	/* Generic */
	#StartofContent { margin-bottom: 20px; }
	.social .col-sm-6 { text-align: center;  margin-bottom: 20px; }
	footer.social ul { width: 100%; }
	footer.social li { display: block; margin: 0 0 10px 0; text-align: center; }

	/* Home */
	.flickity-page-dots { position: relative !important; bottom: 0px !important; }
	.gray { padding: 30px; }

	/* Become */
	details summary h3, details summary h4, details summary div { display: block; }
	details summary h3 { margin-bottom: 10px; }
	details summary h4 { max-width: 85%; }

}