body 
{
  background-color: #c8d9f745;
}

nav {
  position: fixed;
}

.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
  color: #335aaa;

}
.navbar-light .navbar-nav .nav-link {
  color: #335aaa;
}


.first_headings {

  text-align: center;
  margin-top: 30px;
}

.first_headings h4 {
  color: #777777;
  font-family: Montserrat, sans-serif;
  font-size: 36px;
}

.first_headings p {
  color: #888888;
  font-family: Montserrat, sans-serif;
  font-size: 15px;
}

.first_cards1 {
  text-align: center;
  padding: 25px;
}

.first_cards1 i {
  background-color: #3e65af;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  padding-top: 13px;
  color: #ffffff;
  cursor: pointer;
  transition: 1.0s;
}

.first_cards1 i:hover {
  background-color: #404040;
  color: #ffffff;
}

.first_cards2 h4 {
  font-size: 16px;
  font-weight: bold;
  font-family: Montserrat, sans-serif;
}

.first_cards2 p {
  color: #888888;
text-align: justify;
}


.middle_banner {

  background: url('./images/Bannerr\ b&w.jpg');
  height: 400px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  /* background-attachment: fixed; */
  background-position: center;

}

.middle_banner:hover {

  background: url('./images/Bannerr\ color.jpg');
  height: 400px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  /* background-attachment: fixed; */
  background-position: center;
}

@media screen and (min-width:0px) and (max-width:1000px) {

  .middle_banner {
    height: 150px;
  }

  .middle_banner:hover {
    height: 150px;
  }
}

/* body, html {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: orange; } */

.wrapper {
  /* display: flex;
    width: 90%; */
  justify-content: space-around;
}

.cards {
  width: 280px;
  height: 290px;
  border-radius: 15px;
  padding: 1.5rem;
  background: white;
  position: relative;
  display: flex;
  align-items: flex-end;
  transition: 0.4s ease-out;
  box-shadow: 0px 7px 10px rgba(0, 0, 0, 0.5);
  z-index: 1;
}

/* .cards:hover
{
z-index: 0;
} */

/* .cards:hover {
      transform: translateY(20px); } */
.cards:hover:before {
  opacity: 1;
}

.cards:hover .info {
  opacity: 1;
  transform: translateY(50px);
}

.cards:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 15px;
  background: #335aaaa6;
  z-index: 2;
  transition: 0.5s;
  opacity: 0;
}

.cards img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 15px;
}

.cards .info {
  position: relative;
  z-index: 3;
  color: white;
  opacity: 0;
  transform: translateY(30px);
  transition: 0.5s;
}

.cards .info h1 {
  margin: 0px;
}

.cards .info p {
  letter-spacing: 1px;
  font-size: 15px;
  margin-top: 8px;
}

.cards .info button {
  padding: 0.6rem;
  outline: none;
  border: none;
  border-radius: 3px;
  background: white;
  color: black;
  font-weight: bold;
  cursor: pointer;
  transition: 0.4s ease;
}

.cards .info button:hover {
  background: dodgerblue;
  color: white;
}

.footer_3 ul li {
  list-style-type: none;
}

.info h1 {
  font-size: 25px;
}

.cards_heads {

  color: #000;
  margin: auto;
  font-size: 25px;
  margin-top: -25px;

}

















/* @import url('https://fonts.googleapis.com/css?family=Roboto+Mono');
 * {
	 box-sizing: border-box;
	 font-weight: normal;
}
 body {
	 color: #555;
	 background: #222;
	 text-align: center;
	 font-family: 'Roboto Mono';
	 padding: 1em;
}
 h1 {
	 font-size: 2.2em;
} */

.front h1 
{
  font-size: 25px;
  margin-top: 230px;
}
 .flip {
	 position: relative;
}
 .flip > .front, .flip > .back {
	 display: block;
	 transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
	 transition-duration: 2s;
	 transition-property: transform, opacity;
}
 .flip > .front {
	 transform: rotateY(0deg);
}
 .flip > .back {
	 position: absolute;
	 opacity: 0;
	 top: 0px;
	 left: 0px;
	 width: 100%;
	 height: 100%;
	 transform: rotateY(-180deg);
}
 .flip:hover > .front {
	 transform: rotateY(180deg);

}
 .flip:hover > .back {
	 opacity: 1;
	 transform: rotateY(0deg);
}
/*  .flip.flip-vertical > .back {
	 transform: rotateX(-180deg);
}
 .flip.flip-vertical:hover > .front {
	 transform: rotateX(180deg);
}
 .flip.flip-vertical:hover > .back {
	 transform: rotateX(0deg);
} */
 .flip {
	 position: relative;
	 display: inline-block;
	 margin-right: 2px;
	 margin-bottom: 1em;
	 width: 400px;
}
 .flip > .front, .flip > .back {
	 display: block;
	 color: white;
	 width: 280px;
	 background-size: cover !important;
	 background-position: center !important;
	 height: 290px;
	 padding: 1em 2em;
	 background: #465797;
	 border-radius: 10px;
  
}
 .flip > .front p, .flip > .back p {
	 font-size: 0.9125rem;
	 line-height: 160%;
   margin-top: 30px;
	 color: #ffffff;
}
.flip > .front h2, .flip > .back h2{
  margin-top: 30px;
  font-size: 25px;
}
 .text-shadow {
	 text-shadow: 1px 1px rgba(0, 0, 0, 0.04), 2px 2px rgba(0, 0, 0, 0.04), 3px 3px rgba(0, 0, 0, 0.04), 4px 4px rgba(0, 0, 0, 0.04), 0.125rem 0.125rem rgba(0, 0, 0, 0.04), 6px 6px rgba(0, 0, 0, 0.04), 7px 7px rgba(0, 0, 0, 0.04), 8px 8px rgba(0, 0, 0, 0.04), 9px 9px rgba(0, 0, 0, 0.04), 0.3125rem 0.3125rem rgba(0, 0, 0, 0.04), 11px 11px rgba(0, 0, 0, 0.04), 12px 12px rgba(0, 0, 0, 0.04), 13px 13px rgba(0, 0, 0, 0.04), 14px 14px rgba(0, 0, 0, 0.04), 0.625rem 0.625rem rgba(0, 0, 0, 0.04), 16px 16px rgba(0, 0, 0, 0.04), 17px 17px rgba(0, 0, 0, 0.04), 18px 18px rgba(0, 0, 0, 0.04), 19px 19px rgba(0, 0, 0, 0.04), 1.25rem 1.25rem rgba(0, 0, 0, 0.04);
}
 
.footer_li p a 
{
  color: #ffffff;
    text-decoration: none;
}
.footer_li p a:hover 
{
  font-weight: bold;
}
@media screen and (min-width:0px) and (max-width:717px) {
  .client_img
  {
    height: 250px !important;
    text-align: center;
  }
  
}

nav.navbar.navbar-expand-lg.navbar-light.bg-light {
  box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
}