body, html{
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background: #08101d;
}

*, *:before, *:after {
  box-sizing: inherit;
}

a, a:active, a:focus {
   outline: none;
}

html{
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body{
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-style: #7db0ff;
    position: fixed;
  }

  img {
    max-width: 100%;
  }

article, aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{
  display:block;
}
audio,canvas,progress,video{
  display:inline-block;
  }

progress{vertical-align:baseline}
audio:not([controls]){display:none;height:0}[hidden],template{display:none}
a{
  background-color:transparent;
  -webkit-text-decoration-skip:objects;
}
a:active,a:hover{
  outline-width:0
  }

abbr[title]{
  border-bottom:none;
  text-decoration:underline;
  text-decoration:underline dotted;
}

header, nav, footer, section, article, div {
  box-sizing: border-box;
}

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


  /*
   *
   * Header
   *
   */

header {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
  min-height: 50px;
  transition: min-height 0.3s;
  margin: inherit;
  background: #0f1928;
  }

  .header_logo {
    height: 200px;
    display: block;
    margin: -80px auto;


  }

  /*
   *
   * navigation bar
   *
   */

.nav {

    position: fixed;
    z-index: 1;
    top: 3.3em;
    margin-bottom: 0px;
    margin-top: auto;
    float: left;
    width:100%;
    content: inherit;

    }

    .nav__menu {
      width: 100%;
      padding: 0;
      margin: 0;
      margin-bottom: 0px;
      padding-top: 3.2em;
    }

    .nav__item {
      box-sizing: border-box;

      display: inline-block;
      width: 19.5%;
      text-align: center;
      line-height: 100px;
      border-radius: 10%;
      text-transform: uppercase;
    }
    .nav a {
      text-decoration: none;
      color: #f4f4f4;
      padding: 1.5em;
    }

    .nav a:hover {
      text-decoration: none;
      color: #6599ed;
     }


     /*
      *
      * Main
      *
      */



main {
       height: inherit;
       width: 100%;
       height: 800px, auto;
       position: 0%;
       top: 0%;
       background-size: cover;
     }

.slider {
        top: 81px;
         display: block;
         margin: auto;
         width: 100%;
         height: 100%;
         overflow: hidden;
         position: relative;
         float: left;
         text-align: center;
}

.slider img {
          height: auto;
          width: auto;
          max-height: 800px;
          position: relative;

}

         .slide {
             position: absolute;
             display: block;
             width: auto;
             height: 100%;
             max-height: 100%;
             animation: slide 30s infinite;
             overflow: hidden;

         }

         .slide:nth-child(1) {
             left: 0%;
             animation-delay: -0.5s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }

         .slide:nth-child(2) {
             left: 100%;
             animation-delay: 2s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }

         .slide:nth-child(3) {
             left: 100%;
             animation-delay: 4.5s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }

         .slide:nth-child(4) {
             left: 100%;
             animation-delay: 7s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }

         .slide:nth-child(5) {
             left: 100%;
             animation-delay: 9.5s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }

         .slide:nth-child(6) {
             left: 100%;
             animation-delay: 12s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }

         .slide:nth-child(7) {
             left: 100%;
             animation-delay: 14.5s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }

         .slide:nth-child(8) {
             left: 100%;
             animation-delay: 17s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }

         .slide:nth-child(9) {
             left: 100%;
             animation-delay: 19.5s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }

         .slide:nth-child(10) {
             left: 100%;
             animation-delay: 22s;
             background-size: cover;
             background-position: center;
             background: #08101d;
         }



     @keyframes slide {
         0% {
             left: 100%;
             width: 100%;
         }
         5% {
             left: 0%;
         }
         25% {
             left: 0%;
         }
         30% {
             left: -100%;
             width: 100%;
         }
         31% {
             left: -100%;
             width: 0%;
         }
         100% {
             left: 100%;
             width: 0%;
         }
     }



     /*
      *
      * ______________________________________________________________
      *
      */
      /* Viewport - Screensizes */
      @media screen and (max-width: 379px) {

        .nav {
           font-size: 8px;
            }
            .nav__item {
              border-radius: 6%;
              width: 19%;
            }

            .nav a {
              padding: 0.4em;
            }
     }

      @media screen and (max-width: 549px) {

           header {
            min-height: 120px;
          }

        .nav {
           position: fixed;
            z-index: 1;
            top: 3em;
           font-size: 9px;
            }

            .nav__menu {
              width: 100%;
              padding: 0;
              margin: 0;
              margin-bottom: 0px;
              padding-top: 3.2em;
            }

            .nav__item {
              line-height: 160px;
              border-radius: 8%;
           }
            .nav a {
              padding: 1em;
            }



        .preston {

            height: 350px;
             }


       .media {
               left: 3%;
             }

             .media ul{
               line-height: 40px;
             }

             .media a {
               font-size: 21px;
               padding: 20px 20px;
               color: #292929;
               padding: 1.3em;
             }

              .media ul, span {
                top: 20px;
                height: 20px;
                line-height: 5px;
                transform: translateX(-110%) translateY(-5px);
                color: #fff;
                font-size: 16px;
              }


      }

      @media screen and (min-width: 550px) {

        .nav {
           position: fixed;
            z-index: 1;
            top: 3em;
           font-size: 12px;
            }

            .nav__menu {
              width: 100%;
              padding: 0;
              margin: 0;
              margin-bottom: 0px;
              padding-top: 3.2em;
            }

            .nav__item {
              line-height: 160px;
              border-radius: 8%;
           }
            .nav a {
              padding: 1em;
            }


            .preston {

                height: 350px;
                 }

     }

     @media screen and (min-width: 700px) {
      .preston {
          height: 450px;
           }

      }

      @media screen and (min-width: 850px) {

        main, .nav{
          margin-left: auto;
          margin-right: auto;
          }

        .preston {
            height: 750px;
             }

        }