@font-face {
	font-family: AvenirBlack;
	src: url('fonts/AvenirLTStd-Black.otf');
}
@font-face {
	font-family: AvenirLight;
	src: url('fonts/AvenirLTStd-Light.otf');
}
@font-face {
	font-family: AvenirMedium;
	src: url('fonts/AvenirLTStd-Medium.otf');
}
@font-face {
	font-family: MinionPro;
	src: url('fonts/MinionPro-Regular.otf');
}
html,
body {
	width: 100%;
	height: 100%;
	margin: 0px;
	/*zoom: 75%;*/
}

a {
	color: #669FD5;
}

#gridContainer {
	/* list-style: none;
	text-align: center;
	display: inline-block;*/

	width: 100%;
	height: 100%;
}

#leftColumn {
	height: 99%;

	width: 420px;//442pt;
	float: left;

	padding-left: 15px;
	padding-right: 15px;
	/*padding-top: 15px;*/

	font-family: "Minion Pro", "serif";
	text-align: center;
	/*overflow-y: auto;*/
	overflow-y: hidden;
	overflow-x: hidden;

}
/*LeftColumn text specific CSS rules*/
/*logo picture*/

#leftColumn .logo {
	max-height: 100%;
	width: 260px;//442px;
	height: auto;
	text-align: right;
	padding-top: 15px;
}
/*Title*/

#leftColumn h1 {
	/*Black*/
	color: #231F20;
	font-family: MinionPro;
	font-size: 42pt;//68pt;
	font-weight: bold;
	margin-top: 10px;
	margin-bottom: 0px;

	vertical-align: bottom;
}

#leftColumn a{
	/*color: #231F20;*/
	color: #6D6E70;
    text-decoration: none;
}
/*subtitle*/

#leftColumn h2 {
	/*Grey*/
	color: #6D6E70;
	font-family: MinionPro;
	font-size: 26pt;//42pt;
	margin-top: 10px;
	margin-bottom: 0px;
}

#leftColumn .twitter-timeline{
	width: 420px;
	margin-bottom: 0px;
	margin-top: 10px;
	//height:auto;
	min-height:300px;
	//max-height: 320px;
	height:calc(98% - 450px);//was -490px on my first try
}

/*text*/

#leftColumn h3 {
	/*Grey*/
	color: #6D6E70;
	font-family: MinionPro;
	font-size: 21pt;//34pt;
	margin-top: 10px;
	margin-bottom: 0px;
}
/*Updates*/

#leftColumn h4 {
	/*Grey*/
	color: #6D6E70;
	font-family: AvenirLight;
	font-size: 13pt;//21pt;
	text-align: center;
	font-weight: bold;
	margin-top: 0px;//32px;
	margin-bottom: 0px;//32px;
}

#leftColumn h5 {
	/*Green*/
	color: #009344;
	font-family: AvenirLight;
	font-size: 13pt;//21pt;
	text-align: justify;
	margin-top: 10px;
	margin-bottom: 0px;
}

#leftColumn p {
	/*Grey*/
	color: #6D6E70;
	font-family: AvenirLight;
	font-size: 13pt;//21pt;
	text-align: center;
	font-weight: bold;
	margin-top: 0px;//32px;
	margin-bottom: 0px;//32px;

}

/*End of LeftColumn text specific CSS rules */

#lineSeparator {
	height: 100%;
	width: 30px;//65px;
	float: left;
	padding: 0px;
	background: #231F20;
}
#container {
	height: 97.5%;
	//width:calc(98% - 490px);
	float: left;
	overflow-y: auto;
	position: fixed;
	/* 260pt instead of 442pt*/
	/*442pt + 60px (45pt) + margin of 16*/
	/*margin-left: 490px;*/
	/*modified left margin, so the background image goes under the line separator*/
	margin-left: 480px;

	margin-right: 0px;

	padding-left: 20px;
	padding-right: 20px;

	padding-top:10px;
	padding-bottom:12px;

	background-image: url("./images/background-01.png");
	background-repeat: no-repeat;
	border-style:none;
	border-collapse: collapse;
	border-spacing: 0;
	background-size: cover;
    background-attachment: fixed;
	//min-width: 100%;


}
.infoBox {
	width: 300px;//375px;//442px;
	height: 485px;//606px;//715px;
	float: left;
	position: relative;
	padding: 23px;
	/*Grey*/
	border-color: #6D6E70;
	border-style: dashed;
	border-width: 1px;

	/* By default no div will have a bottom and right border. I will add them programatically*/
	border-right-style: none;
	border-bottom-style: none;

	/*Text color Grey*/
	/*color: #6D6E70;*/
	/*Modification to increase readability after background was added*/
	color: #626364;

	/*background colour 80% white*/
	background-color: rgba(255,255,255,0.8);//#ffffff;
	/*opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */

}
.infoBox:hover{
	background-color: #f1f1f2;
	/*Text color Black*/
	color: #231F20;
}

/*Infobox text specific CSS rules*/
/*Title*/

#container .infoBox h1 {
	margin-top: 30px;//43px;
	font-family: AvenirBlack;
	font-size: 26;//34pt;//55pt;
	/*Suppresing -webkit-margin-before and -webkit-margin-after*/
	margin-bottom: 0;
	padding: 0;
}
/*subtitle*/

#container .infoBox h2 {
	margin-top: 23px;//32px;
	font-family: AvenirBlack;
	font-size: 13pt;//16pt;//26pt;
	/*Suppresing -webkit-margin-before and -webkit-margin-after*/
	margin-bottom: 0;
	padding: 0;
}
/*text*/

#container .infoBox p {
	margin-top: 0px;
	font-family: AvenirLight;
	font-size: 13pt;//16pt;//26pt;
	/*Suppresing -webkit-margin-before and -webkit-margin-after*/
	margin-bottom: 0;
	padding: 0;
}

#container .infoBox ul {
	margin-top: 0px;
	font-family: AvenirLight;
	font-size: 13pt;//16pt;//26pt;
	/*Suppresing -webkit-margin-before and -webkit-margin-after*/
	margin-bottom: 0;
	padding: 0;
}


#container .infoBox .twitter-timeline{
	width: 420px;
	margin-bottom: 0px;
	margin-top: 10px;
	//height:auto;
	min-height:300px;
	//max-height: 320px;
	height:420px;
}

/*footnote specific*/

#container .infoBox span {
	position: absolute;
	bottom: 0;
	margin-bottom: 30px;//43px;
	/*Suppresing -webkit-margin-before and -webkit-margin-after*/
	padding: 0;
}

#container .infoBox #googleMap{
	width: 280px;
	height: 215px;
}

#container .infoBox .sponsor{
		/*width: 280px;*/
		width: 70%;
		padding-top: 20px;
}

/*Text pages in container*/
#container.textDoc .textDiv{
	/*background colour 80% white*/
	background-color: rgba(255,255,255,0.8);//#ffffff;
	/*opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */

    /*Padding so text doesn't touch the border*/
    padding-top: 1px;
    padding-right: 20px;
    padding-bottom: 1px;
    padding-left: 20px;
}

#container.textDoc h1{
	margin-top: 30px;//43px;
	/*Black*/
	/*color: #231F20;*/
	/*White*/
	color: #ffffff;
	font-family: AvenirBlack;
	font-size: 34pt;//55pt;
	text-align: justify;
}

#container.textDoc h2{
	margin-top: 23px;//32px;
	/*Grey*/
	color: #6D6E70;
	font-family: AvenirBlack;
	font-size: 16pt;//26pt;
	text-align: justify;
}

#container.textDoc h3{
	margin-top: 23px;//32px;
	/*Black*/
	color: #000000;
	font-family: AvenirBlack;
	font-size: 16pt;//26pt;
	text-align: justify;
}


#container.textDoc p{
	/*Black*/
	color: #231F20;
	font-family: AvenirLight;
	font-size: 16pt;//26pt;
	text-align: justify;
}
#container.textDoc li{
	/*Black*/
	color: #231F20;
	font-family: AvenirLight;
	font-size: 16pt;//26pt;
	text-align: justify;
}
#container.textDoc td{
	/*Black*/
	color: #231F20;
	font-family: AvenirLight;
	font-size: 16pt;//26pt;
	text-align: justify;
}
#container #googleMap{
	width: 700px;
	height: 450px;
}



/*Navigation menu style*/

#navMenu {
	width: 100%
	position: relative;
	/*padding: 23px;*/
	margin-right:-50px;
	margin-left:-50px;
	margin-top: 15px;
}

#navMenu .navMenuOption{
	padding-top: 3px;
	padding-bottom: 3px;

	/*Grey*/
	border-color: #6D6E70;
	border-style: dashed;
	border-width: 1px;

	border-right-style: none;
	border-left-style: none;
	border-bottom-style: none;

	/*Grey*/
	color: #6D6E70;
	font-family: AvenirBlack;
	font-size: 21pt;//55pt;
}

#navMenu .navMenuOption:last-child {
	border-bottom-color: #6D6E70;
	border-bottom-style: dashed;
	border-bottom-width: 1px;
}

/* Removing href underline and blue color */
#navMenu a.navMenuOption{
    text-decoration: none;

	color: #6D6E70;
}

/* Colourful left side menus*/

#navMenu .navMenuOption.currentOption.navMenuOptionGreen{
	/*Green*/
	background-color: #8CC63F;

}
#navMenu .navMenuOption.currentOption.navMenuOptionGreen a{
	/*Grey on Black*/
	color: #231F20;
}

#navMenu .navMenuOption.currentOption.navMenuOptionOrange{
	/*Orange*/
	background-color: #F89E1D;
}
#navMenu .navMenuOption.currentOption.navMenuOptionOrange a{
	/*Grey on Black*/
	color: #231F20;
}

#navMenu .navMenuOption.currentOption.navMenuOptionYellow{
	/*Orange*/
	background-color: #DDDA43;
}
#navMenu .navMenuOption.currentOption.navMenuOptionYellow a{
	/*Grey on Black*/
	color: #231F20;
}

#navMenu .navMenuOption.currentOption.navMenuOptionSkyBlue{
	/*Orange*/
	background-color: #37A5EF;
}
#navMenu .navMenuOption.currentOption.navMenuOptionSkyBlue a{
	/*Grey on Black*/
	color: #231F20;
}

#navMenu .navMenuOption.currentOption.navMenuOptionBlue{
	/*Orange*/
	background-color: #32AAB7;
}
#navMenu .navMenuOption.currentOption.navMenuOptionBlue a{
	/*Grey on Black*/
	color: #231F20;
}

#navMenu .navMenuOption.currentOption.navMenuOptionLightPurple{
	/*Orange*/
	background-color: #C5C5EF;
}
#navMenu .navMenuOption.currentOption.navMenuOptionLightPurple a{
	/*Grey on Black*/
	color: #231F20;
}

#navMenu .navMenuOption.currentOption.navMenuOptionIndianRed{
	background-color: #CD5C5C;
}
#navMenu .navMenuOption.currentOption.navMenuOptionIndianRed a{
	/*Grey on Black*/
	color: #231F20;
}


.paperList p{
	margin: 5px;
}
#container.textDoc .paperList p.author {
	font-size: 14pt;
}

.paperList li{
	margin-bottom: 20px;
	list-style-type:none
}




/**
 * SMALL SCREEN SPECIFIC CSS
 * @media all and (max-width: 850px){
 */
@media all and (max-width: 1000px){

	#gridContainer {
		margin:0 auto;
	}

	#leftColumn{
		width: 100%;
		margin: 0 auto;
		height: auto;
		padding-top: 5px;
		padding-bottom: 10px;
	}
	#leftColumn .logo {
		width: 140px;
		padding-top: 5px;
	}
	#lineSeparator {
	    clear: both;
	    height: 30px;
		width: 100%;
	}

	#container {
		width: 100%;

		height: auto;
		float: left;
		overflow-y: initial;
		position: relative;

		margin-left: 0px;
		padding-left: 20px;
		padding-right: 20px;

		padding-top:5px;
		padding-bottom:5px;
	}
}


/**
 * TABBED INTERFACE FOR THE PROGRAM
 * http://www.w3.org/Style/Examples/007/target.en.html#tab1
 */
 

/*Program table */
#container.textDoc .programTable{
	padding:5px;
	border-spacing: 0px;
    border-collapse: separate;
    width:100%;
  }
/* table headers for the program table*/
#container.textDoc .programTableHeader p{
	text-align: left;
	margin-top: 0px;
	margin-bottom: 0px;
	font-weight: bold;
	font-size:16pt;
}
/*Chairs for each session*/
#container.textDoc p.programChairs{
	font-style: italic;
}
#container.textDoc p.note{
	font-size:13pt;
	font-style: italic;
}
#container.textDoc span.note{
	font-size:13pt;
	font-style: italic;
}
div.days > h2 {
  display: inline-block  /* We want the buttons all on one line */
  }		

#daySelectionTable{
	width:100%;
}
#container.textDoc #daySelectionTable tr th h2{
 text-align: center;
}

#container.textDoc h2.programAnchor{
   	margin-top: 0px;
   	padding-top: 15px;
   	font-size:20pt;
   	
}
#daySelectionTable th a{
	color:#6D6E70;

}
#daySelectionTable th.currentDay a{
	color:#231F20;
	font-size: 32pt;
}

.programTable td{
	border-bottom: 1px solid black;
	border-top: 1px solid black;
	border-collapse: collapse;
}