/* Theme Name: Food from the Heart - Passion Ball 2016 */ /* ========================================================================== Base ========================================================================== */ html{font-size:62.5%} @media (max-width:1000px){html{font-size:57%}} @media (max-width:900px){html{font-size:55%}} @media (max-width:700px){html{font-size:50%}} html,body{width:100%;height:100%;font-family: "futura-pt", 'Futura PT', Helvetica, Arial, "sans-serif";background:#eaeaea;} body{font-size:2rem} a{color:#d3af05;-webkit-transition: all .2s ease-out;transition: all .2s ease-out} a:hover{color:#000} hgroup{padding:0;margin:0 0 60px;font-size:0;text-align:center;background:url(img/ui/bg-title.gif) repeat-x center} h1, h2{margin:0;color:#d3af05;font-family:Lora, serif;font-size:5rem;font-weight:normal;line-height:1.2em;text-transform:uppercase} h3{margin:0;font-family:Lora, serif;font-weight:normal;} hgroup h1, hgroup h2{display:inline-block;padding:0 15px;margin:0;vertical-align:middle;background:#eaeaea} hgroup:before, hgroup:after{display:inline-block;width:9px;height:9px;content:'';vertical-align:middle;background:#eaeaea;border:solid 1px #d3af05;border-radius:100%} hgroup.white-bg:before, hgroup.white-bg:after, hgroup.white-bg h2{background:#FFF} hgroup.blank-bg, hgroup.blank-bg:before, hgroup.blank-bg:after, hgroup.blank-bg h2{background:none} hgroup.blank-bg{position:relative} hgroup.blank-bg .line{position:absolute;top:50%;left:0;width:100%;height:1px;background:#d3af05} input[type='number'] {-moz-appearance:textfield;} input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none;} @media (max-width:500px){ hgroup{margin-bottom:7vw;background:none} hgroup h2{padding:0} hgroup:before, hgroup:after{content:none} hgroup .line{display:none} } /* ========================================================================== Common ========================================================================== */ .orange{color:#d3af05} .animated, .animated:before, .animated:after{-webkit-transition: all .2s ease-out;transition: all .2s ease-out} .sct{position:relative;padding:50px 0 95px;font-weight:300} .sct.white-bg{background:#FFF} .sct-inner{position:relative;width:95%;max-width:1400px;margin:0 auto} .title-divider{width:45px;height:2px;margin:22px auto;background:#d3af05} .footnote{width:80%;margin:30px auto 10px;font-size:1.6rem;font-weight:300} .bordered-box{position:relative;text-align:center;background:#FFF} .bordered-box:after{position:absolute;top:10px;left:10px;width:calc(100% - 20px);height:calc(100% - 20px);content:'';border:solid 1px #d3af05;pointer-events:none} .cta{position:relative;display:block;padding:12px 0;margin:0 auto;color:#d3af05;text-align:center;text-transform:uppercase;background:#000;border:0} .cta:focus{outline:0} .cta:not([disabled]):active{-webkit-transform:scale(1.05);transform:scale(1.05);-webkit-transition: all .1s ease-out;transition: all .1s ease-out} .cta:after{position:absolute;top:5px;left:5px;width:calc(100% - 10px);height:calc(100% - 10px);content:'';border:solid 1px #d3af05} .no-touchevents .cta:not(.disabled):not([disabled]):hover, .cta:not(.disabled):not([disabled]):active, .cta:not(.disabled):not([disabled]):focus{color:#000;text-decoration:none;background:#d3af05} .no-touchevents .cta:not(.disabled):not([disabled]):hover:after, .cta:not(.disabled):not([disabled]):active:after{border-color:#000} .cta.disabled, .cta:disabled, .no-touchevents .cta.disabled:hover, .cta.disabled:active{color:#d3af05;text-decoration:none;-webkit-transform:none;transform:none;cursor:default;opacity:.6} .shake{-webkit-animation:shake ease-out .3s;animation:shake ease-out .3s;} @-webkit-keyframes shake{0%{-webkit-transform:translateX(0px);transform:translateX(0px);} 12.5%{-webkit-transform:translateX(-12px);transform:translateX(-12px);} 37.5%{-webkit-transform:translateX(12px);transform:translateX(12px);} 50%{-webkit-transform:translateX(0px);transform:translateX(0px);} 62.5%{-webkit-transform:translateX(-5px);transform:translateX(-5px);} 87.5%{-webkit-transform:translateX(5px);transform:translateX(5px);} 100%{-webkit-transform:translateX(0px);transform:translateX(0px);} } @keyframes shake{0%{-webkit-transform:translateX(0px);transform:translateX(0px);} 12.5%{-webkit-transform:translateX(-12px);transform:translateX(-12px);} 37.5%{-webkit-transform:translateX(12px);transform:translateX(12px);} 50%{-webkit-transform:translateX(0px);transform:translateX(0px);} 62.5%{-webkit-transform:translateX(-5px);transform:translateX(-5px);} 87.5%{-webkit-transform:translateX(5px);transform:translateX(5px);} 100%{-webkit-transform:translateX(0px);transform:translateX(0px);} } @media (max-width:768px){ .sct{padding:6.5vw 0 10vw} } /* ========================================================================== Header ========================================================================== */ #hdr{width:100%;height:68px; /*background:url(img/home/banner.jpg) no-repeat center calc(50% - 5px) #000;*/ border-bottom:solid 8px #d3af05} #hdr.compact{height:210px;background-position-y:30px;background-size:auto 100%} @media (max-width:1400px){#hdr{height:calc(50vw + 60px);max-height:665px;background-position-y:calc(50% + 20px);background-size:140% auto;border-bottom:0}} @media (max-width:600px){#hdr{height:calc(70vw + 60px);background-size:160% auto}} /* ========================================================================== Footer ========================================================================== */ #ftr{padding:17px 0;color:#FFF;font-size:1.7rem;font-weight:300;text-align:center;background:#000} #ftr a{margin:0 0 0 15px} .no-touchevents #ftr a:hover, #ftr a:active{color:#FFF} /* ========================================================================== Navigation ========================================================================== */ #nav{ position:fixed; top:0; z-index:5; width:100%; height:60px; font-size:0; background:rgba(0,0,0,1.0); outline:solid 1px rgba(211,175,5,.2) /* max-width:1400px; left:calc((100% - 1400px) / 2); */} .admin-bar #nav{top:32px} #nav .logo{float:left;width:auto;margin:7px 0 0 15px} #nav .logo img{width:100%} body:not(.home) #nav .menu-primary-container{margin-right:0px} #nav .menu-primary-container{float:right;height:100%;} #nav ul, #nav .menu li{height:100%;padding:0;margin:0;list-style:none} #nav .menu li.book-now, .home.has-items #nav .menu li.book-now, #nav .review-booking, .home.has-items #nav .review-booking { /* display:block; */ } #nav li{display:inline-block;vertical-align:middle} #nav .menu a{display:block;height:100%;padding:0 27px;color:#FFF;font-size:1.8rem;line-height:60px;} #nav .menu a:active, #nav .menu a:focus{text-decoration:none} #nav .menu a.active{border-bottom:solid 2px #d2ae05} #nav .menu a:hover{text-decoration:none} .no-touchevents #nav .menu a:hover, #nav .menu a:active, #nav .menu a.active{color:#d3af05} #nav .book-now{} .home #nav .book-now{display:inline-block} #nav .book-now a{display:block;height:100%;padding:0 40px;margin-left:27px;color:#000;line-height:60px;text-transform: uppercase; background:#d3af05} .no-touchevents #nav .book-now a:hover, #nav .book-now a:active, #nav .book-now a.active{color:#000; background:#FF8291;border:0} #nav .book-now-mobile{display:none} #nav .review-booking{display:none} .home.has-items #nav .review-booking{display:inline-block} #nav .review-booking a{display:block;height:100%;padding:0 40px;color:#d3af05;line-height:60px;text-transform: uppercase} .no-touchevents #nav .review-booking a:hover, #nav .review-booking a:active, #nav .review-booking a.active{color:#FFF;border:0;} #nav .review-booking-mobile{display:none} @media (min-width:701px){ #nav.condensed{height:55px;background:rgba(0,0,0,.85)} #nav.condensed .logo{width:72px;margin:9px 0 0 10px} #nav.condensed .menu a{font-size:1.65rem;line-height:55px} #nav.condensed .book-now a{margin-left:15px;font-size:1.7rem;line-height:55px} } @media (max-width:1400px){ #nav{left:0} #nav .menu a{padding:0 1.9vw} #nav .book-now a{padding:0 2.8vw;margin-left:2vw} } @media (max-width:1000px){ #nav{height:55px} #nav .logo{width:105px;margin-top:11px;margin-left:10px;} #nav .menu a{padding:0 1.4vw;line-height:55px} #nav .book-now a{padding:0 2.4vw;margin-left:1.5vw} } @media (max-width:767px){ #nav .menu a.active{border:0} #nav{background:#000} #nav .menu-primary-container{position:absolute;top:55px;display:none;float:none;width:100%;height:auto;background:#222;box-shadow:0 10px 30px rgba(0,0,0,.2)} #nav .menu-primary-container.active{display:block} #nav li{display:block;width:100%;} #nav .menu a{padding:15px 0 15px 15px;line-height:normal} #nav .book-now{} #navicon{position:relative;float:right;width:60px;height:45px;margin:5px 0 0 0;cursor:pointer} #navicon:before, #navicon:after, #navicon .bar{position:absolute;top:50%;left:17.5px;display:block;width:25px;height:3px;content:'';background:#FFF;-webkit-transition:all .3s ease-out;transition:all .3s ease-out;} #navicon:before{margin-top:-9px} #navicon .bar{margin-top:-1.5px} #navicon:after{margin-top:5px} #navicon.active:before{-webkit-transform:rotate(45deg) translate(3px, 3px);transform:rotate(45deg) translate(5px, 4px)} #navicon.active .bar{opacity:0} #navicon.active:after{-webkit-transform:rotate(-45deg) translate(4px, -4px);transform:rotate(-45deg) translate(5px, -5px)} .home #nav .book-now{} .home #nav .book-now-mobile{display:block;float:right;height:100%;padding:0 25px;color:#ffffff;font-size:2.2rem;line-height:55px;text-transform: uppercase;background:#E1374B} .home #nav .book-now-mobile:active, #nav .book-now-mobile:focus, #nav .book-now-mobile:hover{text-decoration:none} .home.has-items #nav .review-booking{display:none} .home.has-items #nav .review-booking-mobile{display:block;float:right;height:100%;padding:0 20px;color:#d3af05;font-size:2rem;line-height:55px;text-transform: uppercase;border-left:solid 1px rgba(211,175,5,.2)} .home.has-items #nav .review-booking-mobile:hover, .home.has-items #nav .review-booking-mobile:active{text-decoration:none} } @media (max-width:500px){ .home.has-items #nav .book-now{display:block} .home.has-items #nav .book-now a{margin-left:0} .home.has-items #nav .book-now-mobile{display:none} .home.has-items #nav .review-booking-mobile{border-right:solid 1px rgba(211,175,5,.2);} } /* ========================================================================== Quick facts ========================================================================== */ #quick-facts{position:relative;max-width:1400px;padding:25px 0;margin:0px auto 0;font-size:0;text-align:center;background:#FFF;box-shadow:0 2px 30px rgba(0,0,0,.2)} #quick-facts:before{position:absolute;top:10px;left:10px;width:66%;height:calc(100% - 20px);content:'';background: url(img/home/info-tl.png) no-repeat 0 0} #quick-facts:after{position:absolute;top:10px;right:10px;width:66%;height:calc(100% - 20px);content:'';background: url(img/home/info-tr.png) no-repeat 100% 0} #quick-facts .bar-inner{width:100%;height:100%;padding:0 10px;} #quick-facts .bar-inner:before{position:absolute;bottom:10px;left:10px;z-index:1;width:66%;height:66%;content:'';background: url(img/home/info-bl.png) no-repeat 0 100%} #quick-facts .bar-inner:after{position:absolute;right:10px;bottom:10px;z-index:1;width:66%;height:66%;content:'';background: url(img/home/info-br.png) no-repeat 100% 100%} #quick-facts .col{position:relative;z-index:2;display:inline-block;height:100%;padding:10px 40px;font-size:1.8rem;text-align:center;vertical-align:middle} #quick-facts .col:after{position:absolute;top:16px;right:0;width:1px;height:50px;content:'';background:#d2d2d2} #quick-facts .col:last-child:after{content:none} #quick-facts .header{font-family:Lora, Times, "Times New Roman", "serif";font-size:2.7rem;line-height:1.2em;} #quick-facts .countdown{display:inline-block; margin:0 16px;font-size:1.5rem;text-align:center;vertical-align: middle} #quick-facts .countdown:last-child{margin-right:0} #quick-facts time{display:block;font-size:3.9rem;line-height:1.1em} @media (max-width:1400px) and (min-width:951px){ #quick-facts{padding:1.7vw 0;margin-top:0} #quick-facts .col:after{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)} #quick-facts .col:last-child{padding-left:.8vw;text-align: center;} #quick-facts .header{font-size:1.8vw} #quick-facts .countdown{margin:0 1vw} #quick-facts time{font-size:3.6vw} } @media (max-width:950px) and (min-width:501px){ #quick-facts{height:auto;padding:0;margin-top:0;box-shadow:none} #quick-facts .bar-inner{padding:40px 0} #quick-facts .col{width:calc(50% - 30px);max-width:300px;padding:0} #quick-facts .col:nth-child(1), #quick-facts .col:nth-child(2){padding-bottom:22px} #quick-facts .col:nth-child(3), #quick-facts .col:nth-child(4){padding-top:22px} #quick-facts .col:after{content:none} #quick-facts .countdown{width:17%;margin:0} #quick-facts .divider-v, #quick-facts .divider-h{position:absolute;z-index:2;background:#d2d2d2} #quick-facts .divider-v{top:40px;left:50%;width:1px;height:calc(100% - 80px);} #quick-facts .divider-h{top:50%;left:40px;width:calc(100% - 80px);height:1px} } @media (max-width:500px){ #quick-facts{padding:25px 0;margin-top:0;box-shadow:none} #quick-facts .col{width:calc(100% - 30px);max-width:300px;padding:15px 0} #quick-facts .col:after{content:none} /* #quick-facts .col:after{top:auto;bottom:0;left:50%;width:40px;height:1px;transform:translateX(-50%)}*/ #quick-facts .col:first-child, #quick-facts .col:nth-child(2){width:calc(50% - 15px)} #quick-facts .col:nth-child(3){display:none} #quick-facts .header{line-height:1.1em} #quick-facts .countdown{width:auto;margin:0 8px} } /* ========================================================================== About ========================================================================== */ /*#about .quote{position:relative;background:url(img/home/bg-about-quote.gif) #FFF no-repeat 45px 45px;text-align:center;} #about .quote:before{content:'';position:absolute;top:10px;left:10px;width:calc(100% - 20px);height:calc(100% - 20px);border:solid 2px #d3af05;pointer-events:none} #about .quote-inner{padding:55px 80px 55px}*/ #about .kv img{display:block;width:100%} #about .texts{padding-left:25px;text-align:justify} #about .texts p{margin:0 0 1em} #about hgroup{margin-bottom:30px} #about h3{font-size:4rem;} #about .quote{position:relative;float:right;width:300px;padding:30px 0;margin:10px 0 15px 25px;text-align:center;background:url(img/home/quote.png) no-repeat 0px 20px;} #about .quote:before, #about .quote:after{position:absolute;left:10%;display:block;width:80%;height:2px;content:'';background:#d3af05} #about .quote:before{top:0} #about .quote:after{bottom:0} #about .title-divider{margin:20px auto;} #about blockquote{margin:0 0 30px;font-size:2.5rem;font-weight:500} #about .author{font-size:2.2rem;font-style:italic;font-weight:500} #about .bohemia{font-family: 'Homemade Apple', cursive;font-size:80%} #about .brazilian{font-family: 'Satisfy', cursive} @media (max-width:991px){ #about .kv{margin:0 10px 5px 0} } @media (max-width:768px){ #about .kv img{max-width:300px;margin:0 auto 40px} #about .quote{width:200px} #about h3{font-size:3rem} #about blockquote{margin-bottom:3.9vw;font-size:2rem} } @media (max-width:500px){ #about .texts{text-align:left} #about .quote{float:none;width:100%;max-width:300px;margin:0 auto 40px} } /* ========================================================================== Auction ========================================================================== */ #auction{padding:60px 0 5px;color:#FFF;text-align:center;background:url(img/home/bg-auction.jpg) #000 no-repeat fixed center / cover} #auction h2{display:inline-block;padding:0 15px} #auction .borders-holder{position:absolute;top:88px;left:50%;width:90%;height:80px;max-width:1400px;-webkit-transform:translateX(-50%);transform:translateX(-50%);} #auction .border{position:absolute;top:0;left:0;width:100%;height:100%;border:solid 1px #FFF;} #auction .border.btm{position:static;width:90%;height:45px;max-width:1400px;margin:0 auto;border-top:none} #auction .items, #auction .item{padding:0;margin:0;list-style:none;} #auction .items-scroll{position:relative;overflow:hidden} #auction .items .item a { display:block; width: 308px; height: 400px; } #auction .items{width:100%;margin:28px 0 22px;overflow:hidden;white-space:nowrap;} #auction .item{position:relative;display:inline-block;width:306px;height:355px;margin:0 17px 60px;vertical-align:middle;background:#FFF;cursor:pointer} #auction .item.blank{visibility:hidden} #auction .item .info{position:absolute;bottom:0;left:calc(50% - 120px);width:240px;padding:15px 22px;white-space:normal;background:#000;transform:translateY(50%)} #auction .item .name{margin-bottom:3px;color:#d3af05;font-family:Lora, serif;font-size:1.8rem;line-height:1.2em} #auction .item .price{font-size:1.6rem;font-weight:500} #auction .item .arrow{position:absolute;top:50%;right:-21px;width:42px;height:42px;background:url(img/home/auction-item-arrow.png) no-repeat #d3af05 center;transform:translateY(-50%)} #auction .item:hover .arrow{background-color:#FF8291;transform:translate(3px, -50%)} #auction .btn{position:absolute;top:calc(50% - 75px);display:block;width:70px;height:70px;border-radius:100%;cursor:pointer} #auction .btn.prev{left:20px;background:url(img/home/auction-prev.png) rgba(0,0,0,.9) no-repeat 48% center / auto 50%} #auction .btn.next{right:20px;background:url(img/home/auction-next.png) rgba(0,0,0,.9) no-repeat 55% center / auto 50%} .no-touchevents #auction .btn.prev:hover{transform:translateX(-4px)} .no-touchevents #auction .btn.next:hover{transform:translateX(4px)} .no-touchevents #auction .btn:hover:active, #auction .btn:active{-webkit-transition: all .1s ease-out;transition: all .1s ease-out;} .no-touchevents #auction .btn.prev:active:hover, #auction .btn.prev:active{transform:translate(-4px, 2px)} .no-touchevents #auction .btn.next:active:hover, #auction .btn.next:active{transform:translate(4px, 2px)} @media (max-width:500px){ #auction h2{max-width:250px;} } /* ========================================================================== Gallery ========================================================================== */ /* editions */ #gallery .editions{position:relative} #gallery ul{width:95%} #gallery ul, #gallery li{padding:0;margin:0;list-style:none} #gallery li{position:relative;padding-left:60px;margin-bottom:18px;font-size:1.8rem;cursor:pointer} #gallery .indicator{position:absolute;top:10px;left:8px;z-index:1;width:19px;height:19px;background:#FFF;border:solid 3px #000;border-radius:100%} #gallery h3{font-size:2.5rem} #gallery .value{font-size:2rem;font-weight:500} #gallery .details{display:none} #gallery .details p{margin:.2em 0 .75em} #gallery .line{position:absolute;top:20px;left:25px;width:2px;height:100%;background:#d3af05} .no-touchevents #gallery li:not(.active):hover h3{color:#d3af05} .no-touchevents #gallery li:not(.active):hover .indicator{top:7px;left:5px;width:25px;height:25px} #gallery .active .indicator{left:0;width:35px;height:35px;border:solid 6px #d3af05} #gallery .active h3{color:#d3af05;font-size:3.5rem;} #gallery .active .details{display:block} /* images */ #gallery .images.loading{background:url(img/ui/loading.gif) no-repeat center} #gallery .img{position:relative;float:left;width:calc((100% - 6px) / 3);max-width:308px;margin:1px;cursor:pointer} #gallery .img:after{position:absolute;top:0;left:0;display:block;width:100%;height:100%;content:'';background:url(img/home/gallery-plus.png) no-repeat center rgba(0,0,0,.8); -webkit-transition: all .2s ease-out;transition: all .2s ease-out;opacity:0} .no-touchevents #gallery .img:hover:after{opacity:1} #gallery .img:active:after{background-color:rgba(0,0,0,.9);background-size:100px auto} #gallery .img img{width:100%;height:auto} #gallery .pages{margin-top:2px;text-align:right} #gallery .pages .page{display:inline-block;padding:5px 6px;font-size:1.5rem;cursor:pointer} .no-touchevents #gallery .pages .page:hover{color:#d3af05} #gallery .pages .page.active:after{display:block;width:10px;height:3px;margin:0 auto;content:'';background:#d3af05} @media (max-width:768px){ #gallery .pages .page{font-size:2rem} #gallery .img:after{background-size:40% auto} } /* ========================================================================== Book now ========================================================================== */ #book-now{padding-bottom:20px;text-align:center;background:url(img/home/bg-booknow.jpg) #000 no-repeat fixed center top / cover} #book-now hgroup{margin-bottom:60px} #book-now .panel{display:inline-block;width:376px;height:500px;padding-top:65px;font-size:2.5rem;vertical-align:middle} #book-now p{width:79%;max-width:300px;margin:0 auto;font-size:2rem;line-height:1.3em} #book-now .cta{position:absolute;bottom:60px;left:50%;width:225px;font-size:2rem;letter-spacing:.2em;-webkit-transform:translateX(-50%);transform:translateX(-50%)} #book-now .cta:active{-webkit-transform:translateX(-50%) scale(1.02);transform:translateX(-50%) scale(1.02)} #book-now .footnote{color:#FFF} /* select menu */ #book-now .select-menu{position:relative;width:285px;margin:0 auto 15px auto;font-family:Lora, serif;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;} #book-now .select-menu .label{position:relative;margin:0;font-size:5rem;text-transform:none;border-bottom:solid 1px #d3af05;} #book-now .select-menu .label:after{display:inline-block;width:15px;height:9px;margin-left:20px;content:'';vertical-align:middle;background:url(img/ui/arrow-down.png) center no-repeat;} #book-now .select-menu.active .label:after{-webkit-transform:rotate(180deg);transform:rotate(180deg);} #book-now .select-menu .options, #book-now .select-menu li{padding:0;margin:0;list-style:none;} #book-now .select-menu .options{position:absolute;z-index:1;display:none;width:100%;margin-top:-1px;box-shadow:0 0 25px rgba(0,0,0,.15);border:solid 1px #d3af05} #book-now .select-menu.active .options{display:block;} #book-now .select-menu .option{padding:10px 0;font-size:3.5rem;background:#FFF;border-bottom:solid 1px #d3af05} #book-now .select-menu .option:last-child{border:0} #book-now .select-menu .option.active, .no-touchevents #book-now .select-menu .option:hover, #book-now .select-menu .option:active{color:#FFF;background:#d3af05} /* big panel */ #book-now .panel.big{width:418px;height:560px;padding-top:90px;margin:0 20px;} #book-now .big .cta{bottom:90px;font-size:2.2rem;} /* amount input */ #book-now .amt{display:block;width:81%;max-width:305px;margin:0 auto 15px;font-family:Lora, serif;font-size:5rem;text-align:center;border:none;border-bottom:solid 1px #d3af05} #book-now .amt:focus{outline:0} #book-now input.amt::-webkit-input-placeholder{color:#000;} #book-now input.amt::-moz-placeholder{color:#000;} #book-now input.amt:-ms-input-placeholder{color:#000;} #book-now input.amt:placeholder-shown{color:#000;} #book-now .amt:focus, #book-now .amt:active{box-shadow:0 6px 5px rgba(211,175,5,.1);outline:none} /* number input */ #book-now .count{width:45px;text-align:center;border:none;border-bottom:solid 1px #d3af05} #book-now .count.error{color:#B00} #book-now .count:focus, #book-now .count:active{box-shadow:0 6px 5px rgba(211,175,5,.1);outline:none} /* donation panel */ #book-now .donation label{display:block;margin-bottom:50px} /* single panel */ #book-now .panel.single{width:600px;height:500px;padding-top:90px;margin:0 20px;} #book-now .panel.single .amt{width:75%;max-width:none} #book-now .panel.single label{margin-bottom:30px} #book-now .panel.single p{width:75%;max-width:none} @media screen and (max-width:1400px) and (min-width:1001px){ #book-now .panel{width:29vw} #book-now .panel.big{width:33vw;margin:0 1vw} #book-now .select-menu{width:75%} #book-now .select-menu .label{font-size:4rem} #book-now .amt{width:81%;font-size:4rem} } @media screen and (max-width:1000px){ #book-now hgroup{margin-bottom:7vw} #book-now .panel, #book-now .panel.big{display:block;width:95%;height:auto;max-width:none;padding:50px 0;margin:20px auto} #book-now .panel.single{width:calc(100% - 30px);margin:0 auto;} #book-now .donation label{margin:0 0 20px} #book-now .cta, #book-now .big .cta, #book-now .cta:disabled, #book-now .big .cta:disabled{position:relative;top:0;left:0;margin:50px auto 0;-webkit-transform:none;transform:none} #book-now .cta:not([disabled]):active, #book-now .big .cta:not([disabled]):active, #book-now .cta:not([disabled]):hover, #book-now .big .cta:not([disabled]):hover{-webkit-transform:scale(1.02);transform:scale(1.02)} } @media screen and (max-width:500px){ #book-now .select-menu .arrow{width:9.4vw;} } /* ========================================================================== Sponsors ========================================================================== */ #sponsors{font-size:0;text-align:center} #sponsors h3{margin:50px 0 35px;font-family: "futura-pt", 'Futura PT', Helvetica, Arial, "sans-serif";font-size:2.2rem;text-align:center} #sponsors .row{margin-bottom:25px;text-align:center} #sponsors .col{display:inline-block;float:none;text-align:center;vertical-align:middle; margin:10px 0;} #sponsors .special-thanks .col, #sponsors .in-kind-sponsors .col{margin-bottom:40px;} #sponsors .col img{max-width:100%} #sponsors .charity-partner img{margin-bottom: 60px} #sponsors .row.platinum-donor .col img, #sponsors .hotel-partner .col img {max-height:130px;max-width:300px;} #sponsors .auction-in-kind-sponsors .col img {max-height:130px;max-width:250px;} @media screen and (max-width:768px){ #sponsors h3{margin:6.5vw 0 3.5vw} #sponsors .with-support-from, #sponsors .with-support-from .col{margin-bottom:0} #sponsors .with-support-from .col{width:50%} } @media screen and (max-width:500px){ #sponsors .col{margin:10px 0} #sponsors .title-sponsor img{width:90%} #sponsors .angel-sponsor img, #sponsors .friend-sponsor img{max-width:80%} #sponsors .with-support-from{margin-bottom:20px} #sponsors .with-support-from .col{width:100%} #sponsors .special-thanks .col, #sponsors .in-kind-sponsors .col{width:50%} #sponsors .col img{max-width:75%} } /* ========================================================================== Map ========================================================================== */ #map{height:540px;padding:35px 0} #gmap{position:absolute;top:0;left:0;width:100%;height:100%} #map .shadow{position:absolute;left:0;width:100%;height:60px;pointer-events:none;} #map .shadow.top{top:0;box-shadow:inset 0 10px 20px rgba(0,0,0,.2)} #map .shadow.btm{bottom:0;box-shadow:inset 0 -10px 20px rgba(0,0,0,.2)} #map .sct-inner{pointer-events:none} #map .panel{height:470px;padding:35px 0;pointer-events:all} #map h3{font-size:3.5rem} #map strong{font-weight:500} #map a{font-weight:500} @media screen and (max-width:768px){ #map{height:800px;padding:4vw} #map .panel{height:auto;padding:6vw 0;} #map .contact{margin-top:4vw} #map .title-divider{margin:2vw auto} } /* ========================================================================== Overlay ========================================================================== */ #overlay{position:fixed;top:0;left:0;z-index:200;display:none;width:100%;height:100%;background:rgba(0,0,0,.95);opacity:0} #overlay .bg{position:fixed;top:0;left:0;width:100%;height:100%;cursor:pointer} #overlay .content{position:absolute;top:50%;left:50%;display:none;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)} #overlay .content.image{width:90vw;height:90vh;pointer-events:none} #overlay .content.item{top:75px;width:90vw;max-width:1200px;padding:30px 30px 45px;margin-bottom:75px;background:#FFF;-webkit-transform:translateX(-50%);transform:translateX( -50%)} #overlay .content.item.loading{min-height:75vh;background:url(img/ui/loading.gif) #FFF no-repeat center} #overlay .content.item .col-left{float:left;width:42%;} #overlay .content.item .col-left img{max-width:100%} #overlay .content.item .col-right{float:right;width:52%;text-align:left;} #overlay .content.item h2{font-size:3rem;text-transform:none} #overlay .content.item h3{color:#000;font-family: "futura-pt", 'Futura PT', Helvetica, Arial, "sans-serif";font-size:3rem;font-weight: 500} #overlay .content.item .price{color:#000;font-family: "futura-pt", 'Futura PT', Helvetica, Arial, "sans-serif";font-size:2.5rem;font-weight: 500} #overlay .content.item .body-copy{font-size:1.8rem;font-weight:300} #overlay .prev, #overlay .next{position:absolute;top:0;display:none;width:70px;height:100%;cursor:pointer} #overlay.image .prev, #overlay.image .next{display:block} #overlay .prev{left:15px;background:url(img/home/btn-prev-gold.png) no-repeat center} #overlay .next{right:15px;background:url(img/home/btn-next-gold.png) no-repeat center} .no-touchevents #overlay .prev:hover, #overlay .prev:active{transform:translateX(-5px)} .no-touchevents #overlay .next:hover, #overlay .next:active{transform:translateX(5px)} @media screen and (max-width:768px){ #overlay .content.item .col-left, #overlay .content.item .col-right{float:none;width:100%;max-width:none} #overlay .content.item .col-right{text-align:center} } /* ========================================================================== Review Booking ========================================================================== */ #review-booking{padding:85px 0 0 0} #review-booking .cart-holder{position:relative;padding:20px;background:#FFF} #review-booking .woocommerce-message{display:none} #review-booking .woocommerce-error .button{display:none} #review-booking .overlay-message{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background:rgba(255,255,255,.5);opacity:0} #review-booking .disabled .overlay-message{z-index:1;display:block;opacity:1} #review-booking .overlay-message .loading{position:absolute;top:50%;left:50%;padding:30px;text-align:center;background:#FFF;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);} #review-booking .overlay-message .loading:after{position:absolute;top:10px;left:10px;width:calc(100% - 20px);height:calc(100% - 20px);content:'';border:solid 1px #d3af05;pointer-events:none} #review-booking tr.delete{-webkit-animation:delete-row ease-out .4s forwards;animation:delete-row ease-out .4s forwards;} @-webkit-keyframes delete-row{ 0%{opacity:1} 100%{-webkit-transform:translateX(100px);opacity:0} } @keyframes delete-row{ 0%{opacity:1} 100%{-webkit-transform:translateX(100px);transform:translateX(100px);opacity:0} } #review-booking .cart-empty{text-align:center} #review-booking .footnote{margin-bottom:75px;text-align:center} #review-booking table{width:100%;margin:0;border:0;table-layout: fixed;} #review-booking th{font-size:1.5rem;font-weight:300;text-align:center;border-bottom:solid 1px #d3af05} #review-booking td{padding:20px 0;text-align:center;border:0;border-bottom:solid 1px #d3af05} #review-booking .product-name{padding-left:15px;text-align:left} #review-booking .product-name a{color:#000;font-family:Lora, serif;font-size:2rem;} .no-touchevents #review-booking .product-name a:hover, #review-booking .product-name a:active{color:#d3af05;text-decoration:none;} #review-booking input.qty{width:70px;text-align:center;border:solid 1px #D2D2D2} #review-booking .product-name{width:55%} #review-booking .product-price{width:130px} #review-booking .product-price input{width:110px;text-align:center;vertical-align:middle;border:solid 1px #D2D2D2} #review-booking .product-quantity{width:70px} #review-booking .product-quantity label{position:relative;display:inline-block} #review-booking .product-subtotal{width:140px} #review-booking .product-remove{width:45px;padding-right:15px} #review-booking a.remove{float:right;color:#d3af05 !important} #review-booking a.remove:hover{color:#FFF !important;background:#d3af05 !important} #review-booking a.remove.disabled, #review-booking a.remove.disabled:hover{color:#999 !important;background:#FFF !important;cursor:default} #review-booking .tooltip{position:absolute;left:50%;z-index:1;width:100px;padding:3px 10px;margin-top:2px;font-size:1.5rem;font-weight:300;line-height:1.2em;background:#eaeaea;-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)} #review-booking .tooltip:before{position:absolute;top:-8px;left:calc(50% - 5px);content:'';border-color: transparent transparent #eaeaea transparent;border-style: solid;border-width: 0 5px 8px 5px;} #review-booking .cart_totals{float:none;width:100%;} #review-booking .cart_totals td{padding-right:15px;font-size:2.5rem;text-align:right;border:0} #review-booking .wc-proceed-to-checkout{margin-top:50px} #review-booking .cta{font-weight:300;letter-spacing:.2rem} #review-booking .cta.back{width:190px;padding:12px 0;font-size:2rem;} #review-booking .cta.checkout{width:230px;padding:15px 0;font-size:2.2rem} #review-booking aside{float:right} #review-booking .give-hope{margin-bottom:20px;} #review-booking .give-hope h2{max-width:200px;margin:0 auto;color:#000;font-size:3rem;text-transform:none} #review-booking .give-hope .img{position:relative;width:100%;height:195px;margin-bottom:25px;background:url(img/review-booking/gift.jpg) no-repeat center 42% / cover} #review-booking .give-hope .img:after{position:absolute;top:0;left:0;width:100%;height:100%;content:'';background:url(img/review-booking/vignette.png) no-repeat 0 0 / 100% 100%} #review-booking .give-hope .contents{padding:0 28px 60px;font-size:1.8rem;font-weight:300} #review-booking .give-hope table{margin-top:20px} #review-booking .give-hope td{padding:10px 0} @media screen and (max-width:992px){ #review-booking aside{float:none;margin-bottom:25px} #review-booking .give-hope .img{position:absolute;top:0;left:0;width:200px;height:100%;margin:0} #review-booking .give-hope .contents{float:right;width:calc(100% - 210px);padding:30px 20px 30px 10px;text-align:left} #review-booking .give-hope h2{width:100%} #review-booking .give-hope .title-divider{display:none} #review-booking .give-hope a{float:right;margin-top:12px;margin-right:15px} } @media screen and (max-width:768px){ #review-booking{padding-top:11vw} #review-booking table tr{border:solid 1px #d2d2d2;border-bottom:0;} #review-booking .product-name, #review-booking .product-price, #review-booking .product-quantity, #review-booking .product-subtotal, #review-booking .product-remove{width:100%;padding:10px 15px;border-bottom-color:#D2D2D2} #review-booking .product-remove{border:0} #review-booking a.remove{display:inline-block;float:none;} #review-booking .cart_totals td:before{content:none} #review-booking .cart_totals td{padding:10px 15px;border-bottom:solid 1px #D2D2D2;} #review-booking .give-hope h2{font-size:2.5rem} #review-booking .give-hope .img{width:150px} #review-booking .give-hope .contents{width:calc(100% - 160px);} } @media screen and (max-width:600px){ #review-booking .cta.pull-left, #review-booking .cta.pull-right{float:none !important} #review-booking .cta.checkout{margin-bottom:20px} #review-booking .give-hope .img{background:url(img/review-booking/gift-bg.jpg) no-repeat center / cover} #review-booking .give-hope .img:after{display:block;content:'';background:url(img/review-booking/gift-fg.png) no-repeat center / 70% auto} } /* ========================================================================== Checkout ========================================================================== */ #checkout .woocommerce-info{display:none} #checkout .row{margin-bottom:8px} #checkout .review-payment{margin-top:80px} #checkout .bordered-box{padding:40px 25px 30px} #checkout h3{font-size:2.5rem} #checkout .label, #checkout label{display:block;margin-bottom:4px;font-size:1.6rem;cursor:pointer} #checkout .error-descr{float:right;color:#B00;font-size:1.6rem;font-style:italic} #checkout .radios label{float:left;padding-right:30px;font-size:2rem} #checkout .radios.error label{color:#B00} #checkout .radios .error-descr{float:none;padding-left:4px;} #checkout .radios input[type=radio]{margin-right:2px} #checkout .checkboxes label{font-size:2rem} #checkout .checkboxes input[type=checkbox]{margin-right:5px} #checkout .ship_to_different_address{display:none} #checkout input[type=text], #checkout input[type=number], #checkout input[type=email], #checkout input[type=tel], #checkout select{display:block;width:100%;padding:5px 10px;margin-bottom:10px;font-size:2rem;border:solid 1px #D2D2D2} #checkout input::-webkit-input-placeholder{color:#999;font-style:italic} #checkout input::-moz-placeholder{color:#999;font-style:italic} #checkout input:-ms-input-placeholder{color:#999;font-style:italic} #checkout input:placeholder-shown{color:#999;font-style:italic} /* review order */ #checkout .shop_table{width:100%;margin-bottom:50px;border:0} #checkout .shop_table .product-name{padding-left:10px} #checkout .shop_table .product-quantity{width:65px;text-align:center} #checkout .shop_table .product-total{width:85px;padding-right:10px;text-align:center} #checkout .shop_table th{padding:0;font-size:1.5rem;font-weight:300;border-bottom:solid 1px #d3af05} #checkout .shop_table td{padding:15px 0;font-weight:500;border-bottom:solid 1px #d3af05} #checkout .shop_table td.product-name{font-family:Lora, serif;} #checkout .shop_table tfoot td{padding-right:10px;text-align:right;border-bottom:0} #checkout .woocommerce-checkout-review-order-table .footnote{width:100%;padding:0 15px;margin-top:10px;text-align:center} /* payment method */ #checkout #payment .wc_payment_method{float:left;width:calc(50% - 2px);margin:0 1px;text-align:center;} #checkout #payment label{display:block;padding:20px 0;margin:0;font-size:1.8rem;font-weight:500;line-height:1.2em;border:solid 1px #d3af05;} #checkout #payment input[type="radio"]:checked+label{padding:16px 0;border-width:5px} #checkout #payment input[type=radio]{display:none} #checkout div.payment_box{padding:25px 35px !important;margin-bottom:0 !important;color:#000 !important;font-size:2rem;font-weight:500;text-align:left;background:#eaeaea !important;border-radius:0 !important} #checkout #payment div.payment_box.payment_method_mcpayment{display:none !important} #checkout div.payment_box:before{content:none !important} #checkout div.payment_box a{color:#000} #checkout div.payment_box p, #checkout div.payment_box .form-row{margin:0 !important} #checkout #payment div.payment_box label{padding:0;margin-bottom:5px;color:#000;font-size:1.6rem;font-weight:300;border:0} #checkout #payment input[type=tel]{color:#000 !important;font-size:2rem;font-weight:300} #checkout #payment label[for=stripe-card-expiry] .error-descr, #checkout #payment label[for=stripe-card-cvc] .error-descr{float:none;} #checkout #payment span.required{display:none} /* btns */ #checkout .place-order{margin-top:60px} #checkout .cta.back{width:190px;padding:12px 0;font-size:2rem;} #checkout .cta.checkout{width:230px;padding:12px 0;font-size:2rem} @media screen and (max-width:1000px){ #checkout .review-payment{margin-top:5vw} #checkout .place-order{margin-top:4vw} } @media screen and (max-width:600px){ #checkout .cta.pull-left, #checkout .cta.pull-right{float:none !important} #checkout .cta.checkout{margin-bottom:20px} } /* ========================================================================== Checkout - Auction ========================================================================== */ #checkout .review-payment{margin:40px 0 120px} #checkout.auction #cart{float:none;margin:0 auto 80px} #checkout.auction .shop_table{margin-bottom:0} #checkout.auction .review-payment .woocommerce-checkout-review-order-table{display:none} #checkout.auction #payment{float:none;margin:0 auto} #checkout.auction .pdpa-holder{margin-top:35px} #checkout.auction .pdpa{float:left;margin:3px 7px 0 0} #checkout.auction .checkbox-label{float:left;width:calc(100% - 22px)} /* ========================================================================== Thankyou ========================================================================== */ #thankyou .info{padding:25px 20px;margin-bottom:40px;font-size:0} #thankyou .value{font-family:Lora, serif;font-size:3.5rem;line-height:1.2em} #thankyou .col{display:inline-block;float:none;font-size:2rem;vertical-align:middle;} #thankyou .col:after{position:absolute;top:calc(50% - 25px);right:0;width:1px;height:50px;content:'';background:#d2d2d2} #thankyou .col:last-child:after{content:none} #thankyou .body{margin-bottom:60px;text-align:center} #thankyou .cta{width:280px;margin:0 auto;font-size:2.2rem;font-weight:300;letter-spacing:.2em} @media (max-width:768px){ #thankyou .info{margin-bottom:2vw} #thankyou .col{padding-top:5px;padding-bottom:25px;margin-bottom:2vw} #thankyou .col:last-child{padding-bottom:0;margin-bottom:2vw;} #thankyou .value{line-height:1.3em} #thankyou .col:after{top:auto;bottom:0;left:calc(50% - 25px);width:50px;height:1px} #thankyou .body{margin-bottom:5vw} } /* ========================================================================== Special Thanks ========================================================================== */ #special-thanks.sct{font-weight:500;text-align:center} #special-thanks .title{text-decoration:underline} #special-thanks .cta{width:280px;margin:100px auto 0 auto;font-size:2.2rem;font-weight:300;letter-spacing:.2em} #special-thanks .tier{margin-bottom:40px}