/* CSS Document */



#gallery {

	}



#gallery a {

	text-decoration:none;
	

	}



#gallery .item {

	width: 200px; height: 200px; overflow: hidden;

	float: left;

	border: 5px solid #333;

	margin: 5px 5px 5px 5px;

	}





#gallery .item a { 

    overflow: hidden;

	}



#gallery .item a img {height: 100%; align-self: center;

	}



/*************************************

 * Basic lightbox styles. Notice the

 * default 'display' is 'none'.

 */



.lightbox {

  /** Hide the lightbox */

  display: none;



  /** Apply basic lightbox styling */

  position: fixed;

  z-index: 9999;

  width: 100%;

  height: 100%;

  text-align: center;

  top: 0;

  left: 0;

  background: black;

  background: rgba(0,0,0,0.8);

}



.lightbox img {

  /** Pad the lightbox image */

  max-width: 90%;

  max-height: 80%;

  margin-top: 5%;

}



.lightbox:target {

  /** Show lightbox when it is target */

  display: block;



  /** Remove default browser outline style */

  outline: none;

}



.lightbox .image {

	max-width:400px;

	margin:0 auto;

	text-align:center;
	
	background:#fff;
	
	padding:0px 35px 35px 35px;
	
	border-radius:5px;

	}



.lightbox .image img {

	border:10px solid #fff;

	margin:auto;

	clear:both;

	}







.lightbox .info {

	width: 100%;

	height:26px;

	display: block;

	text-align: center;

	margin: 50px auto 0px auto;

	clear:both;

}	





.close {float:right; margin-top:7px;   opacity: 1.2; margin-right:-20px;}





.close img {border-color:#e53d10; width:20px; height:20px; }



.close {  box-sizing: inherit }



.close:hover, .close:focus{

	color:#fff;

	opacity:1.0;

}



.lightbox .prev {

	float:left;

	}

	

.lightbox .next {

	float:right;

	}