@import url('https://fonts.googleapis.com/css2?family=Cinzel&family=DM+Serif+Text&family=Gentium+Book+Plus&family=Roboto:wght@100&display=swap');

body {
			color: #333;
			background: #02594075;
			font-family: 'Cinzel', serif;
			font-family: 'DM Serif Text', serif;
			margin:0;

			}
		
		h1, h2 {color:maroon;
			color: #FCFCFC;
			font-family: 'DM Serif Text', serif;
			text-shadow: 0px 5 px 8 px rgba(0,0,0,.5);
			msrgin:0;
		}
ul,li{
	margin:0;
	padding:0;
	list-style:none;
	display: inline;
	
	}
		
	p{font-size:16px;
		font-weight:normal;
		line-height:1.5;}	
		
		
		
		.main-nav {
			background-color:#024059;
			color:white;
			padding:20px;
			
			width:100%;
			top:0;
			position:fixed;
			z-index: 999;
			}
	
		.main-nav a {color:white;
					text-decoration: none;
					margin-right: 20px;
					}
		.main-nav a:hover {
					color:#9AA8FA !important;
					text-decoration:underline;}
		.main-nav a:visited {
					color:#666;
}

.dropdown { 
	display:none; 
	position:absolute;
	left:228px; 
	padding-top:20px;
}

.dropdown li{
	display: block;
	width:175px;
	background: #024059;
	border-top: 1px solid white;
	padding:10px;
	
}
.dropdown-link:hover .dropdown{
	display:block;
	
}
.dropdown-link::after {
		content: "+";
		color:yellow;
		font-weight: Bold; 
}
		
		.active { color: #FFD470 !important;
				text-decoration: underline !important;}
		
		.main-header {background-image: url("images/pattern.jpg"); 
					background-size:100px;
			background-position: left -100px;
			background-color: #026873;
			background-repeat: no-repeat;
			padding: 80px;
			text-align: center;
			paadding-top: 138px;
		
		}
		
		
		.main-content {
			background-color: #fff;
			border-width: px;
			boder-stye: solid; 
			border-color: #666;
			border-radius: 20px;
			box-shadow: 0px 5px 8px #025940;
			width:600px;
			margin:100px auto;
			padding: 25px 50px;
			text-align: auto;
			
		} 
.button
		{background-color:#064B67;
		color:white;
		font-size:24px;
		padding:20px;
		margin-top:50px;
		display:block; 
		text-align:center;
		width:300px;
		margin-left:auto;
		margin-right:auto;
		font-weight:bold;
		text-decoration:none; 
		text-transform:uppercase;
		letter-spacing:1px;
		border-radius: 20px;
		border-bottom:10px solid black;
		Transform:TranslateY(0px);
		transition-property:all;
		transition-duration:300ms;
		opacity: .5;
		animation-name: moving-button;
		animation-duration: 2s;
		animation-iteration-count:infinite;
		animation-timing-function:ease-in-out;
		animation-direction:reverse;
}

.button:hover {
	background-color:#457672;
	color:black; 
	opacity: 1;
}
.button:active {
	backrgound:blue;
	color:white;
	margin-top:50px;
	border-bottom: none;
	transform: translateY(10px);
	
}
.main-content img {
	width:50%;
	margin-left:auto;
	margin-right:auto;
	display: block;
	margin-bottom: 30px; 
	
}

.main-content img:last-child {
	margin-bottom:0;
}
.main-content img:first-child {
	display:none;
}
.main-content img:nth-child(3){
	width:100%;
}



.main-header h1 {
	animation-name: popinheader; 
	animation-duration:1s;
}
.main-header h2{
	animation-name: popinheader; 
	animation-duration:1s;
	animation-delay:1s;
	opacity:0;
	transform:translateY(50px);
	animation-fill-mode:forwards;
}
@keyframes popinheader {
	from{opacity:0;transform:translateY(50px);}
	to{opacity:1; transform:translateY(0px);}
	
	
}




@keyframes moving-button { 
	0% {transform:translateX(0);background-color:#666;}
	25%{transform:translateX(-200px);background-color:#096F6F;width:400px;}
	50% {transform:translateX(0);background-color:#666;}
	75%{transform:translateX(200px);background-color:#096F6F;width:400px;}
	100% {transform:translateX(0);background-color:#666;}
	
	
}






			@charset "UTF-8";
/* CSS Document */