@font-face {
  font-family: Righteous;
  src: url(Righteous-Regular.ttf);
}

* {
   font-family: Righteous;
   margin: 0px;
   padding: 0px;
}

body {
  margin: 0px;
  padding: 0px;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-image: linear-gradient(to bottom right, #eaf2f8, #fff);
  background-size: 100% 100%;
}

.logo {
    width:50px;
}


#input_container { 
    position:relative;
    padding:0;
    margin:0;
}
#input { 
    height:30px;
    width: 400px;
    margin:0;
    padding-left:45px;
    border-radius: 15px;
}
#input_img {
    position:absolute;
    bottom:8px;
    left:20px;
    width:20px;
    height:20px;
}

.nav_container {
  background-image: linear-gradient(to bottom right, #2874a6, #5dade2);
}

.banner {
  margin: auto;
  width: 100%;
  height: 400px;
  line-height: 400px;

  display: flex;

  justify-content: center;

  text-align: center;
  vertical-align: middle;
}

.banner::before {

  content: "";
  background-image: url("https://systemgridinc.com/images/technologybanner.jpg");
  background-size: cover;
  position: absolute;
  height: 400px;
  right: 0px;
  left: 0px;
  opacity: 0.52;


}

h1 {
  position: relative;
  color: #fff;
}

img.box {
    width: 60px;
}

table.boxes {
    border-spacing: 10px;
    margin-left: auto;
    margin-right: auto;
}

td.box {
    border: 2px solid #2874a6;
    width: 200px;
    height: 300px;
    text-align: center;
}