@charset "utf-8";

/*==========Common Styles==========*/
*,html {font-size: 100%; line-height:18px; -webkit-text-size-adjust: none;} 
body {margin: 0; padding: 0; font-family: Arial,sans-serif;
	font-family: "proxima-nova",sans-serif;
	font-style: normal;
	font-weight: 700;
	overflow-x: hidden;
	word-wrap: break-word;
}
.sans{
	font-family: "proxima-nova",sans-serif;
	font-style: normal;
	font-weight: 400;
}
.sansBlack{
	font-family: "proxima-nova",sans-serif;
	font-style: normal;
	font-weight: 700;
}

.serif{
	font-family: "garamond-premier-pro-display",serif;
	font-style: normal;
	font-weight: 700;
}

/*mashead*/

.head-video{
	position: absolute;
	height: 750;
	width: 100%;
	background-color: #f5e700;
}
.mashead{
	position: relative;
	height: 750px;
	width: 100%;
	/*background-image: url(../assets/head.jpg);
	background-size: cover;
	background-position: center;*/
}
h1{
	font-size: 110px;
}
h2{
	font-size: 180px;
}
h3{
	font-size: 15px;
	letter-spacing: 1.005em;
}
h4{
	font-size: 30px;
}
h5{
	font-size: 20px;
}
/*override*/
.btn-lg {
  padding: 10px 16px;
  font-size: 15px;
  line-height: 1.33;
  border-radius: 6px;
}
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
  color: #000;
  background-color: #FFF;
  border-bottom: 2px solid #000;
  border-radius: 0px;
}
.nav .caret {
  border-top-color: #FFF;
  border-bottom-color: #FFF;
}
.nav a:hover .caret {
  border-top-color: #2a6496;
  border-bottom-color: #2a6496;
}
.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
  background-color: #f5e700;
}
.nav-pills > li > a{
	color: #000;
	border-bottom: 2px solid #FFF;
}


/*mashead title*/

.title0{
	color: #f5e700;
	letter-spacing: 0.2em;
	font-size: 40px;	
}
.title1{
	color: #f5e700;
	letter-spacing: 0.2em;
	font-size: 120px;	
}
@media screen and (max-width: 480px) {
	.title0{
		font-size: 20px;	
	}
	.title1{
		font-size: 50px;	
	}	
}
@media (min-width: 480px) and (max-width: 768px) {
	.title0{
		font-size: 30px;	
	}
	.title1{
		font-size: 80px;	
	}	
}

/*timeline*/


.timeline{
	position: relative;
	height: 450px;
	width: 100%;
	background-color: #ededed;
	color: #ff5289;
}
.timeline-grid{
	position: absolute;
	height: 450px;
	width: 1px;
	left: 10%;
	background-color: #fecfde;
}
.timeline-line{
	position: relative;
	padding-top: 220px;
}

.timeline-events{
	position: relative;
	z-index: 100;
}
.timeline-event{
	position: absolute;
	font-size: 12px;
	padding: 3px 7px;
	-webkit-border-radius: 4px;
	
	color: #ff5289;
	background-color: #ededed;

}
.timeline-event.more-info {

	color: #FFF;
	background-color: #ff5289;
	border: 1px solid #ff5289;
}

.timeline-event > i{
	padding: 0 6px;
}
.timeline-line-line{
	margin-top: 19px;
	width: 100%;
	height: 10px;
	background-image: url(../assets/timeline.png);
}
.timeline h5{
	background-color: #ededed;
	padding: 5px 20px;
}

@media screen and (max-width: 480px) {
	.timeline h5{
		font-size: 15px;
	}	
}
/*timeline V*/
.timelineV{
	display: inline-block;
	position: relative;
	height: auto;
	width: 100%;
	background-color: #ededed;
	color: #ff5289;
}
.timeline-gridV{
	position: absolute;
	height: 1px;
	width: 100%;
	background-color: #fecfde;
}
.timeline-eventsV{
	width: 50%;
	height: auto;
	display: block;
	padding: 0 20px;
	background-color: transparent;
}
.timeline-eventWrapperV{
	position: relative;
	display: inline-block;
	width: 100%;
}
.timeline-eventV{
	position: relative;
	display: inline-block;
	width: auto;
	font-size: 12px;
	padding: 3px 7px;
	-webkit-border-radius: 4px;
	color: #ff5289;
	background-color: #ededed;
}
.timeline-eventV.more-info {

	color: #FFF;
	background-color: #ff5289;
	border: 1px solid #ff5289;
}
.timeline-line-lineV{
	position: absolute;
	top: 90px;
	width: 10px;
	height: 500px;
	background-image: url(../assets/timeline.png);
}
.timeline-lineV h5{
	display: block;
	width: 100%;
	padding: 10px;
}


/*object*/

.objects-nav{
	position: relative;
	display: inline-block;
	width: 100%;
	height: 110px;
	background-color: #FFF;
	color: #000;
}
.objects-nav > ul{
	padding-top: 30px;
	width: 635px;
}

@media screen and (max-width: 630px) {
	.objects-nav{
		height: 180px;
	}
	.objects-nav > ul{
		width: 310px;
	}
	.objects-nav li{
		font-size: 12px;
	}
	
}
.objects{
	text-align: center;
	position: relative;
	display: inline-block;
	width: 100%;
	height: auto;
	background-color: #fff8dd;
	color: #000;
	padding: 80px 20px;
	clear: both;
}
.object-item{
	text-align: center;
	position: relative;
	display: inline-block;
	margin: -5px;
	-webkit-transform: scale(0.7,0.7);
	-webkit-transition: all 0.1s cubic-bezier(.42,.22,.91,1.51);
}
@media screen and (max-width: 480px) {
	.object-item{
		margin: -15px;
	}
}

/*face*/

.faces{
	position: relative;
	display: inline-block;
	width: 100%;
	height: auto;
	background-color: #f5e700;
	font-size: 120px;
	color: #f5e700;
}
.face-item{
	width: 25%;
	height: 300px;
	display: inline-box;
	float: left;
	
	background-size: cover;
	background-position: center;
	
	overflow: hidden;
}
.face-text{
	margin-top: 50px; /*script control*/
	-webkit-transition: all 0.4s ease-out;
}
@media screen and (max-width: 480px) {
	.face-text{
		font-size: 100px;
	}
	.face-item{
		width: 50%;
		height: 200px;
	}
}
@media (min-width:480px) and (max-width: 768px) {

	.face-item{
		width: 50%;
		height: 300px;
	}
}
@media (min-width: 1200px) {
	.face-item{
		width: 16.66666666666%;
		height: 300px;
	}
}

/*@media (max-width: 480px) and (max-width: 768px) {
	.story-item > h3{text-align: center};
}*/


.slideshow{
	position: relative;
	display: inline-block;
	width: 100%;
	height: auto;
}

/*story*/

.stories{
	position: relative;
	display: inline-block;
	width: 100%;
	height: auto;
	background-color: #FFF;
	color: #ff5289;
	padding: 85px 0 20px;
}
.story-item{
	padding: 0 0px 40px;
}
.story-item > p{
	font-size: 12px;
	line-height: 1.8em;
}

.story-item > img,
.story-item > p,
.story-item > h3{
	padding: 0 35px;
}

@media screen and (max-width: 768px) {
	.story-item > h3{text-align: center};
}
/*@media (min-width: 401px) and (max-width: 767px) {
	.carousel-control{position: absolute; top: 40%; font-size: 45px;}
}*/


.timetable{
	position: relative;
	display: inline-block;
	margin: 0px;
	width: 100%;
	height: 545px;
	background-color: #ff5289;
	color: #FFF;
	padding: 0px 5px;
}
.timetable h1{
	font-size: 110px;
}
@media screen and (max-width: 480px) {
	.timetable h1{
		font-size: 60px;
	}
}

/*fb\-like*/
.facebook-like{
	width: 60px;
	margin-bottom: 50px;
}
.facebook-like > i{
	color: #FFF;
	font-size: 5em;
}



/*carousel*/
/*==========Carousel==========*/
.carousel-control {position: absolute; top: 42%; left: 0; width: 40px; height: 40px; margin-top: -20px; font-size: 60px; font-weight: normal; line-height: 30px; color: #ffffff; text-align: center; background: transparent; border: none;
  -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; opacity: 0.7; filter: alpha(opacity=70); /*IE8*/-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";}
.carousel-control.left{background-image: none;}
.carousel-control.right{background-image: none;}

@media screen and (max-width: 400px) {
	.carousel-control{position: absolute; top: 36%; font-size: 35px;}
}
@media (min-width: 401px) and (max-width: 767px) {
	.carousel-control{position: absolute; top: 40%; font-size: 45px;}
}
/*==========Masthead (The banner area)==========*/
.fullwidthCarousel {position: relative; padding: 0; text-align: center;}
.fullwidthCarousel img{width: 100%; max-width: 100%; height: auto; width: 100%\9; /* ie8 */ z-index:1; padding: 0; margin: 0;}
.fullwidthCarousel .carousel-control{width: 80px; height: 80px; margin-top: 0;}
.fullwidthCarousel .carousel-control span{color: #FFF; font-size: 80px;}




.carousel-control.left {
	background-image: none;
}

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

.carousel-control .icon-prev,
.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: inline-block;
}

.carousel-control .icon-prev,
.carousel-control .glyphicon-chevron-left {
  left: 50%;
}

.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-right {
  right: 50%;
}

.carousel-control .icon-prev,
.carousel-control .icon-next {
  width: 20px;
  height: 20px;
  margin-top: -10px;
  margin-left: -10px;
}