@charset "utf-8";
/* CSS Document */

body, html {
  height: 110%;
  margin: 0;
}

.bg {
  background-image: url("../images/website_background-01.png");
  height: 110%; 
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

body { 
  color: white; 
}

.body
body {padding-bottom: 2000px;}

.navbar
{font-family: "Century Gothic"}

.navbar-nav
li a {
    color:#4665AF;
}
.navbar-nav .nav-item.active .nav-link,
.navbar-nav .nav-item:hover .nav-link {
    color:#FBC4B4;
}


p {
  background-color: transparent;
  color: white;
	align-content: center;
	text-align: center;
	padding-bottom: 10%;
	padding-top: 1%;
	font-family:"Century Gothic"
}


h1 {font-family:"Century Gothic"; color:#2A1E33; font-style: oblique}

.container-fluid
h2 {
  color:#4665AF; align-content: center; text-align: center; font-family:"Century Gothic"; font-size: 40px; padding-bottom: 10%
}


h2 {
  color:#AF9BC1; align-content: center; text-align: center; font-family:"Century Gothic"; font-size: 40px; padding-bottom: 10%
}

h3 {
  color:#AF9BC1; align-content: right; text-align: center; font-family:"Century Gothic"; font-size: 40px; padding-bottom: 10%
}

.link-container
a:link {
  color:#FFFFFF;
}

a:visited {
  color:#4665AF;
}

a:hover {
  color:#FBC4B4;
}

a:active {
  color:#FBC4B4;
}

.gallery {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-width: 33%;
-moz-column-width: 33%;
column-width: 33%; }
.gallery .pics {
-webkit-transition: all 350ms ease;
transition: all 350ms ease; }
.gallery .animation {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1); }

@media (max-width: 450px) {
.gallery {
-webkit-column-count: 1;
-moz-column-count: 1;
column-count: 1;
-webkit-column-width: 100%;
-moz-column-width: 100%;
column-width: 100%;
}
}

@media (max-width: 400px) {
.btn.filter {
padding-left: 1.1rem;
padding-right: 1.1rem;
}
}

$(function() {
var selectedClass = "";
$(".filter").click(function(){
selectedClass = $(this).attr("data-rel");
$("#gallery").fadeTo(100, 0.1);
$("#gallery div").not("."+selectedClass).fadeOut().removeClass('animation');
setTimeout(function() {
$("."+selectedClass).fadeIn().addClass('animation');
$("#gallery").fadeTo(300, 1);
}, 300);
});
});


.btn
{font-family:"Century Gothic"; font-size: 20px; color: #624583}

.container-sm
{font-family:"Century Gothic"}


p2
{
  background-color: transparent;
  color:#4665AF;
	align-content: center;
	text-align: center;
	padding-bottom: 0%;
	padding-top: 20%;
	font-family:"Century Gothic";
	font-size: 12pt
}

.find-widget
{font-family: "Century Gothic", font-size: 15pt; color:#624583}

.input[type=submit] {
  background-color:#AF9BC1;
  border: none;
  color: white;
  padding: 16px 32px;
  text-decoration: none;
  margin: 4px 2px;
  cursor: pointer;
}

.mb-1
a:link {
  color:#FFFFFF;
}

a:visited {
  color:#4665AF;
}

a:hover {
  color:#4665AF;
}

a:active {
  color:#FBC4B4;
}


	
	* { 
		box-sizing: border-box; 
	} 
	
	
	/* styling body */
	.container-fluid { 
		max-width: 1200px; 
		margin: auto; 
		padding-top: 200px
	} 
	
	h1 { 
		color: #4665AF; 
	} 
	
	/* anchor tag decoration */
	a { 
		text-decoration: none; 
		color: #4665AF; 
		font-size: 15pt
	} 
	
	a:hover { 
		color: #FBC4B4; 
	} 
	
	/* paragraph tga decoration */
	p { 
		display: -webkit-box; 
		-webkit-box-orient: vertical; 
		-webkit-line-clamp: 4; 
		overflow: hidden; 
		font-family: "Century Gothic";
		color: #4665AF

	} 
	
	/* row and column decoration */
	.row { 
		margin: 0px -18px; 
		padding: 8px; 
	} 
	
	.row > .column { 
		padding: 6px; 
	} 
	
	.column { 
		float: left; 
		width: 25%; 
	} 
	
	.row:after { 
		content: ""; 
		display: table; 
		clear: both; 
	} 
	
	/* content decoration */
	.content { 
		background-color: white; 
		padding: 10px; 
		border: 1px solid gray; 
	} 



.page-footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color:#4665AF;
  color:#FFFFFF;
  text-align: center;
  font-family: "Century Gothic";
  padding-top: 2%
}



