.grey-box
    	{
    		background-color: white;
    		margin-bottom: 10px;
    		text-align: center;
    		padding: 5%;
        border-radius: 25px;
        border-style: outset;
        width: 100%;
    	}
      .navbar{
        background-color: #333;
        color: white;
        width: 100%;
      }
      a{
        color: white;
      }
      a:hover{
        color: green;
      }
      body{
        background-color: #bfb8e7;
      }
      .heading{
        margin-bottom: 5%;
      }
      .xyz{
        background-color: #e1e2e3;
        width: 100%;
        border-radius: 25px;
        padding: 5%;
        margin-bottom: 5%;
      }
@keyframes slideInFromLeft {
  0% {
    transform: translateY(-100%);
  }
  50% {
    transform: translateY(0);
  }
  
}

.transform {
  animation: 5s ease-out 0s 1 slideInFromLeft;
  background-color: #45CEE0;
}
      .navbar-fixed .navbar-toggle .icon-bar{
        background-color: white;
      }
th{
	background-color:black;
	color:white;
	font-size:2em;
	padding-right:5%;
	text-align:center;
	 border-style: solid;
    border-width: 5px;
    border-color: #BCBCBC;
    word-wrap: break-word;
}
table{
	width: 100%;
	table-layout: fixed;
}
td{
	background-color:#e1e2e3;
	font-size:2em;
	padding-right:5%;
	 border-style: solid;
    border-width: 5px;
    border-color: #BCBCBC;
    word-wrap: break-word;
}
button{
    font-family: 'Work Sans', sans-serif;
	font-size: 22px;
	background-color: #279;
	color: #fff;
	border: 0px;
	border-radius: 3px;
	padding: 10px;
	cursor: pointer;
	margin-bottom: 30px;
}
button:hover{
	background-color: #38a;
}
@media only screen and (max-width: 300px) {
  #con {
    width: 100%;
  }
}
@media only screen and (max-width: 300px) {
.dropdown-menu>li>a {
	color: black;
	}
}