﻿@media screen and (max-width: 1600px) {
    
   #search-bar {
                margin-left: 65%;
}
}

@media screen and (max-width: 1500px) {
    
   #search-bar {
                margin-left: 64%;
}
}

@media screen and (max-width: 1400px) {
    
   #search-bar {
                margin-left: 60%;
}
}

@media screen and (max-width: 1300px) {
    
         .top-navigation-tabs a {
            font-size: 95%;
}
        .box-wrap {
         top: -7px;
}
}

@media screen and (max-width: 1200px) {
    
   #search-bar {
                margin-left: 55%;
}

            .top-navigation-tabs a {
            font-size: 90%;
}
        .box-wrap {
         top: -8px;
}
}

@media screen and (max-width: 1100px) {
    
   #search-bar {
                margin-left: 50%;
}
}

@media screen and (max-width: 947px) {
    
       #search-bar {
                 margin-left: 40%;
}
}

@media screen and (max-width: 900px) {   
   .top-navigation-tabs a {  
                font-size: 80%;
}
   .box-wrap {
        top: -9px;
}
   .search-new { 
                font-size: 10pt;
}
   .button-new {
                font-size: 10pt;
}
}

@media screen and (max-width: 821px) {
    
      .top-navigation-tabs a {

    font-size: 70%;
}
            .homelink a {
    font-size: 100%;
}
    .leftlinks {
        font-size: 100%;
}
    #search-bar {
        margin-left: 50%;
    }

             .search-new { 
                font-size: 8pt;
}
      .button-new {
                font-size: 8pt;
}
    
      .box-wrap {
    top: -12px;
}
         .siteTitle {
       font-size: 200%;
   }

}

@media screen and (max-width: 750px) {
    
      .top-navigation-tabs a {

    font-size: 65%;
}
   #search-bar {

                margin-left: 50%;
}

     .box-wrap {
    top: -13px;
}
        
}


@media screen and (max-width: 720px) {

    p {
        font-size: 85%;
    }

    h1 {
        font-size: 115%;
    }

    .topnav {
        font-size: 70%;
        text-align: center;
    }

    .siteTitle_Mobile {
        font-family: 'Roboto', sans-serif;
        font-weight: 300;
        display: table;
        color: #fff;
        background-color: #063;
        font-size: 32pt;
        text-align: center;
        text-decoration: none !important;
        padding-left: 12%;
    }

    header {
        background-color: #063;
    }
        

    #header {
        background-color: #063;
    }

    .box-wrap {
        border: 0px;
    }

    #hc_Header {
        display: inline;
        height: 0px;
        background-color: #063;
    }

    #hc_HeaderRight {
        display: none;
    }

    .top-navigation-tabs {
        display: none;
    }

#hc_Logo {
    background: none;
}

    #hc_Logo img {
    padding-top: 0px;
    margin: 0;
    margin-top: 0px;
}

    .siteTitle {
        display: none;
    }

    .footerdark {
        padding-top: 35px;
        font-size: 100%;
    }

    .column-one {
        margin-right: 30px;
    }
    
    .column-one-content {
    padding-top: 1px;

}

    .homelink a {
        font-size: 100%;
    }

    .leftlinks a {
        font-size: 95%;
    }

    .innercontainer {
        border: none;
        padding: 0;
    }

    .mobilemenu {
        display: block;
    }

    body {
        font-family: sans-serif;
        margin: 0;
        padding: 0;
        -webkit-transition: all 400ms ease;
        -moz-transition: all 400ms ease;
        -ms-transition: all 400ms ease;
        -o-transition: all 400ms ease;
        transition: all 400ms ease;
    }

    nav {
        margin-top: 0;
        margin-bottom: 15px;
        margin-left: auto;
        display: table;
        padding-bottom: 5px;
        padding-top: 0;
    }

        nav a {
            font-size: 22pt;
            color: #000;
            text-decoration: none;
        }

            nav a.title {
                padding: 10px;
                font-weight: bold;
            }

                        nav img {
                            left: 500px;
            }

        nav ul.menu {
            float: left;
            margin: 0;
            padding: 0;
            list-style-type: none;
            letter-spacing: -4px;
        }

            nav ul.menu li.menu-item {
                letter-spacing: normal;
                display: inline-block;
            }

                nav ul.menu li.menu-item a {
                    padding: 5px;
                    padding-top: 0px;
                    padding-left: 20px;
                    display: block;
                    font-size: 100%;
                }

        nav a.mobile-menu {
            display: none;
            float: right;
            height: 60px;
            width: 60px;
        }

    div.container {
        padding: 20px;
    }

    nav ul.menu {
        background: #3a3a3a;
        width: 330px;
        height: 100%;
        position: fixed;
        top: 0;
        right: -330px;
        -webkit-transition: all 400ms ease;
        -moz-transition: all 400ms ease;
        -ms-transition: all 400ms ease;
        -o-transition: all 400ms ease;
        transition: all 400ms ease;
    }

        nav ul.menu li.menu-item {
            display: block;
            border-bottom: 3px solid #353535;
        }

            nav ul.menu li.menu-item a {
                color: #FFF;
            }

    nav a.mobile-menu {
        display: block;
    }

    body.nav-open {
        margin-left: -330px;
        margin-right: 330px;
    }

        body.nav-open nav ul.menu {
            right: 0;
        }



    nav ul.menu li.menu-item-search .button-mobile {
        position: relative;
        padding: 8px 15px;
        border: 2.8px solid #212121;
        border-left: 1px solid #808080;
        background-color: #212121;
        color: #dbdbdb;
        outline-color: #063;
        font-size: 10pt;
    }

    nav ul.menu li.menu-item-search .search-mobile {
        padding: 10px 20px;
        background: #212121;
        color: #fff;
        border: 0 solid #dbdbdb;
        outline: none;
        font-size: 11pt;
    }

    nav ul.menu li.menu-item-search .button-mobile:hover {
        background-color: #191919;
    }

        nav ul.menu li.menu-item-search .search-mobile:hover {
        background-color: #191919;
        color: #fff;
    }

    .form-mobile {
        margin-left: 30px;
        margin-top: 15px;
    }

    .tabs a {
        font-size: 75%;
    }

    fieldset {
        font-size: 95%;
        padding: 0 0 0 0;
    }

        fieldset.dbSearch {
           margin-left: -26px;
    }

                ol {
           margin-left: -38px;
    }

    p.description {
        padding-bottom: 10px;
        width: 70%;
    }
   
    form select {
        width: 50%;
    }

    a.menu {
  float: right;
  width: 30px;
  height: 23px;
  overflow: hidden;
  transition: 0.3s;
  padding-left: 10px;
}
a.menu span {
  float: right;
  width: 45px;
  height: 4px;
  background-color: #fff;
  position: relative;
  top: 25px;
  left: -15px;
  transition: 0.3s;
}
a.menu span:before {
  content: '';
  width: 45px;
  height: 4px;
  background-color: #fff;
  position: absolute;
  top: -12px;
  left: 0;
}
a.menu span:after {
  content: '';
  width: 45px;
  height: 4px;
  background-color: #fff;
  position: absolute;
  bottom: -12px;
  left: 0;
}
a.menu.active {
  transform: rotate(360deg);
}
a.menu.active span {
  background-color: transparent;
}
a.menu.active span:before {
  top: 0;
  transform: rotate(-45deg);
}
a.menu.active span:after {
  bottom: 0;
  transform: rotate(45deg);
}

    div.column-three-right {
        display: none;
    }

    .resourceOuter_1 {
        float: none;
        width: auto;
    }

    .resourceOuter_2 {
        float: none;
        width: auto;
    }

#contactForm #message {
    width: 180px;
    height: 100px;
    font-size: 80%;
}

#contactForm input {
    width: 170px;
}

#contactForm p {
    font-size: 80%;
    width: 100%;
}

}

@media screen and (max-device-width: 500px) {

    p {
        font-size: 120%;
    }

    h1 {
        font-size: 220%;
    }

    .topnav {
        font-size: 180%;
        text-align: center;
    }

    .siteTitle_Mobile {
        display: table;
        font-family: 'century gothic', sans-serif;
        color: #fff;
        background-color: #063;
        font-size: 52pt;
        text-align: center;
        text-decoration: none !important;
        padding-left: 5%;
    }

    header {
        background-color: #063;
    }

    #header {
        background-color: #063;
    }

    #hc_Header {
        display: inline;
        height: 0px;
        background-color: #063;
    }

    #hc_HeaderRight {
        display: none;
    }

    .top-navigation-tabs {
        display: none;
    }

#hc_Logo {
    background: none;
}

    #hc_Logo img {
    padding-top: 0px;
    margin-left: 5px;
    margin-top: 0px;
}

        .box-wrap {
        margin-top: 8px;
        border: 0px;
    }

    .siteTitle {
        display: none;
    }


    .footerdark {
        padding-top: 40px;
        font-size: 225%;
    }

    .column-one {
        margin-right: 30px;
        margin-top: 10px;
        font-size: 0.7em;
    }

    .homelink a {
        font-size: 235%;
    }

    .leftlinks a {
        font-size: 180%;
        padding: 0;

    }

    .innercontainer {
        border: none;
    }

    .mobilemenu {
        display: block;
    }

    body {
        font-family: sans-serif;
        margin: 0;
        padding: 0;
        -webkit-transition: all 400ms ease;
        -moz-transition: all 400ms ease;
        -ms-transition: all 400ms ease;
        -o-transition: all 400ms ease;
        transition: all 400ms ease;
    }

    nav {
        margin-top: 0;
        margin-bottom: 0;
        margin-left: auto;
        display: table;
        padding-bottom: 5px;
        padding-top: 0;
    }

        nav a {
            font-size: 22pt;
            color: #000;
            text-decoration: none;
        }

            nav a.title {
                padding: 10px;
                font-weight: bold;
            }

        nav ul.menu {
            float: left;
            margin: 0;
            padding: 0;
            list-style-type: none;
            letter-spacing: -4px;
        }

            nav ul.menu li.menu-item {
                letter-spacing: normal;
                display: inline-block;
            }

                nav ul.menu li.menu-item a {
                    padding: 40px;
                    display: block;
                    font-size: 300%;
                }

        nav a.mobile-menu {
            display: none;
            float: right;
            height: 60px;
            width: 60px;
        }

    div.container {
        padding: 20px;
    }

    nav ul.menu {
        background: #3a3a3a;
        width: 730px;
        height: 100%;
        position: fixed;
        top: 0;
        right: -730px;
        -webkit-transition: all 400ms ease;
        -moz-transition: all 400ms ease;
        -ms-transition: all 400ms ease;
        -o-transition: all 400ms ease;
        transition: all 400ms ease;
    }

        nav ul.menu li.menu-item {
            display: block;
            border-bottom: 5px solid #353535;
        }

            nav ul.menu li.menu-item a {
                color: #FFF;
            }

                nav ul.menu li.menu-item a:hover {
                    background: #212121;
                }

    nav a.mobile-menu {
        display: block;
    }

    body.nav-open {
        margin-left: -730px;
        margin-right: 730px;
    }

        body.nav-open nav ul.menu {
            right: 0;
        }



    nav ul.menu li.menu-item-search .button-mobile {
        position: relative;
        padding: 12px 20px;
        border: 2.5px solid #212121;
        border-left: 4px solid #808080;
        background-color: #212121;
        color: #dbdbdb;
        outline-color: #063;
        font-size: 30pt;
    }

    nav ul.menu li.menu-item-search .search-mobile {
        padding: 16px 20px;
        background: #212121;
        border: 0 solid #dbdbdb;
        outline: none;
        font-size: 29pt;
        margin-left: 10px;
    }

    .form-mobile {
        margin-left: 20px;
        margin-top: 100px;
    }

    .tabs a {
        font-size: 123%;
    }

    fieldset.col-group.cf {
        font-size: 150%;
    }

    p.description {
        padding-bottom: 20px;
    }

    a.menu {
  float: right;
  width: 30px;
  height: 23px;
  overflow: hidden;
  transition: 0.3s;
  padding-left: 10px;
}
a.menu span {
  float: right;
  width: 55px;
  height: 6px;
  background-color: #fff;
  position: relative;
  top: 28px;
  left: -12px;
  transition: 0.3s;
}
a.menu span:before {
  content: '';
  width: 55px;
  height: 6px;
  background-color: #fff;
  position: absolute;
  top: -16px;
  left: 0;
}
a.menu span:after {
  content: '';
  width: 55px;
  height: 6px;
  background-color: #fff;
  position: absolute;
  bottom: -16px;
  left: 0;
}
a.menu.active {
  transform: rotate(360deg);
}
a.menu.active span {
  background-color: transparent;
}
a.menu.active span:before {
  top: 0;
  transform: rotate(-45deg);
}
a.menu.active span:after {
  bottom: 0;
  transform: rotate(45deg);
}

    div.column-three-right {
        display: none;
    }

    .resourceOuter_1 {
        float: none;
        width: auto;
    }

    .resourceOuter_2 {
        float: none;
        width: auto;
    }

#contactForm #message {
    width: 180px;
    height: 100px;
    font-size: 80%;
}

#contactForm input {
    width: 170px;
}

#contactForm p {
    font-size: 80%;
    width: 100%;
}

}



@media screen and (min-device-width: 501px) and (max-device-width: 825px)
 {

    p {
    font-size: 120%;
}

    h1 {
        font-size: 210%;
    }
.topnav {
background-color: #063;
color: #fff;
font-size: 150%;
padding: 4px 2px 5px 2px;
text-align: center;
margin-bottom: 0;
overflow:hidden;
}

      .topnav a {
       text-decoration: none;
       color: #FFF;
       font-weight: normal;
  }

header {
        background-color: #063;
        border: none;
}

    #header {
        background-color: #063;
        border: none;
    }


    #hc_Header {
        display: inline;
        height: 0px;
        background-color: #063;
    }

    #hc_HeaderRight {
        display: none;
    }

    .top-navigation-tabs {
        display: none;
    }

#hc_Logo {
    background: none;
}

    #hc_Logo img {
    margin-left: 5px;
    margin-top: 3px;
}

        .siteTitle {
        display: none;
    }

    .siteTitle_Mobile {
    display: inline;
    position: relative;
    font-family: 'Century Gothic';
    color: #fff;
    background-color: #063;
    font-size: 42pt;
    text-align: center;
    text-decoration: none;
    padding-left: 13.5%;
  
}
    .top-navigation-tabs {
        display: none;
    }

.footerdark {
    color: #fff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 180%;
    padding: 50px 10px;
    text-align: center;

}

.column-one {
    margin-right: 20px;
    margin-top: 8px;
    font-size: 0.8em;
}

    .homelink a {
        font-size: 200%;

    }

        .leftlinks a {
        font-size: 145%;
    }

        .leftlinks a:hover, .leftlinks a:focus {
            color: #fff;    
        }



.box-wrap {
    border: none;
    margin-top: 10px;
}


.innercontainer {
    border: none;
}

#input {
    left: 800px;
    z-index: 200;

}

#label {
    left: 800px;
    z-index: 200;

}

.mobilemenu {
    display: block;
}

    body {
        font-family: sans-serif;
        margin: 0;
        padding: 0;
        -webkit-transition: all 400ms ease;
        -moz-transition: all 400ms ease;
        -ms-transition: all 400ms ease;
        -o-transition: all 400ms ease;
        transition: all 400ms ease;
    }

nav {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: auto;
  background: #063;
  display: table;
  padding-bottom: 5px
}
nav a {
  color: #000;
  text-decoration: none;
}
nav a.title {
  padding: 10px;
  font-weight: bold;
}
nav ul.menu {
  float: left;
  margin: 0;
  padding: 0;
  list-style-type: none;
  letter-spacing: -4px;
}
nav ul.menu li.menu-item {
  letter-spacing: normal;
  display: inline-block;
}
nav ul.menu li.menu-item a {
  padding: 30px;
  display: block;
  font-size: 200%;
}
nav a.mobile-menu {
  padding: 10px;
}

div.container {
  padding: 20px;
}

  nav ul.menu {
    background: #3a3a3a;
    width: 530px;
    height: 100%;
    position: fixed;
    top: 0;
    right: -530px;
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
  }
  nav ul.menu li.menu-item {
    display: block;
    border-bottom: 5px solid #353535;
  }
  nav ul.menu li.menu-item a {
    color: #FFF;
  }
  nav ul.menu li.menu-item a:hover {
    background: #212121;
  }
        nav a.mobile-menu {
            display: block;
            height: 40px;
            width: 40px;
        }

  body.nav-open {
    margin-left: -530px;
    margin-right: 530px;
  }
  body.nav-open nav ul.menu {
    right: 0;
  }

  nav ul.menu li.menu-item-search .button-mobile {
                position:relative;
                padding:6px 15px;
                left: 0;
                border: 2.5px solid #212121;
                border-left: 3px solid #808080;
                background-color:#212121;
                color: #dbdbdb;
                outline-color: #063;
                font-size: 20pt;
  }

    nav ul.menu li.menu-item-search .search-mobile {
                padding:8px 15px;
                background: #212121;
                border: 0 solid #dbdbdb;
                outline: none;
                font-size: 20pt;
    }


        .form-mobile.input a {
            color: #fff;        
        
        }



    .form-mobile {
        margin-left: 40px;
        margin-top: 70px;
    }

 a.menu {
  float: right;
  width: 30px;
  height: 23px;
  overflow: hidden;
  transition: 0.3s;
  padding-left: 20px;
}
a.menu span {
  float: right;
  width: 60px;
  height: 6px;
  background-color: #fff;
  position: relative;
  top: 22px;
  left: 15px;
  transition: 0.3s;
}
a.menu span:before {
  content: '';
  width: 60px;
  height: 6px;
  background-color: #fff;
  position: absolute;
  top: -16px;
  left: 0;
}
a.menu span:after {
  content: '';
  width: 60px;
  height: 6px;
  background-color: #fff;
  position: absolute;
  bottom: -16px;
  left: 0;
}
a.menu.active {
  transform: rotate(360deg);
}
a.menu.active span {
  background-color: transparent;
}
a.menu.active span:before {
  top: 0;
  transform: rotate(-45deg);
}
a.menu.active span:after {
  bottom: 0;
  transform: rotate(45deg);
}

    div.column-three-right {
        display: none;
    }

    .resourceOuter_1 {
        float: none;
        width: auto;
    }

    .resourceOuter_2 {
        float: none;
        width: auto;
    }

#contactForm #message {
    width: 180px;
    height: 100px;
    font-size: 80%;
}

#contactForm input {
    width: 170px;
}

#contactForm p {
    font-size: 80%;
    width: 100%;
}
}
