* {
  margin: 0;
  padding: 0
}
@media print
{
    #print
    {
        display: none !important;
    }
    body {
      background: white!important;
    }

    .navbar{
    display: none;
    }
    .nav {
  background-image: url("../images/pattern2.jpg")!important;
  background-repeat: no-repeat;
  width: 94%;
  height: 88px;
  margin-top: 13px;
}
}

body {
  background: linear-gradient(180deg, rgba(233, 233, 240, 1) 48%, rgba(227, 241, 241, 1) 100%);
  overflow-x: auto;
}
.navbar{
background: linear-gradient(90deg, rgba(45,26,59,1) 0%, rgba(30,71,96,1) 50%, rgba(28,27,27,1) 100%);
}


.nav {
  background-image: url("../images/pattern2.jpg");
  background-repeat: no-repeat;
  width: 94%;
  height: 88px;
  margin-top: 13px;
}

.main-div {
  width: auto;
  position: relative;
  top: 10px;
  background: lightblue;
  border-radius: 10px;
  background:#fff;
  border: 1px solid grey;
  box-shadow: -5px 5px 5px lightgrey;
  height: auto;
  padding: 50px;
}
.add_div {
  width: 30%;
  margin-top: 40px;
  background: lightblue;
  border-radius: 10px;
  background:#fff;
  border: 1px solid grey;
  box-shadow: -5px 5px 5px lightgrey;
  height: auto;
  padding: 10px;
}

.heading p{
  font-weight: bold;
  font-size: 30px;
  margin-bottom: 20px;
  color: #F6383E;

}
label{
  font-weight: bold;
}
.main-div2 {
  background-image: url("../images/id card2.png");
   background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 400px;
  border-radius: 10px;
  border: 1px solid grey;
  box-shadow: -5px 5px 5px lightgrey;
  height: 270px;
  position:relative;
  overflow:hidden;
}
.col1{
      position:relative;
}.col2{
      position:relative;
}
.user-img{
     position: absolute;
     top:152px;
     left:81px;
}
.user-name{
     position: absolute;
     top:216px;
     left:200px;
}
.col2 .user-name{
     position: absolute;
     top:214px;
     left:200px;
}
.nav-heading{

  margin: auto;
  position: absolute;
 left: 0;
 right:0;
 margin-right:70px;
 top:10px;

}
.main-div2 .main-div2-footer{
    position:relative;
    height:35px;
    top:245px;
     background: rgb(70, 184, 250);
     color: white;
}
.main-div2 .div1{
    font-size:14px;
    opacity:0.8;
    margin-left:35px;
}.main-div2 .div2{
    font-size:14px;
    opacity:0.8;
    margin-right:35px;
}
.qrcode{
    position: absolute;
    right:2px;
}
.main-div2 li{
  font-size: 12px;
  line-height: 16px;
  margin-bottom: 10px!important;
  font-weight: 600;
  color:#2665d9;
  margin-left: 28px;
  opacity: .8;

}
.main-div2 li:first-child{
  margin-top: -10px;
}
.main-div2 li:last-child{
  line-height: 20px;
}
.main-div2 span{
  color: red;
  opacity: 0.7;
}
.ins{
  border: 1px solid black;
  box-shadow: 3px 3px 5px grey;
  border-radius: 10px;
  opacity: .7;
  padding: 2px 2px;
  /*background: #2665d9;*/
  background: rgb(70, 184, 250);
  color: white;
}
.link{
  font-weight: 400;
}



#card-pf {
  position: absolute;
  right: 20px;
  top: 55px;
  border: 4px solid white!important;
}
#logo{
  position: relative;
  top: 20px;
  left: 12px;
}

.nav-heading {
  color: white;
  font-family:serif;
  font-size: 22px;
  left: 49px;
}

#nav-head {
  font-size: 16px;
  margin-left: 0px;
  letter-spacing: 1px;
  position: relative;
  top: -6px;
}

#card-value {
  font-size: 13px;
  font-weight: 400;
  color: black;
}

.row1 h6 {
  font-size: 14px;
  color: #2665d9;
  opacity: 0.8;
}


.contact-us {}

.sign img {
  position: relative;
  left: 82%;
}
body{
    overflow:auto!important;
}

/*@media screen and (max-width:768px) {
  .main-div {
    width: 400px!important;
    position: relative;
    top: 100px;
    margin:auto!important;


    background: lightblue;
    border-radius: 10px;
    background: white;
    border: 1px solid grey;
    box-shadow: -5px 5px 5px lightgrey;
  }
  .main-div2{
    margin:auto!important;
  }
 body{
      width:100%!important;
 }
 .navbar{
     width:100%!important;
 }
}*/
