/*	Default	*/
body { background-color: #fff; font-family: Arial; margin: 0px; min-width: 1000px; padding: 0px; }
body.overflow { overflow-y: scroll; }
a { text-decoration: none; }
img { border: none; }

.button { background-color: #006da7; border-radius: 5px; color: #fff; font-size: 12px; font-weight: bold; padding: 5px 10px; }

/* Header */
.header { background-color: rgba(255, 255, 255, 0.95); box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.25); height: 40px; padding: 10px; position: fixed; width: 100%; z-index: 10; }
.header .inner { margin: 0px auto; min-width: 1000px; width: 80%; }
.header .inner .icon { background: url(../images/icon.png) no-repeat; float: left; height: 40px; width: 40px; }
.header .inner .name { color: #006da7; float: left; font-size: 18px; font-weight: bold; margin: 4px 0px 0px 10px; text-transform: uppercase; }
.header .inner .name .desc { color: #006da7; font-size: 10px; font-weight: normal; }
.header .inner .name a { color: #000; }
.header .inner .nav { float: right; padding: 10px 20px 10px 10px; }
.header .inner .nav .link { border-radius: 3px; color: #000; font-size: 13px; margin: 0px 10px; padding: 7px 10px; transition: all 0.5s; }
.header .inner .nav .link:hover { background-color: #f5f5f5; }
.header .inner .nav .link.current { background-color: #006da7; color: #fff; }

/* Content */
.content { padding-top: 60px; min-width: 1000px; }
.content .front { background: url(../images/front02.jpg) no-repeat center; background-size: cover; height: 450px; }
.content .front.profile { background: url(../images/front01.jpg) no-repeat center; background-size: cover; height: 250px; }
.content .front.project { background: url(../images/front03.jpg) no-repeat center; background-size: cover; height: 250px; }
.content .front .detail { color: #fff; float: right; font-size: 15px; line-height: 24px; padding: 18px; position: absolute; text-shadow: 2px 1px 1px #000; top: 130px; width: 400px; }
.content .front .detail .title { font-size: 28px; font-weight: bold; line-height: 32px; margin-bottom: 15px; }
.content .front .detail .more { margin: 30px 10px 10px 10px; }
.content .front .detail .more .button { float: right; font-size: 15px; font-weight: bold; padding: 10px 15px; text-shadow: none; }
.content .front .page_header { margin: 0px auto; min-width: 1000px; width: 80%; }
.content .front .page_header .title { color: #fff; font-size: 32px; font-weight: bold; padding: 150px 20px 20px 20px; text-shadow: 1px 1px 3px #000; } 
.content .info { min-height: 400px; }
.content .info .inner { margin: 0px auto; min-width: 1000px; width: 80%; }
.content .info .container { padding: 50px 20px 30px 20px; }
.content .info .container .title { color: #000; font-size: 26px; margin-bottom: 30px; }
.content .info .container .text { color: #515151; font-size: 15px; line-height: 22px; margin-bottom: 80px; }
.content .info .container .text p { margin-bottom: 25px; }
.content .info .container .text .more { margin-top: 80px; text-align: center; }
.content .info .container .text .more .button { background-color: #006da7; color: #fff; font-size: 16px; font-weight: bold; padding: 12px 30px; }
.content .info .container .item { box-shadow: 2px 2px 25px rgba(0, 0, 0, 0.25); float: left; margin: 10px 25px 20px 0px; }
.content .info .container .item .innertext { background-image: linear-gradient(to bottom, transparent 20%, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.75)); color: #fff; font-size: 15px; font-weight: bold; height: 40px; margin-top: -120px; padding: 70px 10px 10px 10px; position: absolute; text-align: center; width: 210px; }
.content .info .container .banner { color: #515151; font-family: Tahoma; font-size: 20px; font-weight: bold; margin: 40px 0px; padding: 40px 0px; text-align: center; }
.content .info .container .banner .highlight { color: #006da7; font-size: 30px; font-style: italic; font-family: 'Times New Roman'; font-weight: bold; padding: 0px 4px; }
.content .tiles { min-height: 400px; padding: 10px 0px 30px 0px; }
.content .tiles .inner { margin: 0px auto; min-width: 1000px; width: 80%; }
.content .tiles .inner .title { color: #000; font-size: 26px; padding: 50px 10px 30px 10px; }
.content .tiles .detail { background-color: rgba(0, 0, 0, 0.75); border-radius: 5px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25); color: #fff; font-size: 18px; font-weight: bold; padding: 15px 20px; position: absolute; top: 150px; }
.content .tiles .tile { box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.25); float: left; height: 190px; margin: 5px; transition: box-shadow 0.3s; width: 190px; }
.content .tiles .tile:hover { box-shadow: 3px 15px 40px rgba(0, 0, 0, 0.35); }
.content .maps { }
.content .maps .contact { background-color: rgba(255, 255, 255, 0.95); border-radius: 5px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25); color: #777; float: right; font-size: 12px; line-height: 18px; padding: 20px; position: absolute; top: 150px; width: 300px; z-index: 10; }
.content .maps .contact .title { color: #006da7; font-size: 18px; font-weight: bold; margin-bottom: 20px; }
.content .maps .contact b { color: #000; }
.content .maps .contact a { color: #777; transition: all 0.3s; }
.content .maps .contact td { padding: 0px 10px 5px 0px; }
.content .maps .contact a:hover { color: #006da7; text-decoration: underline; }
.content .miles { min-height: 400px; }
.content .miles .inner { margin: 0px auto; min-width: 1000px; padding-top: 50px; width: 80%; }
.content .miles .inner .timeline { border-left: solid 4px #ddd; height: 220px; margin: 0px 0px 30px 80px; width: 150px; }
.content .miles .inner .timeline.fixed { position: fixed; top: 110px; }
.content .miles .inner .timeline .tag { background-color: #fff; border: solid 3px #ddd; border-radius: 40px; cursor: pointer; height: 16px; margin: 0px 0px 50px -13px; width: 16px; }
.content .miles .inner .timeline .tag.select { background-color: #006da7; border: solid 3px #ddd; }
.content .miles .inner .timeline .tag .text { color: #999; font-size: 16px; font-weight: bold; margin-left: 25px; }
.content .miles .inner .timeline .tag.select .text { color: #006da7; font-size: 16px; font-weight: bold; margin-left: 25px; }
.content .miles .inner .info { padding: 0px 15px 30px 15px; }
.content .miles .inner .info .title { color: #006da7; font-size: 22px; font-weight: bold; margin-bottom: 20px; }
.content .miles .inner .info .text { margin: 0px 0px 50px 0px; }
.content .miles .inner .info .text p { color: #aaa; font-size: 13px; margin: 10px 0px 15px 0px; }
.content .miles .inner .info .text p b { color: #666; font-size: 15px; }
.content .miles .inner .info .item { float: left; margin: 10px 10px 20px 10px; }
.content .miles .inner .info .item img { border: solid 7px #fff; border-radius: 5px; box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.25); }
.content .miles .inner .info .item .title { color: #000; font-size: 13px; font-weight: bold; margin: 15px 0px 0px 0px; min-height: 35px; text-align: center; }

/* Footer */
.footer { background-color: #eee; color: #000; font-size: 13px; }
.footer.blank { background-color: #fff; }
.footer .inner { margin: 0px auto; min-width: 1000px; width: 80%; }
.footer .container { padding: 30px; }
.footer .container .right { color: #555; float: right; }

/* Others */
.clear:after { clear: both; content: "."; display: block; font-size: 0; height: 0; line-height: 0; visibility: hidden; }
.hidden { display: none; }
.fixed { position: fixed; }
.transparent { opacity: 0; }