body {
	background-color: rgb(192, 188, 183);
	overflow-x: hidden;
	color: rgb(38, 37, 36);
	font-family: "Raleway", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}

h1, h2 {
	color: rgb(241, 241, 241);
}

.fgradient {
	height: 50px;
	background: linear-gradient(to top, rgba(139, 132, 125, 1.0), rgba(192, 188, 183, 0));
}

.fbody {
	color: rgb(241, 241, 241);
	background-color: rgb(139, 132, 125);
}

.wide {
	letter-spacing: 0.2rem;	
}

.green {
	color: rgb(127, 209, 174);
}

.white {
	color: rgb(241, 241, 241);
}

.btn {
	background-color: rgb(127, 209, 174);
	color: rgb(241, 241, 241);
}
.btn:hover {
	background-color: rgb(241, 241, 241);
	color: rgb(38, 37, 36);
}

.form-control {
	background-color: rgb(241, 241, 241);
	color: rgb(38, 37, 36);
}
.form-control:focus {
	border-color: rgb(38, 37, 36);
	box-shadow: 0 0 0 0.25rem rgba(38, 37, 36, 0.25); 
}

a {
	color: rgb(241, 241, 241);
}
a:hover {
	color: rgb(38, 37, 36);
}		

#gbottom {
	height: 20px;
	position: relative;
	z-index: 1000;
	top: -20px;
	background: linear-gradient(to top, rgba(192,188,183,1.0), rgba(192,188,183,0));
}		

#header {
	width: 100%;
	z-index: 1000;
}

.overlay-div-left {
	left: 0;
	background-image: url("static/bg-left-2.png");
	-webkit-mask-image: linear-gradient(to right, rgba(0,0,0,1), rgba(0,0,0,0));
	mask-image: linear-gradient(to right, rgba(0,0,0,1), rgba(0,0,0,0));
}
.overlay-div-right {
	right: 0;
	background-image: url("static/bg-right-2.png");
	-webkit-mask-image: linear-gradient(to left, rgba(0,0,0,1), rgba(0,0,0,0));
	mask-image: linear-gradient(to left, rgba(0,0,0,1), rgba(0,0,0,0));
}

#cmiddle {
	position: relative;
	overflow: hidden; 
	width: 100%;
}

#cinner {
	height: 360px; 
	width: 480px; 
	position: relative;	
	left: 50%;
	transform: translateX(-50%);
}

.overlay-div {
	position: absolute;
	top: 0;
	width: 50px;
	height: 100%;
	z-index: 1000;
	background-size: 50px 360px;
}

.cimage {
	width:480px;
	height:360px;
}

#outerheader {
	z-index: 10000;
	position: absolute;
	top: 0px;		
}
#gtop {
	height: 15rem;
	position: relative;			
	z-index: 10000;
	background: linear-gradient(to bottom, rgba(188, 183, 177,1.0) 0%, rgba(188, 183, 177,1.0) 50%, rgba(188, 183, 177,0) 100%);
}

#couter {
	margin-top:-7.5rem;
	height: 360px;
	z-index: 1;
}		
		
.side-left {
	background-image: url("static/bg-left-2.png");
	background-size: 50px 360px;
}
.side-right {
	background-image: url("static/bg-right-2.png");
	background-size: 50px 360px;
}


@media (min-width: 480px) {		
	#cmiddle {
		width: 0px;
		left: 50%;
		overflow: visible;
	}
	#cinner {
		height: 540px; 
		width: 720px; 
		position: relative; 
		left: -360px;
		transform: translateX(0%);		
	}
	.overlay-div {
		position: absolute;
		top: 0;
		width: 50px;
		height: 100%;
		z-index: 1000;
		background-size: 50px 540px;
	}
	.cimage {
		width:720px;
		height:540px;
	}
	#gtop {
		height: 8rem;
	}
	#couter {
		height: 540px;
		margin-top:-4rem;				
	}				
	.side-left {
		background-image: url("static/bg-left-2.png");
		background-size: 50px 540px;
	}
	.side-right {
		background-image: url("static/bg-right-2.png");
		background-size: 50px 540px;
	}
}


@media (min-width: 768px) {		
	#cmiddle {
		width: 0px;
		left: 50%;
		overflow: visible;
	}
	#couter {
		height: 768px;
		z-index: 1;
	}
	.side-left {
		background-size: 10px 768px;
	}
	.side-right {
		background-size: 10px 768px;
	}	
	#cinner {
		position: relative; 
		height: 768px; 
		width: 1024px; 
		left: -512px;
		transform: translateX(0%);						
	}
	.cimage {
		width:1024px;
		height:768px;
	}			
	.overlay-div {
		background-size: 50px 768px;
	}
}


@media (min-width: 1200px) {	
	#cmiddle {
		width: 0px;
		left: 50%;
		overflow: visible;
	}
	#couter {
		height: 1080px;
		z-index: 1;
	}
	.side-left {
		background-size: 10px 1080px;
	}
	.side-right {
		background-size: 10px 1080px;
	}
	#cinner {
		position: relative; 
		height: 1080px; 
		width: 1440px; 
		left: -720px;
		transform: translateX(0%);						
	}
	.cimage {
		width:1440px;
		height:1080px;
	}			
	.overlay-div {
		background-size: 50px 1080px;
	}
}


.englebert-regular {
	font-family: "Englebert", cursive;
	font-weight: 500;
	font-style: normal;
	text-shadow: 1px 1px 1px #6e6a65
}


.carousel-item {
	transition: transform 1.0s ease-in-out;
}
.carousel-fade .active.carousel-item-start,
.carousel-fade .active.carousel-item-end {
	transition: opacity 0s 1.0s;
}

.tr {
	border: 1px solid red;
}
.tg {
	border: 1px solid green;
}
.tb {
	border: 1px solid blue;
}