// ____ _____ ____ _____ _____ // | _ \| ____/ ___|| ____|_ _| // | |_) | _| \___ \| _| | | // | _ <| |___ ___) | |___ | | // |_| \_\_____|____/|_____| |_| // // http://meyerweb.com/eric/tools/css/reset/ // v2.0 | 20110126 | License: none (public domain) html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; } * { margin: 0; padding: 0; } input { margin: 0; padding: 0; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 100%; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } ul, ol, li { list-style-type: none; } input, textarea { outline: none; } strong { font-weight: bold; } .fr { float: right; } .fl { float: left; } .cb { clear: both; } .mb-0 { margin-bottom: 0!important; } .pb-0 { padding-bottom: 0!important; } // _ _ __ _____ _ _ _____ _____ ___ _ _ _____ ____ // | | / \\ \ / / _ \| | | |_ _| | ___/ _ \| \ | |_ _/ ___| // | | / _ \\ V / | | | | | | | | | |_ | | | | \| | | | \___ \ // | |___ / ___ \| || |_| | |_| | | | | _|| |_| | |\ | | | ___) | // |_____/_/ \_\_| \___/ \___/ |_| |_| \___/|_| \_| |_| |____/ // .body-font { .open-sans-light; } .paragraph-font { .open-sans-light; font-size: 14px; line-height: 22px; @media all and (max-width: 992px) { .open-sans-light; font-size: 14px; line-height: 22px; } } .heading-1-font { .trajan-regular; font-size: 28px; line-height: 35px; @media all and (max-width: 414px) { font-size: 23px; line-height: 31px; } } .heading-2-font { .open-sans-light; font-size: 28px; line-height: 34px; @media all and (max-width: 992px) { font-size: 21px; } @media all and (max-width: 414px) { font-size: 20px; line-height: 27px; } } .heading-3-font { .open-sans-light; font-size: 21px; line-height: 35px; @media all and (max-width: 414px) { font-size: 20px; line-height: 27px; } } .heading-5-font { .open-sans-light; font-size: 17px; line-height: 23px; @media all and (max-width: 992px) { font-size: 16px; line-height: 21px; } } .heading-6-font { .trajan-regular;; font-size: 15px; @media all and (max-width: 414px) { font-size: 15px; line-height: 24px; } } // ____ _____ _ _ _____ ____ _ _ // / ___| ____| \ | | ____| _ \ / \ | | // | | _| _| | \| | _| | |_) | / _ \ | | // | |_| | |___| |\ | |___| _ < / ___ \| |___ // \____|_____|_| \_|_____|_| \_\/_/ \_\_____| // body { .body-font; font-size: 14px; line-height: 19px; overflow-x: hidden; &.hide-content { overflow: hidden; } } body, html { background: #fff; height: 100%; } html, body { height: 100%; margin: 0; padding: 0; h1 { .heading-1-font; } h2 { .heading-2-font; } h3 { .heading-3-font; } h5 { .heading-5-font; } h6 { .heading-6-font; } p { .paragraph-font; } } #page-wrapper { height: 100%; position: relative; .first-page { height: 100%; } #header-wrapper { } .carousel, .carousel .item { background-size: cover; background-position: center; height: 100vh; } .carousel-fade { .carousel-inner { .item { .transition-single(opacity, 1s); } .item, .active.left, .active.right { opacity: 0; } .active, .next.left, .prev.right { opacity: 1; } .next, .prev, .active.left, .active.right { left: 0; transform: translate3d(0, 0, 0); } } .carousel-control { z-index: 2; } } .scroll-to-content { position: fixed; bottom: 36px; left: 50%; width: 170px; height: 43px; z-index: 4; .arrow-big { display: block; position: relative; bottom: 20px; left: -25px; width: 50px; height: 50px; cursor: pointer; z-index: 1001; transition: .5s ease-out; background: rgba(0, 0, 0, 0.4); border-radius: 50%; &:before, &:after { content: ''; display: block; position: absolute; bottom: 23px; left: 50%; width: 18px; height: 2px; background: #fff; } &:before { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); margin-left: -15px; } &:after { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); margin-left: -4px; } &.slidedown { bottom: 10px; } } } .arrow { position: fixed; bottom: 25px; left: 50%; margin-left: -20px; width: 36px; height: 36px; background-color: @white; background-size: contain; text-align: center; .round(50px); padding-top: 7px; padding-left: 1px; i { font-size: 11px; line-height: 7px; display: block; } i.first { } i.second { } i.third { } } .slider-wrapper { .logo { .gotham-bold; font-size: 23px; letter-spacing: 0.1em; position: absolute; top: 10px; right: 38px; z-index: 9; } .carousel-inner { height: 100%; .bg { background-repeat: no-repeat; background-size: cover; } .bg1 { background-image: url('../images/content/slide-1.jpg') !important; background-position: center center; } .bg2 { background-image: url('../images/content/slide-2.jpg') !important; background-position: center center; } .bg3 { background-image: url('../images/content/slide-3.jpg') !important; background-position: center center; } .bg4 { background-image: url('../images/content/slide-4.jpg') !important; background-position: center center; } .bg5 { background-image: url('../images/content/slide-5.jpg') !important; background-position: center center; } .insights-bg-1 { background-image: url('../images/content/clients-slide-1.jpg') !important; background-position: center bottom; } .portfolio-bg-1 { background-image: url('../images/content/portfolio-slide-1.jpg') !important; background-position: center bottom; } .case-study-bg-1 { background-image: url('../images/content/case-study-slide-1.jpg') !important; background-position: center center; } .contact-us-bg-1 { background-image: url('../images/content/contact-us-slide-1.jpg') !important; background-position: center center; } .project-bg-1 { background-image: url('../images/content/project-slide-1.jpg') !important; background-position: center bottom; } .project-conrad-sanya-haitang-bay-bg-1 { background-image: url('../images/content/project-conrad-sanya-haitang-bay-resort-slide-1.jpg') !important; background-position: center bottom; } .project-conrad-sanya-haitang-bay-bg-2 { background-image: url('../images/content/project-conrad-sanya-haitang-bay-resort-slide-2.jpg') !important; background-position: center bottom; } .project-conrad-sanya-haitang-bay-bg-3 { background-image: url('../images/content/project-conrad-sanya-haitang-bay-resort-slide-3.jpg') !important; background-position: center bottom; } .project-doubletree-sanya-bg-1 { background-position: center bottom; } .project-double-tree-sanya-bg-1 { background-image: url('../images/content/project-double-tree-sanya-slide-1.jpg') !important; background-position: center bottom; } .project-double-tree-sanya-bg-2 { background-image: url('../images/content/project-double-tree-sanya-slide-2.jpg') !important; background-position: center bottom; } .project-double-tree-sanya-bg-3 { background-image: url('../images/content/project-double-tree-sanya-slide-3.jpg') !important; background-position: center bottom; } .project-hilton-ningbo-bg-1 { background-image: url('../images/content/project-hilton-ningbo-slide-1.jpg') !important; background-position: center bottom; } .project-hilton-ningbo-bg-2 { background-image: url('../images/content/project-hilton-ningbo-slide-2.jpg') !important; background-position: center bottom; } .project-hilton-ningbo-bg-3 { background-image: url('../images/content/project-hilton-ningbo-slide-3.jpg') !important; background-position: center bottom; } .project-indigo-zheng-zhou-bg-1 { background-image: url('../images/content/project-indigo-zheng-zhou-slide-1.jpg') !important; background-position: center bottom; } .project-indigo-zheng-zhou-bg-2 { background-image: url('../images/content/project-indigo-zheng-zhou-slide-2.jpg') !important; background-position: center bottom; } .project-krabi-resort-bg-1 { background-image: url('../images/content/project-krabi-resort-slide-1.jpg') !important; background-position: center bottom; } .project-krabi-resort-bg-2 { background-image: url('../images/content/project-krabi-resort-slide-2.jpg') !important; background-position: center bottom; } .project-krabi-resort-bg-3 { background-image: url('../images/content/project-krabi-resort-slide-3.jpg') !important; background-position: center bottom; } .project-novotel-jaipur-bg-1 { background-image: url('../images/content/project-novotel-jaipur-slide-1.jpg') !important; background-position: center bottom; } .project-novotel-jaipur-bg-2 { background-image: url('../images/content/project-novotel-jaipur-slide-2.jpg') !important; background-position: center bottom; } .project-novotel-jaipur-bg-3 { background-image: url('../images/content/project-novotel-jaipur-slide-3.jpg') !important; background-position: center bottom; } .project-podo-bg-1 { background-image: url('../images/content/project-podo-slide-1.jpg') !important; background-position: center bottom; } .project-raycom-bg-1 { background-image: url('../images/content/project-raycom-slide-1.jpg') !important; background-position: center bottom; } .project-raycom-bg-2 { background-image: url('../images/content/project-raycom-slide-2.jpg') !important; background-position: center bottom; } .project-raycom-bg-3 { background-image: url('../images/content/project-raycom-slide-3.jpg') !important; background-position: center bottom; } .project-regent-jakarta-bg-1 { background-image: url('../images/content/project-regent-jakarta-slide-1.jpg') !important; background-position: center bottom; } .project-regent-jakarta-bg-2 { background-image: url('../images/content/project-regent-jakarta-slide-2.jpg') !important; background-position: center bottom; } .project-regent-jakarta-bg-3 { background-image: url('../images/content/project-regent-jakarta-slide-3.jpg') !important; background-position: center bottom; } .project-regent-xi-an-bg-1 { background-image: url('../images/content/project-regent-xi-an-slide-1.jpg') !important; background-position: center bottom; } .project-regent-xi-an-bg-2 { background-image: url('../images/content/project-regent-xi-an-slide-2.jpg') !important; background-position: center bottom; } .project-regent-xi-an-bg-3 { background-image: url('../images/content/project-regent-xi-an-slide-3.jpg') !important; background-position: center bottom; } .project-regent-xi-an-bg-4 { background-image: url('../images/content/project-regent-xi-an-slide-4.jpg') !important; background-position: center bottom; } .project-renaissance-and-courtyard-by-marriott-bg-1 { background-image: url('../images/content/project-renaissance-and-courtyard-by-marriott-slide-1.jpg') !important; background-position: center bottom; } .project-renaissance-and-courtyard-by-marriott-bg-2 { background-image: url('../images/content/project-renaissance-and-courtyard-by-marriott-slide-2.jpg') !important; background-position: center bottom; } .project-renaissance-and-courtyard-by-marriott-bg-3 { background-image: url('../images/content/project-renaissance-and-courtyard-by-marriott-slide-3.jpg') !important; background-position: center bottom; } .project-renaissance-and-courtyard-by-marriott-bg-4 { background-image: url('../images/content/project-renaissance-and-courtyard-by-marriott-slide-4.jpg') !important; background-position: center bottom; } .project-samui-resort-bg-1 { background-image: url('../images/content/project-samui-resort-slide-1.jpg') !important; background-position: center bottom; } .project-sheraton-mactan-bg-1 { background-image: url('../images/content/project-sheraton-mactan-slide-1.jpg') !important; background-position: center bottom; } .project-shimao-hongqiao-mini-hotel-bg-1 { background-image: url('../images/content/project-shimao-hongqiao-mini-hotel-slide-1.jpg') !important; background-position: center bottom; } .project-shimao-hongqiao-mini-hotel-bg-2 { background-image: url('../images/content/project-shimao-hongqiao-mini-hotel-slide-2.jpg') !important; background-position: center bottom; } .project-six-senses-uluwatu-bg-1 { background-image: url('../images/content/project-six-senses-uluwatu-slide-1.jpg') !important; background-position: center bottom; } .project-six-senses-uluwatu-bg-2 { background-image: url('../images/content/project-six-senses-uluwatu-slide-2.jpg') !important; background-position: center bottom; } .project-travelodge-bg-1 { background-image: url('../images/content/project-travelodge-slide-1.jpg') !important; background-position: center bottom; } .project-travelodge-bg-2 { background-image: url('../images/content/project-travelodge-slide-2.jpg') !important; background-position: center bottom; } .project-travelodge-bg-3 { background-image: url('../images/content/project-travelodge-slide-3.jpg') !important; background-position: center bottom; } .project-travelodge-bg-4 { background-image: url('../images/content/project-travelodge-slide-4.jpg') !important; background-position: center bottom; } .project-wanda-reign-xsbn-bg-1 { background-image: url('../images/content/project-wanda-reign-xsbn-slide-1.jpg') !important; background-position: center bottom; } .project-wanda-reign-xsbn-bg-2 { background-image: url('../images/content/project-wanda-reign-xsbn-slide-2.jpg') !important; background-position: center bottom; } .project-wanda-reign-xsbn-bg-3 { background-image: url('../images/content/project-wanda-reign-xsbn-slide-3.jpg') !important; background-position: center bottom; } .project-wanda-reign-xsbn-bg-4 { background-image: url('../images/content/project-wanda-reign-xsbn-slide-4.jpg') !important; background-position: center bottom; } .project-benxi-doubletree-by-hilton-bg-1 { background-image: url('../images/content/project-benxi-doubletree-by-hilton-slide-1.jpg') !important; background-position: center bottom; } .project-fairmont-sanur-beach-bali-bg-1 { background-image: url('../images/content/project-fairmont-sanur-beach-bali-slide-1.jpg') !important; background-position: center top; } .project-hilton-fengxian-bg-1 { background-image: url('../images/content/project-hilton-fengxian-slide-1.jpg') !important; background-position: center bottom; } .project-hilton-goa-bg-1 { background-image: url('../images/content/project-hilton-goa-slide-1.jpg') !important; background-position: center top; } .project-hyatt-regency-jeju-bg-1 { background-image: url('../images/content/project-hyatt-regency-jeju-slide-1.jpg') !important; background-position: center bottom; } .project-kokotel-bangkok-bg-1 { background-image: url('../images/content/project-kokotel-bangkok-slide-1.jpg') !important; background-position: center bottom; } .project-regent-phuket-cape-panwa-bg-1 { background-image: url('../images/content/project-regent-phuket-cape-panwa-slide-1.jpg') !important; background-position: center bottom; } .project-jumeirah-dhevanfushi-bg-1 { background-image: url('../images/content/project-jumeirah-dhevanfushi-slide-1.jpg') !important; background-position: center bottom; } .project-princes-palace-resort-and-spa-bg-1 { background-image: url('../images/content/project-princes-palace-resort-and-spa-slide-1.jpg') !important; background-position: center bottom; } .project-miaonong-resort-bg-1 { background-image: url('../images/content/project-miaonong-resort-slide-1.jpg') !important; background-position: center bottom; } .project-marriott-wenchang-bg-1 { background-image: url('../images/content/project-marriott-wenchang-slide-1.jpg') !important; background-position: center -95px; @media all and (max-width: 1280px) { background-position: center bottom; } } .project-melia-bali-bg-1 { background-image: url('../images/content/project-melia-bali-slide-1.jpg') !important; background-position: center bottom; } .project-qianshen-spa-and-hotel-bg-1 { background-image: url('../images/content/project-qianshen-spa-and-hotel-slide-1.jpg') !important; background-position: center bottom; } .project-sheraton-grande-walkerhill-restaurants-bg-1 { background-image: url('../images/content/project-sheraton-grande-walkerhill-restaurants-slide-1.jpg') !important; background-position: center bottom; } .project-sarasvati-a-luxury-collection-resort-bg-1 { background-image: url('../images/content/project-sarasvati-a-luxury-collection-resort-slide-1.jpg') !important; background-position: center bottom; } .project-sarasvati-a-luxury-collection-resort-bg-2 { background-image: url('../images/content/project-sarasvati-a-luxury-collection-resort-slide-2.jpg') !important; background-position: center bottom; } .project-regent-taipei-bg-1 { background-image: url('../images/content/project-regent-taipei-slide-1.jpg') !important; background-position: center bottom; } .profile-bg-1 { background-image: url('../images/content/profile-slide-1.jpg') !important; background-position: center top; } .news-bg-1 { background-image: url('../images/content/news-slide-1.jpg') !important; background-position: center bottom; } .careers-bg-1 { background-image: url('../images/content/careers-slide-1.jpg') !important; background-position: top center; } .story-jumeirah-dhevanafushi-bg-1 { background-image: url('../images/content/story-jumeirah-dhevanafushi-slide-1.jpg') !important; background-position: bottom center; } .story-fairmont-sanur-beach-bg-1 { background-image: url('../images/content/story-fairmont-sanur-beach-slide-1.jpg') !important; background-position: bottom center; } .item { background-color: @text-grey; .carousel-caption { z-index: 6; } } } .carousel-indicators { right: -24% !important; bottom: 30px !important; left: auto; li { margin-right: 10px; width: 8px; height: 8px; background-color: #a1a1a1; border: 0; &.active { margin: 1px; margin-right: 10px; width: 8px; height: 8px; background-color: @white; border: 0; } } } div.item { div.carousel-caption-up { top: 75%; } div.carousel-caption-with-text { top: 38% !important; } div.carousel-caption { width: 780px; position: absolute; left: 50%; bottom: 11%; &.insights-caption { width: 48%; } div.caption-text { position: relative; left: -50%; h1 { text-shadow: none; } } } #blur-bg { content: ""; position: fixed; left: 0; bottom: 0; z-index: -1; display: none; // temp background: url('../images/content/blur-bg.png') no-repeat; width: 473px; height: 414px; -webkit-filter: blur(5px); -moz-filter: blur(5px); -o-filter: blur(5px); -ms-filter: blur(5px); filter: blur(5px); } #blur-bg-2 { content: ""; position: fixed; left: 0; bottom: 0; z-index: -1; display: none; // temp background: url('../images/content/blur-bg-2.png') no-repeat; width: 473px; height: 414px; -webkit-filter: blur(5px); -moz-filter: blur(5px); -o-filter: blur(5px); -ms-filter: blur(5px); filter: blur(5px); } div.carousel-caption-2 { display: none; // temp position: absolute; bottom: 45px; left: 37px; h3 { .gotham-medium; font-size: 18px; line-height: 23px; letter-spacing: 0.075em; margin-bottom: 10px; } ul { border-top: 1px solid @white; border-bottom: 1px solid @white; padding: 14px 0 8px 0; li { margin-bottom: 5px; span.title { .gotham-medium; font-size: 11px; letter-spacing: 0.05em; min-width: 110px; display: inline-block; vertical-align: top; } span.content { .trajan-regular; font-size: 12px; line-height: 17px; max-width: 160px; display: inline-block; vertical-align: top; } } } } } } #content-wrapper { overflow: hidden; } #footer-wrapper { height: auto; width: 100%; left: 0; bottom: 48px; &.fixed-footer { position: static !important; } } #copyright-wrapper { height: auto; width: 100%; left: 0; bottom: 0; &.fixed-footer { position: static !important; } } .seperator-dot { width: 6px; height: 6px; background-color: @white; margin: 10px auto; .round(50px); } .seperator-line { background-color: @dark-blue !important; width: 43px; height: 2px; } div.dropdown { display: inline-block; position: relative; width: 100%; height: 30px; i { position: absolute; right: 10px; top: 7px; } select { width: 100%; height: 100%; .appearance(none); .round(0px); background-color: @bg-light-grey; .placeholder(@light-grey); .open-sans-light; font-size: 12px; line-height: 21px; border: 2px solid @bg-light-grey; padding-left: 11px; padding-right: 5px; } } input[type="checkbox"] { margin: 0; .opacity(0); z-index: 999; position: relative; top: 0; left: 2px; display: inline-block; } input[type="checkbox"] + label span { width: 12px; height: 12px; margin-right: 8px; border: 1px solid #a7a9ac; z-index: -999; display: inline-block; font-size: 17px; line-height: 18px; } input[type="checkbox"]:checked + label span:after { content: '\2713'; position: absolute; top: -2px; left: 2px; } label.checkbox-label { display: inline-block; margin-left: -17px; position: relative; vertical-align: top; p.label-text { display: inline-block; line-height: 18px; vertical-align: top; height: 13px; font-size: 13px; letter-spacing: 0.03em; } } } a, a:link, a:hover, a:active, a:visited { text-decoration: none; cursor: pointer; .transition(); } h1 { .gotham-bold; } h2 { .gotham-bold; } h3 { .gotham-bold; } h4 { } h5 { } hr.small { width: 30px; margin-top: 12px; margin-bottom: 15px; } // p { // } #return-to-top { position: fixed; bottom: 30%; right: 50px; background: rgb(0, 0, 0); background: rgba(0, 0, 0, 0.7); width: 50px; height: 50px; display: block; text-decoration: none; -webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px; display: none; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } #return-to-top i { margin: 0; position: relative; left: 16px; top: 13px; font-size: 19px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } #return-to-top:hover { background: rgba(0, 0, 0, 0.9); } #return-to-top:hover i { top: 5px; } .cta { .open-sans-light; text-transform: capitalize; font-size: 14px; font-style: italic; i { display: inline-block; margin-left: 10px; position: relative; top: 1px; font-size: 17px; line-height: 24px; letter-spacing: 0.1em; } &:hover { border-color: @dark-blue; } } .vertical-line { border-left: 1px solid #ccc; height: 770px; width: 1px; margin: 0 auto; margin-right: 50px; }