body{
	margin: 0;
	padding:0;
	
	
}


ul{
	padding: 0;
	margin: 0 0 0 200px;
	list-style:none;

}

nav{
	width: 100%;
	overflow: auto;
	background-color:navy;
}
li{
	float: left;

}

li a{
	width: 200px;
	display: block;
	padding: 5px ; 
	text-decoration:underline;
	color: white;
	text-align:center;
}

li a:hover{
	background-color:darkgoldenrod;
	text-transform: uppercase;
	margin: auto;
	padding:5%;
}

.logo img{
	position: absolute;
	margin-top: 5px;
	margin-left: 10px;
	border-radius: 50px;
}

*{
	box-sizing: border-box;
	margin:0;
	padding:0; 
	
}

.heading1{
	border-radius: 25px;
	text-align: center;
	  margin-top: 25px;
	margin-left: 30%;
	margin-right: 30%;
	width: 480px;
	font-style:bold;
	font-family: Georgia, 'Times New Roman', Times, serif;
	background:cyan;
	margin-bottom: 20px; 
  }
  
  h3{
	color: white;
  }
  

.col{
  float: left;
  width:33%;
  padding-bottom:50px;
  padding-right:50px;
}

.row:after {
  content: "";
  display: table;
  clear: both;
  
}

@media screen and (max-width: 600px) {
  .column {
    display: block;
  }
}

.card1{
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
  padding: 5px;
  text-align: center;
  background-color:navy;
  width: 100%;
  margin-left:50%;

 
}

.card2
{
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
	padding: 5px;
	text-align: center;
	background-color:navy;
	margin-left:50%;
	width:100%;
    margin-top: 5px;	
  
}

.card3{
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
	padding: 5px;
	text-align: center;
	background-color:navy;
	margin-left:50%;
	width: 100%;

	
}

.card4{
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
	padding: 5px;
	text-align: center;
	background-color:navy;
	margin-left:50%;
	margin-top: 5px;	
	width: 100%;
}

.card1:hover {
  box-shadow: 0 8px 16px 0  rgb(238, 201, 99);
}
.card2:hover {
	box-shadow: 0 8px 16px 0  rgb(238, 201, 99);
}
.card3:hover {
	box-shadow: 0 8px 16px 0 rgb(238, 201, 99);
}
.card4:hover {
	box-shadow: 0 8px 16px 0  rgb(238, 201, 99);
}
.img
{
	size:50px;
	width:100px;
}
.navbar-brand{
    font-size:20px;
}