body,
	html {
	padding:0;
	color:#404040;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #FAFAFA;
	margin: auto;
	}

h2	{
	font-size: 1.8em;
}

h3	{
	font-size: 1.8em;
	font-family: Arial Narrow, Helvetica, sans-serif;
	text-align: center;
}

h4	{
	margin-bottom: 0em;
}

.red	{
	color: red;
	text-align: center;
}

.blue	{
	color: blue;
	text-align: center;
}

.align-center	{
	text-align: center;
}

.hundredprocent {
	width: 100%;
}

/* Top Navigation Bar -------------------------------------------*/

nav {
	background: rgba(230,240,240,0.7);
	width: 100%;
	position: relative;
	z-index: 1000;
	height: 73px;
	text-align: right;
}

nav ul {
	display: inline-block;
	padding-top: 5px;
	padding-bottom: 15px;
}

nav ul li {
	position: relative;
	float: left;
	margin: 0;
}

nav ul li a {
	font-family: 'Arial Narrow',sans-serif;
	font-size: 20px;
	font-weight: 400;
	color: #404040;
	text-decoration: none;
	padding: 12px;
}

nav ul li a:hover {
	color: #a90e4b;
	color: #ffffff;
	background: rgba(120,170,190,0.9);
}

.headline {
	font-family: 'Arial Narrow',sans-serif;
	font-size: 22px;
	font-color: #404040;
	text-align:center;
	font-weight: 400;
	color: #404040;
	text-decoration: none;
}

.emailline {
	font-family: 'Arial Narrow',sans-serif;
	font-size: 1em;
	font-color: #404040;
	text-align:left;
	font-weight: 400;
	color: #404040;
	text-decoration: none;
}

#wrap {
	width: 64em;
	box-shadow: 0px 2px 12px #CCCCCC;
	background-color: #FFFFFF;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0;
	}

#header {
	width: 100%;
	padding: 0px;
	margin-top: 1em;
	}
	
#header img{
	width: 100%;
	height: auto;
	padding-bottom:0;
	margin-bottom:0;
	display: block;
	}

#linkBar{
	width: 100%;
	height: 4em;
	margin-top:0em;
	margin-bottom:1em;
	background-color:#6ccff6;
	background-image: url(aqua2.jpg);
	background-size: 100% 100%;
	}
	
#linkBar p{
	font-size:1.5em;
	color:#FFFFFF;
	padding-top:0.7em;
	margin-left: 1em;
	text-align:left;
	}

#main {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}

#main img{
	margin-bottom:.1em;
	margin-top: 0.3em;
	height: auto;
}

.article {
	color: #404040;
	width: 87%;
	margin-left: 5%;
	background-color: rgb(255, 255, 255);
}

.article2 {
	color: #404040;
	margin-left: 2.5em;
	margin-right: 2.5em;
	background-color: rgb(255, 255, 255);
}

.article-alumnilogo-left {
	width: 22em;
	float: left;
}

.article-item-right {
	width: 34em;
	float: right;
}

.boxtext {
	padding-top:0.0em;
	max-width: 100%;
	color: #404040;
	border:1px solid rgb(200, 230, 230);
	border-radius:5px;
	padding-top: 0.7em;
	padding-left: 1.2em;
	padding-right: 1.2em;
	background-color: rgb(252, 252, 252);
}

.boxsidebar {
	padding-top:0.0em;
	height: 18em;
	width: 11em;
	float: left;
	margin-left: 0em;
	margin-right: 1.5em;
	margin-bottom: 2%;
	box-shadow: 1px 1px 10px #CCCCCC;
	color: #FAFAFA;
	border:1px solid rgb(200, 230, 230);
	border-radius:5px;
	padding-left: 0.6em;
	padding-right: 0.6em;
	background-color: rgb(252, 252, 252);
}

.boxlightgrey {
	padding-top:0.6em;
	margin-left: 3%;
	margin-right: 3%;
	border:1px solid rgb(220, 230, 230);
	padding-left: 0.6em;
	padding-right: 0.6em;
	padding-bottom: 0.6em;
	background-color: rgb(242, 242, 242);
}

.boxgrey {
	background-color: #eeeeee;
	padding: 0.8em;
	border:1px solid rgb(200, 230, 230);
}

.boxsidebar2 {
	padding-top:0.0em;
	height: 21em;
	width: 11.2em;
	float: left;
	margin-left: 3%;
	margin-right: 3%;
	margin-bottom: 2%;
	box-shadow: 1px 1px 15px #CCCCCC;
	color: #404040;
	border:1px solid rgb(200, 230, 230);
	border-radius:5px;
	padding-left: 0.6em;
	padding-right: 0.6em;
	background-color: rgb(252, 252, 252);
}

.speaker {
	width: 10em;
	margin-right: 1em; 
	margin-bottom: 1em; 
	float: left;
}

.speakerright {
	width: 10em;
	margin-left: 1em;
	margin-right: 0em;
	margin-bottom: 1em; 
	float: right;
}

/* Events -------------------------------------------*/

p.events {
	line-height: 1.5em;
	}

p.headorange {
	text-align: right;
	font-size: 1.8em;
	color: rgb(255, 106, 6);
	}

p.headorange2 {
	text-align: left;
	font-size: 1.8em;
	color: rgb(255, 106, 6);
	}

p.headwhite {
	text-align: center;
	font-size: 1.5em;
	color: rgb(255, 255, 255);
	}

#headwhite {
	position: absolute;
	width: 30em;
	top: 1.7em;
	left: 1.7em;
	float: left;
	z-index: 12;
	}

p.eventtext1 {
	text-align: center; 
	font-size:1.8em;
	}

p.eventtext2 {
	text-align: center; 
	font-size:1.5em;
	}

p.eventtext3 {
	text-align: left;
	font-size:1.2em;
	}

p.eventtext3b {
	text-align: left;
	font-size:1.2em;
	color: navy;
	}

.contedu {
	float: right;
	width:14em;
	}

.colorband-greyblue {
	width: 100%;
	height: 6.4em;
	background-color: rgb(70, 110, 136);
	}

.imgeccles {
	width: 19em;
	}

.imgfabio {
	width: 11em;
	margin-right: 2.0em;
	float: right;
	box-shadow: 5px 5px 12px #505050;
	}

.imghathway {
	width: 13em;
	float: left;
	margin-right: 1.0em;
	margin-bottom: 1.0em;
	}

.imgleft {
	width: 11em;
	margin-left: 2.0em;
	float: left;
	}

.image2 {
	max-width: 58em;
	}

/* Necessary for menu -------------------------------*/
ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* Necessary for menu -------------------------------*/

/* --- Table ----------------------------------------*/
table { 
  width: 100%; 
  border-collapse: collapse; 
}

th { 
  background: #333; 
  color: white; 
  font-weight: bold; 
}
td, th { 
  padding: .4em; 
  border: 1px solid #ccc; 
  text-align: left; 
}

/* --- Links ----------------------------------------*/

a{
	text-decoration:none;
	color:#101050;
}

a:hover{
	color:#007560;
	text-decoration:none;
}

a.alum {
	text-decoration:none;
	color:#0000FF;
}

a.alum:hover{
	color:#0000FF;
	text-decoration:underline;
}

#fb{
	width: 82%;
	margin-right:auto;
	margin-left:auto;
	margin-top:45em;
	clear:both;
}


#center-row{
	clear:both;
}

#bottom-row{
	clear:both;
}

* html #footer {
		height:1px;
}

.float_left {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}

.float_right {
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
}

.float-right {
	float: right;
}

.float-left {
	float: left;
}

/* --- Footer -------------------------------------------------------------*/

#footer {
	height:12em;
	background: rgba(40, 40, 40,1.0);
	color: rgb(178, 196, 208);
	font-size: 0.9em;
	padding-left: 0.6em;
	padding-right: 0.6em;
	padding-bottom: 0.6em;
}
	
#footer a:link {
	color: rgb(178, 196, 208);
	text-decoration: none;
}
	
#footer a:visited{
	color: rgb(178, 196, 208);
	text-decoration:none;
}

#footer a:hover{
	color: rgb(178, 196, 208);
	text-decoration: underline;
}

#footerbox1	{
	max-width:75em;
	padding-top: 0.5em;

	padding-bottom: 0.5em;
	margin-right: auto;
	margin-left: auto;
	background-color: rgba(40, 40, 40,1.0);
}

.footerbox2	{
	width:27%;
	font-size: 1.0em;
	color: #959595;
	text-align: left;
	padding-top: 0.5em;
	padding-left: 1em;
	padding-left: 1em;
	padding-bottom: 1em;
	margin-left: 2em;
	margin-bottom: 1em;
	border: 1px solid rgb(38, 38, 38);
	float: left;
	background-color: rgba(40, 40, 40,1.0);
}

.foot	{
	margin-right: 0.8em;
}

.next{
	clear: both;
	}

.clear-both {
	clear: both;
	}

.commit	{
	float:left;
	padding-left:1%;
}

/* max-width: 1040px -------------------------------------------------------------------------------*/
@media screen and (max-width: 1040px) {

#wrap {
	width:100%;
	background-color: #FFFFFF;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	}

.boxsidebar {
	padding-top:0.0em;
	height: 18em;
	width: 10.6em;
	float: left;
	margin-left: 0em;
	margin-right: 1.0em;
	margin-bottom: 2%;
	box-shadow: 1px 1px 10px #CCCCCC;
	color: #FAFAFA;
	border:1px solid rgb(200, 230, 230);
	border-radius:5px;
	padding-left: 0.5em;
	padding-right: 0.5em;
	background-color: rgb(252, 252, 252);
}

#column1 {
	min-width: 28%;
}

#column3 {
	max-width: 28%;
}

#column4 {
	max-width: 30%;
}

#linkBar{
	width: 100%;
	height: 3.5em;
	margin-top:0em;
	margin-bottom:.8em;
	background-color:#6ccff6;
	}
	
#linkBar p{
	font-size:1.5em;
	color:#FFFFFF;
	padding-top:0.6em;
	margin-left: 1em;
	text-align:left;
	}

p{
	text-align:left;
	font-size:0.9em;
	}

nav ul li a {
	font-family: 'Arial Narrow',sans-serif;
	font-size: 18px;
}

#header {
	width: 100%;
	height:auto;
	}

}

/* max-width: 950px -------------------------------------------------------------------------------*/
@media screen and (max-width: 950px) {

.boxsidebar {
	padding-top:0.0em;
	height: 18em;
	width: 10.1em;
	float: left;
	margin-left: 0em;
	margin-right: 0.8em;
	margin-bottom: 2%;
	box-shadow: 1px 1px 10px #CCCCCC;
	color: #FAFAFA;
	border:1px solid rgb(200, 230, 230);
	border-radius:5px;
	padding-left: 0.4em;
	padding-right: 0.6em;
	background-color: rgb(252, 252, 252);
}

}

/* max-width: 900px -------------------------------------------------------------------------------*/
@media screen and (max-width: 900px) {

.article {
	width: 90%;
}

.boxsidebar {
	padding-top:0.0em;
	height: 17em;
	width: 24%;
	float: left;
	margin-left: 4%;
	margin-right: 2%;
	margin-bottom: 2%;
	box-shadow: 1px 1px 15px #CCCCCC;
	color: #FAFAFA;
	border:1px solid rgb(200, 230, 230);
	border-radius:5px;
	padding-left: 0.6em;
	padding-right: 0.6em;
	background-color: rgb(252, 252, 252);
}

.headline {
	font-size: 19px;
}

#column1 {
	width: 35%;
}

#column2 {
	width: 85%;
}

#column5 {
	width: 40%;
}
#column6 {
	width: 90%;
}

#linkBar{
	width: 100%;
	height: 3.5em;
	margin-top:0em;
	margin-bottom:.8em;
	background-color:#6ccff6;
	}

.imglarge img {
	width: 100%;
	}

.image2	{
	width: 100%;
	height: auto;
	padding-bottom:0;
	margin-bottom:0;
	}

p.headorange {
	text-align: center;
	}

}

/* max-width: 800px -------------------------------------------------------------------------------*/
@media screen and (max-width: 800px) {

.boxsidebar {
	padding-top:0.0em;
	height: 17em;
	width: 25%;
	margin-left: 3%;
	margin-right: 1%;
	padding-left: 0.4em;
	padding-right: 0.4em;
}

p.headorange {
	text-align: center;
	font-size: 1.5em;
	}

p.eventtext2 {
	font-size:1.3em;
	}

p.eventtext3 {
	font-size:1.1em;
	}

.alumnilogo1 {
	width:34em;
	}

}

/* max-width: 700px -------------------------------------------------------------------------------*/
@media screen and (max-width: 700px) {

#wrap {
	width:100%;
	background-color: #FFFFFF;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

.boxsidebar {
	padding-top:0.0em;
	height: 17em;
	width: 22%;
	float: left;
	margin-left: 2%;
	margin-right: 1%;
	margin-bottom: 2%;
	box-shadow: 1px 1px 15px #CCCCCC;
	color: #FAFAFA;
	border:1px solid rgb(200, 230, 230);
	border-radius:5px;
	padding-left: 0.4em;
	padding-right: 0.4em;
	background-color: rgb(252, 252, 252);
}

.boxtext {
	margin-left: 1.em;
	padding-left: 0.8em;
	padding-right: 0.8em;
}

p{
	text-align:left;
	font-size:0.8em;
	}

#column1 {
	width: 90%;
}

#column2 {
	width: 90%;
}

#column3 {
	min-width: 85%;
}

#column4 {
	min-width: 70%;
}

#column5 {
	width: 95%;
}

#column6 {
	width: 95%;
}

#linkBar{
	width: 100%;
	height: 3em;
	margin-top:0em;
	margin-bottom:.6em;
	background-color:#6ccff6;
	}
	
#linkBar p{
	font-size:1.3em;
	color:#FFFFFF;
	padding-top:0.5em;
	margin-left: .8em;
	text-align:left;
	}

#header {
	width: 100%;
	height:auto;
	}

p.headorange {
	font-size: 1.3em;
	}

p.eventtext2 {
	font-size:1.2em;
	}

.alumnilogo1 {
	width:33em;
	}

.image2	{
	width: 100%;
	height: auto;
	padding-bottom:0;
	margin-bottom:0;
	}

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}
	
	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	/*
	Label the data
	*/
	td:nth-of-type(1):before { content: "Alumnus:"; font-weight:bold; }
	td:nth-of-type(2):before { content: "Graduation:"; font-weight:bold; }
	td:nth-of-type(3):before { content: "Dissertation:"; font-weight:bold; }

#fb{
	width: 50%;
	margin-right:10%;
	margin-left: 10%;
	margin-top:45em;
	clear:both;
}

}

/* max-width: 650px -------------------------------------------------------------------------------*/
@media screen and (max-width: 650px) {

.boxsidebar {
	padding-top:0.0em;
	height: 17em;
	width: 25%;
	margin-left: 3%;
	margin-right: 1%;
	padding-left: 0.4em;
	padding-right: 0.4em;
}

.alumnilogo1 {
	width:30em;
	}

p.eventtext2 {
	font-size:1.0em;
	}

p.eventtext3 {
	font-size:1.0em;
	}

}

/* max-width: 600px -------------------------------------------------------------------------------*/
@media screen and (max-width: 600px) {

nav ul li a {
	font-size: 15px;
	padding: 5px;
}

.boxsidebar {
	padding-top:0.0em;
	height: 17em;
	width: 38%;
	float: left;
	margin-left: 3%;
	margin-right: 1%;
	margin-bottom: 2%;
	box-shadow: 1px 1px 15px #CCCCCC;
	color: #FAFAFA;
	border:1px solid rgb(200, 230, 230);
	border-radius:5px;
	padding-left: 0.6em;
	padding-right: 0.6em;
	background-color: rgb(252, 252, 252);
}

.boxtext {
	width: 87%;
	margin-left: 3%;
	margin-right: 3%;
	margin-bottom: 2%;
	padding-top: 0.7em;
	padding-left: 0.6em;
	padding-right: 0.6em;
}

p{
	text-align:left;
	font-size:0.8em;
	}

.image2	{
	width: 75%;
	}

#linkBar{
	width: 100%;
	height: 2.8em;
	margin-top:0em;
	margin-bottom:.6em;
	background-color:#6ccff6;
	}

#linkBar p{
	font-size: 1.1em;
	padding-top: 0.7em;
	margin-left: .8em;
	}

.alumnilogo1 {
	width:27em;
	}

}

/* max-width: 450px -------------------------------------------------------------------------------*/
@media screen and (max-width: 450px) {

#linkBar p{
	font-size:0.9em;
	padding-top: 0.9em;
	margin-left: .8em;
	}

.alumnilogo1 {
	width:25em;
	}

.imgeccles {
	width: 100%;
	}

}

/* max-width: 390px -------------------------------------------------------------------------------*/
@media screen and (max-width: 390px) {

#wrap {
	width:100%;
	background-color: #FFFFFF;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	
	}

nav {
	height: 63px;
}

nav ul {
	display: inline-block;
	padding-top: 0px;
	padding-bottom: 15px;
}

nav ul li a {
	font-size: 13px;
	padding: 4px;
}

.boxsidebar {
	padding-top:0.0em;
	height: 17em;
	width: 83%;
	float: left;
	margin-left: 6%;
	margin-right: 6%;
	margin-bottom: 6%;
	box-shadow: 1px 1px 15px #CCCCCC;
	color: #FAFAFA;
	border:1px solid rgb(200, 230, 230);
	border-radius:5px;
	padding-left: 0.6em;
	padding-right: 0.6em;
	background-color: rgb(252, 252, 252);
}
	
#linkBar{
	width: 100%;
	height: 2em;
	margin-top:0em;
	margin-bottom:.4em;
	background-color:#6ccff6;
	}
	
#linkBar p{
	font-size:0.7em;
	color:#FFFFFF;
	padding-top: 0.7em;
	margin-left: .6em;
	text-align:left;
	}
	
#header {
	width: 100%;
	height:auto;
	}

.alumnilogo1 {
	width:19em;
	}

#fb{
	width: 50%;
	margin-right:10%;
	margin-left: 10%;;
	margin-top:45em;
	clear:both;

}
	
}
