* {
	box-sizing: border-box;
}

body {
	margin: 0;
}

#container {
	position: relative;
}

header {
	padding: 20px 0;
	background-color: #fff;
	display: flex;
	justify-content: center;
}

.in-header-div {
	flex: 1;
	max-width: 1220px;
}

.arrow-down {
	margin-left: 20px;
}

.arrow-up {
	margin-right: 20px;
}

h2 {
	text-align: center;
}

#select-view {
	width: 80%;
	padding: 10px;
	display: block;
	margin: 0 auto;
}

#select-view:focus {
	outline: none;
	border: 1px solid rgb(62, 5, 168);
}

#gallery {
	max-width: 1220px;
	margin: 30px auto;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.image-container {
	display: inline-block;
	max-width: 100%;
}

.image-container img {
	width: 100%;
	height: auto;
}

.top-img {
	margin-bottom: 30px;
    background-image: url(/images/1.jpg);
    background-size: cover;
    height:450px;
	/* padding-top:5% !important; */
}



/* .top-caption {
    width: 100%;
    top: 3%;
    left: 50%;
    color: black !important;
    font-size: 15px !important;
	width: 71%;
	margin: auto ;
} */

.border {
	border: 1px solid black !important;
}

.top-card {
	/* height: 452px; */
	width: 40%;
	margin: auto;
	border-radius: none !important;
	box-shadow: none !important;
	border-radius: 0px !important;
	top: 15%;

}

.border-div {
	/* height: 434px; */
}

.banner-card{
	width:50%;
}
@media screen and (max-width: 700px) {
	.logo-sm {
		width: 50%;
	}

	.top-text {
		/* margin-top: 42%; */
	}
	.banner-card{
		width:100%;
	}
}
@media screen and (max-width: 700px) {
	.top-card {
		/* height: 452px; */
		width: 100%;
		margin: auto;
		border-radius: none !important;
		box-shadow: none !important;
		border-radius: 0px !important;
		top: 15%;
	
	}

	/* .top-caption {
		width: 100%;
		top: 0%;
		left: 0%;
		color: black !important;
		font-size: 0px !important;
		width: 71%;
		margin: auto ;
	} */
}

@media screen and (min-width: 700px) {
	.top-img {

	}

	

	/* .top-caption {
        display: inline;
        top: 5%;
        left: 50%;
        color: white;
        text-align: center;
        font-size: 15px !important;
		width: 40%;

    } */
	
	#gallery {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.image-container {
		margin: 10px 0;
	}

	.image-container img {
		height: 200px;
		width: auto;
	}

	#larger-img {
		position: fixed;
		display: block;
		top: 50%;  
		left: 50%;  
		transform: translate(-50%, -50%);
	}

	#larger-img img {
		border: 2px solid black;
		max-width: 100%;
	}

	#close-image {
		position: absolute;
		top: -15px;
		right: -15px;
		width: 50px;
		height: 50px;
		border-radius: 50%;
		border: 1px solid black;
		background-color: #fff;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}

.sticky {
	position: sticky;
	top: 0;
}