
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,700,800|Poly:400,400italic);

* { margin:0; padding:0; text-decoration:none; list-style:none; outline:none; }
html, body { width:100%; height:100%; }
#container { padding-top:110px; position:relative; background:#FFF; }
.centre { max-width:1200px; margin:auto; padding:0 50px; position:relative; }
a img { border:none; }

/******************** 1.0 - Navigation ********************/

#nav { width:100%; height:110px; position:fixed; background:#FFF; box-shadow:0 0 1px rgba(0,0,0,.2),0 0 15px rgba(0,0,0,.15); z-index:100; }
#nav .centre { height:100%; }
#nav .logo { position:absolute; top:50%; left:50px; transform:translate(0,-50%); -webkit-transform:translate(0,-50%); -ms-transform:translate(0,-50%); }
#nav nav { position:absolute; top:50%; right:308px; margin-top:-20px; }
#nav nav li { float:left; position:relative; }
#nav nav li.mobile { display:none; }
#nav nav li a { height:40px; padding:0 14px; font:12px/40px 'Open Sans', sans-serif; color:#000; letter-spacing:.8px; text-transform:uppercase; display:block; position:relative; }
#nav nav li a:after { content:""; width:calc(100% - 24px); height:2px; position:absolute; bottom:7px; left:12px; }
#nav nav li.active a { font-weight:800; opacity:1; }
#pull { width:25px; font-size:25px; position:absolute; top:7px; right:236px; display:none; cursor:pointer; }
.hover #nav .logo:hover { opacity:.5; }
.hover #nav nav li:hover a:after { background:rgba(0,0,0,.1); }

/* 1.1 - Drop Downs */

#nav nav li ul { position:absolute; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,.1); display:none; }
#nav nav li ul li { float:none; }
#nav nav li ul li a { min-width:150px; height:44px; padding:0 14px; font-size:12px; line-height:44px; color:#FFF; font-weight:600 !important; white-space:nowrap; text-transform:none; background:#555; border-bottom:1px solid #424242; cursor:pointer; }
#nav nav li ul li a i { font-size:11px; position:absolute; top:50%; right:12px; margin-top:-5px; color:rgba(255,255,255,.2); }
#nav nav li ul li:last-of-type a { border:none; }
#nav nav li ul li a:after { display:none; }
#nav nav li ul li ul { top:0; left:100%; }
#nav nav li ul li ul li a { background:#484848; border-bottom:1px solid #383838 !important; }
#nav nav li ul li ul li:last-of-type a { border:none !important; }
#nav nav li ul li.active a, .hover #nav nav li ul li:hover a { background:#484848; }
#nav nav li ul li ul li.active a { background:#404040 !important; }
.hover #nav nav li ul li ul li a:hover { background:#404040; }

/* 1.2 - Languages */

#language { max-height:30px; margin-top:-15px; position:absolute; top:50%; right:240px; border-radius:4px; box-shadow:1px 1px 0 rgba(0,0,0,.12); overflow:hidden; }
#language li a { width:22px; height:20px; padding:10px 0 0 32px; font:bold 10px/10px 'Open Sans', sans-serif; color:#000; letter-spacing:1px; display:block; background:#EEE; border-top:1px solid #D5D5D5; }
#language li:first-child a { background:#EEE !important; border:none; box-shadow:1px 1px 0 rgba(0,0,0,.12); cursor:default; }
#language li a:before { content:""; width:14px; height:11px; position:absolute; left:10px; }
#language li.en a:before { background:url(../images/flag-en.png); }
#language li.cn a:before { background:url(../images/flag-cn.png); }
#language li.fr a:before { background:url(../images/flag-fr.png); }
#language li.de a:before { background:url(../images/flag-de.png); }
#language li.it a:before { background:url(../images/flag-it.png); }
#language:hover { max-height:200px; }
.hover #language li a:hover { background:#DDD; }

/* 1.3 - Book Button */

#nav .book { width:160px; height:50px; font:800 12px/46px 'Open Sans', sans-serif; letter-spacing:1px; text-transform:uppercase; display:block; border-radius:5px; box-sizing:border-box; position:absolute; top:50%; right:50px; margin-top:-25px; overflow:hidden; border:2px solid }
#nav .book span { width:100%; text-indent:15px; position:relative; display:inline-block; }
#nav .book span:before { color:#FFF; position:absolute; left:0; top:100%; content:attr(data-hover); }
#nav .book i { font-size:16px; position:absolute; top:15px; right:15px; }
.hover #nav .book:hover span { transform:translateY(-100%); -webkit-transform:translateY(-100%); -ms-transform:translateY(-100%); }
.hover #nav .book:hover i { color:#FFF; }

/* 1.4 - Fixed Navigation */

#container.scroll { padding-top:80px; }
#nav.scroll { height:80px; }


/******************** 3.0 - Content ********************/

main { font:14px/25px 'Open Sans', sans-serif; color:#000; letter-spacing:.4px; background:top left repeat-x; }
main .centre { padding:70px 50px; }
main .centre:after { content:""; clear:both; display:block; }
main h1, main h2 { margin-bottom:30px; font:600 22px/30px 'Open Sans', sans-serif; text-transform:uppercase; letter-spacing:1.2px; position:relative; }
main h1 strong, main h2 strong { font-weight:800; }
main h3 { margin-bottom:28px; font:700 16px/26px 'Open Sans', sans-serif; text-transform:uppercase; letter-spacing:1px; }
main p { margin:0 0 30px; }
main p.fine { font-size:12px; }
main p a, main p a i, main ul a { font-weight:bold; border-bottom:1px solid #E5E5E5; }
main p.credit { margin:-20px 0 38px; padding:7px 12px 8px; background:#EEE; border-radius:5px; display:inline-block; box-shadow:1px 1px 0 rgba(0,0,0,.12); }
main p.credit a { border-color:#DDD; }
main p.credit i { margin-right:2px; font-size:16px; position:relative; top:2px; }
main hr { margin-bottom:30px; border:1px solid #FFF; border-bottom:1px solid #E5E5E5; }
main ul { margin-bottom:30px; }
main ul li { list-style:circle; }
main ul ul { margin-left:18px; }
main table { max-width:100%; margin:35px 0; background:#F5F5F5; box-shadow:1px 1px 0 rgba(0,0,0,.12); border-radius:5px; overflow:hidden; border-collapse:collapse; position:relative; }
main table:before { content:""; width:100%; height:5px; position:absolute; top:0; left:0; z-index:1; }
main table td, main table th { padding:12px 30px; background:#F5F5F5; }
main table th { padding:22px 30px 17px; font:800 14px/20px 'Open Sans', sans-serif; letter-spacing:1.2px; text-transform:uppercase; background:#FFF; position:relative; }
main table th:before { content:""; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.2; }
main table tr:nth-child(odd) td { background:#EEE; }
main blockquote { width:40%; margin:0 25px 25px -30px; font:bold 25px/30px 'Open Sans', sans-serif; float:left; }
#content { margin:0 0 -38px; }
#content .button { margin-top:5px; margin-bottom:30px; }
//.fullwidth main { text-align:center; }
.fullwidth main h1 { margin-top:-8px; }
.fullwidth main table { margin-left:auto; margin-right:auto; }
.hover main p a:hover, .hover main p a:hover i, .hover main ul a:hover { color:#000; }
.hover main ul.sitemap a:hover { color:#000; }

/* 3.1 - USP Boxes */

.usp { margin:45px 0; }
.usp .box { width:100%; padding:15px 0; }
.usp .box i { width:70px; height:70px; font-size:22px; line-height:66px; text-align:center; border:2px solid; border-radius:100px; box-sizing:border-box; margin:0 30px 0 0; float:left; }
.usp .box p { margin:0; }
.usp h3 { margin-bottom:3px; font:700 16px/22px 'Open Sans', sans-serif; letter-spacing:.5px; text-transform:none; }
.usp .box:after, .usp:after { content:""; display:block; clear:both; }
.fullwidth .usp { margin:45px 0 0; }
.fullwidth .usp .box { width:33.33%; padding:0 15px; float:left; box-sizing:border-box; }
.fullwidth .usp .box:first-child { padding:0 35px 0 0; }
.fullwidth .usp .box:last-child { padding:0 0 0 35px; }
.fullwidth .usp .box i { margin:0 0 20px; float:none; }

/* 3.2 - Feature List */

#featurelist { width:100%; text-align:left; background-color:gainsboro; background-size:100% 100%; position:relative; box-shadow:0 1px 0 rgba(0,0,0,.07),inset 0 1px 0 0 rgba(0,0,0,0.05),inset 0 20px 10px -17px rgba(0,0,0,0.05); z-index:1; }
#featurelist .centre { z-index:1; }
#featurelist h2 { margin:-20px 0 55px; font:italic 40px/45px 'Poly', georgia; text-align:center; letter-spacing:-.3px; text-transform:none; }
#featurelist #slideshow:before { background:rgba(255,255,255,.2); border-color:rgba(0,0,0,.12); }
.featurelist { box-shadow:1px 1px 0 rgba(0,0,0,.1); border-radius:5px; overflow:hidden; }
.feature { width:100%; margin-bottom:1px; padding:40px 30px 10px; background:rgba(255,255,255,.5); border-top:1px solid rgba(255,255,255,.6); box-sizing:border-box; }
.feature:last-child { margin:0; }
.feature .thumb { margin-top:-10px; margin-bottom:20px; border-radius:60px; float:left; border:5px solid #FFF; box-sizing:border-box; box-shadow:1px 1px 0 rgba(0,0,0,.12); }
.feature .details { width:310px; padding:0 40px; line-height:20px; float:left; box-sizing:border-box; }
.feature .details h3 { margin-bottom:3px; font:800 16px/22px 'Open Sans', sans-serif; letter-spacing:1.5px; text-transform:uppercase; }
.feature .details a { padding:10px 10px 10px 0; font:800 12px/20px 'Open Sans', sans-serif; letter-spacing:1.5px; text-transform:uppercase; border:none; }
.feature .details a i { margin-right:3px; font-size:14px; position:relative; bottom:-1px; }
.feature .copy { width:calc(100% - 430px); float:left; }
.feature:after { content:""; display:block; clear:both; }
.hover .feature .details a:hover, .hover .feature .details a:hover i { color:#000; }
.hover .feature:hover { background:#FFF; }
.hover .feature:hover .thumb { transform:scale(1.2); border-radius:5px; border:none; box-shadow:none; }

/* 3.3 - Pagination */

.pagination { margin:20px 0 -10px; background:#EEE; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,.12); display:inline-block; }
.pagination:after { content:""; display:block; clear:both; }
.pagination li { font-weight:800; font-size:12px; color:#BBB; float:left; border-right:1px solid #D5D5D5; list-style:none; }
.pagination li:last-child { margin:0; border:none; }
.pagination li a { padding:10px 17px; display:block; }
.pagination li span { padding:10px 17px; display:block; }
.hover .pagination li a:hover { color:#000; }



/******************** 8.0 - Location ********************/

#map { width:100%; position:relative; background:#E5E3DF; }
#map .spacer { width:100%; min-height:300px; height:auto; display:block; }
#googlemap { width:100%; height:100%; position:absolute; top:0; left:0; }
main #map { min-height:400px; }


/******************** 15.0 - Sitemap ********************/

main ul.sitemap { max-width:800px; margin:0 auto; text-align:center; border-radius:5px; overflow:hidden; box-shadow:1px 1px 0 rgba(0,0,0,.12); position:relative; }
main ul.sitemap * { position:relative; z-index:1; }
main ul.sitemap:before { content:""; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.25; }
main ul.sitemap li { list-style:none; }
main ul.sitemap a { padding:15px; font-size:20px; font-weight:800; display:block; background:none; border:none; }
main ul.sitemap ul { margin:0; }
main ul.sitemap ul a { padding:10px; font-size:14px; font-weight:normal; color:#000; background:#EEE; border-bottom:1px solid #D5D5D5; cursor:pointer; }
main ul.sitemap li:last-child a { border-bottom:none; }
.hover main ul.sitemap a:hover { color:#FFF; }
.hover main ul.sitemap ul a:hover { background:#E5E5E5; color:#000; }

