.carousel-fade .carousel-item {
    transition-duration: .6s;
}
.carousel-inner {
    padding-bottom: 42%;
    height: calc(0px + 100vh - 195px); /* 195px is banner height*/
    overflow: hidden;
}
.showControlBar .carousel-inner {
    /* height: calc(0px + 100vh - 195px - 53px); */
}
.carousel-item {
    position:absolute;
    height: 100%;
    background: rgba(27, 20, 100, 0.8);
}
.carousel-front {
    position:absolute;
    height: 100%;
    width:100%;
    /* top:0; */
    /* background: rgba(255, 152, 0, 0.28); */
    z-index: 2;
}


.carousel-front .col {
	
-ms-transition: border-color 0.5s ease 0s;
	
-webkit-transition: border-color 0.5s ease 0s;
	
-moz-transition: border-color 0.5s ease 0s;
	
-ms-transition: background-color 0.5s ease 0s;
	
-webkit-transition: background-color 0.5s ease 0s;
	
-moz-transition: background-color 0.5s ease 0s;
	
transition: border-color 0.5s ease 0s, background-color 0.5s ease 0s;
	
border-right: 1px solid transparent;
}
.carousel-front .col:hover {

/* border-left: 1px solid; */

/* border-right: 1px solid; */

background: rgba(158, 158, 158, 0.28);

color: white;
}

.carousel-front .col:hover .carousel-caption {
    bottom: 0;
    -ms-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -webkit-transform: translateY(0%);
    transform: translateY(0%);
    justify-content: center;
}

.carousel-front .col:hover .caption-body {
    display: block;
}

.carousel .caption-body p {
    font-size: .9rem;
}

.carousel .caption-body a:link {
    background: #303F9F;
    display: inline-block;
    width: initial;
    margin-left: auto;
    margin-right: auto;
    padding: .3rem .8rem;
    padding-bottom: .3rem;
    font-size: .8rem;
}
.carousel-item > a {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.carousel-item img {
    width: 100%; height: 100%;
    object-fit: cover;
}
.carousel-caption {
    text-shadow: 1px 2px 3px rgba(0,0,0,0.6);
    top: 5%;
}

.carousel-item > .carousel-caption {
    -ms-flex-align: center!important;
    align-items: center!important;
    display: -ms-flexbox!important;
    display: flex!important;
}
.carousel-caption > * {
	width:100%;
}

.carousel-caption .caption-title {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 1rem;
    font-weight: normal;
    text-transform: uppercase;
}

.carousel-caption .caption-title::after {
    content: '+';
    display: inline-block;
    padding-left: .5rem;
    /* content: 'U+0002B'; */
    /* content: '&plus;'; */
}
.col .carousel-caption .caption-body {
    display: none;
    /* height: 100%; */
}

.carousel-front .carousel-caption {
    top: 0;
    bottom: 54px;
    /* border-top: solid 1px; */
    left: 0;
    right: 0;
    padding: .8rem 3%;
    /* padding-left: 3%; */
    /* padding-right: 3%; */
    overflow: hidden;
    background: rgba(0,0,0,0.4);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1, StartColorStr='#66000000', EndColorStr='#66000000')";
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#66000000', EndColorStr='#66000000');
    /* transition: all .5s; */
    -ms-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    /* width: 100%; */
    -ms-transition: transform 0.5s ease;
    -webkit-transition: -webkit-transform 0.5s ease;
    -moz-transition: transform 0.5s ease;
    transition: transform 0.5s ease;
    display: flex;
    /* justify-content: center; */
}
.carousel-caption p {
    animation-delay: .1s;
}
.carousel-caption p {
    animation-delay: .3s;
}
.carousel-indicators li {
    /* box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.6); */
}
.carousel-control-prev {
    background-image: -webkit-linear-gradient(left,color-stop(rgba(0,0,0,0.5) 0),color-stop(rgba(0,0,0,0.0001) 100%));
    background-image: linear-gradient(to right,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.0001) 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000',endColorstr='#00000000',GradientType=1);
}
.carousel-control-next {
    background-image: -webkit-linear-gradient(left,color-stop(rgba(0,0,0,0.0001) 0),color-stop(rgba(0,0,0,0.5) 100%));
    background-image: linear-gradient(to right,rgba(0,0,0,0.0001) 0,rgba(0,0,0,0.5) 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#80000000',GradientType=1);
}
/* html.size-sm .carousel-inner {padding-bottom: 100%;} */
@media only screen and (max-width: 576px) and (orientation:portrait) {
	.carousel-inner {padding-bottom: 100%;}
}
/* md */
@media (min-width: 768px) {
	.carousel-inner:hover .carousel-item .carousel-caption {
		display: none!important;
	}
}