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


/*FADE IN CONTENT*/
.main-content {
    -webkit-animation: fadein 2.0s; /* Safari and Chrome */
    -moz-animation: fadein 2.0s; /* Firefox */
    -ms-animation: fadein 2.0s; /* Internet Explorer */
    -o-animation: fadein 2.0s; /* Opera */
    animation: fadein 2.0s;}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari and Chrome */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}​

/* Opera */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}​

a img {
	-webkit-transition: all 0.75s ease-in-out;
	-moz-transition: all 0.75s ease-in-out;
	-o-transition: all 0.75s ease-in-out;
	transition: all 0.75s ease-in-out;
	opacity: 1; 
	filter: alpha(opacity=100);
}
a img:hover, a img:focus { 
	opacity: 0.8; 
	filter: alpha(opacity=80);
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
 }


/*===========================================
	TRANSITIONS
===========================================*/
.img-scale { 
	-webkit-transition: all 0.3s ease-in-out; 
	-moz-transition: all 0.3s ease-in-out; 
	-o-transition: all 0.3s ease-in-out; 
	transition: all 0.3s ease-in-out; 
}
.img-scale:hover, .img-scale:focus { 
	-webkit-transform: scale(1.1); 
	-moz-transform: scale(1.1); 
	-o-transform: scale(1.1); 
	transform: scale(1.1); 
}

.img-rotate { 
	-webkit-transition: all 0.3s ease-in-out; 
	-moz-transition: all 0.3s ease-in-out; 
	-o-transition: all 0.3s ease-in-out; 
	transition: all 0.3s ease-in-out; 
}
.img-rotate:hover, .img-rotate:focus { 
	-webkit-transform: rotate(30deg); 
	-moz-transform: rotate(30deg); 
	-o-transform: rotate(30deg); 
	transform: rotate(30deg); 
}

.img-translate { 
	-webkit-transition: all 0.3s ease-in-out; 
	-moz-transition: all 0.3s ease-in-out; 
	-o-transition: all 0.3s ease-in-out; 
	transition: all 0.3s ease-in-out; 
}
.img-translate:hover, .img-translate:focus { 
	-webkit-transform: translate(50px); 
	-moz-transform: translate(50px); 
	-o-transform: translate(50px); 
	transform: translate(50px); 
}

.img-skewy {
	-webkit-transition: all 0.3s ease-in-out; 
	-moz-transition: all 0.3s ease-in-out; 
	-o-transition: all 0.3s ease-in-out; 
	transition: all 0.3s ease-in-out; 
}
.img-skewy:hover, .img-skewy:focus{
    -ms-transform: skewY(30deg); /* IE 9 */
    -webkit-transform: skewY(30deg); /* Safari */
    transform: skewY(30deg); /* Standard syntax */
}


/*===========================================
	BG IMAGE FADE
===========================================*/
.crossfade > div {
	-webkit-animation: imageAnimation 30s linear infinite;
	-moz-animation: imageAnimation 30s linear infinite;
	-ms-animation: imageAnimation 30s linear infinite;
	-o-animation: imageAnimation 30s linear infinite;
	animation: imageAnimation 30s linear infinite;
	backface-visibility: hidden;
	background-size: 1920px auto;
	background-repeat: no-repeat;
	color: transparent;
	height: 815px;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}
.crossfade {
	height: 815px;
}
@keyframes imageAnimation {
	0% { opacity: 1; }
	17% { opacity: 1; }
	25% { opacity: 0; }
	92% { opacity: 0; }
	100% { opacity: 1; }
}
@-webkit-keyframes imageAnimation {
	0% { opacity: 1; }
	17% { opacity: 1; }
	25% { opacity: 0; }
	92% { opacity: 0; }
	100% { opacity: 1; }
}
@-moz-keyframes imageAnimation {
	0% { opacity: 1; }
	17% { opacity: 1; }
	25% { opacity: 0; }
	92% { opacity: 0; }
	100% { opacity: 1; }
}
@-ms-keyframes imageAnimation {
	0% { opacity: 1; }
	17% { opacity: 1; }
	25% { opacity: 0; }
	92% { opacity: 0; }
	100% { opacity: 1; }
}
@-o-keyframes imageAnimation {
	0% { opacity: 1; }
	17% { opacity: 1; }
	25% { opacity: 0; }
	92% { opacity: 0; }
	100% { opacity: 1; }
}

.crossfade div.crossfade-box:nth-of-type(1) {
	background-image: url(/images/bg_kw_tour.jpg);
	-webkit-animation-delay: 24s;
	-moz-animation-delay: 24s;
	-ms-animation-delay: 24s;
	-o-animation-delay: 24s;
	animation-delay: 24s;
	background-position: 50% 60px;
}
.crossfade div.crossfade-box:nth-of-type(2) {
	background-image: url(/images/bg_kw_orchestra2.jpg);
	-webkit-animation-delay: 18s;
	-moz-animation-delay: 18s;
	-ms-animation-delay: 18s;
	-o-animation-delay: 18s;
	animation-delay: 18s;
	background-position: 50% -150px;
}
.crossfade div.crossfade-box:nth-of-type(3) {
	background-image: url(/images/bg_kip_symphony_2.jpg);
	-webkit-animation-delay: 12s;
	-moz-animation-delay: 12s;
	-ms-animation-delay: 12s;
	-o-animation-delay: 12s;
	animation-delay: 12s;
	background-position: 65% 20px;
}
.crossfade div.crossfade-box:nth-of-type(4) {
	background-image: url(/images/bg_kip_live.jpg);
	-webkit-animation-delay: 6s;
	-moz-animation-delay: 6s;
	-ms-animation-delay: 6s;
	-o-animation-delay: 6s;
	animation-delay: 6s;
	background-position: 50% 0px;
}
.crossfade div.crossfade-box:nth-of-type(5) {
	background-image: url(/images/bg_home_blur.jpg);
	-webkit-animation-delay: 0s;
	-moz-animation-delay: 0s;
	-ms-animation-delay: 0s;
	-o-animation-delay: 0s;
	animation-delay: 0s;
	background-position: 50% 60px;
}




@media (max-width: 768px) {

	.crossfade > div {
		background-size: auto 640px ;
	}
	.crossfade, .crossfade-box, .bg-empty-1 {
		height: 640px !important;
	}


.crossfade div.crossfade-box:nth-of-type(1) {
	background-image: url(/images/bg_kw_tour.jpg);
	-webkit-animation-delay: 24s;
	-moz-animation-delay: 24s;
	-ms-animation-delay: 24s;
	-o-animation-delay: 24s;
	animation-delay: 24s;
	background-position: 50% 30px;
}
.crossfade div.crossfade-box:nth-of-type(2) {
	background-image: url(/images/bg_kw_orchestra2.jpg);
	-webkit-animation-delay: 18s;
	-moz-animation-delay: 18s;
	-ms-animation-delay: 18s;
	-o-animation-delay: 18s;
	animation-delay: 18s;
	background-position: 50% 50px;
}
.crossfade div.crossfade-box:nth-of-type(3) {
	background-image: url(/images/bg_kip_symphony_2.jpg);
	-webkit-animation-delay: 12s;
	-moz-animation-delay: 12s;
	-ms-animation-delay: 12s;
	-o-animation-delay: 12s;
	animation-delay: 12s;
	background-position: 65% 30px;
}
.crossfade div.crossfade-box:nth-of-type(4) {
	background-image: url(/images/bg_kip_live.jpg);
	-webkit-animation-delay: 6s;
	-moz-animation-delay: 6s;
	-ms-animation-delay: 6s;
	-o-animation-delay: 6s;
	animation-delay: 6s;
	background-position: 50% 30px;
}
.crossfade div.crossfade-box:nth-of-type(5) {
	background-image: url(/images/bg_home_blur.jpg);
	-webkit-animation-delay: 0s;
	-moz-animation-delay: 0s;
	-ms-animation-delay: 0s;
	-o-animation-delay: 0s;
	animation-delay: 0s;
	background-position: 50% 30px;
}




}




/*=========================================
	ANIMATED IMAGE CAPTION           
=========================================*/
img {
	width: 100%;
}

figure {
	margin: 0;
	padding: 0;
/*	height: 300px;*/
	position: relative;
	display: block;
	cursor: pointer;
	overflow: hidden;
	border: 0px solid #fff;
}

figure:hover figcaption {
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	filter: alpha(opacity=100);
	opacity: 1;
/*	-webkit-transform: rotate(0);
	-moz-transform: rotate(0);
	-o-transform: rotate(0);
	-ms-transform: rotate(0);
	transform: rotate(0);*/
	bottom: -5px;
}

figcaption {
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	filter: alpha(opacity=0);
	opacity: 0;
	position: absolute;
	height: 50px;
	width: 100%;
	padding: 5px;
		bottom: -50px;
	background: rgba(255,255,255,.85);
	color: #fff;
	text-align: center;
	
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	-ms-transition: all .5s ease;
	transition: all .5s ease;
	-webkit-transition-delay: .5s;
	-moz-transition-delay: .5s;
	-o-transition-delay: .5s;
	-ms-transition-delay: .5s;
	transition-delay: .5s;
/*	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	transform: rotate(360deg);*/
}

figcaption h3 {
/*	font-family: 'Open sans';
	font-weight: 400;
	color: #f3b204;
	margin-bottom: 0;
	position: relative;
	left: 100%;
	margin-top: 37px;
	font-size: 24px;*/
	margin: 0;
	padding: 0px 10px 0px;
	
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	-ms-transition: all .5s;
	transition: all .5s;
	-webkit-transition-delay: 1s;
	-moz-transition-delay: 1s;
	-o-transition-delay: 1s;
	-ms-transition-delay: 1s;
	transition-delay: 1s;
}

figcaption p, figcaption .fas.fa-search-plus {
	color: #000;
/*	font-family: 'Open sans';*/
	padding: 0px 10px;
	margin: 0;
	margin-bottom: 20px;
/*	margin-top: 20px;*/
	position: relative;
	right: 100%;
	font-size: 40px;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	-ms-transition: all .5s;
	transition: all .5s;
	-webkit-transition-delay: 1.3s;
	-moz-transition-delay: 1.3s;
	-o-transition-delay: 1.3s;
	-ms-transition-delay: 1.3s;
	transition-delay: 1.3s;
}

figure:hover h3,figure:hover p {
	left: 0;
}


/*=========================================
	ANIMATE HOME PAGE IMAGES - is inline          
=========================================*/
/*.box-wrapper {
    transition-duration: 1800ms;
    -webkit-transition-duration: 1800ms;
	margin-top: 0;
	width: 100%;
}

.box-wrapper.loading:nth-child(odd) {
    transform: translate(-130%);
    -webkit-transform: translate(-130%);
	opacity: 0;
}

.box-wrapper.loading:nth-child(even) {
    transform: translate(130%);        
    -webkit-transform: translate(130%);
	opacity: 0;
}

.box-wrapper:nth-child(odd) .box {
	right: 20%;
	position: absolute;
	background-image: url(/images/bg_cd.png); 
	background-size: contain; 
	background-repeat: no-repeat; 
	background-position: center center;
	opacity: 1;
}

.box-wrapper:nth-child(even) .box {
	left: 20%;
	position: absolute;
	background-image: url(/images/bg_cd_cover.png); 
	background-size: contain; 
	background-repeat: no-repeat; 
	background-position: center center;
	opacity: 1;
}

.box {
    content: "";
    display: inline-block;
    margin: 0 auto;
    max-width: 400px;
    max-height: 400px;
}


@-webkit-keyframes spinX {  
	0%   {-webkit-transform: rotateX(0deg); -webkit-transform-origin: 0% 50% 0;}  
	100% {-webkit-transform: rotateX(360deg); -webkit-transform-origin: 0% 50% 0;}  
}
@keyframes spinX {  
	0%   {transform: rotateX(0deg); transform-origin: 0% 50% 0;}  
	100% {transform: rotateX(360deg); transform-origin: 0% 50% 0;}  
}

#loading {
		-webkit-animation: rotation 2s infinite linear;
}

@-webkit-keyframes rotation {
		from {
				-webkit-transform: rotate(0deg);
		}
		to {
				-webkit-transform: rotate(359deg);
		}
}
@keyframes rotation {
		from {
				transform: rotate(0deg);
		}
		to {
				transform: rotate(359deg);
		}
}
*/