.mySlides {
	display: none
}
/* Slideshow container */
.slideshow-container {
	max-width: 1150px;
	max-height:450px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 45%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 5px 5px 0;
  background-color: rgba(0,0,0,0.1);
  text-decoration:none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
  color: white;
  text-decoration:none;
}

/* Caption text */
.text {
  color: white;
  background-color: rgba(0,0,0,0.8);
  font-size: 15px;
  padding: 5px 5px;
  position: absolute;
  bottom: 0px;
  width: 100%;
  text-align: center;
}


/* The dots/bullets/indicators */
.dot {
  cursor:pointer;
  height: 13px;
  width: 13px;
  margin: 0 1px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}
		
/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 5s;
  animation-name: fade;
  animation-duration: 5s;
}

@-webkit-keyframes fade {
	0% {opacity: 0.2;} 
	15% {opacity: 1;}
	85% {opacity: 1;}
	100% {opacity: 0.2;}
}

@keyframes fade {
	0% {opacity: 0.2;} 
	15% {opacity: 1;}
	85% {opacity: 1;}
	100% {opacity: 0.2;}
}
/* Container to hold all button components*/
.button-container{
	position: relative;
	max-width: 350px;
	float: left;
	margin-left: 10%;
}
		
.button-container a{
	color: white;
	text-decoration-color: white;
}
		
.button-container-r a{
	color: white;
	text-decoration-color: white;
}
		
.button-container-r{
	position: relative;
	max-width: 350px;
	float: right;
	margin-right: 10%;
}
/* Container for text to overlay image*/
.text-block{
	position: absolute;
	top: 50%;
	left:50%;
	transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%)
}
		
.button-container:hover .button-image {
	filter: brightness(70%);
}			
		
.button-container-r:hover .button-image {
	filter: brightness(70%);
}
		
.button-text{
	background-color: rgba(0, 0, 0, 0.75);
	font-weight: bold;
	padding: 16px 16px;
	font-size: 20px;
}
		
.button-image{
	opacity: 1;
	display: block;
	width: 100%;
	height:auto;
	transition: 0.5s ease;
	
}

@media only screen and (max-width: 990px) {
  .button-container-r {
   float:left;
   margin-left: 25%;
	  margin-top: 10px;
	  margin-right:0;
  }
.button-container {
   margin-left: 25%;
  }
}
		
	@media only screen and (max-width: 768px) {
 .button-container-r {
   margin-left: 15%;
  }
.button-container {
   margin-left: 15%;

  }
}	
		
		
@media only screen and (max-width: 425px) {
 .button-container-r {
   float:left;
   margin-left: 0%;
	  margin-top: 10px;
	  margin-right:0;
  }
.button-container {
   float:left;
   margin-left: 0%;
	  margin-top: 10px;
	  margin-right:0;
  }
}

.maintext-container{
	position: relative;
	width: 90%;
	float: left;
	margin-left: 5%;
	margin-bottom: 10px;
}
		
.maintext-text{
	background-color: rgba(240, 248, 255, 1);
	padding: 6px 6px;
}
		
.nugget-title{
	position: relative;
	float:left;
	left:50%;
	margin-top: 20px;
	transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
}
		
.nugget-container{
	float:left;
	background-color: rgba(240, 248, 255, 1);
	width: 100%;
	margin-top:10px;
	position: relative;
}

.nugget-container-even{
	float:left;
	background-color: rgba(245, 245, 245, 1);
	width: 100%;
	margin-top:10px;
	position: relative;
}


.nugget-image{
	display:inline-block;
	width:100%;
	max-width: 280px;
	margin-right: 10px;
	position: relative;
}

@media only screen and (max-width: 768px) {
 .nugget-image {
	 margin-right: 0px;
    display:block;
	 float:left;
	left:50%;
	transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%)
  }
 .nugget-text {
	 float:left;
	 min-width: 100%;
  }
}
		
.nugget-image img{
	max-width: 280px;
	width:100%;
	height:auto;
}
		
.nugget-image video{
	max-width: 280px;
	width:100%;
	height:auto;
	display:block;
	margin-bottom: -7px;
}
		
.nugget-text{
	position: relative;
	display:inline-block;
	padding: 5px 5px;
	vertical-align: top;
	max-width: calc(100% - 300px);
}
		
		
.nugget-name-box{
position: absolute;
	bottom: 15%;
	left: 15%;
	background-color: rgba(0, 0, 0, 0.7);
	width: 70%;
	height: 70%;
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	-webkit-transition: .3s ease;
	transition: .3s ease;
}
		
.nugget-image:hover .nugget-name-box {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
		
.nugget-text-title{
	float:left;
	font-size:18;
}
		
.nugget-box-text {
	color: white;
	font-size: 20px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
}
		
.nugget-box-text a{
	color: white;
	text-decoration-color: white;
}
		
		
.button {
  background-color: hsl(208, 100%, 90%);
  border: none;
	border-radius: 8px;
  padding: 1em, 0.5em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 2px 2px;
  transition: 0.6s;
  cursor: pointer;
  font-weight: bold;
}
.button a{
	color: #383838;
	text-decoration: none;
}		

.button:hover{
	color: white;
	box-shadow: inset 0 0 0 2em hsl(208, 100%, 40%);	
}
		
.button:hover a{
	color: white;
}

		
.button-even {
  background-color: hsl(0, 0%, 90%);
  border: none;
	border-radius: 8px;
  padding: 1em, 0.5em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 2px 2px;
  transition: 0.6s;
  cursor: pointer;
  font-weight: bold;
}
		
.button-even a{
	color: #383838;
	text-decoration: none;
}
.button-even:hover{
	color: white;
	box-shadow: inset 0 0 0 2em hsl(0, 0%, 40%);	
}
.button-even:hover a{
	color: white;
}

.studentship {
	position: relative;
	width: 95%;
	float: left;
	margin-left: 2.5%;
	margin-bottom: 10px;
	background-color: rgba(240, 248, 255, 1);
	padding: 6px 6px;
	animation: ripple 1.5s linear infinite;
	transition: all 0.7s ease;
	margin-top: 25px;
	text-align:center;

}
	
.studentshipevent {
	position: relative;
	width: 95%;
	padding:3px;
	float: left;
	margin-left: 2.5%;
	margin-bottom: 10px;
	background-color: hsl(208, 100%, 95%);
	border: 4px;
	border-style: solid;
	border-color: hsl(208, 100%, 25%);
	text-align:center;
	font-size:17px;
	transition: all 0.7s ease;
}
		
.studentshipevent a{
	color:black;
	text-decoration-color:black;
	
}

@keyframes ripple {
    0% {
      box-shadow: 0px 0px 0px 0px hsla(0,0%,30%,30%),
        0px 0px 0px 1px hsla(208,100%,90%,90%),
        0px 0px 0px 3px hsla(208,100%,80%,90%),
        0px 0px 0px 5px hsla(208,100%,70%,80%);
    }
    100% {
      box-shadow: 0px 0px 0px 0px hsla(0,0%,30%,30%),
        0px 0px 0px 3px hsla(208,100%,90%,30%),
        0px 0px 0px 6px hsla(208,100%,80%,0%),
        0px 0px 0px 10px hsla(208,100%,70%,0%);
    }
}

@-o-keyframes ripple {
    0% {
      box-shadow: 0px 0px 0px 0px hsla(0,0%,30%,30%),
        0px 0px 0px 1px hsla(208,100%,90%,90%),
        0px 0px 0px 3px hsla(208,100%,80%,90%),
        0px 0px 0px 5px hsla(208,100%,70%,80%);
    }
    100% {
      box-shadow: 0px 0px 0px 0px hsla(0,0%,30%,30%),
        0px 0px 0px 3px hsla(208,100%,90%,30%),
        0px 0px 0px 6px hsla(208,100%,80%,0%),
        0px 0px 0px 10px hsla(208,100%,70%,0%);
    }
}

@-webkit-keyframes ripple {
    0% {
      box-shadow: 0px 0px 0px 0px hsla(0,0%,30%,30%),
        0px 0px 0px 1px hsla(208,100%,90%,90%),
        0px 0px 0px 3px hsla(208,100%,80%,90%),
        0px 0px 0px 5px hsla(208,100%,70%,80%);
    }
    100% {
      box-shadow: 0px 0px 0px 0px hsla(0,0%,30%,30%),
        0px 0px 0px 3px hsla(208,100%,90%,30%),
        0px 0px 0px 6px hsla(208,100%,80%,0%),
        0px 0px 0px 10px hsla(208,100%,70%,0%);
    }
}

@-moz-keyframes ripple {
    0% {
      box-shadow: 0px 0px 0px 0px hsla(0,0%,30%,30%),
        0px 0px 0px 1px hsla(208,100%,90%,90%),
        0px 0px 0px 3px hsla(208,100%,80%,90%),
        0px 0px 0px 5px hsla(208,100%,70%,80%);
    }
    100% {
      box-shadow: 0px 0px 0px 0px hsla(0,0%,30%,30%),
        0px 0px 0px 3px hsla(208,100%,90%,30%),
        0px 0px 0px 6px hsla(208,100%,80%,0%),
        0px 0px 0px 10px hsla(208,100%,70%,0%);
    }
}
	
.ProjectTable{
width:95%;
	border:none;
	border-collapse:separate;
	border-spacing:0 5px;
	text-align:center;
}
.ProjectTable tr{

}	
		
.ProjectTable td{
	border:none;
}	

		
.ProjectTable tr:nth-of-type(odd) {
	background-color: hsl(208,100%,95%);
}

.ProjectTable tr:nth-of-type(even) {
	background-color: hsl(0,0%,95%);
}    
