*{box-sizing: border-box; margin: 0; padding: 0;}
html {
      height: 100%;
    }
    body {
      background: #f1f1f2;
      padding: 0;
      text-align: center;
      font-family: 'open sans';
      position: relative;
      margin: 0;
      height: 100%;
    }
a{text-decoration: none;}
ul{list-style-type: none;}
.colorwhite{color: #fff;}
.test-border{border: 1px solid #fff;}
.texttoupper{text-transform: uppercase;}
.fontsize-small{font-size: 0.8em;}

.bg{height: 100vh;
     background-attachment: fixed;
     background-position: bottom;
     background-repeat: no-repeat;
    background-size: cover;}
.headerbg{background-image: url(../images/headerbg.jpg);}
 .overlay {
     height: 100%;
     width: 100%;
     background-color: rgb(0, 0, 0);
     background-color: rgba(0, 0, 0, 0.55);
     overflow-x: hidden;
 }
.logo-nav-content{display: grid; grid: auto auto/1fr; grid-gap: 40px; margin-top: 25px;}
/*.nav{align-self: center;}*/

.logo{display: grid; grid: 1fr auto/1fr; width: 200px; place-items: center; grid-gap: 10px; margin-left: 10px; justify-self: center;}


.nav-bar{display: grid; grid: 1fr 1fr 1fr 1fr/1fr; width: 95%; margin: 0 auto; justify-items: center; grid-gap: 15px; position: relative; top: 50px;}
/*.nav-li4{margin-right: 25px;}*/
/*.headerh1{position: relative; top: 300px; text-align: center; font-size: 60px; font-family: 'open sans';}*/
.headerh1 {
     color: #fff;
     position: relative;
     top: 90px;
     text-transform: capitalize;
     font-family: 'Open Sans';
     font-size: 50px;
     font-weight: 100;
 }