.fa-heading
{
	text-align: center;
	font-weight: bold;
	margin-top: 5%;
}
.fa-affiliation
{
	color: black;
	text-align: center;
	font-weight: bold;
	margin-top: 3%;
}
.fa-glance
{
	text-decoration: underline;
}
.fa-collegeglance
{
	margin-left: 10%;
	margin-right: 10%;
}
.button
{
	padding: 15px 20px 15px 20px;
	border-radius: 15px 15px 15px 15px;
	background-color: orange;
}
.button:hover
{
	background-color: brown;
}
.fa-parallax
{
	margin-top: 100px;
	margin-bottom: 100px;
}
.ourAdmin
{
	width: 100%;
	background-color: MediumPurple;
}
.fa-ourAdmin
{
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
	/* color: white; */
}

@media (min-width: 1025px)
{
	.fa-collegeLogo
	{
		margin-top: 50px;
		margin-bottom: 50px;
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 50%;
	}
	.gallery, .forStudents
	{
		width: 85%;
		height: inherit;
		display: flex;
		margin: auto;
		margin-top: 100px;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	a
	{
		text-decoration: none;
	}
	/* set individual icons */
	.photo
	{
		width: auto;
		height: auto;
		max-width: 300px;
		max-height: 300px;
	}
	.fa-photo
	{
		width: 300px;
		height: 300px;
	}
	.text
	{
		color: white;
		font-size: 20px;
		position: absolute;
		top: 45%;
		left: 50%;
		transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		text-align: center;
	}
    .flip-card 
	{
		background-color: transparent;
		width: 300px;
		height: 300px;
		perspective: 1000px; /* This gives 3D effect */
	}
	/* This container is needed to position the front and back side */
	.flip-card-inner 
	{
		position: relative;
		width: 100%;
		height: 100%;
		text-align: center;
		transition: transform 0.6s;
		transform-style: preserve-3d;
		box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
	}
	/* Do a horizontal flip when you move mouse over the box */
	.flip-card:hover .flip-card-inner 
	{
		transform: rotateY(180deg);
	}
	/* Position the front and back side */
	.flip-card-front, .flip-card-back 
	{
		position: absolute;
		width: 100%;
		height: 100%;
		-webkit-backface-visibility: hidden; /* safari */
		backface-visibility: hidden;
	}
	/* Style the front side (fall back if image is missing) */
	.flip-card-front 
	{
		background-color: #bbb;
		color: black;
	}
	/* Style the back side */
	.flip-card-back 
	{
		background-color: #2980b9;
		color: white;
		transform: rotateY(180deg);
	}
	  .dept-flip-card
	  {
		  background-color: transparent;
		  width: 150px;
		  height: 150px;
		  perspective: 1000px; /* This gives 3D effect */
	  }
	  .dept-flip-card:hover .flip-card-inner 
	  {
		  transform: rotateY(180deg);
	  }
	  .dept-flip-card-front
	  {
		  position: absolute;
		  width: 100%;
		  height: 100%;
		  -webkit-backface-visibility: hidden; /* safari */
		  backface-visibility: hidden;
	  }
	  .dept-odia-color
	  {
		  background-color: Tomato;
		  color: black;
	  }
	  .dept-history-color
	  {
		  background-color: MediumSeaGreen;
		  color: black;
	  }
	  .dept-sanskrit-color
	  {
		  background-color: Orange;
		  color: black;
	  }
	  .dept-education-color
	  {
		  background-color: DodgerBlue;
		  color: black;
	  }
	  .dept-sociology-color
	  {
		  background-color: Violet;
		  color: black;
	  }
	  .dept-english-color
	  {
		  background-color: Wheat;
		  color: black;
	  }
	  .dept-politicalScience-color
	  {
		  background-color: Aquamarine;
		  color: black;
	  }
	  .dept-economics-color
	  {
		  background-color: BlueViolet;
		  color: black;
	  }
	  .dept-chemistry-color
	  {
		  background-color: Chartreuse;
		  color: black;
	  }
	  .dept-zoology-color
	  {
		  background-color: CadetBlue;
		  color: black;
	  }
	  .dept-physics-color
	  {
		  background-color: Purple;
		  color: black;
	  }
	  .dept-botany-color
	  {
		  background-color: Salmon;
		  color: black;
	  }
	  .dept-mathematics-color
	  {
		  background-color: YellowGreen;
		  color: black;
	  }
	.fa-pageFooter
	{
		margin-top: 50px;
	}
}

@media (min-width: 768px) and (max-width: 1024px)
{
	.fa-collegeLogo
	{
		margin-top: 50px;
		margin-bottom: 50px;
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 75%;
	}
	.gallery, .forStudents
	{
		width: 85%;
		height: inherit;
		display: flex;
		margin: auto;
		margin-top: 100px;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	a
	{
		text-decoration: none;
	}
	/* set individual icons */
	.photo
	{
		width: auto;
		height: auto;
		max-width: 120px;
		max-height: 120px;
	}
	.fa-photo
	{
		width: 120px;
		height: 120px;
	}
	.text
	{
		color: white;
		font-size: 20px;
		position: absolute;
		top: 45%;
		left: 50%;
		transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		text-align: center;
	}
    .flip-card 
	{
		background-color: transparent;
		width: 120px;
		height: 120px;
		perspective: 1000px; /* This gives 3D effect */
	}
	/* This container is needed to position the front and back side */
	.flip-card-inner 
	{
		position: relative;
		width: 100%;
		height: 100%;
		text-align: center;
		transition: transform 0.6s;
		transform-style: preserve-3d;
		box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
	}
	/* Do a horizontal flip when you move mouse over the box */
	.flip-card:hover .flip-card-inner 
	{
		transform: rotateY(180deg);
	}
	/* Position the front and back side */
	.flip-card-front, .flip-card-back 
	{
		position: absolute;
		width: 100%;
		height: 100%;
		-webkit-backface-visibility: hidden; /* safari */
		backface-visibility: hidden;
	}
	/* Style the front side (fall back if image is missing) */
	.flip-card-front 
	{
		background-color: #bbb;
		color: black;
	}
	/* Style the back side */
	.flip-card-back 
	{
		background-color: #2980b9;
		color: white;
		transform: rotateY(180deg);
	}
	  .dept-flip-card
	  {
		  background-color: transparent;
		  width: 150px;
		  height: 150px;
		  perspective: 1000px; /* This gives 3D effect */
	  }
	  .dept-flip-card:hover .flip-card-inner 
	  {
		  transform: rotateY(180deg);
	  }
	  .dept-flip-card-front
	  {
		  position: absolute;
		  width: 100%;
		  height: 100%;
		  -webkit-backface-visibility: hidden; /* safari */
		  backface-visibility: hidden;
	  }
	  .dept-odia-color
	  {
		  background-color: Tomato;
		  color: black;
	  }
	  .dept-history-color
	  {
		  background-color: MediumSeaGreen;
		  color: black;
	  }
	  .dept-sanskrit-color
	  {
		  background-color: Orange;
		  color: black;
	  }
	  .dept-education-color
	  {
		  background-color: DodgerBlue;
		  color: black;
	  }
	  .dept-sociology-color
	  {
		  background-color: Violet;
		  color: black;
	  }
	  .dept-english-color
	  {
		  background-color: Wheat;
		  color: black;
	  }
	  .dept-politicalScience-color
	  {
		  background-color: Aquamarine;
		  color: black;
	  }
	  .dept-economics-color
	  {
		  background-color: BlueViolet;
		  color: black;
	  }
	  .dept-chemistry-color
	  {
		  background-color: Chartreuse;
		  color: black;
	  }
	  .dept-zoology-color
	  {
		  background-color: CadetBlue;
		  color: black;
	  }
	  .dept-physics-color
	  {
		  background-color: Purple;
		  color: black;
	  }
	  .dept-botany-color
	  {
		  background-color: Salmon;
		  color: black;
	  }
	  .dept-mathematics-color
	  {
		  background-color: YellowGreen;
		  color: black;
	  }
	.fa-pageFooter
	{
		margin-top: 50px;
	}
}

@media (max-width: 767px)
{
	.fa-collegeLogo
	{
		margin-top: 50px;
		margin-bottom: 50px;
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 80%;
	}
	.gallery, .forStudents
	{
		margin-left: 20%;
		margin-right: 20%;
	}
	a
	{
		text-decoration: none;
	}
	/* set individual icons */
	.photo
	{
		width: auto;
		height: auto;
		max-width: 100px;
		max-height: 100px;
	}
	.fa-photo
	{
		width: 100px;
		height: 100px;
	}
	.text
	{
		color: white;
		font-size: 10px;
		position: absolute;
		top: 45%;
		left: 50%;
		transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		text-align: center;
	}
    .flip-card 
	{
		background-color: transparent;
		width: 100px;
		height: 100px;
		perspective: 1000px; /* This gives 3D effect */
	}
	/* This container is needed to position the front and back side */
	.flip-card-inner 
	{
		position: relative;
		width: 100%;
		height: 100%;
		text-align: center;
		transition: transform 0.6s;
		transform-style: preserve-3d;
		box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
	}
	/* Do a horizontal flip when you move mouse over the box */
	.flip-card:hover .flip-card-inner 
	{
		transform: rotateY(180deg);
	}
	/* Position the front and back side */
	.flip-card-front, .flip-card-back 
	{
		position: absolute;
		width: 100%;
		height: 100%;
		-webkit-backface-visibility: hidden; /* safari */
		backface-visibility: hidden;
	}
	/* Style the front side (fall back if image is missing) */
	.flip-card-front 
	{
		background-color: #bbb;
		color: black;
	}
	/* Style the back side */
	.flip-card-back 
	{
		background-color: #2980b9;
		color: white;
		transform: rotateY(180deg);
	}
	  .dept-flip-card
	  {
		  background-color: transparent;
		  width: 150px;
		  height: 150px;
		  perspective: 1000px; /* This gives 3D effect */
	  }
	  .dept-flip-card:hover .flip-card-inner 
	  {
		  transform: rotateY(180deg);
	  }
	  .dept-flip-card-front
	  {
		  position: absolute;
		  width: 100%;
		  height: 100%;
		  -webkit-backface-visibility: hidden; /* safari */
		  backface-visibility: hidden;
	  }
	  .dept-odia-color
	  {
		  background-color: Tomato;
		  color: black;
	  }
	  .dept-history-color
	  {
		  background-color: MediumSeaGreen;
		  color: black;
	  }
	  .dept-sanskrit-color
	  {
		  background-color: Orange;
		  color: black;
	  }
	  .dept-education-color
	  {
		  background-color: DodgerBlue;
		  color: black;
	  }
	  .dept-sociology-color
	  {
		  background-color: Violet;
		  color: black;
	  }
	  .dept-english-color
	  {
		  background-color: Wheat;
		  color: black;
	  }
	  .dept-politicalScience-color
	  {
		  background-color: Aquamarine;
		  color: black;
	  }
	  .dept-economics-color
	  {
		  background-color: BlueViolet;
		  color: black;
	  }
	  .dept-chemistry-color
	  {
		  background-color: Chartreuse;
		  color: black;
	  }
	  .dept-zoology-color
	  {
		  background-color: CadetBlue;
		  color: black;
	  }
	  .dept-physics-color
	  {
		  background-color: Purple;
		  color: black;
	  }
	  .dept-botany-color
	  {
		  background-color: Salmon;
		  color: black;
	  }
	  .dept-mathematics-color
	  {
		  background-color: YellowGreen;
		  color: black;
	  }
	.fa-pageFooter
	{
		margin-top: 50px;
	}
}