/*
	FTD - LINHA DO TEMPO
	--------------------
	@author: Tequilla!
*/

body { -webkit-touch-callout: none; -webkit-user-select:none; }
button { outline: none; }
a { text-decoration: none; color: #000000; }

.brown { background: #533525; }
.avacado { background: #19b996; }
.beige { background: #f6f5e3; }
.cream { background: #edecda; }
.yellow { background: #e8e058; }
.red { background: #d64d64; }

#main * { -webkit-touch-callout: none; -webkit-user-select:none; }
#main { position: relative; padding: 14px 0; width: 1024px; height: 740px; background: #f8f8f8; }

#main .intro { visibility: hidden; position: relative; width: 1024px; height: 740px; background: url( '../img/background.jpg' ); overflow: hidden; z-index: 1; }
#main .intro-logo { position: absolute; top: 85px; left: 378px;}
#main .intro-box { position: absolute; top: 196px; left: 76px; padding: 22px 15px; width: 836px; }
#main .intro-box-background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; }
#main .intro-box-title { float: left; width: 380px; font-family: 'fishfingersregular'; font-size: 75px; line-height: 62px; color: #19b996; letter-spacing: -1px; text-align: right; text-transform: uppercase; }
#main .intro-box-text { position: relative; float: right; width: 390px; font-family: Helvetica; font-size: 22px; color: #533525; line-height: 25px; }
#main .intro-box-text-click { color: #ed0e33; }
#main .intro-init { position: relative; top: 530px; left: 438px; padding : 0; margin : 0; }
#main .intro-init-circle { position: absolute; width: 120px; height: 120px; font-family: 'fishfingerslight'; font-size: 50px; color: #edecda; text-transform: uppercase; border: 0; border-radius: 60px; box-sizing: border-box; padding : 0; margin : 0; }

#main .timeline { visibility: hidden; position: absolute; top: 0; padding: 0 30px; width: 964px; height: 768px; overflow: hidden; z-index: 0; }
#main .timeline-background { position: absolute; top: 50%; left: 50%; margin: -700px 0 0 -700px; width: 1400px; height: 1400px; border-radius: 700px; }
#main .timeline-content { position: relative; }
#main .timeline-content-beings { padding: 80px 0 70px 0; }
#main .timeline-content-beings ul li { position: relative; float: left; width: 25%; height: 312px; }
#main .timeline-content-beings-circle { position: absolute; top: 26px; left: 50%; margin-left: -115px; width: 230px; height: 230px; border-radius: 115px; }
#main .timeline-content-beigns-pic { position: absolute; opacity: 1; }
#main .timeline-content-beigns-pic-special { position: absolute; opacity: 0; }
#main .timeline-content-beings ul li:nth-child(1) .timeline-content-beigns-pic { margin-left: -10px; }
#main .timeline-content-beings ul li:nth-child(2) .timeline-content-beigns-pic { margin-left: -10px; }
#main .timeline-content-beings ul li:nth-child(3) .timeline-content-beigns-pic { margin: -10px 0 0 -8px; }
#main .timeline-content-beings ul li:nth-child(4) .timeline-content-beigns-pic { margin-left: 6px; }
#main .timeline-content-beings ul li:nth-child(3) .timeline-content-beigns-pic-special { margin: -10px 0 0 -8px; }
#main .timeline-content-beings-more { position: absolute; top: 235px; left: 50%; margin-left: -38px; width: 71px; height: 71px; font-family: 'Gotham HTF Bold'; font-size: 60px; line-height: 24px; border-radius: 36px; overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; }
#main .timeline-content-beings ul li:nth-child(1) .timeline-content-beings-more { color: #533525; background: #efe6d8; border: 5px solid #dcdccf; }
#main .timeline-content-beings ul li:nth-child(2) .timeline-content-beings-more { color: #19b996; background: #efe6d8; border: 5px solid #dcdccf; }
#main .timeline-content-beings ul li:nth-child(3) .timeline-content-beings-more { color: #e8e058; background: #efe6d8; border: 5px solid #dcdccf; }
#main .timeline-content-beings ul li:nth-child(4) .timeline-content-beings-more { color: #d64d64; background: #efe6d8; border: 5px solid #dcdccf; }
#main .timeline-content-slider-timelines { position: relative; }
#main .timeline-content-slider-timelines ul li { position: relative; margin-top: 4px; height: 33px; }
#main .timeline-content-slider-timelines ul li:first-child { margin-top: 0; }
#main .timeline-content-slider-timelines-line { position: absolute; top: 14px; width: 100%; height: 5px; border-radius: 10px; z-index: 0; }
#main .timeline-content-slider-timelines-line.chicken { background: url( '../img/timeline_chicken.gif' ) repeat-x; }
#main .timeline-content-slider-timelines-line.cat { background: url( '../img/timeline_cat.gif' ) repeat-x; }
#main .timeline-content-slider-timelines-line.bean { background: url( '../img/timeline_bean.gif' ) repeat-x; }
#main .timeline-content-slider-timelines-line.baby { background: url( '../img/timeline_baby.gif' ) repeat-x; }
#main .timeline-content-slider-timelines-icon { position: relative; float: left; width: 8.33%; height: 33px; text-align: center; z-index: 1; }
#main .timeline-content-slider-months { padding: 12px 0; overflow: hidden; }
#main .timeline-content-slider-months ul li { float: left; width: 8.33%; font-family: Helvetica; font-size: 18px; color: #565e69; font-weight: bold; text-align: center; }
#main .timeline-content-slider-text { padding: 17px 0; font-family: Helvetica; font-size: 18px; color: #565e69; font-weight: bold; text-align: center; }

#main .lightbox { display: none; position: absolute; top: 0; width: 100%; height: 100%; z-index: 3; }
#main .lightbox-container { position: relative; width: 100%; height: 100%; }
#main .lightbox-window { display: none; position: absolute; width: 100%; height: 100%; }
#main .lightbox-content { position: relative; width: 100%; height: 100%; }
#main .lightbox-background { position: absolute; width: 100%; height: 100%; opacity: .9; }
#main .lightbox-window:nth-child(1) .lightbox-background { background: #e5e5d5; }
#main .lightbox-window:nth-child(2) .lightbox-background { background: #e5e5d5; }
#main .lightbox-window:nth-child(3) .lightbox-background { background: #e5e5d5; }
#main .lightbox-window:nth-child(4) .lightbox-background { background: #e5e5d5; }
#main .lightbox-popup { position: relative; width: 500px; height: 500px; border-radius: 250px; }
#main .lightbox-window:nth-child(1) .lightbox-popup { top: 36px; left: 36px; color: #edecda; }
#main .lightbox-window:nth-child(2) .lightbox-popup { top: 36px; left: 176px; color: #070707; }
#main .lightbox-window:nth-child(3) .lightbox-popup { top: 36px; left: 326px; color: #070707; }
#main .lightbox-window:nth-child(4) .lightbox-popup { top: 36px; left: 486px; color: #edecda; }
#main .lightbox-window:nth-child(1) .lightbox-popup a { color: #edecda; }
#main .lightbox-window:nth-child(2) .lightbox-popup a { color: #070707; }
#main .lightbox-window:nth-child(3) .lightbox-popup a { color: #070707; }
#main .lightbox-window:nth-child(4) .lightbox-popup a { color: #edecda; }
#main .lightbox-popup-close { position: absolute; top: 85px; right: 80px; width: 55px; text-align: center; }
#main .lightbox-popup-close-x { font-family: 'Gotham HTF Thin'; font-size: 60px; line-height: 20px; }
#main .lightbox-popup-close-text { font-family: Georgia; font-size: 12px; font-style: italic; font-weight: bold; }
#main .lightbox-popup-content { position: absolute; top: 90px; left: 80px; pointer-events:none; }
#main .lightbox-popup-content-being { font-family: 'fishfingerslight'; font-size: 58px; text-transform: uppercase; }
#main .lightbox-popup-content-month { margin-top: -5px; font-family: 'fishfingersregular'; font-size: 58px; font-weight: bold; text-transform: uppercase; }
#main .lightbox-popup-content-text { margin-top: 10px; width: 350px; font-family: Helvetica; font-size: 21px; line-height: 23px; }
#main .lightbox-popup-content-text span { display: none; }