/* main css for msender */
/* background-image: url(admin/img/icon-alert.svg);*/

.container {
  display:flex;
  flex-wrap:wrap;

  }

.card {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0);
  max-width: 200px;
  margin: left;
  display:grid;
  grid-template-rows: 90px 50px 50px 50px 40px  40px 40px 10px; /* adjust the space in the grid, for the element in card */
  margin:5px;
  width: 40%;
  max-height: 400px;
  text-align: center;
  font-family: arial;
}

.price {
  color: grey;
  font-size: 22px;
}

.view_button {
  border: none;
  outline: 0;
  padding: 9px;
  color: white;
  background-color: #000;
  text-align: center;
  cursor: pointer;
  width: 100%;
  font-size: 18px;
}
.edit_delete_button {
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 5px;
}
.edit_button{
  border: none;
  padding: 9px;
  color: white;
  background-color: #6495ED;
  text-align: center;
  cursor: pointer;
  font-size: 16px;
}
.delete_button{
  border: none;
  padding: 9px;
  color: white;
  background-color: #FF0000;
  text-align: center;
  cursor: pointer;
  font-size: 16px;
}

.image-wrapper{
   width: 100%;
   height: 330upx;
   border-radius: 3px;
   overflow: hidden;
   image{
      width: 100%;
      height: 100%;
      opacity: 1;
   }
}


.headnav{
   width: 100%;
   margin: 0 auto;
}



nav{
   float: left;
}

nav ul{
   margin: 0;
   padding: 0;
   list-style: none;
   align: center;
}

nav li{
   display: inline-block;
   margin: 0 20px;
   padding-top: 23px;
   padding-button: 100px;
   position: relative;
}

nav ul > li > a {
   color: #444;
   text-decoration: none;
   font-size: 14px;

}

nav ul > li > a:hover {
   background-color: #55d6aa;
}

nav ul > li > a::before {
   content: "";
   display: block;
   height: 5px;
   width: 100%;
   background-color: #444;
   position: absolute;
   top: 0;
   width: 0%;
   transition: all ease-in-out 250ms;
}

nav ul > li > a:hover::before {
   width: 100%;
}

.subtitle{
   background: #55d6aa;
}

/* prefect image displace for any screen */
img{
   max-width: 100%;
   height: auto;
   width: auto\9;
}


.detail_container> h2{
   width: 100%;
   margin:20px 10 10px 30;
   border-radius: 12px;

}

.detail_container> h3{
   width: 100%;
   margin:20px 10 10px 30;
   border-radius: 12px;

}

.detail_container> h4{
   width: 100%;
   margin:20px 10 10px 30;
   border-radius: 12px;

}

.detail_container> p{
   width: 100%;
   margin:20px 10 10px 30;
   border-radius: 12px;

}

.errorlist
    {
        color: 38b03a;
        font-size: 1.25em;
    }