/* Style HTML Elements */
body 
{
   font: 400 17px/1.8 Lato, sans-serif;
   color: #000;
   background-color: #ffffff;
}

h1 
{
	font-family: "Times New Roman", Times, serif;
	font-weight: normal;
	font-size: 40px;
	margin: 10px 0 20px 0;
	letter-spacing: normal;
	color: #000;
}

h2 
{
	font-family: "Times New Roman", Times, serif;
	margin: 8px 0 18px 0;
	letter-spacing: normal;
	font-size: 38px;
	color: #000;
}

h3 
{
	font-family: "Times New Roman", Times, serif;
	margin: 6px 0 16px 0;
	letter-spacing: normal;
	font-size: 18px;
	color: #000;
}

h4 
{
	font-family: "Times New Roman", Times, serif;
	margin: 4px 0 16px 0;
	letter-spacing: normal;
	font-size: 14px;
	color: #000;
}	

p
{
	color: #000;
	text-align: center;
}

a
{
	color: #000;
	font-style: italic;
	text-decoration: underline;
}

a:hover
{
	color: #808080;
	text-decoration: none;
}

hr
{
	border: 0;
	width: 100%;
	background-color: #1A2940;
	height: 1px;
}

/* Style Bootstrap Container */
.container 
{
	padding: 25px;
}

#navbar-container
{
	background-color: #f4eee6;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 9999;
}

/* Style Bootstrap Navigation Bar */
.navbar {
	/*background-color: #f4eee6;*/
	background-color: #ececec;
	font-size: 22px !important;
	letter-spacing: 2px;
	margin-bottom: 0;
}
.navbar .navbar-brand {
	padding: 3px;
	margin: 0;
	height: 58px;
}
.navbar .navbar-brand img {
	width: 200px;
	padding: 0;
	margin: 0;
	left: 0;
}
.navbar li a { 
	color: #000 !important;
	font-style: normal;
	text-decoration: none;	
	text-align: center;
	line-height: 30px;
}
.navbar .navbar-header
{
	padding:3px;
}
.navbar-nav li a:hover {
	color: #000 !important;
	text-decoration: underline;
}
.navbar-nav li.active a {
	color: #000 !important;
	background-color: #f4eee6 !important;
}
.navbar-default .navbar-toggle {
	border-color: transparent;
}
.navbar-default .navbar-toggle .icon-bar {
	/* width: 32px !important; */
	background-color: #000;
}
.navbar-default .navbar-toggle .navbar-text {
	color: #000;
}
.navbar-toggle .icon-bar{
	width: 30px !important;
	color: #000 !important;
}
.navbar-toggle .navbar-text{
	font-size: 22px !important;
	letter-spacing: 0px;
}

/* Style Social Media Icons */
ul.social{
	list-style-type: none;
	margin: 0 auto;
	padding: 0;
}
ul.social li{
	float: left;
	padding: 15px 5px 15px 5px;
}
ul.social li a{
	width: 35px;
	height: 35px;
	display:block;
	background: url(../images/logos/SocialSprite.png) no-repeat;		
}
ul.social li.fb a{
	background-position: 0 0;
}
ul.social li.ig a{
	background-position: -105px 0;
}
ul.social li.fb a:hover{
	opacity: 0.8;
}
ul.social li.ig a:hover{
	opacity: 0.8;
}

/* Style Horizontal Menu */
table.menu{
	margin:0 auto;
	border-collapse: separate;
	border-spacing: 6px;
}
table.menu a{
	color: #fff;
	font-family: Montserrat, sans-serif;
	font-size: 10px !important;
}
table.menu a:hover{
	color: #d5d5d5;
	text-decoration: none;
}

/* Style Top Banners */
table.top-banners{
	border-collapse: separate;
	border-spacing: 6px;
	max-width: 768px;		
}
table.top-banners img{
	padding: 0;
	max-width: 100%;
	width: 100%;
	height: auto;
}
table.top-banners a:hover{
	opacity: 0.8;
}

/* Style the Top Div */
#top-div{
	background-color: #f4eee6;
	padding: 5px 0px 0px 10px;
}
#top-div p{
	color: #1A2940;
}
#top-div a{
	color: #1A2940;
	font-style: normal;
	text-decoration: none;
}

/* Style the Page Footer */
#footer{
	background-color: #506F70;
	padding: 25px;
	width: 100%;
}
#footer p{
	color: #fff;
}
#footer a{
	color: #fff;
}
#footer a:hover{
	color: #808080;
	text-decoration: none;
}

/* Style the "Meet Your Guides" button */
#meet_guides_btn{
	width: 100%;
	background-color: #6aa148;
	border: none;
	color: white;
	padding: 12px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin-top: 20px;
	margin-bottom: 20px;
}

#meet_guides_btn:hover
{
	background-color: #45583a;
}

#vid-btn-container
{
	width: 100%;
	margin: 0 auto;"
}

/* Style the Frontpage Video */
.frontpage-video-container
{
	display: none;
	width: 100%;
	height: auto;
	overflow: hidden;
}

#myCarousel1
{
	display: block;
}

#myCarousel2
{
	display: block;
}

#myCarousel3
{
	display: block;
}

#myCarousel4
{
	display: block;
}

#myCarousel5
{
	display: block;
}


/* Style the Carousel */
.carousel-inner img {
  width: 100%; /* Set width to 100% */
  margin: auto;
}
.carousel-caption h3 {
  color: #fff !important;
}

.carousel-inner > .item > img, .carousel-inner > .item > a > img {
        display: block;
        height: auto;
        width: 100%;
        line-height: 1;
    }

/*Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)*/
.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}    
.carousel-fade .carousel-inner .active {
  opacity: 1;
}    
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}    
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}    
.carousel-fade .carousel-control {
  z-index: 2;
}

/*WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}

/* Style Google Maps */
.google-map {
	position: relative;
	padding-bottom: 75%; 
	height: 0;
	overflow: hidden;
}
.google-map iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}

.video-container {
   position: relative;
   padding-bottom: 56.25%;
   height: 0; 
   overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}

/* Media Query Breakpoints */
@media screen and (min-width: 576px) 
{
	.navbar-header img{
		width: 150px;
		padding: 10px 10px 10px 10px;
	}	
}

/* Media Query Breakpoints */
@media screen and (min-width: 768px) 
{
	#column
	{
		border-left: 1px solid #999999;
	}
	#column:nth-child(1)
	{
		border-left: none;
	}
	.row.equal 
	{
		display: flex;
		flex-wrap: wrap;
	}
	#vid-btn-container
	{
		width: 80%;
	}
}
	