@charset "utf-8";
/* CSS Document */

@font-face{
	font-family: "rajdhani";
	src: url(../fonts/Rajdhani-Regular.ttf) format('truetype');
}
@font-face{
	font-family: "rajdhani";
	src: url(/fonts/Rajdhani-Bold.ttf) format('truetype');
	font-weight: bold;
}

body{
	font-family: rajdhani,Segoe, Segoe UI, DejaVu Sans, Trebuchet MS, Verdana," sans-serif";
	font-size: 18px;
	background-color: #f4f4f4;
	padding-top: 0px;
}


#myCarousel{
	height: 100%;
}
.container{
	min-width: 90%;
}

.navbar-brand p{
	font-size: 2.5rem;
	margin: 0px;
}




.carousel-caption{
	
	position: absolute; 
   top: 10rem; 
   right: 5rem;
	left: 60%;
	text-align: center;
}

.carousel-caption h3{
	font-size: 3rem;
	background-color: rgba(0,0,0,0.75) ;
	margin: 0px 60px;
	padding: 1rem;
}
.carousel-caption h1{
	padding: 1rem;
	font-size: 3rem;
	margin: 1rem;
	background-color: rgba(0,140,186,1);
}
.carousel-caption h4{
	font-size: 2rem;
	background-color: rgba(0,0,0,0.75) ;
	padding: 1rem;
}
.carousel-bar{
	background-color: rgba(0,0,0,0.75) ;
	height: 11rem;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	color:white;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
@media (max-width: 1025px) {
	.carousel-caption{
	bottom: 0;
	left: 0;
	right: 0;
	top:10%;
/*	background-color: aqua;*/
}
	.mission-text {
		display: none;
	}
}


.carousel-nav-bar {
	background-color: rgba(0,0,0,0.5) ;
	color: white;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-around;
	}

 .carousel-nav-bar div{
    text-align: center;
    max-width: 50%;
	transition: 1.5s;
}
#ndl-nav{ flex-grow: 2;}
#poem-nav{ flex-grow: 2;}

#ndl-nav a, #poem-nav a{ color: white; text-decoration: none;}


    .carousel-nav-bar div:hover{
      transition: 1.5s;
      max-width: 80% !important;
      background-color: rgba(0,140,186,1);
      flex-grow: 2;
      cursor: pointer;
      color: #fff;
    }

#ndl-nav img{margin: 0px 10px 10px 0px;}
#ndl-nav .text-show {display: inline-block;}
#ndl-nav .text {display: none;}
#ndl-nav:hover .text-show {display: none;}
#ndl-nav:hover .text {display: inline-block;}

#poem-nav img{margin: 0px 10px 10px 0px;}
#poem-nav .text-show {display: inline-block;}
#poem-nav .text {display: none;}
#poem-nav:hover .text-show {display: none;}
#poem-nav:hover .text {display: inline-block;}

.carousel-nav-bar h1{
		font-size: 18px;
	}

@media (max-width: 1025px){
	
	.carousel-nav-bar h1{
		font-size: 18px;
	}
}






















/* ---- grid ---- */
.grid-container{
	max-width: 1000px;
	margin: auto;
}
.grid {
  max-width: 100%;
	margin: 2rem 0;
}

/* clearfix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- grid-item ---- */

.grid-sizer{ width: 25%; }
.grid-item { width: 23%; }

.grid-item {
  height: 150px;
  float: left;
  background: #FFFFFF;
  border-color: hsla(0, 0%, 0%, 0.5);
  box-shadow: 0 0px 8px rgba(0,0,0,0.2);
  overflow: hidden;
  margin: 10px 1%;
}


.img-wrap{
	width: 100%;
	height: 150px;
	overflow: hidden;
}
.img-wrap img{
	width: 100%;
}
.vertical.grid-item--height2 img{
	width: 100%;
	height: auto;
	
}
.grid-item--width2 { width:  48%; }
.grid-item--height2 { height: 320px; }
.grid-item--height2 img{
	display: inline-block;
	vertical-align: middle;
	height: auto;
    max-width: none;
    left: -9999px;
    right: -9999px;
    top: -9999px;
    position: absolute;
    margin: auto;
    min-height: 100%;
    bottom: -9999px;
    min-width: 100%;
    max-height: none;
}


/*Articles*/

.readmore{
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: bold;
}
.articl-nav a{
    text-decoration: none;
}
.article-text{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	margin: 1rem;
	height: 150px;
}
.article-quote{
	text-align: center;
	margin: 1rem;
	
}
.article-quote a{
	text-decoration: none;
	color: white;
	
}

.text-noise{
	position: absolute;
	bottom: 0;
	top: 0;
	left: 0;
	right: 0;
	color: white;
}


.article-quote h1{ font-size: 2rem; }
.article-quote h2{ font-size: 2rem; }
.articl-title h2{ font-size: 1.7rem; padding-bottom: .5rem; }
.articl-title h4{ font-size: 1.4rem; }

#IEEE-quote h1{ font-size: 1.8rem; margin: 0;}
#IEEE-quote h2{ font-size: 1.5rem; }
#impact-block .article-quote h1{ font-size: 2.5rem; margin-top: 0px; }
#impact-block .article-quote h2{ margin-top: 3rem; }
#impact-block .article-quote h4{ font-size: 1.5rem; margin: 0px;}
#shines .article-quote h1{ margin-top: 3rem; }


.vertical-text{
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	z-index: 10;
	color: white;
	padding: 1rem;
}
.vertical-text{
    background-color: #000000;
    background-color: rgba(0,0,0,0.5);
    background: -moz-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(0,0,0,0)),color-stop(100%,rgba(0,0,0,0.75)));
    background: -webkit-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%);
    background: -o-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%);
    background: -ms-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%);
    background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#a6000000',GradientType=0);
}
.vertical-text h3{
/*	font-weight: bold;*/
	font-size: 2rem;
	margin-top: 0;
	margin-bottom: 0;
}
.vertical-text h1{
	font-size: 2.5rem;
/*	font-weight: bold;*/
	
}
.vertical-text h2{
	font-size: 2.7rem;
}
.vertical-text a{
	text-decoration: none;
	color: white;
}



.grid .article-text h2{
	margin: 10px 0px 0px 0px; 
}
.grid .article-text h4{
	margin: 0px; 
}
.article-orange{
	background-color: #ffae00;
	color: white;
}
.article-red{
	background-color: #ef0166;
	color: white;
}
.article-blue{
	background-color: #02b2f4;
	color: white;
}
.article-green{
	background-color: #a8c838;
	color: white;
}




.link-orange{
	color: #ffae00;

}
.link-red{
color: #ef0166;

}
.link-blue{
color: #02b2f4;

}
.link-green{
	color: #a8c838;

}

















/*Footer*/

footer{
	background-color: #404040;
	margin-bottom: 0px;
	color: white;
	padding-top: 2rem;
	padding-bottom: 2rem;
	margin-top: 0px;
}
.footer-middle {
	border-left: dotted 1px white;
	border-right: dotted 1px white;
	padding: 0rem 4rem 0rem 4rem;
	display: flex;
	justify-content: center;
	flex-direction: column;
	
}
.footer-space{
	text-align: center;
	color: #02b2f4;
	padding-bottom: 2rem;
}

.footer-info{
	display: flex;
	justify-content: center;
	flex-direction: column;
	padding-top: 5.5rem;
}
.footer-info h4{
	margin: 2px;
	font-size: 1.5rem;
}

.footer-logos .inside-footer img{
	height: 90px;
	max-height: 90px;
	margin: 10px 0;
}
.footer-logos img{
	height: 90px;
	max-height: 90px;
	margin: 10px 0;
}
.footer-nav h3{
	font-weight: bold;
	color: #ff552c;
}
.footer-nav h5{
	margin: 5px 0;
}
.footer-info a,.footer-nav a{
	color: white;
}

.footer-info a:hover,.footer-nav a:hover{
	color: #ff552c;
	transition-timing-function: ease;
	transition-duration: 0.1s;
	text-decoration: none;
}
.footer-nav span{
	font-weight: normal;
}
.UCR-logo .inside-footer{
	text-align: center;
}

.UCR-logo .inside-footer img{
	max-height: 200px;
}
.UCR-logo{
	text-align: center;
}

.UCR-logo img{
	max-height: 200px;
}



.border-right{
	border-right: dotted 1px black;
}
.border-left{
	border-left: dotted 1px black;
}
.border-top{
	border-top: dotted 1px black;
}
.border-bottom{
	border-bottom: dotted 1px black;
}

.strong{
	font-weight: bold;
}

.lab-table{
	width: 100%;
}

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  background-color: #dbdbdb;
}

.footer-logos, .UCR-logo{
	min-height: 240px;
}
.inside-footer{
	position: absolute;
	bottom: 0;
	text-align: center; 
}


.footer-info p{
	color: #ff552c;
	margin-bottom: 0;
}
.footer-info h3{
	margin-top: 0;
}










/*Media Queries*/


@media (min-width: 1250px){ 
/*
	.grid-item { height: 240px; width: 19%; margin: 10px 0.5%; }
	.grid-item--width2{	width: 39%; }
	.grid-item--height2 { height: 500px; }
	.grid-sizer{ width: 20%;}
	.img-wrap{ height: 200px; }
	.article-text{ height: 270px; }
	.article-quote h1{ font-size: 3rem; }
	.article-quote h2{ font-size: 2.5rem; }
*/
/*	.vertical.grid-item--height2 img{ min-width: 0; }*/
}
@media (min-width:642px) and (max-width: 1025px) {
	.grid-item { margin: 7px 1%; width: 31.3333%; height: 175px;}
	.grid-item--width2{ width: 64.6666%; }
	.grid-item--height2 { height: 364px; }
	.grid-sizer{ width: 33.333%; }
	.img-wrap{ height: 175px; }
	.vertical.grid-item--height2 img{ width: 100%; height: auto; }
	#UCR-article{ display: none;}
	.footer-logos .inside-footer img{ height: 70px;}
}
@media (max-width: 769px){
	
.vertical.grid-item--height2 img{ width: auto; height: 100%; }
}
@media (min-width:482px) and (max-width: 641px) { 
	.grid-item { width: 48%; margin: 5px 1%; height: 170px;}
	.grid-item--width2{	width: 98%; }
	.grid-item--height2 { height: 350px; }
	.grid-sizer{ width: 50%; }
	.img-wrap{ height: 170px; }
	.vertical.grid-item--height2 img{ width: 100%; height: auto; }
	#group-photo{ display: none;}
	.footer-logos, .UCR-logo{display: inline-block;}
}
@media (max-width: 481px) {	
	.grid-item { width: 90%; margin: 5px 5%; height: auto;}
	.grid-item--width2{	width: 90%; height: auto;}
	.grid-item--height2 { height: 400px; }
	.grid-sizer{ width: 100%; }
	.img-wrap{ height: 200px;}
	.vertical.grid-item--height2 img{
	width: 100%;
	height: auto;
	min-height: none;
	max-width: 100%;
}
	.grid-item--height2 img{    
    top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
    position: relative;
}
	.footer-logos .inside-footer img{ height: 60px;}
}

.news-button{
	color: #ff552c;
}
