@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'DBOzone';
    src: url('fonts/db_Ozone.eot');
    src: url('fonts/db_Ozone.eot?#iefix') format('embedded-opentype'),
         url('fonts/db_Ozone.woff') format('woff'),
         url('fonts/db_Ozone.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Sukhumvit';
    src: url('fonts/Sukhumvit_set_Medium.eot');
    src: url('fonts/Sukhumvit_set_Medium.eot?#iefix') format('embedded-opentype'),
         url('fonts/Sukhumvit_set_Medium.woff') format('woff'),
         url('fonts/Sukhumvit_set_Medium.ttf') format('truetype'),
         url('fonts/Sukhumvit_set_Medium.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* Create  */
.topcontent {font-size: 28px; font-family: "Sukhumvit"; color: #b92025;}
.topcontent12 {font-size: 13px; font-family: "Sukhumvit"; color: #b92025;}
.content {font-size: 12px; font-family: "Sukhumvit"; color: #7b6c59;}
.headcontent {font-size: 60px; font-family: "Sukhumvit"; color: #b92025; text-align:center;}
.historycontent {font-size: 18px; font-family: "Sukhumvit"; color: #b92025; text-align:center;}

/* About CEO */
.title {font-size: 18px; font-family: "Sukhumvit"; color: #b92025;}
.ceo {font-size: 18px; font-family: "Sukhumvit"; color: #7b6c59;}
.contentceo {font-size: 15px; font-family: "Sukhumvit"; color: #7b6c59;}

.maincontent { overflow:auto }
.timeline_list { 
	float:left;width:16.66%;overflow:hidden ;
	position:relative;
}
.timeline_list .hover_pic {
	opacity:0;
	position:absolute;top:0px;left:0px;
	width:100%;height:100%;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;    
    transition: all .3s ease-in-out;
} 
.timeline_list .year {
	position:absolute;bottom:20%;left:0px;
	width:100%;
}

.timeline_list:hover .hover_pic {
	opacity:1;
	-webkit-transform: scale(1.1); 
	-moz-transform:scale(1.1); 
	-o-transform:scale(1.1); 
	-ms-transform: scale(1.1); 
	transform:scale(1.1); 
}

#detail-container {display:none }
#detail-content { background:url(../images/about_animate/timeline/detail/bg.jpg) repeat-x top;}
#detail-content > .inner { position:relative;height:100%;overflow:hidden }
#detail-content > .inner .info { margin-left:60px; }
#detail-content > .inner .info > .name-th { font-size:28px;color:#000000;font-weight:bold }
#detail-content > .inner .info > .name-en { font-size:22px;color:#888888;margin-top:-7px; }
#detail-content > .inner .info > .position-th { font-size:26px;color:#616161;font-weight:bold;margin-top:20px; }
#detail-content > .inner .info > .position-en { font-size:22px;color:#888888;margin-top:-7px; }
#detail-content > .inner .btn_left { position:absolute;left:20px;top:50%;margin-top:-80px; }
#detail-content > .inner .btn_right { position:absolute;right:20px;top:50%;margin-top:-80px; }
#detail-content > .inner .btn_close { position:absolute;top:10px;left:50%;margin-left:400px; }

.img_detail { margin-bottom:20px;max-width:900px; }
.pagination-timeline-detail { display:none }


.btn_timeline { position:absolute;right:0px;top:100px;border-top:1px #aaaaaa solid; }
.btn_timeline a { display:block;text-align:right;border-bottom:1px #aaaaaa solid;padding:6px 30px;font-size:24px;font-weight:bold;color:#a81d22  }
.btn_timeline a.active { color:#ffffff;background-color:#a81d22 }