  /*5 col*/
  .col-xs-15 {
      width: 20%;
  }

  .divide {
      border-bottom: 2px solid lightgrey;
      margin-bottom: 10px;
  }

  .divider {
      border-bottom: 1px solid lightgrey;
  }

  .box h3 {
      font-size: 22px;

      font-weight: bold !important;
  }

  .box h1 {
      font-size: 28 px;

      font-weight: bold !important;
  }
  .box h2 {
      font-size: 17px;

      font-weight: bold !important;
  }

  .box {
      border: 1px solid black;

  }

  .btnstyle {
      margin: 0 auto;
      text-align: center;
  }

  @media only screen and (max-width: 767px) {
      #wrapper {
          margin: 0px 4px 4px 4px;
          padding: 20px 10px;
      }
  }

  #wrapper {
      padding: 20px 0px;
      margin-bottom: 4px;
      background: #fff;

      -webkit-box-shadow: 0 0px 0 4px rgba(0, 0, 0, .025), 0px -1px 1px rgba(0, 0, 0, .025);
      -moz-box-shadow: 0 0px 0 4px rgba(0, 0, 0, .025), 0px -1px 1px rgba(0, 0, 0, .025);
      box-shadow: 0 0px 0 4px rgba(0, 0, 0, .025), 0px -1px 1px rgba(0, 0, 0, .025);
  }

  .box p {
      clear: both;
      padding-top: 1px;
      float: none;
      display: block;
  }

  .toolbar ul {
      display: table-row;
  }

  .toolbar ul li {
      display: table-cell;

      list-style-type: none;
      margin: 10px;
      vertical-align: middle;
  }

  .toolbar ul li a {
      display: table-cell;
      vertical-align: middle;
      padding-left: 28px;
      padding-bottom: 17px;
  }

  .toolbar ul li.button a {
      height: 50px;

  }

  .box h3 {
      font-size: 16px;
      line-height: 20px;
      font-weight: bold !important;
  }

  #wrapper {
      border-color: black;
      width: 100%;
      overflow: hidden;
  }

  .introimg {

      width: 300px;
      height: 235px;
  }

  .imgContainer {
      text-align: center;
  }

  @media only screen and (max-width: 767px) {
      .introimg {

          width: 340px;
          height: 340px;
      }
  }

  @media (max-width: 365px) {
      .introimg {

          width: 280px;
          height: 280px;

      }
  }

  /*footer*/
  .full {
      width: 100%;
      height: 40px;
      border: 1px solid #fd9c04;
  }

  .gap {
      height: 30px;
      width: 100%;
      clear: both;
      display: block;
  }

  .footer {
      background: #f2f2f2;
      height: auto;
      padding-bottom: 30px;
      position: relative;
      width: 100%;

      border-top: 1px solid #000;
  }

  .footer p {
      margin: 0;
  }

  .footer img {
      max-width: 100%;
  }

  .footer h3 {
      border-bottom: 1px solid #000;


      line-height: 27px;
      padding: 20px 0 10px;

  }

  .footer ul {
      font-size: 13px;
      list-style-type: none;
      margin-left: 0;
      padding-left: 0;
      margin-top: 15px;
      color: #7F8C8D;
  }

  .footer ul li a {
      padding: 0 0 5px 0;
      display: block;
  }

  .footer a {
      color: #78828D
  }

  /*vertical align*/
  #container {

      height: 40px;

  }

  ol {
      margin: 0;
      padding: 0;
      list-style: none;
      vertical-align: bottom;
      display: inline-block;
  }

  ol li {



      margin: 0 20px 0 0;
      float: left;
  }

  ol li {



      margin: 0 0 0 0 !important;
      float: left;
  }


  @media (max-width: 769px) {
      ol li {



          margin: 0 0 0 0 !important;
          float: left;
      }
  }

  /*extra nav*/
  .color {
      background: #f2f2f2;

  }

  .container-fluid>section {
      /* margin: 0 auto; */
      padding: 1em .5em;
      text-align: center;
  }

  .cl-effect-7 a {
      padding: 12px 10px 10px;
      color: #566473;
      text-shadow: none;
      font-weight: 700;
  }

  .cl-effect-7 a::before,
  .cl-effect-7 a::after {
      position: absolute;
      top: 100%;
      left: 0;
      width: 100%;
      height: 3px;
      background: #566473;
      content: '';
      -webkit-transition: -webkit-transform 0.3s;
      -moz-transition: -moz-transform 0.3s;
      transition: transform 0.3s;
      -webkit-transform: scale(0.85);
      -moz-transform: scale(0.85);
      transform: scale(0.85);
  }

  .cl-effect-7 a::after {
      opacity: 0;
      -webkit-transition: top 0.3s, opacity 0.3s, -webkit-transform 0.3s;
      -moz-transition: top 0.3s, opacity 0.3s, -moz-transform 0.3s;
      transition: top 0.3s, opacity 0.3s, transform 0.3s;
  }

  .cl-effect-7 a:hover::before,
  .cl-effect-7 a:hover::after,
  .cl-effect-7 a:focus::before,
  .cl-effect-7 a:focus::after {
      -webkit-transform: scale(1);
      -moz-transform: scale(1);
      transform: scale(1);
  }

  .cl-effect-7 a:hover::after,
  .cl-effect-7 a:focus::after {
      top: 0%;
      opacity: 1;
  }

  /*bootstrap override */
  #override .col-sm-12 {
      padding-right: 8px;
      padding-left: 8px;
  }

  #override .col-sm-4 {
      padding-right: 8px;
      padding-left: 8px;
  }

  /*list size*/
  #size ul li a {
      font-size: 11px;
  }

  .aligncenter {
      text-align: center;
  }

  .form-group {
      margin-bottom: 8px;
  }

  p {
      color: #848484;
      font-size: 13px;
  }

  #overrid .row {
      margin-right: 0px;
      margin-left: 0px;
  }

  .sidenav {
      height: 100%;
      width: 200px;
      position: fixed;
      z-index: 1;
      top: 0;
      left: 0;
      background-color: #111;
      overflow-x: hidden;
      padding-top: 20px;
  }

  /* Style the sidenav links and the dropdown button */
  .sidenav a,
  .dropdown-btn {
      padding: 6px 8px 6px 16px;
      text-decoration: none;
      font-size: 20px;
      color: #818181;
      display: block;
      border: none;
      background: none;
      width: 100%;
      text-align: left;
      cursor: pointer;
      outline: none;
  }

  /* On mouse-over */
  .sidenav a:hover,
  .dropdown-btn:hover {
      color: #f1f1f1;
  }

  /* Main content */
  .main {
      margin-left: 200px;
      /* Same as the width of the sidenav */
      font-size: 20px;
      /* Increased text to enable scrolling */
      padding: 0px 10px;
  }

  /* Add an active class to the active dropdown button */
  .active {
      background-color: green;
      color: white;
  }

  /* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */
  .dropdown-container {
      display: none;
      background-color: #262626;
      padding-left: 8px;
  }

  /* Optional: Style the caret down icon */
  .fa-caret-down {
      float: right;
      padding-right: 8px;
  }

  /* Some media queries for responsiveness */
  @media screen and (max-height: 450px) {
      .sidenav {
          padding-top: 15px;
      }

      .sidenav a {
          font-size: 18px;
      }
  }

  