@media only screen and (max-width: 1200px) {
    .col-lg-4 {
        display: none;
    }
}
body{
	background-color:whitesmoke;
}
.navbar {
	margin-bottom: 0px;
	background-color: black;
}
.navbar .nav>li>a{
	color: white;
}

.navbar .navbar-brand{
	color: white;
}
.jumbotron{
	color: white;
	background-color: black;
}
.dropdown-menu{
	background-color: white;
}
.pathfinder{
	padding-left: 100px;
}
td:hover{
	background-color: gold;
}
.path{
	background-color: blueviolet;
}
.wall{
	background-color: black;
}
.visited{
	background-color: red;
}
table{
	margin:0 auto 0 auto;
}
.vl {
	border-left: 2px solid black;
	height: 100%;
	position: absolute;
	left: 100%;
	top: 0;
}
.row{
	width: 100%;
}
#tablediv{
	height:auto;
}
.right{
	height: 100%;
}
.slidecontainer{
	width: 100%;
	margin: auto;
}
#controls{
		border:1px solid black;
		border-radius: 10px;
		bottom: 0;
		display: grid;
		grid-template-columns: .3fr 1fr 1fr 1fr;
		grid-gap: 21px;
		padding: 12px;
		height: 10%;
		align-content: center;
		/* align-items: center; */
		position: fixed;
		/* bottom: 0; */
		width: fit-content;
		/* justify-content: inherit;*/
}


* {
	margin: 0px;
	padding: 0px;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  }
  
  nav {
	background-color: #3b3a3a;
	color: white;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 30% 60%;
		grid-template-columns: 30% 60%;
	-webkit-column-gap: 10%;
			column-gap: 10%;
	padding: 0% 5%;
  }
  
  nav .array-inputs {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 60% 40%;
		grid-template-columns: 60% 40%;
	place-content: center;
	padding: 5% 0%;
  }
  
  nav .array-inputs #a_size {
	padding: 5% 0%;
  }
  
  nav .array-inputs #a_speed {
	padding: 5% 0%;
  }
  
  nav .array-inputs #a_generate {
	background-color: transparent;
	border: none;
	outline: none;
	color: white;
	padding: 4% 0% 0% 0%;
	padding-left: 20%;
  }
  
  nav .array-inputs #a_generate:hover {
	cursor: pointer;
  }
  
  nav .header_right {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
		-ms-flex-direction: column;
			flex-direction: column;
  }
  
  nav .header_right .nav-heading {
	display: inline-block;
	font-size: xxx-large;
	padding: 3% 0%;
  }
  
  nav .header_right .algos {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: (16.66667%)[6];
		grid-template-columns: repeat(6, 16.66667%);
	place-content: center;
	padding: 2% 0%;
  }
  
  nav .header_right .algos button {
	background-color: transparent;
	border: none;
	color: white;
	outline: none;
	padding: 5% 0%;
	font-size: x-large;
  }
  
  nav .header_right .algos button:hover {
	background-color: blue;
	cursor: pointer;
  }
  
  nav .header_right .algos .butt_locked {
	background-color: transparent;
	cursor: pointer;
  }
  
  nav .header_right .algos .butt_locked:hover {
	background-color: transparent;
	cursor: pointer;
  }
  
  nav .header_right .algos .butt_selected {
	background-color: white;
	color: green;
  }
  
  nav .header_right .algos .butt_selected:hover {
	background-color: white;
	cursor: pointer;
  }
  
  nav .header_right .algos .butt_unselected:hover {
	background-color: blue;
	cursor: pointer;
  }
  
  section {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 20% 60% 20%;
		grid-template-columns: 20% 60% 20%;
  }
  
  section #Info_Cont1 {
	padding: 20%;
  }
  
  section #array_container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 100%;
	height: 70vh;
  }
  
  section #Info_Cont2 {
	padding: 20%;
  }
  
  .hide {
	display: none;
  }

  
  /* BY UTKARSH JAISWAL, VAIBHAV GUPTA*/