*{
  box-sizing: border-box;
}

/* Style the body */
body {
  font-family: Arial;
  margin: 0;
}

/* Header   */
.header {
  background: #f1f1f1;  
  display: flex;
  flex-wrap: wrap; 
  justify-content: center; 
  padding: 20px 0px 0px 0px;
}

.header_left {
  background: #f1f1f1;
  width: 90px;
  padding: 10px;
}

.header_right {
  width: 400px;
  text-align: center;
  background: #f1f1f1;
  color: #18316e; 
  line-height: 0.1;
}

/* Style the top navigation bar */
.navbar_container {
  display: flex;
  justify-content: center;
  background-color: #f1f1f1;
}


.navbar {  
  text-align: center;
  text-decoration: none;
  display: inline-block;
  margin: 0px 25px;
  font-size: 18px;
  cursor: pointer;
  border-radius: 10px;
  transition: 0.5s;
}
/* Style the navigation bar links*/
.navbar a {
  color: white;
  padding: 10px 30px;
  text-decoration: none;
  text-align: center;
  display: inline-block;
}

/* Column container */
.row {  
  display: flex;
  flex-wrap: wrap; 
  justify-content: center;
  background-color: #f1f1f1; 
}

/* Create two columns that sits next to each other */
/* Sideshow/left column */
.side {
  flex: 50%;
  background-color: #f1f1f1;
  padding: 0px 0px 0px 40px;
}

/* Main column */
.main {
  flex: 50%;
  background-color: #f1f1f1;
  padding: 10px;
  font-family: Helvetica, sans-serif;
  font-size: 16px;
  color: #555555;
}

/* Style the centre Image */
   img {
    border-radius: 5%;
    width: 525px;
    height: 525px;
 }
/* style of button */
 .button {
  border: 2px solid white;
  color: white;
  padding: 47px 35px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 20px;
  margin: 50p 4px 5px 2px;
  cursor: pointer;
  border-radius: 90px;
  transition: 0.5s;
}

  .buttonsubmit {
   background-color: #86af00;
}
  .buttontrack {
   background-color: #0087fd;
}
  .buttonupdate {
   background-color: #980095;
}
  .buttonhome {
   background-color: #ff4781;
}
  .buttonimp {
   background-color: #6F00FF;
}

  .buttonh:hover {
  box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 12px 16px 0 rgba(0,0,0,0.19);
  opacity: 0.5;
}
.button a {
  text-decoration: none;
}

/* Footer */
.footer {
    background-color: #f8f8f8;
    width: 100%;
    padding: 40px;
}

/* Footer table style */
table {
  border-collapse: collapse;
  width: 100%;
}

table, th, td {
  border: 1px solid #f8f8f8;
  text-align: center;
}

th {
  font-size: 15px;
}

td {
  vertical-align: top ;
  color: #454545 ;
  font-size: 12px;
}

.footer_1 {
    background-color: #f8f8f8;
    width: 100%;
    padding: 0px 0px 60px 0px;
    color: #18316e;
    font-size: 36px;
    text-align: center;
}
/* Responsive layout - when the screen is less than 700px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 1000px) {
  .row, .navbar {   
    flex-direction: column;
  }
}