/* Header CSS Start */
:root {
  --color-white-100: white;
  --color-white-200: #f4f5f5;
  --color-white-300: #c9cccf;
  --color-white-400: #a1a6aa;
  --color-white-500: #798086;
  --color-black-100: #12161c;
  --color-black-200: #101419;
  --color-black-300: #0c0f13;
  --color-black-400: #0c0f13;
  ca --color-black-500: #080a0c;
  me --color-red-100: #ffccd5;
  --color-red-200: #ffa3b4;
  --color-red-300: #ff6682;
  --color-red-400: #ff385d;
  --color-red-500: #ff002f;
  --shadow-small: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  --shadow-medium: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-large: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* Overlay Starts */

#Overlay {
  display: none;
  visibility: hidden;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.5);

  height: 100%;
  z-index: 999;
  position: absolute;
}

/* Overlay Ends */
*,
*::before,
*::after {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  list-style: none;
  list-style-type: none;
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

html {
  font-size: 100%;
  box-sizing: inherit;
  scroll-behavior: smooth;
  height: -webkit-fill-available;
}

body {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  height: -webkit-fill-available;
  color: var(--color-black-500);
  /*background-color: var(--color-white-100);*/
  background-color: #F5F4F4;
}

main {
  overflow: hidden;
}

a,
button {
  cursor: pointer;
  user-select: none;
  border: none;
  outline: none;
  background: none;
  box-shadow: none;
  text-decoration: none;
}

img,
video {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.section {
  margin: 0 auto;
  padding: 5rem 0 1rem;
}

.container {
  max-width: 80rem;
  height: auto;
  margin: 0 auto;
  padding: 0 1.25rem;
}

.centered {
  text-align: center;
  vertical-align: middle;
  margin-bottom: 1rem;
}

.btn {
  display: inline-block;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  user-select: none;
  outline: none;
  border: none;
  border-radius: 0.25rem;
  text-transform: unset;
  transition: all 0.3s ease-in-out;
}

.btn-darken {
  padding: 0.75rem 2rem;
  color: var(--color-white-100);
  background-color: var(--color-black-200);
  box-shadow: var(--shadow-medium);
}

.btn-neutral {
  padding: 0.75rem 2rem;
  color: var(--color-black-500);
  background-color: var(--color-white-100);
  box-shadow: var(--shadow-medium);
}

.header {
  position: relative;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  height: auto;
  margin: 0 auto;
  background: var(--color-white-100);
  box-shadow: var(--shadow-medium);
}

.navbar {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  align-content: center;
  height: auto;
  padding-top: 0.5rem;
}

.brand {
  justify-self: start;
  font-family: inherit;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -1px;
  text-transform: uppercase;
  color: var(--color-red-400);
}

.search {
  grid-column: span 2;
  order: 3;
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding-block: 1rem;
}

.search-form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 100%;
  width: 100%;
  height: auto;
  padding-inline: 1.5rem;
  border-radius: 3rem;
  background: var(--color-white-200);
}

.search-input {
  display: block;
  font-family: inherit;
  font-size: 1rem;
  text-align: center;
  font-weight: normal;
  line-height: inherit;
  width: 100%;
  height: 100%;
  padding-block: 0.75rem;
  border: none;
  outline: none;
  color: var(--color-black-500);
  background: transparent;
}

.search-submit {
  display: block;
  font-size: 1.25rem;
  line-height: 1.5;
  margin-top: 0.25rem;
  color: var(--color-white-500);
  background: transparent;
}

.menu {
  position: fixed;
  top: -100%;
  left: 0;
  width: 100%;
  height: auto;
  overflow: hidden;
  padding-block: 3rem 2rem;
  background: var(--color-white-100);
  box-shadow: var(--shadow-medium);
  transition: all 0.45s ease-in-out;
}

.menu.is-active {
  top: 0;
  width: 100%;
  height: inherit;
}

.menu-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 1.25rem;
}

.menu-link {
  font-family: inherit;
  font-size: 1rem;
  font-weight: 500;
  line-height: inherit;
  text-transform: uppercase;
  color: var(--color-black-500);
  transition: all 0.35s ease-in-out;
}

.menu-link:hover {
  outline: none;
  color: var(--color-red-400);
}


.burger {
  position: relative;
  display: block;
  justify-self: end;
  cursor: pointer;
  user-select: none;
  z-index: 10;
  width: 1.75rem;
  height: 1rem;
  border: none;
  outline: none;
  background: none;
  visibility: visible;
  transform: rotate(0deg);
  transition: 0.35s ease;
}

.burger-line {
  position: absolute;
  display: block;
  right: 0;
  width: 100%;
  height: 2px;
  border: none;
  outline: none;
  opacity: 1;
  transform: rotate(0deg);
  background-color: var(--color-black-100);
  transition: 0.25s ease-in-out;
}

.burger-line:nth-child(1) {
  top: 0px;
}

.burger-line:nth-child(2) {
  top: 0.5rem;
}

.burger-line:nth-child(3) {
  top: 1rem;
}

.burger.is-active .burger-line:nth-child(1) {
  top: 0.5rem;
  transform: rotate(135deg);
}

.burger.is-active .burger-line:nth-child(2) {
  right: -1.5rem;
  opacity: 0;
  visibility: hidden;
}

.burger.is-active .burger-line:nth-child(3) {
  top: 0.5rem;
  transform: rotate(-135deg);
}

.search-list {
  display: none;
  position: absolute;
  background: white;
  height: 200px;
  width: 92%;
  overflow-y: scroll;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  border: outset;
}

.search-list li {
  padding: 5px;
}

.search-list li:hover {
  background: #878787;
  color: white;
  padding: 5px;
}

@media only screen and (min-width: 576px) {
  .menu {
    position: relative;
    justify-self: end;
    top: 0;
    left: inherit;
    width: auto;
    height: auto;
    padding-block: 0;
    background: none;
    box-shadow: none;
    transition: none;
  }

  .menu-inner {
    display: flex;
    flex-direction: row;
    column-gap: 1.25rem;
    margin: 0 auto;
  }

  .menu-link {
    text-transform: capitalize;
  }

  .burger {
    display: none;
    visibility: hidden;
  }

  .search-list {
    width: 90%;
  }
}

@media only screen and (min-width: 992px) {
  .navbar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    height: 4.25rem;
    padding-top: 0;
    margin: 0 auto;
  }

  .search {
    justify-self: center;
    grid-column: initial;
    order: initial;
    width: 100%;
    height: auto;
  }

  .search-list {
    width: 27%;
  }

  .search-form {
    max-width: 30rem;
  }
}

/* Header CSS End */

/* Content Wrapper Start */
.content-wrapper {
  height: 100%;
  position: fixed;
  background: #fff;
  padding: 20px;
  width: 100%;
  overflow: auto;
}

.content-wrapper {
  transition: all 300ms;
}

.content-wrapper {
  position: relative;
  background: #f4f5f5;
  margin-top: 10px;
  margin-bottom: 10px;
}

.content {
  width: 98%;
  /*min-height: 90%;*/
  background: #fff;
  border-radius: 10px;
  padding: 30px;
  margin-right: auto;
  margin-left: auto;
  margin-top: 1%;
  box-shadow: var(--shadow-large);
}

/* Content Wrapper End */

/* Footer Start */

.footer {

  background-color: #FFFFFF;
  overflow: auto;
  position: relative;
  width: 100%;
  height: auto;
  bottom: 0;
  left: 0;
  box-shadow: 0 -5px 6px rgb(0 0 0 / 10%);
}

.footer-content-wrapper {
  width: 80%;
  margin: 1em auto;
}

.footer-col {
  display: inline-block;
  padding: 0.5em 0.1em 0.5em 1em;
  box-sizing: border-box;
  /*border-right: solid 1px #bbb;*/
}


.ta-l {
  text-align: left;
}

.flt {
  float: left;
}


.large-25 {
  width: 25%;
}

.footer-col a {
  display: block;
  margin: 0.3em 0;
}

a {
  text-decoration: none;
  color: black;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

@media (max-width: 550px) {
  .small-50 {
    width: 50%;
  }

  .footer-col:nth-child(2) {
    border: none;
  }
}

@media (max-width: 300px) {
  .tiny-100 {
    width: 100%;
  }

  .footer-col {
    border: none;
  }
}

/* Footer End *0


/* Above Content Start */
.Above_Content {
  display: flex;
  flex-direction: row;
}

@media only screen and (max-width: 576px) {
  .Above_Content {
    flex-direction: column;
    align-content:center;
  }

  .Above_Content .search-form {
    max-width: 100%;
    min-width: 97%;
    height: 30px;
    padding-inline: 1rem;
  }

  .Above_Content .search-input {
    font-size: 0.75rem;
  }

  .Above_Content .search-submit {
    font-size: 1rem;
    line-height: 1.25;
  }

  .Above_Content .Add_Button {
    width: 97%;
    height: 30px;
    font-size: 12px;
    white-space: nowrap;
    margin:auto;
  }


}



.Above_Content .search_process {
  /* grid-column: span 2; */
  width: 100%;
  height: 70px;
  margin-left: 1%;
  display: inherit;
  margin-left: 1%;
  align-items: center;
}

.Above_Content .search-form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 100%;
  width: 200px;
  float: left;
  margin-left: 0;
  border: solid 1px green;
  border-radius: 15px;
  outline: green;
  height: 40px;
  padding-inline: 1.5rem;
  border-radius: 3rem;
  background: white;

}

.Above_Content .search-input {
  display: block;
  font-family: inherit;
  font-size: 1rem;
  text-align: center;
  font-weight: normal;
  line-height: inherit;
  width: 100%;
  height: 100%;
  color: var(--color-black-500);
  background: white;
}

.Above_Content .search-submit {
  display: block;
  font-size: 1.25rem;
  line-height: 1.5;
  margin-top: 0.25rem;
  color: var(--color-white-500);
  background: white;
}

.Above_Content .Add_Button {
  background-color: green;
  border: solid 1px green;
  border-radius: 5px;
  color: white;
  height: 45px;
  padding: 10px 10px;
  margin-left: auto;
  margin-top: 1%;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  font-weight: bolder;
  white-space: nowrap;
}


/* Above Content ends */

/* Card View Start */


.Card_View {
  display: flex;
  flex-direction: column;
  border-radius: 25px;
  border: 1px solid #F5F4F4;
  margin-right: auto;
  margin-left: auto;
  width: 98%;
  padding: 10px;
  margin-bottom: 3%;
  box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 10%), 0px 5px 10px 5px rgb(0 0 0 / 10%);
}

.Card_View_Row {
  display: flex;

}

.Card_View_Row h3 {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}

.Card_View_Row input {
  border: 1px solid transparent;
  text-align: center;
  border-radius: 10px;
  background-color: white;
  padding: 10px;
  height: 30px;
  border: 1px solid;
  width: 100px;
  font-size: 16px;
}

.Card_View_Row button img {
  width: 25px;
  display: block;
  position: relative;
  margin-left: 10px;
  height: 25px;
  margin-bottom: 15px;
}

.Card_View_Row p:nth-child(1) {
  display: flex;
  flex-direction: column;
  margin-left: 1px;
  min-width: 50%;
  max-width: 50%;
  padding: 0px 5px 0px 5px;
}

.Card_View_Row p:nth-child(2) {
  display: flex;
  flex-direction: column;
  margin-left: auto;
  margin-right: 1px;
  padding: 0px 5px 0px 5px;
}

.Card_View_Row_Last {
  margin-right: auto;
  margin-left: auto;
  white-space: nowrap;
  display: flex;
  margin-bottom: 0;
  margin-top: auto;
}

.Card_View_Row_Last .Card_View_Negative_Button {
  background-color: red;
  border: solid 1px red;
  border-radius: 15px;
  color: white;
  padding: 10px 10px;
  margin-left: auto;
  margin-right: 10px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  font-weight: bolder;
}

.Card_View_Row_Last .Card_View_Positive_Button {
  background-color: midnightblue;
  border: solid 1px midnightblue;
  border-radius: 15px;
  color: white;
  padding: 10px 10px;
  margin-left: 10px;

  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  font-weight: bolder;
}

/*@media only screen and (max-width: 408px) {
    .Card_View_Row p:nth-child(2){
        min-width: 50%;
        max-width: 50%;
        
    }
}*/


@media only screen and (max-width: 504px) {

  .Card_View {
    display: block;
    width: 100%;
  }

  .Card_View_Row {
    display: flex;

  }

  .Card_View_Row p:nth-child(1) {
    white-space: nowrap;
  }

}

.Card_View_Table .Card_View_Negative_Button {
  /*background-color: red;
    border: solid 1px red;*/
  border-radius: 25px;
  color: white;
  /*padding: 10px 10px;*/
  margin-left: auto;
  margin-right: auto;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  font-weight: bolder;
}

.Card_View_Table .Card_View_Negative_Button img {
  height: 25px;
}

.Card_View_Table .Add_Button {
  border-radius: 25px;
  color: white;
  /*padding: 10px 10px;*/
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  font-weight: bolder;
}

.Card_View_Table .Add_Button img {
  height: 25px;
}


.Card_View_Table {
  margin-top: 1%;
  margin-bottom: 1%;
  width: 98%;
  /*display:none;*/
  border-radius: 5px;
  margin: solid 1px #428bca;
  border-collapse: collapse;
  overflow: hidden;
  text-align: center;
  white-space: nowrap;
}



.sort-arrows {
  position: relative;

}

.sort-arrows::before {
  content: "▲";
  color: #000000;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  right: 10px;
  top: 6px;
}

.sort-arrows.asc::before {
  color: #FFFFFF;
}

.sort-arrows.desc::after {
  color: #FFFFFF;
}

.sort-arrows::after {
  content: "▼";
  color: #000000;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  right: 10px;
  bottom: 6px;
}

.Card_View_Table th {
  padding: 10px;
}

.Card_View_Table th div img {
  height: 25px;
  width: 25px;
  margin-Right: 5%;
}

.Card_View_Table th div {
  display: flex;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}

.Card_View_Table td {
  padding: 10px;
}

.Card_View_Table tr:first-child {
  border-top: none;
  background: #428bca;
  color: #fff;
}

.Card_View_Table tr {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  background-color: #f5f9fc;
}

.Card_View_Table tr:nth-child(odd):not(:first-child) {
  background-color: #ebf3f9;
}

.Elements_Row {
  display: flex;
  overflow-x: auto;
  overflow-y: auto;
  margin-left: 2%;
}

.Card_View_Dynamic_Elements {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  overflow-x: auto;
  display: none;
}

.Card_View_Dynamic_Elements select {
  font-size: 14px;
  text-align: center;
  border-radius: 10px;
  background-color: white;
  padding: 5px;
  height: 30px;
  border: 1px solid;
  width: 175px;
  font-size: 16px;
  margin-left: 2%;

}

.Card_View_Dynamic_Elements .Go_Button {
  background-color: #428bca;
  border: solid 1px #428bca;
  border-radius: 100px;
  color: white;
  height: 30px;
  width: 30px;
  margin-right: auto;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  font-weight: bolder;
  white-space: nowrap;

}

.Elements_Row_Insert {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.Elements_Row_Insert .search {
  /* grid-column: span 2; */
  width: 50%;
  height: 70px;
  margin-right: 3%;
}

.Elements_Row_Insert .search-form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 200px;
  min-width: 200px;
  margin-right: 1%;
  margin-left: auto;
  border: solid 1px midnightblue;
  border-radius: 15px;
  outline: midnightblue;
  height: 40px;
  padding-inline: 1.5rem;
  border-radius: 3rem;
  background: white;
}

.Elements_Row_Insert .search-input {
  display: block;
  font-family: inherit;
  font-size: 1rem;
  text-align: center;
  font-weight: normal;
  line-height: inherit;
  width: 100%;
  height: 100%;
  color: var(--color-black-500);
  background: white;
}

.Elements_Row_Insert .search-submit {
  display: block;
  font-size: 1.25rem;
  line-height: 1.5;
  margin-top: 0.25rem;
  color: var(--color-white-500);
  background: white;
}


.Card_View_Dynamic_Elements .Card_View_Positive_Button {
  background-color: white;
  border: solid 1px midnightblue;
  border-radius: 5px;
  color: midnightblue;
  /*display:none;*/
  padding: 10px 10px;
  margin-left: 10px;
  margin-top: 1%;
  margin-bottom: 1%;
  text-align: center;
  text-decoration: none;
  font-size: 14px;
  font-weight: bolder;
}

.Card_View_Table input {
  border: 1px solid transparent;
  text-align: center;
  border-radius: 10px;
  background-color: white;
  padding: 10px;
  height: 30px;
  width: 150px;
  font-size: 16px;
}

.Card_View_Table input[type="checkbox"] {
  border: 1px solid transparent;
  text-align: center;
  border-radius: 10px;
  background-color: white;
  padding: 10px;
  height: 15px;
  width: 15px;
  font-size: 16px;
}

.Card_View_Table_Nav {
  display: flex;
  width: 99%;
  flex-direction: row;
  justify-content: space-between;

}

.Card_View_Table_Nav_Go {
  display: flex;
}

.autocomplete {
  position: relative;
  display: inline-block;
}

.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  top: 100%;
  left: 0;
  right: 0;
}

.autocomplete-items div {
  width: 350px;
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #d4d4d4;
  margin-left: auto;
  margin-right: auto;
}

/*when hovering an item:*/
.autocomplete-items div:hover {
  background-color: #e9e9e9;
}

/*@media only screen and (max-width: 408px) {
    .Card_View_Row p:nth-child(2){
        min-width: 50%;
        max-width: 50%;
        
    }
}*/
/* Card View End */

/* Popup Content Starts */
.Popup {
  position: relative;
  margin: 0;

  top: 40%;
  border-radius: 15px;
  width: 250px;
  max-width: 98%;
  margin: auto;
  background: #fff;
  padding: 10px;
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -1px rgb(0 0 0 / 6%);

}

#Popup_Title {
  text-align: center;
}

#Popup_Elements {
  text-align: center;
  margin-top: 3%;
  /* max-width: 100%; */
}

#Popup_Elements input[type="text"] {
  max-width: 90%;
  height: 40px;
  min-width: 90%;
  margin-top: 20px;
  font-family: inherit;
  font-size: 1rem;
  text-align: center;
  font-weight: normal;
  border: none;
  border-radius: 15px;
  background: #f5f4f4;

}

#Popup_Elements select {
  text-align-last: center;
  max-width: 90%;
  height: 40px;
  min-width: 90%;
  margin-top: 20px;
  font-family: inherit;
  font-size: 1rem;
  text-align: center;
  font-weight: normal;
  border: none;
  border-radius: 15px;
  background: #f5f4f4;

}

#Popup_Elements input[type="text"]:focus {
  outline: none;
}

#Popup_Buttons {
  text-align: center;
  margin-top: 10%;
  margin-bottom: 1%;
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  display: flex;
}

.Popup_Button_Negative {
  color: red;
  font-weight: bolder;
  position: relative;
  display: block;

}

.Popup_Button_Positive {
  color: #4CAF50;
  font-weight: bolder;
  background: white;
  border: none;
  position: relative;
  display: block;
  margin-right: 0;
  margin-left: auto;
  position: relative;
  display: block;
}

/* Popup Content ends */
/* Pagination starts*/
.pagination {
  float: right;
}

.pagination ul {
  display: flex;
  flex-wrap: nowrap;
  background: #ebf3f9;
  border-radius: 50px;
}

.pagination ul li {
  color: black;
  list-style: none;
  line-height: 35px;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  user-select: none;
  transition: all 0.3s ease;
}

.pagination ul li.numb {
  list-style: none;
  height: 35px;
  width: 35px;
  margin: 0 3px;
  line-height: 35px;
  border-radius: 50%;
}

.pagination ul li.numb.first {
  margin: 0px 3px 0 -5px;
}

.pagination ul li.numb.last {
  margin: 0px -5px 0 3px;
}

.pagination ul li.dots {
  font-size: 22px;
  cursor: default;
}

.pagination ul li.btn {
  padding: 0 20px;
  border-radius: 50px;
}

.pagination li.active,
.pagination ul li.numb:hover,
.pagination ul li:first-child:hover,
.pagination ul li:last-child:hover {
  color: #fff;
  background: midnightblue;
}

@media only screen and (max-width: 576px) {
  .content-wrapper {
    height: 100%;
    position: fixed;
    background: #fff;
    padding: 2px;
    width: 100%;
    overflow: auto;
  }

  .content-wrapper {
    transition: all 300ms;
  }

  .content-wrapper {
    position: relative;
    background: #f4f5f5;
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .content {
    width: 100%;
    background: #fff;
    border-radius: 10px;
    padding: 10px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 1%;
    box-shadow: var(--shadow-large);
  }


  .Card_View_Table_Nav {
    flex-direction: column;
  }

  .Elements_Row_Insert {
    flex-direction: column;
    align-items: inherit;
  }

  .Card_View_Table_Nav_Go {
    display: flex;
    margin: auto;
  }

  .Card_View_Dynamic_Elements .Card_View_Positive_Button {
    background-color: white;
    border: solid 1px midnightblue;
    border-radius: 5px;
    color: midnightblue;
    width: 99%;
    padding: 10px 10px;
    margin-left: auto;
    margin-top: 1%;
    margin-bottom: 2%;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    font-weight: bolder;
  }

  .Card_View_Table_Nav select {
    margin-top: 10px;
    margin-bottom: 10px;

  }

  .Card_View_Dynamic_Elements .Go_Button {
    margin-top: 10px;
  }

  .Elements_Row_Insert .search-form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 99%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 2%;
    border: solid 1px midnightblue;
    border-radius: 15px;
    outline: midnightblue;
    height: 40px;
    padding-inline: 1.5rem;
    border-radius: 3rem;
    background: white;
  }

  .pagination {
    margin-top: 10px;
    width: 99%;
  }

  .pagination ul li {
    color: black;
    list-style: none;
    line-height: 25px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    user-select: none;
    transition: all 0.3s ease;
  }

  .pagination ul {
    margin-bottom: 10px;
    display: flex;
    flex-wrap: nowrap;
    background: #ebf3f9;
    border-radius: 50px;
    width: fit-content;
    margin-right: auto;
    margin-left: auto;
  }

  .pagination ul li.numb {
    list-style: none;
    height: 25px;
    width: 25px;
    margin: 0 3px;
    line-height: 25px;
    border-radius: 50%;
  }

  .pagination ul li.btn {
    padding: 0 10px;
    border-radius: 50px;
  }

}

/* Pagination Ends*/