/* Common styles for any institution's public page. */

/* brand */
.brand {
	background-color: #222;
	margin-top: 1em;
	margin-left: 1em;
}

.brand a {
	font-size: 20px;
	color: white;
	text-decoration: none;
}

.brand .banner {
	/* Keep a height of 40px and have width maintain aspect ratio */
	width: auto;
	height: 45px;
	margin-right: 0.2em;
}

.masthead {
	width: 100%;
}

/* Overwrite bootstrap's navbar border color */
.navbar-inverse {
	border-color: transparent;
}

/* Bootstrap navbar breakpoint to use collapse mode */ 
@media only screen and (max-width: 767px) {
	/* Hide channel name on collapsed mode */
	.nav-text.public-channel-name {
		display: none;
	}

	.brand {
		margin-bottom: 1em;
	}
	#fileExplorerTopMenuContainer {
    	/*margin-top: 10px;*/
    }
    #library-tab-content #mainContentWrapper {
    	margin-top: 30px !important;;
    }
    .dimv_videoContainer {
		margin-top: 30px;
	}
}

#navbarSpacer {
    height: 50px;
}

@media screen and (min-width: 580px) {
    #navbarSpacer {
        height: 45px;
    }
    .dimv_videoContainer {
		margin-top: 35px;
	}
}

@media screen and (min-width: 768px) {
    #navbarSpacer {
        height: 110px;
    }
    #library-tab-content #fileExplorerTopMenuContainer {
    	margin-top: 40px;
    }
    #library-tab-content #mainContentWrapper {
    	margin-top: 50px !important;;
    }
    .dimv_videoContainer {
		margin-top: 55px;
	}
}

@media screen and (min-width: 816px) {
    #navbarSpacer {
        height: 110px;
    }
    #library-tab-content #fileExplorerTopMenuContainer {
    	margin-top: 0px;
    }
    #library-tab-content #mainContentWrapper {
    	margin-top: 10px !important;;
    }
    .dimv_videoContainer {
		margin-top: 55px;
	}
}

@media screen and (min-width: 884px) {
    .dimv_videoContainer {
		margin-top: 15px;
	}
}

@media screen and (min-width: 1250.02px) {
	#navbarSpacer {
        height: 90px;
    }
    #library-tab-content #mainContentWrapper {
    	margin-top: 30px !important;
    }
    .dimv_videoContainer {
		margin-top: 35px;
	}
}

#render-show-hide{
	bottom:0px; 
	width:100%; 
}
@media only screen and (max-device-width: 599px){

	.big-featured-video-container > #featured-video{
		width:100%;
		height: auto;
		margin-bottom : 20px;
	}
}
.big-featured-video-container{
	margin-bottom :1.5em;
	width: auto;
	padding-left: 0 !important;
	padding-right: 30px;
	float:left;
}
@media only screen and (max-device-width: 599px){
	.big-featured-video-container{
		padding-right: 0px !important;
	}
}
@media only screen and (max-width:1199px){
	.small-featured-video-container{
		margin-left: 500px;
	}
}
@media only screen and (max-width:1000px){
	.small-featured-video-container{
		padding-right: 0px !important;
		width: 100% !important;
		display: inline;
	}
}
@media only screen and (max-width:400px){
	.list-item{
		/* width: 272px; */
	}
	.list-item-right{
		padding-left:10px;
		padding-bottom: 10px;
	}
}
#footerReportProblem{
	display:none;
}
#footer {
	/*bottom: 0px;*/
	width: 100%;
	/*height: 3em;*/
	/*position: fixed;
	background-color: #7e7e7e;*/
}

#footer iframe {
	width: 100%;
	border: none;
}

#navbar-collapse-1 a i {
	font-size: 21px;
	margin-top: 4px;
}


#navbar-collapse-1 #home-tab a i {
	font-size: 22px;
	margin-top: 4px;
}

.organizationListElement {
	position: flex;
	color: black;
	background-color: white;
	overflow:hidden;
	margin: 5px;
	height: 45px;
	line-height: 45px;
	text-align: left;
	border: solid 0.5px;
	border-color: #D8D8D8;
}

.organizationListElement a {
	display: block;
	width: 100%;
	height: 100%;
	font-size: 13px;
	text-decoration: none;
	padding-left: 20px;
}

.organizationListElement:hover {
	text-decoration: none;
	color: #4f4f4f;
	background-color:#F5F5F5;
	cursor: pointer;
	border: solid 0.5px;
	border-color: #D8D8D8;
}
 
#organizationListFilterLabel {
	height: 30px;
	width: 90%;
	margin: auto;
	margin-top: 10px;
	font-size: 13px;
	text-align: center;
}

#organizationListFilterInput {
	display: flex;
	color: black;
	background-color: white;
	overflow:hidden;
	padding: 10px;
	margin: 2px;
	margin: auto;
	margin-bottom: 5px;
	word-wrap:break-word;
	border-color: #D8D8D8;
	border: solid 0.5px;
	border-radius: 5px;
	width: 70%;
	height: 40px;
	width: 90%;
	height: 30px;
}

.sortOrganizationBtn {
	height: 40px;
	width: 25%;
	margin: 2px;
}