html {
  height: 102%;
  font-family: "Source Sans Pro", sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

h1 {
  font-size: 3em;
  line-height: 1.25em;
  font-weight: 400;
  margin-bottom: .5em;
  color: #0070c0;
}
h2 {
  font-size: 2em;
  line-height: 1.25em;
  font-weight: 300;
  margin-bottom: .5em;
  color: grey;
}
h3 {
  font-size: 1.4em;
  line-height: 1.5em;
  font-weight: 400;
  margin-bottom: .5em;
  color: #0070c0;
}
h4 {
  font-size: 1.125em;
  font-weight: 600;
  line-height: 1.5em;
  margin-bottom: .5em;
  color: grey;
}

p, li { 
  font-size: 1.3em; 
}

.menu a {
  font-size: 1.125em;
}

.nav>li>a{
  font-size: .84em !important;
}


h1 a, h2 a, h3 a, h4 a {
  color: inherit;
  border: 0 !important;
}

  .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .icon-prev {
      width: 30px;
      height: 0px;
      margin-top: -50px;
      font-size: 100px;
  }


.carousel {
    height: 50%;
}

.carousel .item,
.carousel .item.active,
.carousel .carousel-inner {
    height: 480px;
    width: 1200px;
}




.carousel .fill {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
}


.mobile-hero{
    display: none;

}

html {
  height: 101%;
  font-family: "Source Sans Pro", sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

.icon-next{
  size: 110%;

}

.navbar{
  position: static;
}

.container-fluid{
    overflow: visible;
  }

/*Custom nav bar*/
#custom-bootstrap-menu.navbar-default .navbar-brand {
    color: rgba(255, 255, 255, 1);
}
#custom-bootstrap-menu.navbar-default {
    font-size: 14px;
    background-color: rgba(0, 112, 192, 1);
    border-width: 1px;
    border-radius: 4px;
}
#custom-bootstrap-menu.navbar-default .navbar-nav>li>a {
    color: rgba(255, 255, 255, 1);
    background-color: rgba(248, 248, 248, 0);
    margin-top: 40px;
}
#custom-bootstrap-menu.navbar-default .navbar-nav>li>a:hover,
#custom-bootstrap-menu.navbar-default .navbar-nav>li>a:focus {
    color: rgba(51, 51, 51, 1);
    background-color: rgba(248, 248, 248, 0);
    border-left : .125px solid white;
    border-right: .125px solid white;
}
#custom-bootstrap-menu.navbar-default .navbar-nav>.active>a,
#custom-bootstrap-menu.navbar-default .navbar-nav>.active>a:hover,
#custom-bootstrap-menu.navbar-default .navbar-nav>.active>a:focus {
    color: rgba(51, 51, 51, 1);
    background-color: rgba(255, 255, 255, 1);
}
#custom-bootstrap-menu.navbar-default .navbar-toggle {
    border-color: #ffffff;
}
#custom-bootstrap-menu.navbar-default .navbar-toggle:hover,
#custom-bootstrap-menu.navbar-default .navbar-toggle:focus {
    background-color: #ffffff;
}
#custom-bootstrap-menu.navbar-default .navbar-toggle .icon-bar {
    background-color: #ffffff;
}
#custom-bootstrap-menu.navbar-default .navbar-toggle:hover .icon-bar,
#custom-bootstrap-menu.navbar-default .navbar-toggle:focus .icon-bar {
    background-color: #0070c0;
}  

#auto-div{
  width: auto;
  height: 65px;
}

#logo-div{
  overflow: visible;
  height: auto;
  width: auto;
}

.navbar .brand {
    max-height: auto;
    overflow: visible;
    padding-top: 0;
    padding-bottom: 0;
}


.mobile-logo{
  display: none;
}

@media (max-width: 767px){
.navbar-default .navbar-nav .open .dropdown-menu>li>a {
    color: #ffffff;
}


#custom-bootstrap-menu.navbar-default .navbar-nav>li>a {
    color: rgba(255, 255, 255, 1);
    background-color: rgba(248, 248, 248, 0);
    margin: 0px;
}
#custom-bootstrap-menu.navbar-default .navbar-nav>li>a:hover,
#custom-bootstrap-menu.navbar-default .navbar-nav>li>a:focus {
    color: rgba(51, 51, 51, 1);
    background-color: rgba(248, 248, 248, 0);
    border: none;

}

  .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .icon-prev {
      width: 30px;
      height: 0px;
      margin-top: -60px;
      font-size: 100px;
  }
    .mobile-hero{
        display: block;
    }

    .desktop-hero{
        display: none;
    
    }   
    .img-portfolio {
        margin-bottom: 15px;
    }

    header.carousel .carousel {
        height: 70%;
    }

    .carousel .item,
  .carousel .item.active,
  .carousel .carousel-inner {
    
    width: 100%;
    height: auto;
  }
}


@media(max-width:1000px) {
  .mobile-logo{
      max-width: 200px;
      height: auto;
      display: block;
      float: left;
      margin: 0;      
    }
  #auto-div{
    display:none;
  }
    .img-portfolio {
      margin-bottom: 15px;
    }

    header.carousel .carousel {
        height: 70%;
    }

    .carousel .item,
    .carousel .item.active,
    .carousel .carousel-inner {
    
    width: 100%;
    height: auto;
    }
}