.bor{
  border: 1px solid red;
}
.title {
  text-align: center;
}
.contact-main-title {
  font-size: 44px;
  font-weight: 700;
  color: #fff;
  text-transform: capitalize;
  font-family: "Playfair Display", serif;
  position: relative;
  display: block;
  line-height: 1.2;
  margin-bottom: 30px;
}
@font-face {
    font-family: 'sqr721b';
    src: url(font/SQR721B.TTF);
}

.fnt{
    font-family: 'sqr721b';
}
.fntb{
  font-family: 'sqr721b';
  color:black;
}
.fntw{
    color:white;
    font-family: 'sqr721b';
}
@font-face {
    font-family: 'verdana';
    src: url(font/verdana.ttf);
}

.fnt1{
    font-family: 'verdana';
    font-size: 16px;
    line-height: 29px;
}
.fnt1w{
  font-family: 'verdana';
  font-size: 16px;
  line-height: 29px;
  color:white;
}

.prtcl{
    margin-top: 0%; 
    /* height: 250vh; */
    background: url(../images/part2.jpg) no-repeat center center;
    background-size: cover;
    /* background-color: aquamarine; */
  }
  .prtcl_cnt{
    margin-top: 0%; 
    background: url(../images/part2.jpg) no-repeat center center;
    background-size: cover;
    height: 100vh;
  }
  canvas.particles-js-canvas-el{
    height: 2293px;
    margin-top: -2251px;
  }
  .prtcl_rtt{
    margin-top: 0%; 
    background: url(../images/image_rotate.jpg) no-repeat center center;
  }
  canvas.particles-js-canvas-el1{
    margin-top: -320px;
  }
  .news_cards{
    padding-left: 30px;
  }
  .succ_story{
    padding-left: 30px;
  }
  .prtcl_abt{
    margin-top: 0%; 
    height: 300vh;
    background: url(../images/part2.jpg) no-repeat center center;
  }
  .prtcl_prv{
    margin-top: 0%; 
    background: url(../images/part2.jpg) no-repeat center center;
  }
  .prtcl2_abt{
    margin-top: 0%; 
    height: 180vh;
    background: url(../images/part.jpg) no-repeat center center;
  }
  .prtcl3_abt{
    margin-top: 0%; 
    height: 120vh;
    background: url(../images/part.jpg) no-repeat center center;
  }
  .prtcl2{
    margin-top: 0%; 
    height: 110vh;
    background: url(../images/part.jpg) no-repeat center center;
  }
  canvas.particles-js-canvas-el2{
    margin-top: -550px;
  }

  .prtcl3{
    margin-top: 0%; 
    height: 110vh;
    background: url(../images/part.jpg) no-repeat center center;
  }
  canvas.particles-js-canvas-el3{
    margin-top: -550px;
  }




/*=========== Flip Card===========*/
.case{
    border: 2px solid red;
}
.case1{
    border: 2px solid blue;
    height: 1rem;
}

.flip-card, img {
  background-color: transparent;
  width: 270px;
  height: 400px;
  perspective: 800px;
}
.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.6s;
    transform-style: preserve-3d;
    box-shadow: 0 16px 32px 0 rgba(0, 0, 0, 0.9);
  }
  
  .flip-card:hover .flip-card-inner {
    transform: rotateY(-180deg);
  }
  
  .flip-card-front,
  .card-info {
    position: absolute;
    width: 100%;
    height: 100%;
  }
  
  .flip-card-front {
    background-color: #bbb;
    color: black;
  }

.card-info {
    background-color: white;
    color: black;
    transform: rotateY(180deg);
    max-height: 500px;
    overflow: hidden;
  }
  .card-user-name {
    font-size: 17px;
    margin: 30px 40px 0 40px;
  }
  .card-desc {
    font-size: 16px;
    text-align: center;
    margin: 20px 40px;
  }

/*===========Responsive Cards===========*/
.grid {
    display: grid;
    width: 68.5em;
    grid-gap: 6rem;
    grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));
    align-items: start;
  }
  .new{
      height: 2rem;
  }
.news{
    background-color: #fff;
    border-radius: 0.4rem;
    overflow: hidden;
    box-shadow: 0 3rem 6rem rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: 0.2s;
}
.grid-item {
    background-color: #fff;
    border-radius: 0.4rem;
    overflow: hidden;
    box-shadow: 0 3rem 6rem rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: 0.2s;
  }
  .grid-item:hover {
    transform: translateY(-0.5%);
    box-shadow: 0 4rem 8rem rgba(0, 0, 0, 0.5);
  }
  .card-img {
    display: block;
    width: 100%;
    height: 10rem;
    object-fit: cover;
  }
  .card-content {
    padding: 1rem;
  }
  
  .card-header {
    font-size: 1.5rem;
    font-weight: 500;
    color: #0d0d0d;
    margin-bottom: 1rem;
  }
  
  .card-text {
    font-size: 0.9rem;
    letter-spacing: 0rem;
    line-height: 1.5;
    color: #3d3d3d;
    margin-bottom: 1.5rem;
  }
  
  .card-btn {
    display: block;
    width: 100%;
    padding: 0.7rem;
    font-size: 1.2rem;
    text-align: center;
    color: #3363ff;
    background-color: #d8e0fd;
    border: none;
    border-radius: 0.4rem;
    transition: 0.2s;
    cursor: pointer;
    letter-spacing: 0.1rem;
  }
  
  .card-btn span {
    margin-left: 1rem;
    transition: 0.2s;
  }
  
  .card-btn:hover,
  .card-btn:active {
    background-color: #c2cffc;
  }
  
  .card-btn:hover span,
  .card-btn:active span {
    margin-left: 1.5rem;
  }


  #footer1{
    position: relative; 
    margin: 0 auto;
    width: 100%;
    overflow:hidden;
    padding-top:50px;
    padding-bottom:50px;
    background:#f5f5f5;
    z-index:2;
  }
  #footer1 p{
    font-size:12px;
    color:black;
  }
  .social-footer1{ 
    position:relative;
    margin:0 auto;
    width:100%;
    text-align:center;
    z-index:1002;
    height:30px;
  }
  .footer-social1 li {
      padding:0; 
      list-style: none;
    text-align:center; 
    width:30px;
      display: inline-block;
    cursor:pointer;
    margin-left:2px;
  }

  .footer-social1 li.icon-footer1 a {
    font-family: 'FontAwesome';
    font-size: 16px;
    line-height: 30px;
    width:30px;
    color: #f5f5f5; 
    margin:0;
    padding:0;
    -webkit-transition : all 0.2s ease-out;
    -moz-transition : all 0.2s ease-out;
    -o-transition :all 0.2s ease-out;
    transition : all 0.2s ease-out;
  }
  .footer-social1 li:hover.icon-footer1 a{
    color: #000; 
  }





@media only screen and (min-width: 960px) and (max-width: 1200px) {
  /* .prtcl{
    height: 300vh;
  } */
  .bookshelf figure{
    width:280px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
  .news_cards{
    padding-left: 0;
  }
  .succ_story{
    padding-left: 0;
  }
  /* .logo{
    margin-left: 210px;
    top: -39px;
  } */
  /* .prtcl{
    height: 130vh;
   } */
  canvas.particles-js-canvas-el{
        height: 2728px;
        margin-top: -2710px;
  }
  .prtcl2{
    height: 130vh;
   }
   .container .five.columns{
    width: 100%;
  }
  .flip-card{
    margin-left: 32.421875%;
  }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .banner1{
        height: 50vh;
    }
    .serv{
      width: 500px;
    }
    .succ_story{
      padding-left: 0;
    }
    .news_cards{
      padding-left: 0;
    }
    .bookshelf figure{
      width: 324px;
      margin: 10px 0 0 0;
      padding: 0;
    }
    .wed{
      width: 100%;
    }
    .wed1{
      width: 100%;
    }
    canvas.particles-js-canvas-el{
          height: 4945px;
          margin-top: -4940px;
    }
    .container .five.columns{
      width: 100%;
    }
    .flip-card{
      margin-left: 17.8571428572%;
    }
}
@media only screen and (min-width: 320px) and (max-width: 479px) {
    .banner1{
    height: 50vh;
}
.serv{
  width: 235px;
}
.succ_story{
  padding-left: 0;
}
.news_cards{
  padding-left: 0;
}
.image-background3 img{
  height: 50%;
}
.wed{
  width: 100%;
}
.wed1{
  width: 100%;
}
canvas.particles-js-canvas-el{
    height: 5488px;
    margin-top: -5494px;
}
.bookshelf figure{
  width: 324px;
  margin: 10px 0 0 0;
  padding: 10px;
}
.adjw{
  font-size: 40px;
}
.sub-text p{
  font-size: 18px;
  line-height: 18px;
}
.container .five.columns{
  width: 100%;
}
.flip-card{
  margin-left: 5%;
}
.image-background1 img{
  height: 50%;
}
.image-background2 img{
  height: 50%;
}
.image-background5 img{
  height: 50%;
}
.image-background6 img{
  height: 50%;
}
.image-background4 img{
  height: 50%;
}
}
@media only screen and (max-width: 319px){
  .image-background4 img{
    height: 50%;
}
.succ_story{
  padding-left: 0;
}
.serv{
  width: 220px;
}
.news_cards{
  padding-left: 0;
}
  .image-background6 img{
    height: 50%;
}
  .image-background5 img{
    height: 50%;
}
  .image-background3 img{
    height: 50%;
}
.image-background2 img{
  height: 50%;
}
.image-background1 img{
  height: 50%;
}
    .banner1{
        height: 50vh;
    }
    .home-text{
      margin-left: -97px;
    }
    /* .prtcl{
      height: 308vh;
    } */
    .bookshelf figure{
      width: 324px;
      /* height: 470px; */
      margin: 23px -11 0 -14px;
      padding: 31px;
      left: -25px;
    }
    .csstransformspreserve3d .details ul { padding: 33px 0px 0 19px }
 
  .details {
    width: 163px;
}
  .bookshelf figcaption h2 {
    margin: .2em -27px 4px 0;
}
    canvas.particles-js-canvas-el{
    height: 6355px;
    margin-top: -6336px;
    }
    .adjw{
      font-size: 20px;
    }
    .sub-text p{
      font-size: 15px;
      line-height: 15px;
    }
    .flip-card, img {
      width: 220px;
    }
}