#photos {
  background-image: url("../images/photos/bg.jpg");
}

/*
#photos div {
  border:1px solid red;
}

#photos img {
  border:1px solid green;
}
*/

/* page border */
#photos > div.page_border {
	position: absolute;
	background-color: black;
}

#photos > div.border_right {
	left: 1270px;
	top:0px;
	width: 10px;
	height:720px;
}

#photos > div.border_left {
	left: 0px;
	top:0px;
	width: 10px;
	height:720px;
}

#photos > div.border_top {
	left: 0px;
	top:0px;
	width: 1280px;
	height:10px;
}

#photos > div.border_bottom {
	left: 0px;
	top:710px;
	width: 1280px;
	height:10px;
}


/* Buttons */

#photos > .buttons > .home {
  left: 1117px;
  top: 26px;
  z-index: 1000;
}

/* flying bird */
#photos div.frame {
  position: absolute;
  top: 0px;
  left: 0px;
  opacity: 0.0;
}

#photos > #bird {
	position: absolute;
	left: 300px;
	top: 140px;
	-webkit-animation-name: photos_bird_fly;
	-webkit-animation-duration: 30s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
}

@-webkit-keyframes photos_bird_fly
{
    0%     { left: 1380px; top: 20px; }
    30%   { left: 0px; top: 740px;}
    100%   { left: 0px; top: 740px;}
}

#photos > #bird > .frame {
	width: 100px;
	height: 78px;
}

#photos > #filagry1 {
	position: absolute;
	left: 30px;
	top: 140px;
	-webkit-animation-name: photos_f1_fly;
	-webkit-animation-duration: 30s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
	
}

@-webkit-keyframes photos_f1_fly
{
    0%     { left: 1430px; top: -250px; }
    30%   { left: 20px; top: 480px;}
    45%   { left: -685px; top: 845px;}
    100%  { left: -685px; top: 845px;}
    /*
    60%   { left: -1390px; top: 1210px;}
    100%   { left: -1390px; top: 1210px;}
    */
}

#photos > #filagry1 > .frame {
	width: 503px;
	height: 312px;
}



/* Sliding View */

#photos .sliding-view {
  position: absolute;
  left: 382px;
  top: 76px;
  width: 516px;
  height: 530px;
  overflow: hidden;
  z-index: 0;
}

#photos .sliding-view-element {
  position: absolute;
  top: 10px;
  left: 0px;
  width: 516px;
  height: 517px;
  -webkit-transition: opacity 250ms;
  cursor: pointer;
  z-index: 0;
}

#photos .sliding-view-element img {
  -webkit-transition: opacity 250ms;
  width: 516px;
  height: 517px;
  opacity: 0;
}

#photos .sliding-view-element-focused img {
  opacity: 1;
}

#photos .sliding-view-element-hidden {
  display: none;
}

/* Page Control */

.slider {
  position: absolute;
  left: 385px;
  top: 655px;
  width: 508px;
  height: 2px;
  z-index: 0;
}

#photos .page-control {
  position: absolute;
  left: 389px;
  top: 636px;
  width: 548px;
  height: 48px;
  cursor: pointer;
  z-index: 100;
}

#photos .page-control-indicator-element {
  background: url('../images/interface/lips.png') no-repeat center center;
  position: absolute;
  top: 2px;
  left: 2px;
  width: 64px;
  height: 34px;
}

/* Arrows */

#photos .left-arrow {
  left: 144px;
  top: 266px;
  z-index: 1000;
}

#photos .right-arrow {
  left: 899px;
  top: 266px;
  z-index: 1000;
}

#photos .left-arrow,
#photos .right-arrow {
  -webkit-transition: opacity 500ms;
}

#photos .inactive {
  opacity: 0;
  pointer-events: none;
}

/* dim the arrows when they're inactive on Apple TV */
@media (-webkit-apple-tv) {
  #photos .inactive {
    opacity: 1;
  }
}