/* Format body, links, headers*/

	body {margin:0;
		font-family: Raleway;
		font-weight: 300;
		font-size:20px;
		background-image: url('../merrymaking_img/bg_3.png');
		background-size: cover; 
		background-attachment: fixed;
	}

		h1 {
			font-family: 'Raleway', sans-serif;
			font-weight: 400;
			font-size:50px;
			text-align: center;
		}
	
		a:link {
			text-decoration: none;
			color:#f3f2ea; 
		}

		a:visited {
			text-decoration: none;
			color:#cbcac3;
		}

		a:hover {
			text-decoration: underline;
			color:#fffff1;
		}

		a:active {
			text-decoration: underline;
			color:#aaa9b0;
		}
	
/* Format navigation bar */	

		.navbar {
			overflow: hidden;
			background-color: #3c0000;
			position: fixed;
			top: 0;
			width: 100%;
		}	
	
			.navbar a {
				float: left;
				display: block;
				color: #fdfffc;
				text-align: center;
				padding: 14px 16px;
				text-decoration: none;
				font-size: 17px;
			}

			.navbar a:hover {
				background: #f0efe7;
				color: #006400;
				font-weight:bold;
			}

			.navbar-right{
				float:right;
			}

/* Format logo */

		.logo {
			width: 100px;
			height:50px;
			line-height:50px;
			text-align:center;
			float:center;
			color:#cbcac3;
			margin: 0 auto;
		}

			.logo img {
				width: 75px;
				margin: auto;
				display: block;
			}

/* Format main content container */
	
	.main-content {
		background-color: rgba(0, 0, 0, .7);
		margin: 0 auto;
		width:60%;
		height:460px;   
		padding: 25px;
		color:#cbcac3;
		text-align:center;
}
	
/* Format custom header */

	.header-text {  
		width: 600px;
		height: 60px;
		line-height:60px;
		text-align: center;
		color:#cbcac3;  
		margin: 0 auto;
	}

/* Format the photo grid */

	.grid {
		background-color: #333;
		margin: 0 auto;
		width:80%;
		overflow: auto;
		white-space: nowrap;
		padding: 10px;
	}

		.grid img {	
			width: 274px;
			height: 150px;
			cursor: pointer;
		}

/* Format the lightbox */

	#lightbox {
		position: fixed;
		z-index: 1000;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, .8);
		display: none;
	}

		#lightbox.active {
			display: flex;
			justify-content: center;
			align-items: center;
		}

		#lightbox img {
			max-width: 90%;
			max-height: 80%;
			padding: 4px;
			background-color: black;
			border: 2px solid white;
		}

	/*Format copyright/credits */

	.credit {
		text-align:center; 
		color:#f0efe7;	
	}