/*!
 * Start Bootstrap - Scrolling Nav HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

body {
    width: 100%;
    height: 100%;
}

html {
    width: 100%;
    height: 100%;
}

@media(min-width:767px) {
    .navbar {
        padding: 20px 0;
        -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
        -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
        transition: background .5s ease-in-out,padding .5s ease-in-out;
    }

    .top-nav-collapse {
        /*padding-bottom: 10px;*/
		padding: 0;
		border-style: none none solid;
		border-color:orange;
		border-width:3px;
    }
	.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: 0;
    visibility: hidden;
    margin-top: -1px;
	}

	.dropdown-menu li:hover .sub-menu {
		visibility: visible;
	}

	.dropdown:hover .dropdown-menu {
		display: block;
	}

	.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
		margin-top: 0;
	}

	.navbar .sub-menu:before {
		border-bottom: 7px solid transparent;
		border-left: none;
		border-right: 7px solid rgba(0, 0, 0, 0.2);
		border-top: 7px solid transparent;
		left: -7px;
		top: 10px;
	}
	.navbar .sub-menu:after {
		border-top: 6px solid transparent;
		border-left: none;
		border-right: 6px solid #fff;
		border-bottom: 6px solid transparent;
		left: 10px;
		top: 11px;
		left: -6px;
	}
}

/* Demo Sections - You can use these as guides or delete them - the scroller will work with any sort of height, fixed, undefined, or percentage based.
The padding is very important to make sure the scrollspy picks up the right area when scrolled to. Adjust the margin and padding of sections and children 
of those sections to manage the look and feel of the site. */

.services-section ,.contact-section,.about-section,.portfolio-section,.intro-section{
    height: 100%;
    padding-top: 60px;
    text-align: center;
    background: #fff;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  background-color: #f5f5f5;
}

.navbar-brand {
    padding: 0 15px;  /* adjust the top and bottom padding to less than default 15px  if your logo is too small  */
    margin-top: 0px;  /* adjust the top margin if your logo doesn't line up well  */
    height: 50px; /* you should ONLY need to  adjust this when your navbar is larger than default 50px. This should equal the height of computed height of  .navbar>li>a which is by default is 50px. Don't use this to try and make your logo bigger or smaller. Instead adjust the top and bottom padding accordingly. */
}


    /* Get rid of link padding to make the above easier */
    .navbar-nav>li>a {
         padding-top:0px;
         padding-bottom:0px;
    }

   /* EDIT these but should be the same depending on on what font you're using */
    .navbar-brand, .navbar-nav>li>a {
        height: 67px;
        line-height: 67px;
    }


   /*EDIT top and bottom padding to shrink and grow image */
   .navbar-brand { 
        padding: 15px 15px;
    }
#timeline {
  background: #f7f8fa; }
#timeline .timeline-wrapper {
    margin-top: 60px;
    position: relative;
    /* the first node that comes right next to a year */ }
#timeline .timeline-wrapper:before {
    content: '';
    position: absolute;
    width: 5px;
    height: 100%;
    left: 0;
    background: #e7e8ec;
    right: 0;
    margin: 0 auto;
    z-index: -1; }
#timeline .timeline-wrapper .year {
    text-align: center;
    margin-bottom: 50px;
    margin-top: 50px;
    font-size: 16px; }
#timeline .timeline-wrapper .year:nth-child(1) {
    margin-top: 0px;
    margin-bottom: 60px; }
#timeline .timeline-wrapper .year.last {
    margin-bottom: 0;
    font-size: 21px; }
#timeline .timeline-wrapper .year span {
    display: inline-block;
    background: #E7E8EC;
    padding: 6px 20px;
    color: #5A5A5A;
    border-radius: 3px; }
#timeline .timeline-wrapper .year + .node {
    margin-top: -20px; }
#timeline .timeline-wrapper .node {
    position: relative;
    float: right;
    clear: right;
    width: 44%;
    margin: 35px 0;
    border-radius: 5px;
    /*&:nth-child(2n) {*/ }
@media (max-width: 767px) {
	#timeline .timeline-wrapper .node {
          width: 100%; }
}
#timeline .timeline-wrapper .node.left {
    float: left;
    clear: left; }
#timeline .timeline-wrapper .node.left:before {
    right: -51px;
    left: inherit; }
@media (max-width: 991px) {
    #timeline .timeline-wrapper .node.left:before {
        right: -42px;
        width: 43px; } 
}
#timeline .timeline-wrapper .node.left .marker {
    left: inherit;
          right: -65px; }
          @media (max-width: 991px) {
            #timeline .timeline-wrapper .node.left .marker {
              right: -52px; } }
      #timeline .timeline-wrapper .node:before {
        content: '';
        position: absolute;
        width: 50px;
        height: 4px;
        background: #E7E8EC;
        left: -51px;
        top: 62px; }
        @media (max-width: 991px) {
          #timeline .timeline-wrapper .node:before {
            left: -42px;
            width: 43px; } }
        @media (max-width: 767px) {
          #timeline .timeline-wrapper .node:before {
            display: none; } }
      #timeline .timeline-wrapper .node .marker {
        position: absolute;
        width: 17px;
        height: 17px;
        border-radius: 25px;
        background: #e7e8ec;
        left: -65px;
        top: 55px;
        border: 3px solid #F7F8FA; }
        @media (max-width: 991px) {
          #timeline .timeline-wrapper .node .marker {
            left: -51px; } }
        @media (max-width: 767px) {
          #timeline .timeline-wrapper .node .marker {
            display: none; } }
      #timeline .timeline-wrapper .node .entry {
        position: relative;
        padding: 20px;
        height: 400px;
        background-size: cover;
        background-position: center center;
        border-radius: 5px;
        box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.26); }
        #timeline .timeline-wrapper .node .entry:before {
          position: absolute;
          top: 50%;
          bottom: 0;
          left: 0;
          right: 0;
          content: '';
          border-radius: 0 0 5px 5px;
          background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(15, 24, 49, 0.89) 100%);
          background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(15, 24, 49, 0.89) 100%);
          background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(15, 24, 49, 0.89) 100%);
          background: linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(15, 24, 49, 0.89) 100%); }
        #timeline .timeline-wrapper .node .entry.smallish {
          height: 320px; }
          #timeline .timeline-wrapper .node .entry.smallish .intro {
            top: 68%; }
        #timeline .timeline-wrapper .node .entry.short-entry {
          background: #E7E8EC;
          color: #848C94;
          height: inherit;
          padding: 13px;
          box-shadow: none;
          position: relative;
          top: 41px;
          left: -1px;
          margin-bottom: 20px;
          text-shadow: 1px 1px rgba(255, 255, 255, 0.4); }
          #timeline .timeline-wrapper .node .entry.short-entry:before {
            background: none; }
        #timeline .timeline-wrapper .node .entry .intro {
          position: relative;
          top: 75%;
          color: #FFF;
          z-index: 9;
          letter-spacing: .3px; }
          #timeline .timeline-wrapper .node .entry .intro h4 {
            font-size: 20px;
            text-shadow: 1px 1px rgba(0, 0, 0, 0.69);
            letter-spacing: .5px; }
            @media (max-width: 767px) {
              #timeline .timeline-wrapper .node .entry .intro h4 {
                font-size: 17px; } }
          #timeline .timeline-wrapper .node .entry .intro p {
            font-weight: 300; }
            @media (max-width: 767px) {
              #timeline .timeline-wrapper .node .entry .intro p {
                font-size: 13px; } }
      #timeline .timeline-wrapper .node .news {
        position: relative;
        background-size: cover;
        background-position: center center;
        border-radius: 5px;
        box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.26);
        background: #fff; }
        #timeline .timeline-wrapper .node .news section {
          padding: 30px 20px 60px 20px; }
          #timeline .timeline-wrapper .node .news section h3 {
            margin-top: 0;
            font-size: 17px;
            line-height: 22px; }
          #timeline .timeline-wrapper .node .news section p {
            margin-top: 21px;
            line-height: 22px;
            font-size: 13px;
            color: #7A7979; }
        #timeline .timeline-wrapper .node .news footer {
          position: absolute;
          bottom: 0;
          padding: 12px 20px;
          width: 100%;
          font-size: 12px;
          font-weight: 500;
          color: #9EAEBE; }
          #timeline .timeline-wrapper .node .news footer .tag {
            position: relative;
            padding-left: 27px;
            text-transform: uppercase; }
            #timeline .timeline-wrapper .node .news footer .tag span {
              font-size: 24px;
              position: absolute;
              top: -4px;
              left: 0; }	
.panel-heading{
	background-color:#856227;
}