@charset "utf-8";
/* CSS Document */

/*Social Media Icons*/
@import url(https://fonts.googleapis.com/css?family=Lato);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css);
a {
    text-decoration: none;
    color: #fff;
	
}
a:link {color: #FFFFFF; !important }
a:visited {color: #FFFFFF; !important }
a:hover {color: #FFFFFF;	!important }
a:active {color: #FFFFFF;	!important }

p > a:hover{
    color: #fff !important;
    text-decoration:  underline;
}
ul {
    padding:0;
    list-style: none;
}
.footer-social-icons {
    display:block;
    margin: 0 auto;
}
.social-icon {
    color: #fff;
}
ul.social-icons {
padding-top: 20px;
    margin-top: 0px;
}
.social-icons li {
    vertical-align: top;
    display: inline;
    height: 0px;
}
.social-icons a {
    color: #fff;
    text-decoration: none;
}
.fa-facebook {
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover {
    background-color: #3d5b99;
}
.fa-instagram {
    padding:10px 12px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-instagram:hover {
    background-color: #fb3958;
}

/*Web Fonts*/
  @font-face {
  font-family: AvenirRoman;
  src: url(../fonts/AvenirLTStd-Roman.otf);
  }
  @font-face {
  font-family: AvenirLight;
  src: url(../fonts/Avenir-Light.otf);
  }
  @font-face {
  font-family: AvenirBook;
  src: url(../fonts/AvenirLTStd-Book.otf);
  }
  @font-face {
  font-family: WhitneyBook;
  src: url(../fonts/whitney-book.otf);
  }
  @font-face {
  font-family: WhitneyCondensed;
  src: url(../fonts/whitneycondensed-medium.otf);
  }
  @font-face {
  font-family: WhitneyLight;
  src: url(../fonts/whitney-light.otf);
  }
  @font-face {
  font-family: WhitneyBold;
  src: url(../fonts/whitney-bold.otf);
  }
  @font-face {
  font-family: WhitneyMedium;
  src: url(../fonts/whitney-medium.otf);
  }
  @font-face {
  font-family: WhitneySemiBold;
  src: url(../fonts/whitney-semibold.otf);
  }

		.navbar-collapse {
		margin-top: 0px;
        position: absolute;
        left: 0;
		padding-top:60px;
        padding-left: 15px;
        padding-right: 15px;
        width: 100%;
        height: auto;
		z-index:100;
    }

@media (max-width: 1920px) {
		.navbar-collapse {
		margin-top: 0px;
        position: absolute;
        left: 0;
        padding-left: 15px;
        padding-right: 15px;
        width: 100%;
        height: auto;
		z-index:100;
    }

			#demo {
			position: relative;
			z-index:0;
			height: 100%;
            align-items: center;
            flex-direction: column;
            text-align: center;
			vertical-align:text-top;
			justify-content: center;
			padding-top: 20px;
			margin: auto;
			width: 800px;
			}

.carousel-control-prev-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
      }
      
      .carousel-control-next-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
      }
.carousel-control.left {
  margin-left: -25px;
}

.carousel-control.right {
  margin-right: -25px;
}

    .navbar-collapse.collapsing {
        left: -75%;
        transition: height 0s ease;
    }

    .navbar-collapse.show {
        left: 0;
        transition: left 300ms ease-in-out;
    }

    .navbar-toggler.collapsed ~ .navbar-collapse {
        transition: left 500ms ease-in-out;
    }	
	
	.bar1, .bar2, .bar3 {
  width: 35px;
  height: 2px;
  background-color: #FFF;
  margin: 5px 0;
  transition: 0.4s;
}

.change .bar1 {
  -webkit-transform: rotate(-45deg) translate(-6px, 6px);
  transform: rotate(-45deg) translate(-6px, 6px);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
  -webkit-transform: rotate(45deg) translate(-3px, -3px);
  transform: rotate(45deg) translate(-3px, -3px);
}
#myVideo {
position:relative;
	width:100%;
    left: 0;
    right: 0;
    top: 0;
	filter: brightness(80%)
	}
	.videoBackgroundWrapper{
			position:relative;
			padding-top: 0px;
			padding-bottom: 0px;
			margin-bottom: 0px;
			color: inherit;
			background-color: #eee;
			overflow: hidden;
			position: absolute;
			height: 700px;
			}
}
@media (max-width: 1200px) {
		.navbar-collapse {
		margin-top: 300px;
        position: absolute;
        left: 0;
		padding-top: 0px;
        padding-left: 50px;
        padding-right: 15px;
        width: 100%;
        height: auto;
		z-index:100;
		background: rgb(0,0,0);
		background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 19%, rgba(0,0,0,0) 100%);
    }

	.videoBackgroundWrapper{
			height: 500px;
		}
}
@media (max-width: 400px) {
			#demo {
			position: relative;
			z-index:0;
			height: 100%;
            align-items: center;
            flex-direction: column;
            text-align: center;
			vertical-align:text-top;
			justify-content: center;
			padding-top: 20px;
			margin: auto;
			width: auto;
			}

.carousel-control-prev-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
      }
      
      .carousel-control-next-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
      }


	 .overlay{
	 		position: absolute;
            display: flex;
            top:-200px;
            bottom: 0;
            left: 0;
            right: 0;
            align-items: center;
            flex-direction: column;
            color: white;
            text-align: center;
			vertical-align:middle;
			justify-content: center;
           }
			#myVideo {
			position:relative;
			height:100% !important;
			width:auto !important;
			left: 0;
			right: 0;
			top: 0;
			filter: brightness(90%)
			}
			
			
}
@media (max-width: 888px) {
			#demo {
			position: relative;
			z-index:0;
			height: 100%;
            align-items: center;
            flex-direction: column;
            text-align: center;
			vertical-align:text-top;
			justify-content: center;
			padding-top: 20px;
			margin: auto;
			width: auto;
			}
		.navbar-collapse {
		margin-top: 300px;
        position: absolute;
        left: 0;
		padding-top: 0px;
        padding-left: 50px;
        padding-right: 15px;
        width: 100%;
        height: auto;
		z-index:100;
		background: rgb(0,0,0);
		background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 19%, rgba(0,0,0,0) 100%);		
		}
		.navbar-expand-lg {
		background-color:#000000;
		}
		
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
    outline: none;
    box-shadow: none;
}
.carousel-control-prev-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
      }
      
      .carousel-control-next-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
      }

			#myVideo {
			position:relative;
			height:100% !important;
			width:auto !important;
}			
}
			.videoBackgroundWrapper{
			background:url(../img/pool-hires.jpg);
			background-position: center;
			background-repeat: no-repeat;
			background-size: cover;
	 		position: absolute;
			padding-bottom: 0px;
			margin-bottom: 0px;
			color: inherit;
			background-color: #eee;
			overflow: hidden;
			position: relative;
			}

.slideanim {
    visibility:hidden;
    visibility:visible\9;/*For old IE browsers IE6-8 */
}
.slideanim.slide {                  
    visibility: visible;                  
    animation: slide 1s;
}
.slideanim::after {
    /* useful when its child elements are float:left; */
    content: "";
    display: table;
    clear: both;
}
@keyframes slide {
    0% {
        opacity: 0;
        transform: translateY(50%);
    } 
    100% {
        opacity: 1;
        transform: translateY(0);
    } 
}