.carousel {
  width: auto;
  height: auto;
  position: relative;
  display:flex;
  box-sizing: border-box;
}

.carousel-inner {
  width: 100%;
  height:auto;
  position: relative;
  overflow: hidden;
}

.carousel-inner > .item {
  width:100%;
  height:100%;
  position: relative;
  display:none;
  background-color:transparent;
  -webkit-transition:all 0.6s ease-in-out;
  -o-transition:all 0.6s ease-in-out;
  transition:all 0.6s ease-in-out;
}

.carousel-inner > .item > .post {
  width:100%;
  height:100%;
  position: relative;
  display:flex;
}

.carousel-inner .item .post {
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}


.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  line-height: 1;
}

.post-inner {
  width:50%;
  max-width:560px;
  height:auto;
  position:absolute;
  padding:1.5625em 3.125em;
  margin:0 3.125em;
  top:calc(50% - 10.5625em);
  box-sizing:border-box;
  z-index:1;
}

.post-inner h1 {
  font-family: 'Inter', sans-serif;
  font-size: 2.5em;
  font-weight: 600;
  letter-spacing: 0.0375em;
  text-transform: uppercase;
  color:white;
}

.post-inner p {
  margin:1.5625em 0;
  font-size:1.1em;
  letter-spacing: 0.0375em;
  line-height: 1.5;
  color:white;
}

.post-inner p a {
  font-family: proxima-nova, sans-serif;
  color:#F48120;
}

.carousel-inner .item:nth-child(3) .post .post-inner {
  right:0;
}

.post-overlay {
  width:100%;
  height:100%;
  position:absolute;
  display:block;
  top:0;
  left:0;
  background-color:rgba(0,0,0,0.3);
  z-index:0;
}

.image-carousel .carousel-inner {
  height:calc(100vw/6 - 0.5em);
}

.section-carousel {
  width:35em;
  height:32em;
}

.multi-item-carousel {
  width: 100%;
  height: auto;
  position: relative;
  box-sizing: border-box;
}


.section-carousel .carousel-control .glyphicon {
  background-color: #F48120;
}

@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel-inner > .item {
    -webkit-transition:-webkit-transform 0.6s ease-in-out;
    -o-transition:-o-transform 0.6s ease-in-out;
    transition:transform 0.6s ease-in-out;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    -webkit-perspective:1000;
    perspective:1000
  }
  .carousel-inner > .item.active.right, .carousel-inner > .item.next {
    left:0;
    -webkit-transform:translate3d(100%, 0, 0);
    transform:translate3d(100%, 0, 0)
  }
  .carousel-inner > .item.active.left, .carousel-inner > .item.prev {
    left:0;
    -webkit-transform:translate3d(-100%, 0, 0);
    transform:translate3d(-100%, 0, 0)
  }
  .carousel-inner > .item.active, .carousel-inner > .item.next.left, .carousel-inner > .item.prev.right {
    left:0;
    -webkit-transform:translate3d(0, 0, 0);
    transform:translate3d(0, 0, 0)
  }
}

.carousel-inner > .active {
  left: 0;
}

.carousel-inner > .active,
.carousel-inner > .next,
.carousel-inner > .prev {
  width: 100%;
  position: absolute;
  display:flex;
  top: 0;
}

.carousel-inner > .next {
  left: 50%;
}

.carousel-inner > .prev {
  left: -100%;
}

.carousel-inner > .next.left,
.carousel-inner > .prev.right {
  left: 0;
}

.carousel-inner > .active.left {
  left: -100%;
}

.carousel-inner > .active.right {
  left: 100%;
}

.carousel-control {
  width:1.5em;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  font-size:1.25em;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  background-color: rgba(0, 0, 0, 0);
  z-index: 0;
}

.carousel-control.left {
  right:auto;
  left:0;
}

.carousel-control.right {
  right: 0;
  left: auto;
}

.carousel-control .icon-prev,
.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right {
  position: relative;
  display: inline-block;
  top:calc(50% - 1.5em); 
  margin: -0.625em 0 0 0;
  z-index: 5;
}

.carousel-control .glyphicon {
  width:100%;
  height:3em;
  display: flex;
  justify-content: center;
  align-items: center;
  padding:0.25em;
  background-color:transparent;
  box-sizing: border-box;
}

.carousel-control .glyphicon::after {
    content: "";
    width: 0;
    height: 0;
    position: relative;
    display: inline-block;
    padding: 0.20em;
    border-style: solid;
    border-width: 0 0.20em 0.20em 0;
    border-color:white;
    cursor: pointer;
    outline: none;
    -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
    -moz-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
    z-index: 1;
    align-self: center;
}


.glyphicon-chevron-right::after {
  margin:0 0.125em 0 0;
  -webkit-transform: rotate(315deg);
  -ms-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  transform: rotate(315deg);
}

.glyphicon-chevron-left::after {
  margin:0 0 0 0.33em;
  -webkit-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  transform: rotate(135deg);
}

.carousel-control .icon-prev,
.carousel-control .icon-next {
  width:1.25em;
  height:1.25em;
  font-family: serif;
  line-height: 1;
}

.carousel-control .icon-prev:before {
  content: "\2039";
}

.carousel-control .icon-next:before {
  content: "\203a";
}

.carousel-indicators {
	width: 120px;
  position:absolute;
  margin:0 auto;
  padding-left: 0;
  right:0;
  left:0;
	bottom:0.625em;
  text-align: center;
  list-style: none;
	z-index:1;
}

.carousel-indicators li {
  width:0.875em;
  height:0.875em;
  display: inline-block;
  margin:0.0125em 0.25em;
  text-indent: -999px;
  background-color:#f2f3f7;
  cursor: pointer;
  border: 1px solid #ffffff;
  border-radius:0.625em;
}

.carousel-indicators .active {
  background-color:#F48120;
}

.carousel-control .glyphicon:hover::after  {
  border-color:#F48120;
}

.carousel-caption {
  position: absolute;
  right: 15%;
  bottom:1.25em;
  left: 15%;
  padding-top:1.25em;
  padding-bottom: 1.25em;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  z-index: 10;
}

.carousel-caption .btn {
  text-shadow: none;
}

.clearfix:before,
.clearfix:after {
  display: flex;
  content: " ";
}

.clearfix:after {
  clear: both;
}

.center-block {
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.pull-right {
  float: right !important;
}

.pull-left {
  float: left !important;
}

.hide {
  display: none !important;
}

.show {
  display: block !important;
}

.invisible {
  visibility: hidden;
}

.text-hide {
  font: 0/0 ;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.hidden {
  display: none !important;
}

.affix {
  position: fixed;
}

.section-carousel .carousel-control .icon-prev, 
.section-carousel .carousel-control .icon-next, 
.section-carousel .carousel-control .glyphicon-chevron-left, 
.section-carousel .carousel-control .glyphicon-chevron-right {
  top:0;
  margin:0;
}

.section-carousel .carousel-control {
  top:auto;
}

.section-carousel .carousel-control.left {
  left: auto;
  right:1.5em;
}

.section-carousel .carousel-control.right {
  right:0;
  left:auto;
}


/*Multiple Image Carousel Slider*/

.multi-item-carousel,
.multi-item-carousel .carousel-inner {
  width: calc(100% - 4em);
  height: calc(100vw/3 *(2/3) - 4em);
  margin: 0 auto;
}

.multi-item-carousel .carousel-inner > .item {
  transition: 500ms ease-in-out left;
}

.multi-item-carousel .carousel-inner > .item li {
  width:calc(100% - 1em);
  height:auto;
  position: relative;
  margin:0 0.5em;
  box-sizing: border-box;
}

.multi-item-carousel .carousel-inner > .item li a img {
  width:100%;
  height: auto;
  position: relative;
  box-sizing: border-box;
}

.multi-item-carousel .carousel-inner .active.left {
  left: -33%;
}
.multi-item-carousel .carousel-inner .active.right {
  left: 33%;
}
.multi-item-carousel .carousel-inner .next {
  left: 33%;
}
.multi-item-carousel .carousel-inner .prev {
  left: -33%;
}

.multi-item-carousel .carousel-control .glyphicon {
  background-color: #F48120;
}

.multi-item-carousel .carousel-control .glyphicon:hover::after,
#homeAboutCarousel .carousel-control .glyphicon:hover::after {
  border-color:white;

}

@media all and (transform-3d), (-webkit-transform-3d) {
  .multi-item-carousel .carousel-inner > .item {
    transition: 500ms ease-in-out left;
    transition: 500ms ease-in-out all;
    -webkit-backface-visibility: visible;
            backface-visibility: visible;
    transform: none !important;
  }
}
.multi-item-carousel .carouse-control.left,
.multi-item-carousel .carouse-control.right {
  background-image: none;
}


@media all and (max-width: 767px) {
  .multi-item-carousel .carousel-inner .item > li {
      display: none;
  }
  .multi-item-carousel .carousel-inner .item > li:first-child {
      display: block;
  }
}

.multi-item-carousel .carousel-inner .item.active,
.multi-item-carousel .carousel-inner .item-next,
.multi-item-carousel .carousel-inner .item-prev {
  display: flex;
}

/* medium and up screens */
@media all and (min-width: 768px) {
  
  .multi-item-carousel .carousel-inner .item-end.active,
  .multi-item-carousel .carousel-inner .item-next {
    transform: translateX(25%);
  }
  
  .multi-item-carousel .carousel-inner .item-start.active, 
  .multi-item-carousel .carousel-inner .item-prev {
    transform: translateX(-25%);
  }
}

.multi-item-carousel .carousel-inner .item-end,
.multi-item-carousel .carousel-inner .item-start { 
transform: translateX(0);
}


/* 
===========================================================================================
===============================	Carousels Slide Images CCC ================================
===========================================================================================
*/

/*--- Main Carousel on Home Page ---*/

#homeCarousel {
  width:100%;
  height:calc(100vh - 10.705em);
  position:relative;
}

#homeCarousel .carousel-inner .item:first-child .post {
  background-image:url('../img/slideshow/cover.jpg');
}

#homeCarousel .carousel-inner .item:nth-child(2) .post {
  background-image:url('../img/slideshow/cover 2.png');
}

#homeCarousel .carousel-inner .item:nth-child(3) .post {
  background-image:url('../img/slideshow/cover 3.jpg');
}


/*--- Main Carousel on About Section on Home Page ---*/


#homeAboutCarousel .carousel-inner .item:first-child .post {
  background-image:url('../img/carousels/Home-About/slide 1.jpg');
}

#homeAboutCarousel .carousel-inner .item:nth-child(2) .post {
  background-image:url('../img/carousels/Home-About/slide 2.jpg');
}

#homeAboutCarousel .carousel-inner .item:nth-child(3) .post {
  background-image:url('../img/carousels/Home-About/slide 3.jpg');
}

#homeAboutCarousel .carousel-inner .item:nth-child(4) .post {
  background-image:url('../img/carousels/Home-About/slide 4.jpg');
}

#homeAboutCarousel .carousel-inner .item:nth-child(5) .post {
  background-image:url('../img/carousels/Home-About/slide 5.jpg');
}

#homeAboutCarousel .carousel-inner .item:nth-child(6) .post {
  background-image:url('../img/carousels/Home-About/slide 6.jpg');
}

#homeAboutCarousel .carousel-inner .item:nth-child(7) .post {
  background-image:url('../img/carousels/Home-About/slide 7.jpg');
}



/* 
===========================================================================================
===============================	Media Queries =============================================
===========================================================================================
*/
@media all and (min-width:1026px) and (max-width: 1367px) {
  
	#homeCarousel {
    width:100%;
    max-height:40em;
	}

  .multi-item-carousel {
    width: calc(100% - 0em);
    height: calc(100vw/3 *(2/3) - 0em);
    margin: 0 auto;
  }

  .multi-item-carousel .carousel-inner {
    width: calc(100% - 5em);
    height: calc(100vw/3 *(2/3) - 0em);
  }
	
	.item {
		height:auto;
  }

  .post-inner {
    width:100%;
    margin:0 auto;
    padding:1.5625em 3.125em;
  }
	 	
}

@media all and (min-width:766px) and (max-width: 1025px) {
  
	#homeCarousel {
    width:100%;
    height:26em;
	}

  .multi-item-carousel, 
  .multi-item-carousel .carousel-inner {
    width: calc(100% - 1em);
    height: calc(100vw/3 *(2/3) - 1em);
  }
	
	.item {
		height:auto;
  }

  .post-inner {
    width:100%;
    max-width:unset;
    margin:0 auto;
    padding:1.5625em 3.125em;
  }

  .post-inner h1 {
    font-size:1.75em;
  }
  
  .post-inner p {
    font-size:1em;
  }
	
}

@media all and (min-width:501px) and (max-width: 765px) {
  
	#homeCarousel {
    width:100%;
    height:26em;
	}

  .multi-item-carousel, 
  .multi-item-carousel .carousel-inner {
    width: calc(100% - 0em);
    height: calc(100vw *(2/3) - 0em);
    max-width: 30em;
    max-height: 15em;
  }
	
	.item {
		height:auto;
  }

  .post-inner {
    width:100%;
    max-width:unset;
    margin:0 auto;
    padding:1.5625em 3.125em;
  }

  .post-inner h1 {
    font-size:1.75em;
  }
  
  .post-inner p {
    font-size:1em;
  }
	
}

@media all and (min-width:321px) and (max-width: 500px) {

	#homeCarousel {
    width:100%;
    min-height: 30em;
    max-height: 32em;
	}

  .multi-item-carousel, 
  .multi-item-carousel .carousel-inner {
    width: calc(100% - 0em);
    height: calc(100vw *(2/3) - 3em);
  }
	
	.item {
		height:auto;
  }
  
  .post-inner {
    width:100%;
    margin:0 auto;
    padding:1.5625em 2em;
    top: calc(50% - 8.25em);
  }

  .post-inner h1 {
    font-size:1.65em;
  }
  
  .post-inner p {
    font-size:0.9em;
  }
	 
}

@media all and (max-width: 320px) {

	#homeCarousel {
    width:100%;
    height:75vh;
    min-height: 30em;
    max-height: 32em;
	}

  .multi-item-carousel, 
  .multi-item-carousel .carousel-inner {
    width: calc(100% - 0em);
    height: calc(100vw *(2/3) - 0em);
  }
	
	.item {
		height:auto;
  }

  .carousel-inner > .item > .post {
    align-items: center;
  }
  
  .post-inner {
    width:100%;
    position: relative;
    margin:0 auto;
    padding:1.5625em 2em;
    top:0;
  }

  .post-inner h1 {
    font-size:1.5em;
  }
  
  .post-inner p {
    font-size:0.875em;
  }

  .carousel-control {
    width: 1em;
  }
	 
}



