/*Includes css for:
	* frame
	* ken burns effect
		(author: Thierry Koblentz)
		see: http://www.css-101.org/articles/ken-burns_effect/css-transition.php
	* carousel customization
*/

/*CSS for the frame*/
.decoratedFrame{
background-attachment: scroll;

background-image: url('../res/slideshow.png');
background-origin: padding-box;
background-size: auto;
display: block;
height: 468px;
margin-bottom: 0px;
margin-left: 20px;
margin-right: 20px;
margin-top: 0px;

position: relative;
text-align: left;
width: 560px;
z-index: 0;
}
.frameContent{
display: block;
height: 400px;
left: 30px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;

padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
position: relative;
text-align: left;
top: 39px;
width: 500px;

}
.frameContentImageXXXXX{

display: block;
height: 400px;
left: 0px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;

padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
position: relative;
text-align: left;
top: 0px;
width: 500px;
}
/*END CSS for the frame*/
/*CSS for the ken burns*/
/**
 * author: Thierry Koblentz
 * Copyright 2011 - css-101.org 
 * http://www.css-101.org/articles/ken-burns_effect/css-transition.php
 */
.slideshow {
  position:relative;
  width:500px!important;
  height:400px;
  overflow:hidden;
  border:8px solid #fff;
  -webkit-box-shadow:1px 1px 5px #ddd;
  -moz-box-shadow:1px 1px 5px #ddd;
  -o-box-shadow:1px 1px 5px #ddd;
  box-shadow:1px 1px 5px #ddd;
}
.slideshow img {
  max-width: none;
  position:absolute;
  width:625px;
  height:500px;
  top:50%;
  left:50%;
  margin-left:-360px;
  margin-top:-240px;
  opacity:0.75;
  -webkit-transition-property: opacity, -webkit-transform;
  -webkit-transition-duration: 3s, 8s;
  -moz-transition-property: opacity, -moz-transform;
  -moz-transition-duration: 3s, 8s;
  -o-transition-property: opacity, -o-transform;
  -o-transition-duration: 3s, 8s;
  transition-property: opacity, transform;
  transition-duration: 3s, 8s;
}
.slideshow img  {
  -webkit-transform-origin: bottom left;
  -moz-transform-origin: bottom left;
  -o-transform-origin: bottom left;
  transform-origin: bottom left;
}
.slideshow :nth-child(2n+1) {
  -webkit-transform-origin: top right;
  -moz-transform-origin: top right;
  -o-transform-origin: top right;
  transform-origin: top right;
}
.slideshow :nth-child(3n+1) {
  -webkit-transform-origin: top left;
  -moz-transform-origin: top left;
  -o-transform-origin: top left;
  transform-origin: top left;
}
.slideshow :nth-child(4n+1) {
  -webkit-transform-origin: bottom right;
  -moz-transform-origin: bottom right;
  -o-transform-origin: bottom right;
  transform-origin: bottom right;
}
.slideshow .fx:first-child + img ~ img {
	z-index:-1;
}
.slideshow .fx {
  -webkit-transform: scale(1.25) translate(30px);
  -moz-transform: scale(1.25) translate(30px);
  -o-transform: scale(1.25) translate(30px);
  transform: scale(1.25) translate(30px);
  opacity:1;
}
/*END CSS for the ken burns*/
/*CSS for carousel customization*/
.carousel-indicators{
  visibility: hidden; 
}
.carousel-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 15px;
  background: #333333;
  background: rgba(0, 0, 0, 0.75);
}
.carousel-inner {
  background-color: rgba(0, 48, 95, 1);
}

.center {
    margin-left: auto;
    margin-right: auto;
    display: block
}
/*END CSS for carousel customization*/
