:root {
--content-width: 1200px;
}
header{
height:64px !important;
}
.mdl-layout__header{
z-index: initial; /*Fix Safari not fixing div inside absolute divs. This is for the fixed navbar*/
}
.logo{
		height: 60px;
		width: auto;
	}	
.logodiv{
		float: left;
	}
.top-container{
		max-width: var(--content-width);
		margin-left: auto;
		margin-right: auto;
	}
.docs-navigation{
	max-width: var(--content-width);
	direction: rtl;
	position: absolute;
}

.main-container{
}
.sbp-header-container{
		height: 131px;
		width: 100%;
		padding:0;
    position: absolute;
		bottom: 0;
	}
 .sbp-header{
  background-color: rgb(28, 114, 109);
  background-image: url("images/banner/SBP_banner.png");
	height: 131px;
  width: 1000px;
	/*margin: 0 auto;*/
	}
.fill-header-sx{
	background:rgb(28, 114, 109);
	width: calc(50% - 500px);
	float: left;
	height: 131px;
	}	
.fill-header-dx{
	
	background:rgb(45, 142, 134);
	width: calc(50% - 500px);
	float: right;
	height: 131px;
	}	


.docs-layout-header{
	position: relative;
/*	background-image: url("images/banner/SBP_banner_top_big.png");*/
	height: calc( 131px + 64px) !important;
    }
	


div.mdl-layout__container{
  /*max-width:1000px;*/
  /*left:50%;*/
  /*margin-left:-500px;*/
  }
/*Adjust the vertical postion of the drawer when is updated on large screens to not cover the header
and also leave a bit of white space*/
	.mdl-layout--fixed-drawer>.mdl-layout__drawer{
		position: fixed;
		top: calc(64px + 131px + 25px);
		padding-left: 20px;
    background-color: whitesmoke;
	}
	.stick-drawer-top{
	position:fixed !important;
	top: calc(64px + 25px) !important;
	/*left: calc(50% - 500px + 20px) !important;*/
	}

	.mdl-layout__drawer-button{
	visibility: hidden;
	}
.mdl-layout--fixed-drawer>.mdl-layout__content{
	margin-left: calc(220px); /*240px is the default (the widht of the drawer); you then have to add the distance of the drawer from the left border of the page*/
	margin-top: 25px !important; /*Since header is fixed the margin is from the top of the page. So header heigth must be taken into account*/ 
	
/*This is a tweak just in case the height of the content is less the the height of the drawer on the left. In such case the drawer will be cutted. 
										TODO: Find the fix for this!	
										*/
	/*min-height:1000px; 	*/
	}

.mdl-layout--fixed-drawer>.members{
margin-left:0px;
}
.toc-drawer{
height: auto;
width:220px;
/*height: initial;*/
/*background-color: transparent;*/
//border-left: solid 3px #606060;
box-shadow: none;
border-right: 0px;
/*background-color: wheat;*/
}
.toc-drawer .mdl-navigation{
padding-top:0px;
}
/*
.toc-drawer nav{
	border-left: solid 3px #606060;
}*/
.toc-drawer .mdl-navigation .mdl-navigation__link{
	/*color: #00BCD4;*/
	color: #606060;
	font-weight:400;
	}
a.nav-ul{
	padding-bottom:0px;
	}


.docs-navigation__container {
    top: 0;
		background-color: #f5f5f5;
    position: fixed;
		top: 0px !important;
 		z-index: 999;
}

.docs-navigation .mdl-navigation__link{
	color: #606060;
}

.home .docs-navigation .home, .phd .docs-navigation .phd, .research .docs-navigation .research, .people .docs-navigation .people, .activity .docs-navigation .activity, .joinus .docs-navigation .joinus, .visitus .docs-navigation .visitus, .news .docs-navigation .news {
    opacity: 1;
    border-top-color: green !important;
		background-color:rgba(0, 0, 0, 0.04);
	}

body:not(.home) .docs-navigation__container {
	background-color: rgb(26,107,102);
}
body:not(.home) .docs-navigation .mdl-navigation__link{
	color: white !important;
}

.phd .docs-navigation .phd, .research .docs-navigation .research, .people .docs-navigation .people, .activity .docs-navigation .activity, .joinus .docs-navigation .joinus, .visitus .docs-navigation .visitus, .news .docs-navigation .news {
    opacity: 1;
    border-top-color: yellow !important;
		background-color:rgba(0, 0, 0, 0.04);
	}

body:not(.home) .sbp-header-container{
	display: none !important;
}
body:not(.home) .docs-layout-header{
	height: 64px !important;
}
	.docs-navigation__container {
		/*padding-top: 5px;*/
	}
	.docs-navigation .mdl-navigation__link{
    border-top: 3px solid transparent;
	}
.research-list-card .mdl-card >img{
   max-width:250px;
}
.activity-list-card .mdl-card >img{
  max-width: 250px;
}
.members-pic{
	width:100%;
	max-width: 370px;
	height: auto;
}
.members-list{
	list-style-type:none;
	text-align: left;
}
.mdl-mega-footer--drop-down-section, .mdl-mega-footer__drop-down-section{
	width: 20% !important;
}