/* font-family: 'Trajan Pro'; font-family: 'Gotham'; font-family: 'Gotham Book'; Table of Contents ----------------------------------------------------------------------------- 1. Clean Base 2. Base Typography 3. Images 4. Links 5. Forms 6. Tables 7. Framework */ /* 1. Clean Base ------------------------------------------------------------------------------*/ * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } :before, :after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, a, nav, section, summary, time, mark, audio, video { margin:0 auto; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; text-decoration:none; list-style:none; outline:none; -webkit-font-smoothing: subpixel-antialiased; -webkit-tap-highlight-color:rgba(0,0,0,0); } html, body { -webkit-text-size-adjust:none; -webkit-font-smoothing: antialiased; } article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } img { border:none; max-width:100%; } input[type="text"], input[type="submit"], input[type="button"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"], textarea { -webkit-appearance: none; outline: none; } textarea:focus, input:focus, a, div, img { outline: none; } .cf:before, .cf:after { content: ""; display: table; } .cf:after { clear: both; } .cf { zoom: 1; } .clear { clear: both; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix { display: inline-block; } * html .clearfix { height: 1%; } .clearfix { display: block; } /* 2. Base Typography ------------------------------------------------------------------------------*/ body { color:#534741; font-size:16px; font-family: 'Gotham'; font-weight:300; line-height: 1.5; background-color: #fff; transition: all 0.3s ease;} h1, h2, h3, h4, h5, h6 { margin-bottom:15px; font-weight:400; line-height: 1.2; font-family: 'Trajan Pro'; } h1 { font-size:24px; } h2 { font-size:22px; } h3 { font-size:20px; } h4 { font-size:18px; } h5 { font-size:17px; } h6 { font-size:17px; } p { margin-bottom:15px; } ul { margin:0 0 30px; padding:0; } ul li { padding:0 0 8px 30px; list-style:none; position: relative; } ul li:before{content: ""; width: 6px; height: 6px; display: inline-block; vertical-align: top; background-color: #534741; border-radius: 100%; position: absolute; left: 0; top: 11px;} ol { margin:0 0 30px; padding:0; counter-reset: item; } ol li { padding:0 0 8px 30px; list-style: none; position: relative; } ol li:before { content: counter(item) ". "; counter-increment: item; color: #534741; display: inline-block; vertical-align: top; position: absolute; left: 0; top: 0;} blockquote { display:block; text-align:left; margin-bottom:15px; position:relative; background:#E2E4E1; padding:15px 15px 10px 15px; border-left:2px solid #668e39; } blockquote p { font-size:13px; font-weight:400; line-height:17px; margin-bottom:15px; position:relative; } hr { border:0 #000 solid; border-top-width:1px; clear:both; height:0; } /* 3. Images ------------------------------------------------------------------------------*/ img { border:none; border-style: none; vertical-align:top; height: auto;} .aligncenter {display: block; clear:both; margin:20px auto;} .alignleft {float: left; margin: 0 20px 20px 0; } .alignright {float: right; margin: 0 0 20px 20px;} /* 4. Link ------------------------------------------------------------------------------*/ a {-webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } a:not(.btn, .text-link){ color:#534741; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } a:not(.btn, .text-link):hover { color:#534741; } a:not(.btn, .text-link):active, a:not(.btn).current { color: #534741; } a:not(.btn, .text-link):focus { outline: none; } /* 5. Forms ------------------------------------------------------------------------------*/ input[type="submit"], input[type="reset"], input[type="text"], input[type="button"], input[type="search"], input[type="url"], input[type="tel"], input[type="email"], input[type="password"], textarea { -webkit-appearance: none !important; border-radius: 0; } ::-webkit-input-placeholder {opacity: 1 !important; color: #fff; } ::-moz-placeholder {opacity: 1 !important; color: #fff; } ::-ms-input-placeholder {opacity: 1 !important; color: #fff; } input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"], textarea { border:none; padding: 0 15px; font-size:16px; height:44px; color:#534741; font-family: 'Gotham'; background-color:#ffffff; border-radius:4px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } textarea { height:248px; resize:none; padding: 15px 15px;} input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="search"]:focus, textarea:focus {} input[type="submit"], input[type="button"], input[type="reset"] { border: none; border-radius: 4px; color: #ffffff; display: inline-block; font-family: 'Gotham'; font-weight:400; font-size: 24px; height: 49px; line-height: 26px; text-transform: uppercase; vertical-align: top; max-width: 203px; background:url(/application/themes/grootbos/images/submit-btn-bg.png) no-repeat center center; cursor:pointer; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; padding:0 0 6px;} input[type="submit"]:hover, input[type="button"]:hover {opacity: 0.8; filter: alpha(opacity=80);} label{color:#fff; font-family: 'Gotham'; font-size:30px; line-height:1;} select, select:-moz-focusring, select::-moz-focus-inner {color: transparent !important; text-shadow: 0 0 0 #1a1a1a !important; background-image: none !important; border:0; border-color: inherit; -webkit-box-shadow: none; } select:focus {outline: none; } /* 6. Tables ------------------------------------------------------------------------------*/ table { border-spacing: 0; border-collapse: collapse; } td { text-align: left; font-weight: normal; } /* 7. Layout Framework ------------------------------------------------------------------------------*/ .dis-table { display:table; height:100%; width:100%; } .dis-table-cell { display:table-cell; vertical-align:middle } .btn {background-color: #336531; font-size: 15px; line-height: 43px; display: inline-block; vertical-align: top; font-family: 'Gotham'; font-weight: 500; color: #fff; text-decoration: none; padding: 0 36px; border-radius: 3px; border: 1px solid #336531; text-transform: uppercase;} .btn:hover {background-color: #fff; color: #336531; border-color: #336531;} .btn.btn-red {background-color: #a0410d; border-color: #a0410d;} .btn.btn-red:hover {background-color: #fff; color: #a0410d; border-color: #a0410d;} .slick-dots {text-align: center; line-height: 1; position: absolute; bottom: 0; left: 0; right: 0; margin: 0; line-height: 0; } .slick-dots li {display: inline-block; vertical-align: top; padding: 0; margin: 0 3px;} .slick-dots li:before {display: none;} .slick-dots li button {background: transparent; border: 1px solid #fff; height: 12px; width: 12px; display: block; border-radius: 100%;font-size: 0; cursor: pointer; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; padding: 0; outline: 0; } .slick-dots li.slick-active button, .slick-dots li:hover button {background: #fff;} .slick-arrow { position: absolute; top: 50%; -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); z-index: 3; background: transparent; font-size: 0; border: none; cursor: pointer; outline: 0; } .slick-prev {left: 0;} .slick-next {right: 0;} .slick-prev:before, .slick-next:before { font-family: "grootbos" !important;font-style: normal !important;font-variant: normal !important;font-weight: normal !important;line-height: 1;text-transform: none !important; font-size: 30px; color: #fff; } .slick-prev:before { content: "d"; } .slick-next:before { content: "e"; } .slick-arrow.slick-disabled {display: none !important;} .fancybox-lock{overflow: inherit !important;} .imgixbackground{ display:none; } /* main container */ #wrapper { width:100%; min-height:100%; position: relative;} #wrapper.home-page{padding-top: 114px;} .container { max-width:1170px; width:100%; margin:0 auto; padding: 0;} /* header */ header.main-header { width:100%; height:auto; position: relative; z-index: 999; box-shadow: 1px 1px 4px 0px rgba(0, 0, 0, 0.23);} header.header-sticky{position: fixed; top: 0; left: 0; z-index: 999;} .headroom--top.home-header{position: absolute !important; top: 0; left: 0;} .home-page.open .home-header{position: fixed !important; transform: translateY(0) !important;} .home-header{position: fixed !important; z-index: 10; right: 0; left: 0; top: 0 } .inner-header{position: fixed !important; z-index: 10; right: 0; left: 0; top: 0 } .headroom {transition: transform .25s ease-in-out; will-change: transform } .headroom--pinned {transform: translateY(0);} .headroom--unpinned {transform: translateY(-100%) } .home-header.fix-start-header{position: fixed !important;} header.main-header .top-header {background-color: #002400;} header.main-header .top-header .left-head {float: left;} header.main-header .top-header .left-head .logo-head {display: inline-block; vertical-align: middle; margin: 21px 0; width: 170px;} header.main-header .top-header .left-head .logo-head img {width: 100%;display: block;} header.main-header .top-header .right-head {float: right; padding: 8px 0 10px;} header.main-header .top-header .right-head .phone-language {text-align: right; margin-bottom: 8px;} header.main-header .top-header .right-head .phone-language .phone {display: inline-block; vertical-align: middle; color: #fff; font-style: italic; font-family: 'Gotham Book'; font-size: 12px; line-height: 1; } header.main-header .top-header .right-head .phone-language .phone .icon {font-style: normal; margin-right: 10px; display: inline-block; vertical-align: middle; } header.main-header .top-header .right-head .phone-language .language-selector {display: inline-block; vertical-align: middle; position: relative;margin-left: 18px;} header.main-header .top-header .right-head .phone-language .language-selector .current-language { color: #fff; cursor: pointer; background-color: #2a3a23; position: relative; font-size: 11px; font-family: 'Gotham Book'; line-height: 1; font-style: italic; padding: 10px 10px 8px; } header.main-header .top-header .right-head .phone-language .language-selector .current-language:after {content: ""; display: inline-block; vertical-align: middle; background-image: url("/application/themes/grootbos/images/language-down-arrow.png"); width: 10px; height: 4px; background-position: center center; background-repeat: no-repeat; margin-left: 7px;} header.main-header .top-header .right-head .phone-language .language-selector.open .current-language:after {background-image: url("/application/themes/grootbos/images/language-top-arrow.png");} header.main-header .top-header .right-head .phone-language .language-selector ul {display: none; margin: 0; padding: 2px 0 6px; position: absolute; top: 100%; width: 100%; left: 0; background-color: #2a3a23; text-align: center; z-index: 3; } header.main-header .top-header .right-head .phone-language .language-selector ul li { margin: 0; padding: 0;} header.main-header .top-header .right-head .phone-language .language-selector ul li:before {display: none;} header.main-header .top-header .right-head .phone-language .language-selector ul li a{ display: block; color: #fff; font-size: 11px; font-family: 'Gotham Book'; line-height: 1; font-style: italic; padding: 4px 5px; text-decoration: none;} header.main-header .top-header .right-head .phone-language .language-selector ul li a:hover{ background-color: #002400; } header.main-header .top-header .right-head .top-menu ul {margin: 0; padding: 0; text-align: right; line-height: 1;} header.main-header .top-header .right-head .top-menu ul li {margin: 0 0 0 28px; padding: 0; display: inline-block; vertical-align: top; position: relative;} header.main-header .top-header .right-head .top-menu ul li:after {content: ""; height: 12px; width: 1px; background-color: #fff; display: block; position: absolute; left: -15px; top: 1px; } header.main-header .top-header .right-head .top-menu ul li:first-child:after {display: none;} header.main-header .top-header .right-head .top-menu ul li:before {display: none;} header.main-header .top-header .right-head .top-menu ul li a {color: #fff; padding-bottom: 4px; position: relative; text-decoration: none; font-size: 12px; font-family: 'Gotham Book'; line-height: 1; display: block; text-transform: uppercase; } header.main-header .top-header .right-head .top-menu ul li a:after{position: absolute; content: ""; width: 100%; height: 0; background: #bdbf5a; bottom: 0; left: 0; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} header.main-header .top-header .right-head .top-menu ul li:hover a {color: #bdbf5a;} header.main-header .top-header .right-head .top-menu ul li:hover a:after{height: 1px;} header.main-header .top-header .right-head-mobile {float: right; padding: 8px 0; display: none;} header.main-header .top-header .right-head-mobile .btn {text-transform: uppercase; padding: 0 9px; font-size: 12px; line-height: 30px; margin: 0 2px; } header.main-header .top-header .right-head-mobile .mobile-menu{padding: 0; width: 60px; text-align: center; vertical-align: middle;} header.main-header .top-header .right-head-mobile .mobile-menu span:nth-child(2){display: none;} header.main-header .top-header .right-head-mobile .mobile-menu.active span:nth-child(1){display: none;} header.main-header .top-header .right-head-mobile .mobile-menu.active span:nth-child(2){display: block;} /* nav */ header.main-header .bottom-header {background-color: #ffffff;} header.main-header .bottom-header .main-menu {float: left;} header.main-header .bottom-header .main-menu ul {margin: 0; padding: 0; font-size: 0;} header.main-header .bottom-header .main-menu ul li {margin: 0 1px 0 0; padding: 9px 15px; display: inline-block; vertical-align: top; position: relative;} header.main-header .bottom-header .main-menu ul li:before {display: none;} header.main-header .bottom-header .main-menu > ul > li > a {font-size: 14px; display: block; line-height: 1.1; color: #000000; font-family: 'Trajan Pro'; text-transform: uppercase; padding: 5px 0; text-decoration: none; position: relative;} header.main-header .bottom-header .main-menu > ul > li > a:after{content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 0; background: #a66c23; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;} header.main-header .bottom-header .main-menu > ul > li:hover > a, header.main-header .bottom-header .main-menu > ul > li.active > a {color: #a66c23;} header.main-header .bottom-header .main-menu > ul > li:hover > a:after, header.main-header .bottom-header .main-menu > ul > li.active > a:after {height: 2px;} header.main-header .bottom-header .main-menu ul li:hover ul{opacity: 1; visibility: visible; pointer-events: fill;} header.main-header .bottom-header .main-menu ul ul{width: 250px; position: absolute; top: 100%; left: 0; box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25); opacity: 0; visibility: hidden; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; pointer-events: none;} header.main-header .bottom-header .main-menu ul ul li{display: block; padding: 0; margin: 0;} header.main-header .bottom-header .main-menu ul ul li a{padding: 11px 21px; display: block; background: #f1f1f1; color: #000; text-transform: uppercase; border-bottom: 1px solid #ab9e8c; font-family: 'Gotham'; font-weight: 500; font-size: 14px;} header.main-header .bottom-header .main-menu ul ul li a:hover, header.main-header .bottom-header .main-menu ul ul li.active a{text-decoration: none; background: #f5e2c9;} header.main-header .bottom-header .main-menu ul ul li:last-child a{border-bottom: 0;} header.main-header .bottom-header .container{position: relative;} header.main-header .bottom-header .main-menu ul li.dd-nav{position: static;} header.main-header .bottom-header .main-menu ul.normal-nav ul.drop-down{display: none;} header.main-header .bottom-header .main-menu ul li:hover ul.drop-down{opacity: 1; visibility: visible; pointer-events: fill;} header.main-header .bottom-header .main-menu ul ul.drop-down{width: auto; position: absolute; top: 100%; left: 0; box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25); opacity: 0; visibility: hidden; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; background: #f1f1f1; padding: 10px; padding-bottom: 5px;} header.main-header .bottom-header .main-menu ul ul.drop-down li{margin: 5px;max-width: 230px;display: inline-block; padding: 0;} header.main-header .bottom-header .main-menu ul ul.drop-down li > a{position: relative; padding: 0;display: block; background: none; color: #000; text-transform: uppercase; border-bottom: 0; font-family: 'Gotham'; font-weight: 500; font-size: 14px; min-height: 160px} /*header.main-header .bottom-header .main-menu ul ul.drop-down li > a{min-height: 160px}*/ header.main-header .bottom-header .main-menu ul ul.drop-down li .dropdown-btn{margin-top:10px; text-align: center;} header.main-header .bottom-header .main-menu ul ul.drop-down li a.btn{text-align: center; background-color: #336531; color: #fff; display: inline-block; font-size: 10px; line-height: 14px; padding: 9px; min-width: 80px} header.main-header .bottom-header .main-menu ul ul.drop-down li a.btn.btn-left{float: left;} header.main-header .bottom-header .main-menu ul ul.drop-down li a.btn.btn-right{float: right;} header.main-header .bottom-header .main-menu ul ul.drop-down li a.btn:hover{color: #336531;} header.main-header .bottom-header .main-menu ul ul.drop-down li a figure{position: relative;display: block; width: 100%; overflow: hidden;} /*header.main-header .bottom-header .main-menu ul ul.drop-down li a figure:before{content:''; display: block; position: absolute; top: 0; left: 0;height: 100%; width: 100%; background-color: rgba(0,0,0,0.6)}*/ header.main-header .bottom-header .main-menu ul ul.drop-down li a figure:before{content:''; display: block; position: absolute; top: 0; left: 0;height: 100%; width: 100%; background: -moz-linear-gradient(270deg, rgba(255,255,255,0) 59%, rgba(0,0,0,1) 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(59%, rgba(255,255,255,0)), color-stop(100%, rgba(0,0,0,1))); /* safari4+,chrome */ background: -webkit-linear-gradient(270deg, rgba(255,255,255,0) 59%, rgba(0,0,0,1) 100%); /* safari5.1+,chrome10+ */ background: -o-linear-gradient(270deg, rgba(255,255,255,0) 59%, rgba(0,0,0,1) 100%); /* opera 11.10+ */ background: -ms-linear-gradient(270deg, rgba(255,255,255,0) 59%, rgba(0,0,0,1) 100%); /* ie10+ */ background: linear-gradient(180deg, rgba(255,255,255,0) 59%, rgba(0,0,0,1) 100%); /* w3c */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000',GradientType=0 ); /* ie6-9 */ } header.main-header .bottom-header .main-menu ul ul.drop-down li a figure img{width: 100%; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} header.main-header .bottom-header .main-menu ul ul.drop-down li a span{display: block; color: #534741; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;position: absolute;bottom: 10px; left: 5px;color: #fff; padding: 0 5px;} /*header.main-header .bottom-header .main-menu ul ul.drop-down li a:hover img{transform: scale(1.1); -webkit-transform: scale(1.1);}*/ /*header.main-header .bottom-header .main-menu ul ul.drop-down li a:hover span{color: #000;}*/ header.main-header .bottom-header .main-menu ul ul.drop-down li a:hover, header.main-header .bottom-header .main-menu ul ul.drop-down li.active a{text-decoration: none; background: none;} header.main-header .bottom-header .main-menu ul ul.drop-down li:last-child a{border-bottom: 0;} header.main-header .bottom-header .main-menu ul li.has-submenu > a{padding-right: 15px; position: relative;} header.main-header .bottom-header .main-menu ul li.has-submenu > a:before{content: ""; position: absolute; width: 0; height: 0; vertical-align: middle; border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent; right: 0; top: 8px;} [lang=de] header.main-header .bottom-header .main-menu ul ul.drop-down li a.btn {font-size: 9px;} header.main-header .bottom-header .enquiry {float: right; padding: 4px 0;} header.main-header .bottom-header .enquiry .btn {font-size: 13px; line-height: 32px; padding: 0 20px; } header .btn-close{top: 67px; position: fixed; right: 0; opacity: 0; width: 32px; height: 32px; transition: all 0.9s ease; -webkit-transition: all 0.9s ease; background: url(/application/themes/grootbos/images/close.png); transition: all 0.5s ease; pointer-events: none;} .mobile-nav-block{max-width: 264px; width: 100%; position: fixed; z-index: 0; right: -264px; background: #fff; overflow-y: scroll; z-index: 9; top: 47px; padding: 24px 25px 40px 39px; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; height: calc(100vh - 47px);} /* pop-up-block */ .fancybox-lock .fancybox-overlay{z-index: 9999;} .open-popup{display: none; width: 100%; z-index:99999999; height: 100%;} .fancybox-active .fancybox-success .fancybox-close-small{background: url(/application/themes/grootbos/images/close_black.png) no-repeat; position: absolute; top: 12px; right:12px; width: 28px; height: 28px; background-size: 27px;font-size: 0;color: transparent;} .fancybox-active .fancybox-inner{overflow: hidden !important; width: 100% !important;} .fancybox-is-open .fancybox-stage .open-popup {background: url(/application/themes/grootbos/images/popup.jpg); border-radius: 3px; -webkit-border-radius: 3px; width: 100%; margin: auto;height: calc(100% - 40px);background-color: transparent;padding: 50px 30px;} .open-popup {max-width: 800px !important; width: 100% !important;} .custom-scroll{height: 100%;} .fancybox-active .fancybox-skin{} .custom-scroll .mCSB_container > small{font-size: 18px; } .custom-scroll .mCSB_container > small strong{color: #00b8b5;} .fancybox-active .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { border-radius: 0; width: 8px;} .fancybox-active .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #898989;} .fancybox-active .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color: #898989;filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; } .fancybox-active .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .fancybox-active .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #898989; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; } .fancybox-active .mCSB_scrollTools .mCSB_draggerRail { border-radius: 0;} .fancybox-active .mCSB_scrollTools .mCSB_draggerRail { background-color: #dbdbdb;} .fancybox-active .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)";} .make-inquiry{width: 100%; height: 100%; padding: 0 20px; margin-bottom: 20px;} .inquiry-form{display: inline-block; vertical-align: top; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box;} .inquiry-form h2{font-size: 40px; color: #321c00; text-transform:uppercase; line-height: 42px; margin-bottom: 10px;} .inquiry-form p{font-size: 16px; color: #262626; line-height: 24px; font-family: 'Gotham Book';} .inquiry-form .frm_element{width: 100%; margin-bottom: 10px; font-size: 0;} .inquiry-form .frm_element .column{max-width: 345px; width: 100%; position: relative; display: inline-block; vertical-align: top; margin-right: 10px;} .inquiry-form .frm_element .column.last{margin-right: 0;} .inquiry-form .frm_element .column input{padding:0 19px; font-size: 14px; color: #575757; width: 100%; height: 47px; border: 1px solid #a1a1a1; border-radius: 0; font-family: 'Gotham Book';} .inquiry-form .frm_element textarea{width: 100%; font-size: 14px; color: #575757; background: rgba(255,255,255,1); height: 127px; padding: 20px; border: 1px solid #a1a1a1; border-radius: 0; font-family: 'Gotham Book';} .inquiry-form .frm_element .customSelectWrap{width: 100% !important;} .inquiry-form .frm_element .customSelectWrap .customSelect{/*max-width: 345px; */width: 100%; border: 1px solid #a1a1a1; height: 47px; background: rgba(255,255,255,1); font-size: 14px; color: #575757; line-height: 45px; text-transform: uppercase; padding: 0 20px; font-family: 'Gotham Book';} .inquiry-form .frm_element .customSelectWrap .customSelect:after{background: url(/application/themes/grootbos/images/down-arrow_fill.png); width: 10px; height: 8px; top: 19px; right: 20px; position: absolute; content: "";} .inquiry-form .frm_element .column input::-webkit-input-placeholder {color:#575757;} .inquiry-form .frm_element .column input::-moz-placeholder {color:#575757;} .inquiry-form .frm_element .column input::-ms-input-placeholder {color:#575757;} .inquiry-form .frm_element textarea::-webkit-input-placeholder {color:#575757;} .inquiry-form .frm_element textarea::-moz-placeholder {color:#575757;} .inquiry-form .frm_element textarea::-ms-input-placeholder {color:#575757;} .inquiry-form .frm_action .submit{float: right; border: 1px solid #336531; color: #ffffff; padding: 0px 23px; background: #336531; height: 44px; font-size: 15px; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; margin-bottom: 30px; line-height: 42px; border-radius: 3px;} .inquiry-form .frm_action .submit:hover{background-color: #ffffff; color: #336531;} .inquiry-form .frm_element .date-part input{background: #fff url(/application/themes/grootbos/images/calender.png) no-repeat 21px 50%; padding-left: 53px;} .ui-widget.ui-widget-content{z-index: 99999999 !important;} .contact-info{width: 100%; box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);} .contact-info > .title{width: 100%; background-color: #a67b52; padding: 13px 20px; border-top-right-radius: 3px; border-top-left-radius: 3px;} .contact-info > .title h3{font-size: 20px; color: #fff; margin-bottom: 0;} .contact-info .info{width: 100%; background-color: #fff; padding: 22px 19px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px;} .contact-info .info .block{max-width: 30%; width: 100%; float: left; margin-bottom: 10px; padding-left: 40px; background-position: 0% 0%; background-repeat: no-repeat;} .contact-info .info .block.location{background-image: url(/application/themes/grootbos/images/location.png); padding-right: 20px; margin-bottom: 0;} .contact-info .info .block.phone{background-image: url(/application/themes/grootbos/images/call.png);} .contact-info .info .block.email{background-image: url(/application/themes/grootbos/images/email.png);} .contact-info .info .block.fax{background-image: url(/application/themes/grootbos/images/fax.png);} .contact-info .info .block:first-child{max-width: 40%;} .contact-info .info .block .title{font-family: 'Trajan Pro'; text-transform: capitalize; font-size: 18px; color: #000;} .contact-info .info .block .text-caption{font-size: 14px; font-family: 'Gotham'; font-weight: 300; line-height: 20px;} #popup .mCSB_outside + .mCSB_scrollTools{right: 0;} /* footer */ footer.main-footer { width:100%; height:auto; position: relative; left: 0; box-shadow: 0px 0px 50px 7px rgba(0,0,0,0.15); transition: all 0.5s ease; -webkit-transition: all 0.5s ease; } footer.main-footer .footer-top { background-image: url('/application/themes/grootbos/images/footer-bg.jpg'); background-position: left top; background-repeat: repeat; padding: 20px 0; } footer.main-footer .footer-top .single-foot { float: left; width: 33.33%; } footer.main-footer .footer-top .single-foot .title {color: #2a1a00; font-size: 24px; line-height: 1; font-family: 'Gotham Book'; margin: 0 0 15px;} footer.main-footer .footer-top .single-foot.first {padding: 30px 0; padding-left: 30px; float: left;} footer.main-footer .footer-top .single-foot .contact-block {margin: 0;} footer.main-footer .footer-top .single-foot .contact-block figure {display: inline-block; vertical-align: middle; width: 75px;} footer.main-footer .footer-top .single-foot .contact-block .contact-content {display: inline-block; vertical-align: middle; width: calc(100% - 80px); padding-left: 16px;} footer.main-footer .footer-top .single-foot .contact-block .contact-content .title {margin: 0 0 8px;} footer.main-footer .footer-top .single-foot .contact-block .contact-content p {margin: 0; font-size: 12px; line-height: 1.8; font-family: 'Gotham'; font-weight: 500; color: #2a1a00;} footer.main-footer .footer-top .single-foot .social-block {margin: 30px 0 0 0;} /*CUSTOM*/ footer.main-footer .footer-top .single-foot .social-block ul {margin: 0; padding: 0;} footer.main-footer .footer-top .single-foot .social-block ul li {margin: 0 6px 0 0; padding: 0; display: inline-block; vertical-align: top;} footer.main-footer .footer-top .single-foot .social-block ul li:before {display: none;} footer.main-footer .footer-top .single-foot .social-block ul li:hover a{opacity: 0.7;} div.form-social-block ul {margin: 0; padding: 0; padding-left: 16px;} div.form-social-block ul li {margin: 0 3px 0 3px; padding: 0; display: inline-block; vertical-align: top;} div.form-social-block ul li:before {display: none;} div.form-social-block ul li:hover a{opacity: 0.7;} footer.main-footer .footer-top .single-foot.second { text-align: center; float: right;} footer.main-footer .footer-top .single-foot.second .single-foot-logos {display: flex;align-items: center;justify-content: center;} footer.main-footer .footer-top .single-foot.second .single-foot-logos figure {max-width: 150px;min-width: 150px;} footer.main-footer .footer-top .single-foot.third {float: right; padding: 30px 0;} footer.main-footer .footer-top .single-foot.second .btn {background-color: #438fa6; line-height: 45px; max-width: 265px; width: 100%; font-size: 13px; margin: 10px 0 /*CUSTOM*/; border-color: #438fa6;} footer.main-footer .footer-top .single-foot.second .btn:hover {background-color: #fff; border-color: #438fa6; color: #438fa6;} footer.main-footer .footer-top .single-foot .quick-links {margin: 0; padding: 0; display: inline-block; vertical-align: top; width: calc(50% - 4px);} /*footer.main-footer .footer-top .single-foot .quick-links ul {margin: 0; padding: 0; display: inline-block; vertical-align: top; width: calc(50% - 4px);}*/ footer.main-footer .footer-top .single-foot .quick-links ul li {margin: 0 0 10px; padding: 0 0 0 12px; display: block; vertical-align: top; position: relative; font-size: 12px; line-height: 1; color: #443a34; font-family: 'Gotham'; font-weight: 500; } footer.main-footer .footer-top .single-foot .quick-links ul li:before {display: none;} footer.main-footer .footer-top .single-foot .quick-links ul li:after {position: absolute; left: 0; top: 1px; content: ">";} footer.main-footer .footer-top .single-foot .quick-links ul li a { display: block; color: #443a34; } footer.main-footer .footer-top .single-foot .quick-links ul li:hover:after {color: #336531;} footer.main-footer .footer-top .single-foot .quick-links ul li:hover a{text-decoration: none; color: #336531;} footer.main-footer .footer-bottom {background-color: #473024; padding: 14px 0 12px;} footer.main-footer .footer-bottom .copyright {float: left; margin: 0 0 0 30px; font-size: 11px; line-height: 1; color: #fff; font-family: 'Gotham Book'; } footer.main-footer .footer-bottom ul.terms-privacy {float: right; margin: 0 100px 0 0; padding: 0; line-height: 1;} footer.main-footer .footer-bottom ul.terms-privacy li{display: inline-block; vertical-align: top; margin: 0 0 0 18px; padding: 0; color: #fff; font-family: 'Gotham Book'; font-size: 11px; line-height: 1; position: relative; } footer.main-footer .footer-bottom ul.terms-privacy li a { color: #fff; display: block; line-height: 1;} footer.main-footer .footer-bottom ul.terms-privacy li:before{display: none; } footer.main-footer .footer-bottom ul.terms-privacy li:after{content: ""; height: 12px; width: 1px; background-color: #fff; position: absolute; left: 0; top: 0; display: inline-block; vertical-align: top; margin-left: -10px; } footer.main-footer .footer-bottom ul.terms-privacy li:first-child {margin-left: 0;} footer.main-footer .footer-bottom ul.terms-privacy li:first-child:after {display: none;} /*--------- home page ------------*/ /* banner part */ .banner {background-color: #000; height: 800px; background-position: center center; background-repeat: no-repeat; background-size: cover; box-shadow: 0px 0px 50px 7px rgba(0,0,0,0.15); position: relative; z-index: 99;position: relative;} .banner .text-bg-overlay{ background: -moz-linear-gradient(top, rgba(0,0,0,0.6) 1%, rgba(0,0,0,0.56) 3%, rgba(0,0,0,0.5) 25%, rgba(0,0,0,0.4) 54%, rgba(0,0,0,0.3) 67%, rgba(0,0,0,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 1%,rgba(0,0,0,0.56) 3%,rgba(0,0,0,0.5) 25%,rgba(0,0,0,0.4) 54%,rgba(0,0,0,0.3) 67%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0.6) 1%,rgba(0,0,0,0.56) 3%,rgba(0,0,0,0.5) 25%,rgba(0,0,0,0.4) 54%,rgba(0,0,0,0.3) 67%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */ text-align: center; padding: 80px 20px 30px 20px;} .banner .text-bg-overlay h2, .banner .text-bg-overlay .h2{max-width: 1170px; margin: 0 auto;} .banner .container {max-width: 800px; text-align: center;position: relative;z-index: 99} .banner h2, .banner .h2 {font-family: 'Trajan Pro'; font-size: 34px; color: #fff; line-height: 1.2;} #content-area{box-shadow: 0px 0px 50px 7px rgba(0,0,0,0.15); position: relative; z-index: 99; margin-top: 114px;} #content-area.home-content{margin-top: 0;} /*--------- landing-section ------------*/ @keyframes bounce { from { transform: translateY(0px); } to { transform: translateY(-15px); } } @-webkit-keyframes bounce { from { transform: translateY(0px); } to { transform: translateY(-15px); } } .landing-section { background-size: cover; background-repeat: no-repeat; background-position: center center; height: calc(100vh - 106px); min-height: 600px; text-align: center; position: relative; } .landing-section .logo {margin: 95px 0 35px; float: none; vertical-align: top; position: absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: 0; z-index: 3; width: 250px;} .landing-section .caption {padding: 206px 0 0;} .side-logo-banner {position: absolute;left:10px;bottom:10px;z-index: 3;max-width: 150px;} .side-logo-banner img{width: 100%;} .landing-section .caption h1, .landing-section .caption .h1 { font-weight:400; line-height: 1.2; font-family: 'Trajan Pro'; font-size: 58px; color: #fff; margin: 0 0 7px; } .landing-section .caption h3, .landing-section .caption .h3{ font-weight:700; line-height: 1.2; font-family: 'Trajan Pro'; font-size: 25px; color: #fff; margin: 0 0 26px; } .landing-section .content-block.play .container{z-index: -1;} .landing-section .content-block.play video{z-index: 2;} .landing-section .content-block.play .pause-video{z-index: 999;} .landing-section .content-block video{width: 100%; height: 100%; display: block; position: absolute; z-index: 1; background: #000; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .landing-section .content-block .pause-video{position: absolute; top: 50px; right: 50px; display: inline-block; height: 50px; width: 50px; vertical-align: top; color: #fff; font-size: 24px; text-decoration: none; border: 3px solid #fff; border-radius: 100%; line-height: 50px; background-image: none; text-align: center;} .landing-section .content-block .pause-video:after{content: "\62"; font-family: "grootbos" !important; font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #fff;} .play-video {width: 100px; margin: 0 auto; display: inline-block; vertical-align: top; text-decoration: none; } .landing-section .caption .play-video:not(.pulse-wave) span { display: block; border: 3px solid #fff; border-radius: 100%; text-align: center; height: 84px; width: 84px; font-size: 50px; color: #fff; margin: 0 auto 14px;} .landing-section .caption .play-video:not(.pulse-wave) span:before {line-height: 78px; margin-left: 6px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;} .landing-section .caption .play-video:not(.pulse-wave) i {display: block; font-style: normal; font-family: 'Gotham Book'; font-size: 12px; line-height: 1; color: #fff;} .landing-section .content-block {width: 100%; position: relative; height: 100%;} .landing-section .content-block .video-bg{background-size: cover; background-repeat: no-repeat; background-position: center center; height: 100%; position: absolute; top: 0; left: 0; width: 100%; text-align: center; z-index: 2;} .landing-section .container {position: relative; height: 100%; z-index: 2;} .landing-section .national-geo {position: absolute; bottom: 85px; left: 0; right: 0; margin: auto;} .videobg iframe {display: block; height: 100vh !important; width: 100%; vertical-align: top; margin: 0 !important;} .videobg a.close-video {display: inline-block; height: 50px; width: 50px; vertical-align: top; color: #fff; position: absolute; top: 10px; right: 50px; font-size: 24px; text-decoration: none; border: 3px solid #fff; border-radius: 100%; line-height: 50px; } .videobg .close-video:hover {transform: scale(1.1, 1.1);} .landing-section .down-arrow {position: absolute; right: 50px; bottom: 50px; z-index: 3; animation: bounce 1s infinite alternate; -webkit-animation: bounce 1s infinite alternate; display: inline-block; vertical-align: middle; height: 32px; width: 32px; text-align: center; line-height: 32px; color: #fff; font-size: 18px; background-color: #2a3a23; border-radius: 100%; text-decoration: none;} .landing-section .down-arrow .icon {display: block; line-height: 0; line-height: inherit;} .landing-section .down-arrow .icon:before {line-height: inherit;} .landing-section .down-arrow:hover { bottom: 40px; text-decoration: none; color: #fff; } .fancybox-lock .fancybox-overlay{overflow-y: hidden;} .fancybox-active .fancybox-close {display: inline-block; height: 50px; width: 50px; vertical-align: top; color: #fff; font-size: 24px; text-decoration: none; border: 3px solid #fff; border-radius: 100%; line-height: 50px; background-image: none; text-align: center; position: fixed; right: 40px; top: 30px; background-color: transparent;} .fancybox-active .fancybox-close.icon:hover {transform: scale(1.1, 1.1);} /*--------- specific-gatway-section ------------*/ .specific-gatway-section {background-color: #f5e2c9; padding: 16px 0 14px;} .specific-gatway-section .left-block {display: inline-block; vertical-align: middle; width: 35%; text-align: center;} .specific-gatway-section .left-block p {color: #2a1a00; font-family: 'Trajan Pro'; font-weight: 400; font-size: 24px; line-height: 1.2; margin: 10px 0; } .specific-gatway-section .right-block {display: inline-block; vertical-align: middle; width: calc(65% - 8px);} .specific-gatway-section .right-block ul {margin: 0; padding: 0;} .specific-gatway-section .right-block ul li {margin: 0 -2px; padding: 0; display: inline-block; vertical-align: top; text-align: center; width: 20%;} .specific-gatway-section .right-block ul li:before {display: none;} .specific-gatway-section .right-block ul li figure { -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; margin: 0 0 8px; } .specific-gatway-section .right-block ul li:hover figure {-webkit-transform: scale(1.1); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: scale(1.1); /* IE 9 */ transform: scale(1.1); /* Firefox 16+, IE 10+, Opera*/ /*-ms-transform: scale(1.1); -webkit-transform: scale(1.1); transform: rotateY(180deg);*/} .specific-gatway-section .right-block ul li a {display: block; font-size: 14px; line-height: 1; display: block; color: #2a1a00;font-family: 'Trajan Pro'; font-weight: 400; text-decoration: none; } .specific-gatway-section .down-arrow { display: none; vertical-align: middle; height: 30px; width: 30px; text-align: center; line-height: 32px; color: #fff; font-size: 18px; background-color: #8c4319; border-radius: 100%; text-decoration: none;} .specific-gatway-section .down-arrow .icon {display: block; line-height: 0; line-height: inherit;} .specific-gatway-section .down-arrow .icon:before {line-height: inherit;} .specific-gatway-section .down-arrow:hover { bottom: 40px; text-decoration: none; color: #fff; } .specific-gatway-section .down-arrow.open {-ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg);} /* content part */ /*--------- melting-section ------------*/ .melting-section {background-color: #fff;} .melting-section h2 {text-align: center; margin: 0; padding: 54px 0 52px; color: #321c00; font-family: 'Trajan Pro'; font-weight: 400; font-size: 34px; line-height: 1.2; } .melting-section .full-blocks .single-block { float: left; width: 33.33%; min-height: 375px; position: relative; background-position: center center; background-size: cover; text-decoration: none; padding: 20px; text-align: center;} .melting-section .full-blocks .single-block:before {content: ""; background-color: #8c6239; opacity: 0.45; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;} .melting-section .full-blocks .single-block .title {text-align: center; color: #fff; position: relative; z-index: 2; font-family: 'Trajan Pro'; font-weight: 400; font-size: 28px; text-decoration: none; position: relative; line-height: 1.4; display: inline-block; vertical-align: middle; padding: 8px 0 12px; } /*.melting-section .full-blocks .single-block .title:after {content: ""; position: absolute; height: 3px; width: 0%; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; left: 0; right: 0; margin: auto; bottom: 0; background-color: #fff; }*/ .melting-section .full-blocks .single-block:hover .title:after {width: 70%; } .melting-section .full-blocks .single-block:hover:before { opacity: 0; } .top-caption {margin: 0 0 30px; text-align: center;} .top-caption h2 {color: #321c00; font-family: 'Trajan Pro'; font-weight: 400; font-size: 34px; line-height: 1.4; margin: 0 0 4px;} .top-caption h2 span {display: block; text-align: center; margin-bottom: 5px; line-height: 0;} .top-caption p {color: #534741; font-size: 20px; font-family: 'Gotham Book'; line-height: 1.2; margin: 0; } /*--------- award-section ------------*/ .award-section {background-image: url('/application/themes/grootbos/images/award-bg.jpg'); background-position: left top; background-repeat: repeat; text-align: center; padding: 36px 0; } .award-section .top-caption h2 {color: #fff;} .award-section .single-award {text-align: center; padding: 0 30px;} .award-section .single-award figure {margin-bottom: 16px;} .award-section .single-award .title {color: #fff; font-family: 'Gotham'; font-weight: 500; font-size: 16px; line-height: 1.2; } .award-section .slick-dots {margin: 0 0 -36px;} .award-section .award-slider {margin-bottom: 40px; padding: 0 40px;} /*--------- progressive-section ------------*/ .progressive-section { background-size: cover; background-repeat: no-repeat; background-position: center center; height: 510px; display: table; width: 100%;} .progressive-section .content{max-width: 700px; width: 100%;} .progressive-section .container {max-width: 700px; text-align: center; display: table-cell; vertical-align: middle; width: 100%;} .progressive-section h2 { font-size: 34px; font-family: 'Trajan Pro'; font-weight: 400; color: #321c00; margin-bottom: 18px; } .progressive-section p { font-size: 20px; font-family: 'Gotham Book'; line-height: 1.2; color: #321c00; margin-bottom: 35px; } /*--------- accomodation-section ------------*/ .accomodation-section {background-color: #fff; padding: 76px 0 110px; overflow: hidden;} .accomodation-section .top-caption {max-width: 700px; width: 100%; margin-left: auto; margin-right: auto; text-align: center;} .accomodation-section h2{ color: #321c00;font-family: 'Trajan Pro';font-weight: 400;font-size: 34px;line-height: 1.4;margin: 0 0 4px;} .accomodation-tab .tab-button ul {margin: 0; padding: 0; text-align: center;} .accomodation-tab .tab-button ul li {margin: 0 2px; padding: 0; display: inline-block; vertical-align: top; max-width: 280px; width: 100%; text-align: center;} .accomodation-tab .tab-button ul li:before {display: none;} .accomodation-tab .tab-button ul li a {display: block; background-color: #dfc790; color: #a67c52; font-family: 'Gotham'; font-weight: 500; text-transform: uppercase; text-decoration: none; padding: 17px 0 14px; border-radius: 10px 10px 0 0; border-bottom: 6px solid #fff; } .accomodation-tab .tab-button ul li.active a { background-color: #b08f4f; color: #fff; border-bottom: 6px solid #b08f4f;} .accomodation-tab .tab-button ul li:hover a { background-color: #b08f4f; color: #fff; } .accomodation-tab .tab-button ul li a .title {font-size: 16px; line-height: 1; margin-bottom: 10px;} .accomodation-tab .tab-button ul li a .sub-title {font-size: 11px; line-height: 1;} .accomodation-tab .accomodation-slider {border-bottom: 5px solid #b08f4f; border-top: 5px solid #b08f4f; max-width: 1080px; width: 100%; margin: 0 auto;} .accomodation-tab .accomodation-slider .single-accomodation .left-accomodation { width: 32%; float: right; background-color: #f5e2c9; padding: 38px 46px 30px; margin: 0 0 -2px;} .accomodation-tab .accomodation-slider .single-accomodation .right-accomodation { width: 68%; float: right; min-height: 470px; background-position: center center; background-size: cover; background-repeat: no-repeat; } .accomodation-tab .accomodation-slider .single-accomodation .left-accomodation h3 {color: #320600; font-family: 'Trajan Pro'; font-size: 35px; line-height: 1.2; margin: 0 0 15px;} .accomodation-tab .accomodation-slider .single-accomodation .left-accomodation p {color: #534741; font-weight: 300; line-height: 1.4; font-size: 14px; line-height: 1.2; margin: 0 0 36px;} .accomodation-tab .accomodation-slider .single-accomodation .left-accomodation .btn {width: 100%; text-align: center; margin: 0 0 22px; padding: 0 6px;} .accomodation-tab .accomodation-slider .slick-prev {right: 100%; left: auto; text-align: left;} .accomodation-tab .accomodation-slider .slick-next {left: 100%; right: auto; text-align: right;} .accomodation-tab .accomodation-slider .slick-arrow:before {color: #a67c52; } .accomodation-tab .accomodation-slider .slick-arrow:hover:before {color: #336531; } .accomodation-tab .accomodation-slider .slick-dots {margin: 0; bottom: -50px;} .accomodation-tab .accomodation-slider .slick-dots li.slick-active button, .accomodation-tab .accomodation-slider .slick-dots li:hover button { background: #a67c52 none repeat scroll 0 0; } .accomodation-tab .accomodation-slider .slick-dots li button {border-color: #a67c52;} .accomodation-tab a.accordian-click {background-color: #dfc790;border-radius: 0;color: #a67c52;display: block;font-family: "Gotham";font-weight: 500;padding: 17px 0 14px;text-decoration: none;text-transform: uppercase; text-align: center; text-decoration: none; display: none; position: relative;} .accomodation-tab a.accordian-click:before {content: "i"; font-family: "grootbos" !important;font-style: normal !important;font-variant: normal !important;font-weight: normal !important;line-height: 1;text-transform: none !important; position: absolute; right: 18px; top: 0; bottom: 0; margin: auto; height: 16px; font-size: 16px;} .accomodation-tab .single-accomodation.open a.accordian-click:before {content: "h";} .accomodation-tab a.accordian-click .sub-title {font-size: 11px;line-height: 1;} .accomodation-tab a.accordian-click .title {font-size: 16px;line-height: 1;margin-bottom: 10px;} .accomodation-tab a.accordian-click .sub-title {font-size: 11px;line-height: 1;} .accomodation-tab .single-accomodation.open a.accordian-click {background-color: #b08f4f;color: #ffffff;} /*--------- testimonials-section ------------*/ .testimonials-section { background-image: url('/application/themes/grootbos/images/award-bg.jpg'); background-position: left top; background-repeat: repeat; text-align: center; padding: 36px 0; } .testimonials-section .top-caption h2 {color: #fff;} .testimonials-slider {padding: 0 60px;} .testimonials-slider .slick-dots { margin: 26px 0 0; position: static; } .testimonials-slider .slick-arrow {margin-top: -40px;} .testimonials-slider .single-testimonial .testimonial-inner {max-width: 660px; width: 100%; margin: 0 auto;} .testimonials-slider .single-testimonial p{color: #fff; margin: 0 0 3px; font-family: 'Gotham'; font-weight: 500; font-size: 17px; line-height: 1.4;} .testimonials-slider .single-testimonial .name{color: #fff; font-family: 'Gotham Book'; font-size: 18px; margin: 0 0 16px;} /*--------- gallery-section ------------*/ .gallery-section {background-color: #fff; padding: 70px 0;} .gallery-grids {margin: 0 0 35px;} .gallery-grids a.fancybox {float: left; padding: 0 2px 2px 0; border-radius: 3px; overflow: hidden;} .gallery-grids a.fancybox.width1 {width: 32%;} .gallery-grids a.fancybox.width2 {width: 18%;} .gallery-grids a.fancybox.height1 {height: 250px;} .gallery-grids a.fancybox.height2 {height: 200px;} .gallery-grids a.fancybox .gallery-inner { height: 100%; position: relative; background-color: #000; } .gallery-grids a.fancybox .gallery-inner:before {content: "g"; font-family: "grootbos"; font-style: normal;font-variant: normal;font-weight: normal;line-height: 1;text-transform: none; position: absolute; left: 50%; top: 50%; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #fff; text-align: center; font-size: 30px; z-index: 5; opacity: 0; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .gallery-grids a.fancybox .gallery-inner .bg-img {background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; height: 100%;} .gallery-grids a.fancybox .gallery-inner .bg-img img {display: none; width: 100%;} .gallery-grids a.fancybox .gallery-inner .title {position: absolute; left: 0; bottom: 0; color: #fff; width: 100%; font-size: 14px; line-height: 1; font-family: 'Gotham'; font-weight: 500; padding: 14px 24px 14px 14px; } .gallery-grids a.fancybox .gallery-inner .title:before {content: "f"; font-family: "grootbos"; font-style: normal;font-variant: normal;font-weight: normal;line-height: 1;text-transform: none; position: absolute; right: 14px; opacity: 0; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .gallery-grids a.fancybox .gallery-inner .bg-img .icon:before {line-height: inherit;} .gallery-grids a.fancybox:hover .gallery-inner .bg-img {opacity: 0.5;} .gallery-grids a.fancybox:hover .gallery-inner .title:before {opacity: 1;} .gallery-grids a.fancybox:hover .gallery-inner:before {opacity: 1;} .gallery-grids a.fancybox.has-video .gallery-inner .bg-img .icon {position: absolute; left: 50%; top: 50%; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 6; font-size: 30px; color: #fff; border: 2px solid #fff; text-align: center; border-radius: 100%; height: 58px; width: 58px; line-height: 54px; } .gallery-grids a.fancybox.has-video .gallery-inner .title:before {display: none;} .gallery-grids a.fancybox.has-video .gallery-inner:before {display: none;} .gallery-section .view-full {text-align: center;} .gallery-grids .slick-dots {bottom: -23px;} .gallery-grids .slick-dots li.slick-active button, .gallery-grids .slick-dots li:hover button {background-color: #a67c52;} .gallery-grids .slick-dots li button {border-color: #a67c52;} /*--------- experiences-section ------------*/ .experiences-section {background-image: url('/application/themes/grootbos/images/experience-bg.jpg'); background-position: left top; background-repeat: repeat; text-align: center; padding: 70px 0; -webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.23) inset; -moz-box-shadow:0 3px 6px 0 rgba(0, 0, 0, 0.23) inset; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.23) inset;} .experiences-section .top-caption {margin-left: auto;margin-right: auto;max-width: 700px;text-align: center;width: 100%;} .experience-grids {max-width: 908px; margin: 0 auto 40px; width: 100%;} .experience-grids .single-experience {float: left; position: relative;} .experience-grids .single-experience a{display: block; overflow: hidden; position: relative;} .experience-grids .single-experience a:before{ content: ""; display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0, 0.15);} .experience-grids .single-experience a img{transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .experience-grids .single-experience a:hover img{transform: scale(1.1); -webkit-transform: scale(1.1);} .experience-grids .single-experience.width01 { width: 25.33%; } .experience-grids .single-experience.width02 { width: 49.3392%; } .experience-grids .single-experience-bg {padding: 44%; display: none; background-position: center center; background-size: cover; background-repeat: no-repeat;} .experience-grids .single-experience .title { position: absolute; bottom: 0; left: 0; width: 100%; font-family: 'Trajan Pro'; font-weight: bold; font-size: 25px; line-height: 1.3; color: #fff; padding: 22px; text-transform: uppercase;} .experiences-section .top-caption h2{font-size: 34px;} /*--------- food-wine-section ------------*/ .food-wine-section {background-color: #fff; padding: 60px 0;} .food-wine-section .top-caption {margin-left: auto;margin-right: auto;max-width: 700px;text-align: center;width: 100%;} .food-wine-rows { max-width: 908px; margin: 0 auto; width: 100%; } .food-wine-rows .single-food-wine .food-wine-content{ float: left; width: 39%; text-align: center; position: relative; min-height: 394px; padding: 0 28px 60px;} .food-wine-rows .single-food-wine{ border-top: 1px solid #a67b52; margin-top: 50px; padding-top: 50px;} .food-wine-rows .single-food-wine:first-child {border: none; margin-top: 0; padding-top: 0; } .food-wine-rows .single-food-wine .food-wine-content .btn { position: absolute; bottom: 0; left: 28px; right: 28px; padding: 0 10px; font-size: 14px; } .food-wine-rows .single-food-wine .food-wine-content .title, .food-wine-rows .title h3{color: #321c00; font-family: 'Trajan Pro'; font-size: 26px; line-height: 1.2; margin: 0 0 26px; } .food-wine-rows .title h3{font-size: 20px;} .food-wine-rows .single-food-wine .food-wine-content p {color: #534741; font-family: 'Gotham'; font-weight: 300; font-size: 16px; line-height: 1.5; margin: 0; } .food-wine-rows .single-food-wine .food-wine-img{ float: right; width: 61%; background-size: cover; background-position: center center; background-repeat: no-repeat; } .food-wine-rows .single-food-wine .food-wine-img img {display: none;} .food-wine-rows .single-food-wine.reverse .food-wine-content{ float: left;} .food-wine-rows .single-food-wine.reverse .food-wine-img{float: left;} /*--------- specials-overview-section ------------*/ .specials-overview-section {background-color: #fff; overflow: hidden; padding-top: 50px; padding-bottom: 70px; border-top: 1px solid #ede5dc;} .honeymoon-gateway-page .specials-overview-section{padding-top: 0; border-top: 0;} .honeymoon-gateway-page .specials-overview-section .container{border-top: 1px solid #ede5dc; padding-top: 50px;} .specials-overview-slider {margin: 0 -2px 70px; position: relative;} .specials-overview-slider .single-specials-overview {padding: 0 2px;} .specials-overview-slider .single-specials-overview figure img {width: 100%;} .specials-overview-slider .single-specials-overview figure {-webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;} .specials-overview-slider .single-specials-overview .single-inner { position: relative; background-color: #a67b52; overflow: hidden; border-radius: 4px;} .specials-overview-slider .single-inner .only-title, .specials-overview-slider .single-inner .overlay-content .title {font-family: 'Trajan Pro'; font-size: 26px; line-height: 1.1; margin: 0; color: #fff; text-align: center; } .specials-overview-slider .single-inner .only-title {position: absolute; bottom: 0; left: 0; right: 0; width: 100%; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;padding: 26px; } .specials-overview-slider .single-inner .only-title:after{position: absolute; content: ""; bottom: 0; left: 0; width: 100%; height: 100%; background: url(/application/themes/grootbos/images/special-shadow.png) no-repeat;} .specials-overview-slider .single-inner .overlay-content .title {margin: 20px 0 18px;} .specials-overview-slider .single-inner .overlay-content p {font-size: 16px; line-height: 1.5; color: #fff; font-family: 'Gotham Book'; margin: 0 0 25px;} .specials-overview-slider .single-inner .overlay-content .btn {margin-bottom: 3px;} .specials-overview-slider .single-inner .overlay-content { position: absolute; bottom: 0; top: 0; height: 100%; width: 100%; left: 0; right: 0; opacity: 0; visibility: hidden; -webkit-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; text-align: center; padding: 26px; -ms-transform: scale(0.8); -webkit-transform: scale(0.8); transform: scale(0.8); overflow: auto; } .specials-overview-slider .single-inner:hover .only-title {bottom: -100%;} .specials-overview-slider .single-inner:hover .overlay-content { opacity: 1; visibility: visible; -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); } .specials-overview-slider .single-inner:hover figure {opacity: 0.23;} .specials-overview-slider .slick-prev::before, .specials-overview-slider .slick-next::before{color: #a87f55;} .specials-overview-slider .slick-prev {left: auto; right: 100%;} .specials-overview-slider .slick-next {left: 100%; right: auto; } .specials-overview-slider .slick-dots{margin-bottom: -40px;} .specials-overview-slider .slick-dots li button {border-color: #a67c52; } .specials-overview-slider .slick-dots li.slick-active button, .specials-overview-slider .slick-dots li:hover button {background-color: #a67c52;} .specials-overview-section .view-full {text-align: center;} /*--------- hospitality-section ------------*/ .hospitality-section { background-position: center center; background-repeat: no-repeat; background-size: cover; min-height: 280px; text-align: center; padding: 50px 0; -webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.23); -moz-box-shadow:0 3px 6px 0 rgba(0, 0, 0, 0.23); box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.23); margin: 0 0 26px; position: relative;} .hospitality-section:before{ content: ""; display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0, 0.4);} .hospitality-section .container{z-index: 9; position: relative;} .hospitality-section .top-caption {margin: 0;} .hospitality-section .top-caption h4, .hospitality-section .top-caption .h4, .top-caption .h4{font-size: 38px; color: #fff; margin-bottom: 15px;font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro';} .hospitality-section .make-buttons .btn {max-width: 320px; line-height: 50px; width: 100%; margin: 10px;} /*------------thank-you-page------------*/ .thank-you-block{padding: 48px 0; background-color: #fff; border-bottom: 1px solid #ccc;} .thank-you-block .top-caption {margin: 0 0 25px; text-align: center;} .thank-you-block .top-caption h1 {color: #321c00; font-family: 'Trajan Pro'; font-weight: 400; font-size: 34px; line-height: 1.4; margin: 0 0 4px;} .thank-you-block .top-caption h1 span {display: block; text-align: center; margin-bottom: 5px; line-height: 0;} .thank-you-block .top-caption p {color: #321c00; font-size: 20px; font-family: 'Gotham Book'; line-height: 1.2; margin: 0;} /*-------------accomodation-page----------------*/ .landing-section.inner-banner{height: calc(100vh - 220px); min-height: inherit;} .landing-section.inner-banner h1, .landing-section.inner-banner .h1{font-size: 34px;} .landing-section.inner-banner .caption{padding-top: 80px; max-width: 90%; width: 100%;} .landing-section.inner-banner .caption h3{font-size: 22px;} .accomodation-block{width: 100%; display: block; padding-top: 40px; padding-bottom: 45px;} .heading-caption{display: block; text-align: center; margin: 0 0 25px;} .heading-caption h1{font-size: 34px; color: #321c00; font-family: 'Trajan Pro'; font-weight: 400; line-height: 1.4; margin: 0 0 4px;} .heading-caption h1 span{display: block; text-align: center; margin-bottom: 5px; line-height: 0;} .heading-caption p{font-size: 20px; color: #534741; font-family: 'Gotham Book'; line-height: 1.2; margin: 0;} .lodge-block-wrapper{width: 100%; background: #d8d6c9;} .lodge-block nav{ width:100%; height:auto; font-size: 0; position: relative;} .lodge-block nav ul{margin: 0; text-align: center;} .lodge-block nav li{display: inline-block; margin: 0 1px 0 0; list-style: none; padding: 0;} .lodge-block nav li:before{display: none;} .lodge-block nav li a{display: block; text-align: center; padding: 13px 24px; cursor: pointer; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; font-size: 16px; color: #61553d; font-family: 'Trajan Pro'; font-weight: 400; text-transform: uppercase; position: relative;} .lodge-block nav li a:after{position: absolute; content: ""; width: 0; height: 0; border-style: solid; border-width: 0 0 7px 0; border-color: transparent transparent #ffffff transparent; left: 50%; bottom: 0; transform: translateX(-50%); -webkit-transform: translateX(-50%); z-index: 99; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .lodge-block nav li a .title{font-size: 16px; color: #61553d; font-family: 'Trajan Pro'; font-weight: 400; line-height: 1.2; margin-bottom: 3px; display: block; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .lodge-block nav li a span{font-size: 11px; display: block; font-family: 'Gotham'; font-weight: 500; color: #61553d; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .lodge-block nav li a:hover, .lodge-block nav li.active a{text-decoration: none; color: #fff; background: #a6a49a;} .lodge-block nav li a:hover:after, .lodge-block nav li.active a:after{border-width: 0 7.5px 7px 7.5px;} .lodge-block nav li a:hover .title, .lodge-block nav li.active a .title{color: #fff;} .lodge-block nav li a:hover span, .lodge-block nav li.active a span{color: #fff;} .lodge-block-wrapper.fix{ position:fixed; z-index:9999; top: 0;} .lodge-block-content{width: 100%; padding: 25px 0;} .lodge-block-content .inroduction{padding-top: 0;} .lodge-block-content .lodge-bg.style-1{float: right;} .lodge-block-content .lodge-bg{background-size: cover; float: left; max-width: 660px; width: 100%; position: relative; background-position: center;} .lodge-block-content .lodge-bg.style-1 .lodge-title{right: 20px; left: inherit;} .lodge-block-content .lodge-bg .lodge-title{position: absolute; bottom: 15px; left: 20px; font-size: 30px; font-family: 'Trajan Pro'; color: #fff; z-index: 99; } .lodge-block-content .lodge-detail{max-width: 510px; width: 100%; float: right; background: #f5e2c9; padding: 25px 32px 28px; border-bottom: 5px solid #b08f4f;} .lodge-detail h2{font-size: 30px; color: #320600; line-height: 1.2; margin-bottom: 6px; font-family: 'Trajan Pro';} .lodge-detail h3{font-size: 24px; color: #320600; line-height: 1.2; margin-bottom: 8px; font-family: 'Trajan Pro';} .lodge-detail p{font-size: 14px; color: #534741; font-family: 'Gotham'; font-weight: 300; margin-bottom: 18px;} .lodge-detail ul{margin: 0 0 20px; display: block;} .lodge-detail ul li{list-style: none; padding: 0 0 8px 20px; font-size: 14px; color: #534741; font-family: 'Gotham'; font-weight: 300;} .lodge-detail ul li:before{background: #593228;} .lodge-detail a.btn{width: 210px; font-size: 14px; padding: 0; text-align: center;} .lodge-detail a.btn:first-child{margin-right: 21px;} /*----------garder-lodge-page----------*/ .garder-lodge-block{padding: 30px 0 45px; } .inner-banner-slider{width: 100%;} .inner-banner-slider .iteam{background-size: cover; background-position: center; width: 100%; height: calc(100vh - 220px); position: relative;} .inner-banner-slider .iteam h1, .inner-banner-slider .iteam .h1{position: absolute; top: 25px; right: 25px; font-size: 30px; color: #fff; z-index: 99; font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro';} .inner-banner-slider .iteam .h1{ margin-bottom: 15px;font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro';} .inner-banner-slider .slick-arrow{width: 40px; height: 40px; background: #61553d; border-radius: 50%; text-align: center; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .slick-prev:before, .slick-next:before{transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .inner-banner-slider .slick-prev{left: 30px;} .inner-banner-slider .slick-next{right: 30px;} .inner-banner-slider .slick-prev:hover, .inner-banner-slider .slick-next:hover{background: #fff;} .inner-banner-slider .slick-prev:hover:before, .inner-banner-slider .slick-next:hover:before{color: #0f0f0f;} .inner-banner-slider .slick-prev:before, .inner-banner-slider .slick-next:before{font-size: 20px; line-height: 40px;} .inner-banner-slider .slick-dots{bottom: 30px;} .inner-banner-slider .slick-dots li button{width: 10px; height: 10px; border: 0; background: #fff;} .inner-banner-slider .slick-dots li.slick-active button, .inner-banner-slider .slick-dots li:hover button{background: #61553d;} .garder-lodge-block .inroduction{padding-bottom: 0; padding-top: 10px} .garder-lodge-block .inroduction .heading-caption{border-bottom: 1px solid #ede5dc; margin-bottom: 0; padding-bottom: 25px;} .garder-lodge-block .overview{width:100%;} .garder-lodge-block .overview .title{float: left;} .garder-lodge-block .overview .title h3{font-size: 30px; color: #321c00; margin-bottom: 15px;} .garder-lodge-block .overview h2, .garder-lodge-block .overview h3{font-size: 30px; color: #321c00; margin-bottom: 15px;} .garder-lodge-block .overview p{font-size: 16px; font-family: 'Gotham'; font-weight: 300; color: #534741;} .garder-lodge-block .overview .highlights{margin-top: 45px; background: #faf0e4; width: 100%; padding: 30px;} .overview .highlights .left{max-width: 620px; float: left; width: 100%;} .overview .highlights .left h2{margin-bottom: 5px;} .overview .highlights .left p{font-family: 'Gotham Book';} .overview .highlights .left .highlight-points{background: #a67b52; padding: 15px;} .overview .highlights .left .btn-see{text-transform: uppercase; clear: both; margin-top: 18px;} .highlights .left .highlight-points ul{margin: 0; padding: 0 15px 0 0; display: inline-block; width: 49%; vertical-align: top;} .highlights .left .highlight-points ul li{list-style: none; font-size: 16px; color: #fff; font-family: 'Gotham'; font-weight: 300; padding: 0 0 10px 20px; line-height: 1.2;} .highlights .left .highlight-points ul li:before{content: "e"; background: none; color: #fff; font-size: 12px; font-family: "grootbos" !important; font-style: normal !important; font-variant: normal !important; font-weight: normal !important; line-height: 1; text-transform: none !important; top: 5px;} .overview .highlights .right{float: right; max-width: 460px; width: 100%;} .overview .highlights .right .highlights-slider .iteam{height: 320px; position: relative;} .overview .highlights .right .highlights-slider .iteam h4{position: absolute; bottom: 15px; margin-bottom: 0; font-size: 22px; color: #fff; right: 20px;} .overview .right .highlights-banner .iteam{width: 100%; height: 300px; position: relative; background-size: cover; background-position: center;} .highlights-slider .slick-arrow{width: 40px; height: 40px; background: #61553d; border-radius: 50%; text-align: center; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .highlights-slider .slick-prev{left: 20px;} .highlights-slider .slick-next{right: 20px;} .highlights-slider .slick-prev:hover, .highlights-slider .slick-next:hover{background: #fff;} .highlights-slider .slick-prev:before, .highlights-slider .slick-next:before{font-size: 20px; line-height: 40px; color: #fff;} .highlights-slider .slick-prev:hover:before, .highlights-slider .slick-next:hover:before{color: #000;} .highlights-slider .slick-dots{bottom: -30px;} .highlights-slider .slick-dots li button{width: 10px; height: 10px; border: 1px solid #61553d; background: #fff;} .highlights-slider .slick-dots li.slick-active button, .highlights-slider .slick-dots li:hover button{background: #61553d;} .overview.style-1 .highlights{background: none; padding: 0; margin: 0;} .overview.style-1 .left{float: right; max-width: 680px; padding-right: 20px;} .overview.style-1 .left .highlight-points{display: block; width: auto; max-width: 67%; margin-left: 0;} .overview.style-1 .left .highlight-points ul{max-width: 410px; width: 100%;} .overview.style-1 .right{float: left; margin-right: 28px;} .overview.style-1 .title{float: right; max-width: 680px; width: 100%;} .garder-lodge-block .overview.suits .highlights{margin: 0;} .garder-lodge-block .overview.suits{margin-bottom: 50px;} .overview.suits .highlights .right{max-width: 450px;} .overview.suits .highlights .left .highlight-points ul{width: 100%;} .our-rates-section{width: 100%; display: block; padding: 45px 0; text-align: center; background-size: cover; background-position: center; position: relative;} .our-rates-section .container h3, .our-rates-section .container .h3{font-size: 34px; color: #fff; margin-bottom: 25px; position: relative; font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro';} .our-rates-section .btn-see{text-transform: uppercase; position: relative;} .inner-gallery.gallery-section{padding: 20px 0 0;} .inner-gallery.gallery-section.border-btm .container{padding-bottom: 70px; border-bottom: 1px solid #ede5dc;} .virtual-tours{width: 100%; background-size: 100%; background-position: center; padding: 30px; text-align: center; transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} .virtual-tours:hover{background-size: 110%;} .virtual-tours .text-caption{border: 5px solid #a67b52; padding-top: 40px; padding-bottom: 28px; position: relative;} .virtual-tours .text-caption h4, .virtual-tours .text-caption h2, .virtual-tours .text-caption .h2{font-size: 34px; color: #fff; margin-bottom: 5px; position: relative;font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro';} .virtual-tours .text-caption .btn-round{width: 64px; height: 64px; border: 1px solid #fff; border-radius: 50%; padding: 3px; position: relative; display: block; margin-bottom: 20px;} .virtual-tours .text-caption .btn-round:after{position: absolute; content: ""; width: 44px; height: 45px; background: url(/application/themes/grootbos/images/360_icon.png); top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);} .virtual-tours .text-caption .btn-play{width: 64px; height: 64px; border: 1px solid #fff; border-radius: 50%; padding: 3px; position: relative; display: block; margin-bottom: 20px;} .virtual-tours .text-caption .btn-play:after{position: absolute; content: ""; width: 44px; height: 45px; background: url(/application/themes/grootbos/images/play_icon.png); top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);} .virtual-tours .text-caption p{font-size: 20px; color: #fff; font-family: 'Gotham Book'; position: relative;} /*-------------garden-lodge-suites-page-------------*/ .garden-lodge-suites-block .highlights-suites h2{font-size: 34px; margin-bottom: 10px;} .garden-lodge-suites-block .highlights-suites h5{font-size: 22px; color: #321c00; margin-bottom: 10px;} .highlight-suites-slider{width: 100%; max-width: 1112px; margin-bottom: 45px;} .highlight-suites-slider .iteam{margin: 0 15px; background-color: #f4f0ea;} .highlight-suites-slider .slick-slide.iteam{float: none; height: auto; align-items: stretch;} .highlight-suites-slider .slick-track{display: flex;} .highlight-suites-slider .text-caption{width: 100%; padding: 15px 20px; background: #f4f0ea;} .highlight-suites-slider .text-caption h4{font-size: 22px; color: #321c00;} .highlight-suites-slider .text-caption p{font-size: 14px; color: #534741; margin-bottom: 10px;} .highlight-suites-slider .slick-prev{left: -30px;} .highlight-suites-slider .slick-next{right: -30px;} .highlight-suites-slider .slick-prev:before, .highlight-suites-slider .slick-next:before{font-size: 35px; color: #a67b52;} .highlight-suites-slider .slick-dots{bottom: -40px;} .highlight-suites-slider .slick-dots li.slick-active button, .highlight-suites-slider .slick-dots li:hover button{background: #a67b52;} .highlight-suites-slider .slick-dots li button{border: 1px solid #a67b52; width: 10px; height: 10px;} .garden-lodge-suites-block .gallery-section{padding: 25px 0;} .garden-lodge-suites-block .virtual-tours{margin-top: 20px;} .suites-info{width: 100%; margin-bottom: 50px;} .suites-info .title{display: block; width: 100%; text-align: center;} .suites-info .title h2{font-size: 34px; color: #321c00;} .suites-info .configuration{max-width: 495px; width: 100%; background: #a67b52; padding: 30px; float: left; border-radius: 3px;} .suites-info .configuration h3{font-size: 22px; color: #fff; text-align: center; font-family: 'Gotham Book'; text-transform: uppercase;} .suites-info .configuration ul{display: block; overflow: hidden; margin: 0;} .suites-info .configuration ul li{display: block; list-style: none; padding: 0 0 5px 0; clear: both; overflow: hidden;} .suites-info .configuration ul li:before{display: none;} .suites-info .configuration ul li .sign{background: #8c4319; float: left; max-width: 43px; width: 100%; text-align: center; display: table;} .suites-info .configuration ul li .sign figure{display: table-cell; vertical-align: middle; height: 100%; width: 100%;} .suites-info .configuration ul li .sign figure img{vertical-align: middle;} .suites-info .configuration ul li .field{background: #dfc790; float: left; max-width: 161px; width: 100%; padding: 11px; display: table; position: relative;} .suites-info .configuration ul li .field:after{position: absolute; content: ""; right: -8px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); width: 0; height: 0; border-style: solid; border-width: 7px 0 7px 8px; border-color: transparent transparent transparent #dfc790;} .suites-info .configuration ul li .field span{color: #000; font-size: 16px; font-family: 'Gotham Book'; display: table-cell; vertical-align: middle;} .suites-info .configuration ul li .detail{background: #fff; font-family: 'Gotham'; font-weight: 300; color: #505050; font-size: 16px; float: right; max-width: 231px; width: 100%; padding: 11px; padding-left: 22px;} .suites-info .essentials{max-width: 664px; width: 100%; float: right; background: #dfc790; border-radius: 3px; padding: 20px;} .suites-info .essentials h3{font-size: 22px; color: #321c00; text-align: center; font-family: 'Gotham Book'; text-transform: uppercase; margin-bottom: 25px;} .suites-info .essentials ul{display: block; overflow: hidden; margin: 0;} .suites-info .essentials ul li{display: inline-block; list-style: none; clear: both; overflow: hidden; max-width: 281px; width: 100%; padding: 15px 0; border-bottom: 1px solid #e9d8b2; margin-right: 40px; position: relative; vertical-align: top;} .suites-info .essentials ul li span{font-size: 16px; color: #321c00; font-family: 'Gotham Book'; display: block; padding-left: 34px; } .suites-info .essentials ul li:nth-child(2n){margin-right: 0;} .suites-info .essentials ul li:before{display: none;} .suites-info .essentials ul li img{position: absolute; top: 18px; left: 0;} .garden-lodge-page .experiences-section{box-shadow: inherit; -webkit-box-shadow: inherit; margin-bottom: 70px;} /*----------spacial-page-----------*/ .sapecials-page{padding-top: 70px; width: 100%;} .sapecials-page .heading-caption h1{color: #321c00;} .sapecials-page .heading-caption p{color: #321c00;} .sapecials-page .specials-overview-section{border-top: 0; padding: 0;} .specials-gallery .single-specials-overview{max-width: 391px; width: 100%; float: left; padding: 2px;} /*---------private-villas-page---------*/ .private-villas-block .lodge-detail .see-more{text-align: right;} .private-villas-block .lodge-detail .see-more a{margin-right: 0;} .private-villa-slider{width: 100%; display: block; overflow: hidden; text-align: center; margin-bottom: 15px;} .private-villa-slider .slick-dots{display: none !important;} .slider-for .slick-list{height: 100%;} .slider-for .main-item{width: 100%; height: 490px !important; background-size: cover; background-position: center center;} .slider-for .main-item .villas-item{max-width: 575px; width: 100%; position: absolute; left: 20px; top: 20px; padding: 20px; z-index: 99; background-color: rgba(255,255,255,.9); text-align: left;} .villas-item h2, .villas-item h3{font-size: 34px; color: #321c00; margin-bottom: 10px;} .villas-item p{font-size: 16px; color: #534741; margin-bottom: 0;} .slider-nav{max-width: 975px; width: 100%; margin-top: -42px; height: 100% !important} .slick-initialized .slick-slide{box-sizing:border-box; cursor:pointer;} .thumbs-wrapper{width: 100%; margin: 0 10px; border: 4px solid #fff;} .thumbs-wrapper .thumbs-item{width: 100%; height: 145px !important; background-size: cover; background-position: center center;padding: 0; margin: 0 0px 0 0px; padding: 2px; position: relative;} .thumbs-wrapper .thumbs-item .text-caption{font-family: 'Gotham Book'; font-size: 12px; color: #000; padding: 7px 12px; background: rgba(255,255,255,.8); position: absolute; left: 0; bottom: 0; text-transform: uppercase; text-align: left;} .slider-nav .thumbs-wrapper.slick-current{border: 4px solid #a67b52;} /*------------rates-page-------------*/ .rates-page{padding: 70px 0 0 0;} .rates-block{width: 100%; background: #f5e2c9; padding: 20px; margin-bottom: 32px;} .rates-block .rates-table{background: #dfc790; padding: 20px; margin-bottom: 40px;} .rates-block .rates-table h3{font-size: 24px; color: #321c00;} .rates-table .left-part{/*max-width: 910px; CUSTOM*/ float: left; width: 88%;} .rates-table .right-part{max-width: 100px; /*max-width: 165px; CUSTOM*/ width: 100%; float: right;} .rates-table .right-part .block{width: 100%; display: block; margin-bottom: 35px; overflow: hidden;} .rates-table .right-part .block .title{font-size: 14px; color: #321c00; font-family: 'Gotham'; font-weight: 500; display: block; margin-bottom: 10px; text-transform: uppercase;} .rates-table .right-part .block.currency a{width: 37px; height: 37px;} .rates-table .right-part .block.currency a:last-child{margin-right: 0;} .rates-table .right-part .block.season a{margin-bottom: 5px; padding: 8px 13px;} .rates-table .right-part .block.season a:nth-child(3n){margin-right: 0;} .rates-table .right-part .block a{padding: 6px; float: left; margin-right: 5px; margin-bottom: 5px;/*New CUSTOM*/ background: #336531; font-size: 14px; color: #fff; display: block; font-family: 'Gotham Book'; border-radius: 2px;} .rates-table .right-part .block a:hover{text-decoration: none; background: #9a7a55;} .rates-table .right-part .block a img{display: block; vertical-align: middle;} .rates-block .stay-block{width: 100%;} .rates-block .stay-block h2{font-size: 34px; color: #321c00; text-align: center;} .highlight-suites-slider .text-caption h3 {font-size: 22px;color: #321c00;} .table-rate {width: 100%;} .table-rate th {background:#a0410d; border: 1px solid #bd7a56; padding: 10px; vertical-align: middle; font-family: 'Gotham Book'; font-size: 14px; color: #fff; text-transform: uppercase;} .table-rate th span{display: block; font-size: 12px;} .table-rate td{font-family: 'Gotham'; font-weight: 300; font-size: 14px; color: #000; border:1px solid #c6c1ba; background:#f7f1e8; padding: 13px; text-align: center;} .table-rate td span{display: block;} .table-rate td.text-left{text-align: left;} .table-rate td.vertical-mid{vertical-align: middle;} .table-rate tbody tr:nth-child(3n) td{background: #f2e9dc;} .your-stay-block .highlight-suites-slider .slick-next{right: -33px;} .your-stay-block .highlight-suites-slider .slick-prev{left: -33px;} .hospitality-section.animal-block{min-height: 200px;} .hospitality-section.animal-block .top-caption h4, .hospitality-section.animal-block .top-caption .h4{color: #fff;} .hospitality-section.animal-block .make-buttons .btn{max-width: 175px; padding: 0; text-transform: uppercase;} .hospitality-section.animal-block .make-buttons span{font-size: 16px; color: #fff; font-family: 'Gotham'; font-weight: 500; text-transform: uppercase; line-height: 72px; margin: 0 10px;} .insturction-tabbing{width: 100%; margin-top: 50px;} .insturction-tabbing .nav-tabs {border-bottom: 5px solid #b08f4f; text-align: center; margin: 0;} .insturction-tabbing .nav-tabs li{display: inline-block; max-width: 307px; width: 100%;list-style: none;border-right: 1px solid #fff;box-sizing: border-box; padding: 0; margin-right: 6px;} .insturction-tabbing .nav-tabs li:before{display: none;} .insturction-tabbing .nav-tabs a{display: block; padding: 14px;color: #337ab7;text-align: center; margin-bottom: -1px;border-radius: 9px 9px 0 0; background: #dfc790; font-size: 16px; color: #a67c52; font-family: 'Gotham'; font-weight: 500; text-transform: uppercase; margin-bottom: 5px;} .insturction-tabbing .nav-tabs a:hover{text-decoration: none; color: #fff; background: #b08f4f;} .insturction-tabbing .nav-tabs a.active{background: #b08f4f; margin-bottom: 0; padding-bottom: 19px; color: #fff;} .insturction-tabbing .tab-content{padding: 0;} .insturction-tabbing .tab-content h4{font-size: 22px; color: #321c00; margin-bottom: 18px;font-weight: 400; line-height: 1.2;font-family: 'Trajan Pro';} .insturction-tabbing .tab-content ul li{font-size: 16px; color: #534741; font-family: 'Gotham'; font-weight: 300;} .insturction-tabbing .tab-content .tab-pane{display: none; padding: 25px 30px; background: #f7f1e8; border: 20px solid #f5e2c9;} .insturction-tabbing .tab-content .tab-pane.active{display: block;} .insturction-tabbing .tab-content .trigger{background: #d7c691;display: none;padding: 13px 40px;color: #a67c52;text-align: center; border-radius: 0; margin-bottom: 1px; text-transform: uppercase; color: #a67c52; font-family: 'Gotham'; font-weight: 300; position: relative; width: 100%;} .insturction-tabbing .tab-content .trigger:after{position: absolute; content: ""; width: 11px; height: 11px; border: 1px solid #a67c52; border-bottom: 0; border-right: 0; right: 15px; top: 50%; transform: translateY(-50%) rotate(-135deg); -webkit-transform: translateY(-50%) rotate(-135deg);} .insturction-tabbing .tab-content .trigger.active:after{border-color: #fff;} .insturction-tabbing .tab-content .trigger:hover{text-decoration: none;} .insturction-tabbing .tab-content .trigger.active{background: #b08f4f; color: #fff;} .insturction-tabbing .tab-content .tab-pane a.btn{display: none;} .insturction-tabbing .tab-content .tab-pane li:last-child{display: none;} .rates-page .specials-overview-section{border: 0;} .mobile-table{width: 100%; display: none;} .mobile-table .tab-pane{display: none; padding: 10px; background: #efe1c9;} .mobile-table .tab-pane.active{display: block;} .mobile-table .trigger{background: #dfc790;display: block;padding: 14px; padding-right: 45px; color: #a67c52; border-radius: 0; margin-bottom: 1px; text-transform: uppercase; color: #a67c52; font-family: 'Gotham'; font-weight: 500; position: relative; font-size: 16px;} .mobile-table .trigger:after{position: absolute; content: ""; width: 11px; height: 11px; border: 1px solid #a67c52; border-bottom: 0; border-right: 0; right: 15px; top: 50%; transform: translateY(-50%) rotate(-135deg); -webkit-transform: translateY(-50%) rotate(-135deg);} .mobile-table .trigger.active:after{border-color: #fff; transform: rotate(45deg); -webkit-transform: rotate(45deg);} .mobile-table .trigger:hover{text-decoration: none;} .mobile-table .trigger.active{background: #9a7a55; color: #fff;} .mobile-table .mobile-tab-content .title{font-size: 14px; color: #000; font-family: 'Gotham'; font-weight: 500; text-align: center; margin-bottom: 10px;} .mobile-table .mobile-tab-content .block{display: block; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #d5c7b3; overflow: hidden;} .mobile-table .mobile-tab-content .block:last-child{border: 0; margin-bottom: 0;} .mobile-table .mobile-tab-content .block .left{/*CUSTOM was 58%*/width: 50%; display: inline-block; background: #9a7a55; padding: 10px; vertical-align: top; font-size: 13px; color: #fff; font-family: 'Gotham Book'; text-align: center; margin-right: 5px;} .mobile-table .mobile-tab-content .block .left span{display: block; font-size: 10px;} .mobile-table .mobile-tab-content .block .right{width: 45%; display: inline-block; float: right;} .mobile-table .mobile-tab-content .block .right p{font-size: 12px; color: #000; margin-bottom: 0; font-family: 'Gotham Book'; text-align: center; line-height: 18px;} .mobile-table .mobile-tab-content .block .right div{display: block; width: 100%; overflow: hidden;} .mobile-table .mobile-tab-content .block .right span{font-size: 12px; color: #000; font-family: 'Gotham'; font-weight: 500; line-height: 16px; float: left; width: 55%;} .mobile-table .mobile-tab-content .block .right em{font-weight: 300; font-style: normal; font-size: 12px; color: #000; line-height: 16px; float: right; width: 45%;} /*-----------honeymoon-gateway-----------*/ .honeymoon-gateway-page .heading-caption{padding-top: 40px;} .honeymoon-gateway-page .inner-gallery.gallery-section{padding-bottom: 70px;} .gateway-block{width: 100%; border: 2px solid #d2bda8; padding: 33px 20px; background: #ede5d6; margin-bottom: 60px;} .gateway-block .saving-detail{max-width: 367px; width: 100%; display: inline-block; vertical-align: top; margin-right: 36px;} .gateway-block .saving-detail .btn-save{font-size: 24px; color: #fff; background: #a67b52; padding: 6px 30px; text-transform: uppercase; font-family: 'Gotham'; font-weight: 700; display: inline-block; margin-bottom: 13px; border-radius: 2px; border: 2px solid #a67b52;} .gateway-block .saving-detail .btn-save:hover{background: #fff; color: #a67b52; text-decoration: none;} .gateway-block .saving-detail p{font-size: 14px; color: #534741;} .gateway-block .block{max-width: 340px; width: 100%; display: inline-block; border: 2px solid #fff; padding: 20px; margin-right: 30px; vertical-align: top; min-height: 163px; } .gateway-block .block:last-child{margin-right: 0;} .gateway-block .block h4{font-size: 24px; color: #a67b52; font-family: 'Gotham'; font-weight: 700; text-transform: uppercase; margin-bottom: 10px;} .gateway-block .block p{font-size: 16px; color: #000; margin-bottom: 0;} .gateway-block .block p strong{display: block; font-weight: 500;} .gateway-block .block ul{margin-bottom: 0;} .gateway-block .block ul li{font-size: 14px; color: #000; font-family: 'Gotham Book'; padding-bottom: 6px; padding-left: 18px;} .gateway-block .block ul li:before{top: 8px;} .package-include-block{display: block; width: 100%; padding: 30px 0 50px; border-bottom: 1px solid #ede5dc; margin-bottom: 50px;} .package-include-block h3{font-size: 34px; color: #321c00; text-align: center;} .package-include-block ul{display: block; width: 100%; margin-bottom: 20px;} .package-include-block ul li{width: 49%; display: inline-block; vertical-align: top; padding: 0 0 5px 22px; color: #534741; font-size: 16px; font-family: 'Gotham'; font-weight: 300;} .package-include-block ul li:before{background: #7b5d58; top: 8px;} .package-include-block ul a.btn{display: none;} .package-include-block ul li:last-child{display: none;} /*-------------helpfull-info page----------------*/ .info-tab{width: 100%; display: block; overflow: hidden; position: relative;} .info-tab .nav-tabs{max-width: 244px; width: 100%; float: left; margin: 0; background: #a67b52;} .info-tab .nav-tabs li{display: block; list-style: none; padding: 0;} .info-tab .nav-tabs li:before{display: none;} .info-tab .nav-tabs a{font-size: 16px; color: #e2be9c; border-bottom: 1px solid #b6906a; display: block; font-family: 'Gotham'; font-weight: 500; text-transform: uppercase; padding: 14px 19px; position: relative;} .info-tab .nav-tabs a.active:after{position: absolute; content: ""; width: 14px; height: 14px; border: 1px solid #d2bda8; background: #fff; right: -7px; top: 50%; transform: translateY(-50%) rotate(135deg); -webkit-transform: translateY(-50%) rotate(135deg); border-top: 0; border-left: 0; z-index: 99;} .info-tab .nav-tabs a:hover{text-decoration: none; background: #f5e2c9; color: #856242;} .info-tab .nav-tabs a.active{background: #f5e2c9; color: #856242;} .info-tab .tabing-detail{float: right; max-width: calc(100% - 244px); width: 100%;} .info-tab .tab-pane{display: none; border: 1px solid #d2bda8; padding: 18px 32px;} .info-tab .tab-pane.active{display: block;} .info-tab .tab-pane h3{font-size: 34px; color: #321c00;} .info-tab .tab-pane p{font-size: 16px; color: #534741;} .info-tab .tabing-detail .trigger{background: #dfc790;display: none !important ;padding: 13px 40px;color: #a67c52;text-align: center; border-radius: 0; text-transform: uppercase; color: #a67c52; font-family: 'Gotham'; font-weight: 500; position: relative; font-size: 16px; overflow: hidden;} .info-tab .tabing-detail .trigger:after{position: absolute; content: ""; width: 11px; height: 11px; border: 1px solid #a67c52; border-bottom: 0; border-right: 0; right: 15px; top: 50%; transform: translateY(-50%) rotate(-135deg); -webkit-transform: translateY(-50%) rotate(-135deg);} .info-tab .tabing-detail .trigger.active:after{border-color: #fff; transform: translateY(-20%) rotate(45deg); -webkit-transform: translateY(-20%) rotate(45deg);} .info-tab .tabing-detail .trigger:hover{text-decoration: none;} .info-tab .tabing-detail .trigger.active:before{position: absolute; content: ""; width: 14px; height: 14px; border: 1px solid #d2bda8; background: #fff; left: 50%; bottom: -7px; transform: translateX(-50%) rotate(45deg); -webkit-transform: translateX(-50%) rotate(45deg); border-top: 0; border-left: 0; z-index: 99;} .info-tab .tabing-detail .trigger.active{background: #b08f4f; color: #fff;} .info-tab #map{width: 100%; height: 384px; border: 5px solid #d2bda8;} .enroute-to-grootbos{display: block; width: 100%;} .enroute-to-grootbos h2{font-size: 34px; color: #321c00; text-align: center;} .enroute-to-grootbos p{font-size: 20px; color: #534741; font-family: 'Gotham Book'; text-align: center;} .enroute-gallery{width: 100%; display: block;} .enroute-gallery .block{max-width: 270px; width: 100%; float: left; margin: 0 30px 30px 0; position: relative;} .enroute-gallery .block:nth-child(4n){margin-right: 0;} .enroute-gallery .block figure{width: 100%; height: auto; overflow: hidden;} .enroute-gallery .block figure img{display: block;} .enroute-gallery .block .caption{position: absolute; left: 22px; bottom: 18px; display: block; font-size: 22px; color: #fff; font-family: 'Trajan Pro'; width: 60%;} .services .service-block{background: #f5e2c9; width: 100%; padding: 30px;} .services .service-block h3{font-size: 34px; color: #321c00; text-align: center; margin-bottom: 22px;} .services .service-block .left{max-width: 484px; width: 100%; float: left; margin-right: 28px;} .services .service-block .left figure{display: block; width: 100%;} .services .service-block .right{max-width: 596px; width: 100%; float: right;} .services .service-block .right p{font-size: 16px; color: #534741;} .services .service-block .right ul{margin: 0; display: block;} .services .service-block .right ul li{font-size: 16px; color: #534741; padding-left: 22px;} .faq-block{width: 100%; display: block;} .faq-block h3{font-size: 34px; text-align: center; color: #321c00;} .faq-block h4{font-size: 28px; color: #321c00;} .faq-block .question-block{display: block; width: 100%;} .faq-block .question-block .left{max-width: 570px; width: 100%; float: left; margin-right: 28px;} .faq-block .question-block .right{max-width: 570px; width: 100%; float: right;} .faq-block .question-block .row{width: 100%; display: block; background: #f9f9f9; margin-bottom: 20px;} .faq-block .question-block .row h5{font-size: 16px; color: #321c00; background: #fff; border: 1px solid #e9e9e9; margin: 0; padding: 19px; padding-left: 55px; position: relative; cursor: pointer;} .faq-block .question-block .row h5:before{position: absolute; content: "i"; font-size: 8px; width: 25px; height: 25px; background: #a67b52; border-radius: 50%; font-family: "grootbos" !important; font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; top: 15px; left: 20px; text-align: center; padding-top: 9px; color: #fff;} .faq-block .question-block .row h5.active:before{content: "h";} .faq-block .question-block .row h5.active{background: #ede6e0;} .faq-block .question-block .row p{font-size: 14px; color: #534741;} .faq-block .question-block .row .answer{display: none; padding: 18px 20px;} /*-------------our-location-page------------------*/ .our-location-page{padding: 70px 0 0 0;} .our-location-block{margin-bottom: 60px;} .our-location-block #map{width: 100%; height: 430px; border: 5px solid #d2bda8;} .our-location-page .enroute-to-grootbos{margin-bottom: 40px;} /*-----------gallery-page---------------*/ .gallery-page{padding: 70px 0 0;} .side-bar-content{padding:10px 0 20px} aside.left-aside{max-width: 239px; float:left; width: 100%; margin-right: 0px;} aside.left-aside .title{font-size: 16px; color: #fff; font-family: 'Gotham'; font-weight: 500; padding: 12px 20px; background: #856242; text-transform: uppercase;} aside.left-aside ul{margin: 0; display: block;} aside.left-aside ul ul{display: none;} aside.left-aside ul li{background: #a67b52; padding: 0; margin: 0; color: #fff; position: relative; list-style: none;} aside.left-aside ul li:before{display: none;} aside.left-aside ul li a{color: #e2be9c; font-size: 14px; text-transform: uppercase; font-family: 'Gotham'; font-weight: 500; padding: 12px 20px; display: block; border-bottom: 1px solid #c1a386; padding-right: 35px;} aside.left-aside ul li:hover a{color: #fff; text-decoration: none; background: #a67b52;} aside.left-aside ul li.is-checked a{color: #fff; text-decoration: none; background: #a67b52;} aside.left-aside ul li.active a{color: #fff;} aside.left-aside ul li .sub{display: block; position: absolute; top: 0; right: 0px; width: 46px; height: 46px;-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } aside.left-aside ul li .sub:after{position: absolute; content: ""; width: 11px; height: 11px; top: 50%; left: 50%; border: 2px solid #e2be9c; border-bottom: 0; border-right: 0; transform: translate(-50%,-50%) rotate(-135deg); -webkit-transform: translate(-50%,-50%) rotate(-135deg);} aside.left-aside ul li .sub.active{transform: rotate(180deg);-moz-transform: rotate(180deg);-webkit-transform: rotate(180deg);} aside.left-aside ul li .sub.active:after{border-color: #fff;} aside.left-aside ul li ul li a{padding-left: 45px; position: relative;} aside.left-aside ul li ul li a:after{content: ""; position: absolute; top: 18px; left: 22px; width: 10px; height: 10px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; transform: rotate(135deg); -webkit-transform: rotate(135deg); border: 2px solid #e2be9c; border-bottom: 0; border-right: 0;} aside.left-aside ul li ul li:hover a{color: #856242; background: #f5e2c9;} aside.left-aside ul li ul li:hover a:after{border-color: #856242;} aside.left-aside ul li ul li.is-checked a{color: #856242; background: #f5e2c9;} aside.left-aside ul li ul li.is-checked a:after{border-color: #856242;} aside.left-aside .gallery-zoom{display: none; width: 40px; height: 46px; margin-right: 0; text-align: center; position: relative; float: right; padding: 0;} aside.left-aside .gallery-zoom:after{position: absolute; width: 30px; height: 30px; border-radius: 2px; content: ""; background: #9a7a55 url(/application/themes/grootbos/images/icon_resize.png) 50% 50% no-repeat; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);} .right-content{float: right; max-width: calc(100% - 270px); width: 77%;} .right-content ul{width: 100%; display: block; margin:0 auto; border: none; background: none;} .right-content ul li{width: auto; display: inline-block; vertical-align: top; margin: 0 auto; padding: 0; width: 33.33%; max-width: 303px; padding: 5px; position: relative; overflow: hidden; border-radius: 2px;} .right-content ul li:before{display: none;} .right-content ul li img{max-width: 100%; height: auto} .right-content ul li a{display: block; position: relative; overflow: hidden;} .right-content ul li .caption{background: #f2f2f2; padding: 15px; width: 100%; font-size: 14px; color: #000; font-family: 'Gotham' /*CUSTOM*/; font-weight: 300; display: block; text-align: left;} .right-content ul li a .icon {position: absolute; left: 50%; top: 50%; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 6; font-size: 30px; color: #fff; border: 2px solid #fff; text-align: center; border-radius: 100%; height: 58px; width: 58px; line-height: 54px; } .right-content ul li a .icon:before{line-height: inherit;} .right-content ul li a:after{position: absolute; content: ""; width: 100%; height: 100%; background: rgba(0,0,0,.3); opacity: 0; left: 0; right: 0; top: 0; bottom: 0; transition: all .4s ease; -webkit-transition: all .4s ease; -moz-transition: all .4s ease;} .right-content ul li a:hover:after{opacity: 1;} .right-content ul li a:before {content: "g"; font-family: "grootbos"; font-style: normal;font-variant: normal;font-weight: normal;line-height: 1;text-transform: none; position: absolute; left: 50%; top: 50%; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #fff; text-align: center; font-size: 30px; z-index: 5; opacity: 0; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .right-content ul li a:hover:before{opacity: 1;} .right-content ul li a .caption:before {content: "f"; font-family: "grootbos"; font-style: normal;font-variant: normal;font-weight: normal;line-height: 1;text-transform: none; position: absolute; right: 14px; opacity: 0; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .right-content ul li a:hover .caption:before {opacity: 1;} .right-content ul li a.has-video:before{display: none;} .right-content ul li a.has-video .caption:before{display: none;} .right-content ul li.has-story a:after{display: none;} .right-content ul li.has-story a:before{display: none;} .right-content ul li.has-story .caption:before{display: none;} .right-content ul li.has-story .hvr-story{position: absolute; display: block; width: calc(100% - 10px); height: calc(100% - 10px); top: 5px; left: 5px; padding: 15px; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; background: rgba(0,0,0,.4); text-align: center; -ms-transform: scale(0.8); -webkit-transform: scale(0.8); transform: scale(0.8); opacity: 0; visibility: hidden; overflow: auto;} .right-content ul li.has-story .hvr-story h5{font-size: 18px; color: #fff; font-family: 'Gotham'; font-weight: 500; text-align: left;} .right-content ul li.has-story .hvr-story p{font-size: 14px; color: #fff; text-align: left;} .right-content ul li.has-story .hvr-story a.btn-call{display: inline-block; margin: 0 auto; font-size: 12px; padding: 0 25px; margin-bottom: 15px;} .right-content ul li.has-story:hover .hvr-story{opacity: 1; visibility: visible; -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); visibility: visible;} .right-content ul li.has-story:hover .caption{opacity: 0;} /*-----------food-and-wine-page-------------*/ .food-and-wine-page .heading-caption{padding: 40px 0 0;} .inner-banne-bg .iteam{height: calc(100vh - 220px); background-size: cover; background-position: center; position: relative;} .inner-banne-bg .iteam h1, .inner-banne-bg .iteam .h1{position: absolute; top: 25px; right: 25px; font-size: 30px; color: #fff; z-index: 99; margin-bottom: 15px;font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro';} .overview.suits.wine-exp{margin-bottom: 30px;} .overview.suits.wine-exp .highlights .right{float: left;} .overview.suits.wine-exp .highlights .left{float: right;} /*---------------culinary-page---------------*/ .culinary-page .heading-caption{padding: 40px 0 0;} .culinary-experience-block h3, .culinary-experience-block h2{font-size: 34px; color: #321c00;} .culinary-experience-block h4{font-size: 22px; color: #321c00;} .culinary-page .lodge-block nav li a{padding: 13px 18px;} .dining-exp{width: 100%; background: #faf0e4; padding: 20px;} .dining-exp .left{max-width: 394px; width: 100%; float: left; margin-right: 30px; background: #a67b52; padding: 20px; text-align: center;} .dining-exp .left h4{color: #fff; margin-bottom: 0;} .dining-exp .right{max-width: calc(100% - 424px); width: 100%; float: right;} .dining-exp .right h3, .dining-exp .right h2{margin-bottom: 5px;} .dining-exp .right h4{margin-bottom: 10px;} .dining-exp .right p{color: #534741; font-size: 16px;} .ordering-food{width: 100%;} .ordering-food .left{float: left; width: 100%; margin-bottom: 15px;} .ordering-food .left h3{margin-bottom: 5px; display: inline-block;} .ordering-food .left h4{margin-bottom: 10px;} .ordering-food .left p{color: #534741; font-size: 16px;} .ordering-food .right{float: right; max-width: 408px; width: 100%; background: #a67b52; padding: 20px; margin-left: 15px;} .ordering-food .right ul{display: block; margin: 0;} .ordering-food .right ul li{list-style: none; padding-left: 18px; font-size: 16px; color: #fff; font-family: 'Gotham'; font-weight: 300;} .ordering-food .right ul li:after{content: ""; position: absolute; top: 9px; left: 0; width: 8px; height: 8px; transform: rotate(135deg); -webkit-transform: rotate(135deg); border: 1px solid #fff; border-bottom: 0; border-right: 0;} .ordering-food .right ul li:before{display: none;} .our-culinary-block{width: 100%; background: #faf0e4; padding: 20px;} .our-culinary-block .left{max-width: 100%; width: 100%; float: left;} .our-culinary-block .left h3{margin-bottom: 5px; display: inline-block;} .our-culinary-block .left h4{margin-bottom: 10px;} .our-culinary-block .left p{color: #534741; font-size: 16px;} .our-culinary-block .right{max-width: 394px; width: 100%; float: right; background: #a67b52; padding: 20px; text-align: center; margin-left: 15px;} .our-culinary-block .right h4{color: #fff; margin-bottom: 0;} .staff-slider{width: 100%; max-width: 1058px; margin-bottom: 45px; clear: both; display: block;} .staff-slider .iteam{padding: 6px;} .staff-slider .text-caption{width: 100%; padding: 15px; background: #fff; min-height: 8.8em; max-height: 8.8em; overflow: hidden;} .staff-slider .text-caption h4{font-size: 18px;} .staff-slider .text-caption p{font-size: 14px; color: #534741; margin-bottom: 10px;} .staff-slider .slick-prev{left: -43px;} .staff-slider .slick-next{right: -43px;} .staff-slider .slick-prev:before, .staff-slider .slick-next:before{font-size: 35px; color: #a67b52;} .staff-slider .slick-dots{bottom: -40px;} .staff-slider .slick-dots li.slick-active button, .staff-slider .slick-dots li:hover button{background: #a67b52;} .staff-slider .slick-dots li button{border: 1px solid #a67b52; width: 10px; height: 10px;} .staff-mobile-slider{display: none !important;} .restaurant{width: 100%; background: #a67b52; padding: 30px;} .restaurant .left{max-width: calc(100% - 388px); float: left; width: 100%;} .restaurant .left h2{margin-bottom: 10px; color: #fff;} .restaurant .left .sub-title-h3{color: #fff;} .restaurant .left p{color: #534741; font-size: 16px; color: #fff;} .restaurant .right{max-width: 317px; width: 100%; float: right; background: #faf0e4; padding: 15px 25px; text-align: center; margin-bottom: 20px;} .restaurant .right h3{margin-bottom: 0;} .restaurant .right p{color: #534741; margin-bottom: 15px; font-size: 14px;} .restaurant .right .btn-dining{max-width: 183px; background: #336531 url(/application/themes/grootbos/images/icon_download.png) 90% 50% no-repeat; width: 100%; padding: 0 54px 0 20px; font-size: 14px; margin-bottom: 5px; text-transform: uppercase; text-align: left;} .restaurant .right .btn-dining:hover{background: #fff url(/application/themes/grootbos/images/icon_download_hvr.png) 90% 50% no-repeat;} .restaurant .restaurant-img{width: 100%; display: block; overflow: hidden;} .restaurant .restaurant-img figure{max-width: 544px; width: 100%; float: left; margin-right: 20px;} .restaurant .restaurant-img figure:last-child{margin-right: 0;} .restaurant.destination{background: #faf0e4;} .restaurant.destination h3, .restaurant.destination h2{color: #321c00; display: inline-block;} .restaurant.destination p{color: #321c00;} .restaurant.destination .right p{color: #fff; font-size: 22px;text-transform: uppercase; font-family: 'Trajan Pro';} .restaurant.destination .left{max-width: 100%; margin-bottom: 5px;} .restaurant.destination .left h4, .restaurant.destination .left .sub-title-h3{color: #321c00;} .restaurant.destination .left .right h4{color: #fff; margin-bottom: 0; text-align: center;} .restaurant.destination .right{background: #a67b52; text-align: left; max-width: 410px; margin-top: 7px; margin-left: 15px;} .restaurant.destination .right ul{margin: 0;} .restaurant.destination .right ul li{list-style: none; padding-left: 18px; font-size: 16px; color: #fff; font-family: 'Gotham'; font-weight: 300;} .restaurant.destination .right ul li:before{display: none;} .restaurant.destination .right ul li:after{content: ""; position: absolute; top: 9px; left: 0; width: 8px; height: 8px; transform: rotate(135deg); -webkit-transform: rotate(135deg); border: 1px solid #fff; border-bottom: 0; border-right: 0;} .restaurant.destination .restaurant.destination .restaurant-img{display: block; overflow: hidden; width: 100%;} .restaurant.destination .restaurant-img .block{max-width: 270px; float: left; margin-right: 10px; width: 100%; position: relative;} .restaurant.destination .restaurant-img .block:last-child{margin-right: 0;} .restaurant.destination .restaurant-img .block figure{max-width: 100%; margin: 0;} .restaurant.destination .restaurant-img .block:after{position: absolute; content: ""; background: url(/application/themes/grootbos/images/caption-shadow.png) no-repeat; left: 0; bottom: 0; width: 100%; height: 100%; background-size: cover; z-index: 1} .restaurant.destination .restaurant-img .block .caption{position: absolute; left: 18px; bottom: 18px; font-size: 22px; color: #fff; font-family: 'Trajan Pro'; display: block; width: 90%; z-index: 2;} .restaurant.destination.green{background: #59755d;} .restaurant.destination.green p{color: #FFFFFF;} .restaurant.destination.green .right {background: #9f7c5e;} .restaurant.destination.green .left a {background: #ce5868;} .restaurant.destination.green .left a:hover {background: #FFFFFF; color: #ce5868;} .restaurant.destination.green .left{color: #FFFFFF;} .restaurant.destination.green .left .sub-title-h4, .restaurant.destination.green .left .sub-title-h3, .restaurant.destination.green .left .sub-title-h2, .restaurant.destination.green .left .sub-title-h1, .restaurant.destination.green h4, .restaurant.destination.green h3, .restaurant.destination.green h2, .restaurant.destination.green h1 {color: #FFFFFF;} .wine-description{width: 100%;} .wine-description .left{float: left; max-width: calc(100% - 542px); width: 100%; margin-right: 30px;} .wine-description .left h3{margin-bottom: 10px;} .wine-description .left h4{margin-bottom: 10px;} .wine-description .right{float: right; max-width: 511px; width: 100%;} /*-----------wine-experience-page-----------------*/ .wine-page .heading-caption{padding: 40px 0 0;} .wine-page h3{font-size: 34px; display: inline-block;} .wine-page h4{font-size: 22px;} .wine-exp-block{background: #faf0e4; padding: 30px; width: 100%;} .wine-exp-block.pd0{background: #fff; padding: 0;} .wine-exp-block h3{color: #321c00; } .wine-exp-block h2, .wine-page h2{ display: inline-block; font-size: 34px;margin-bottom: 15px;font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro';color: #321c00;} /*.lodge-block-content .wine-exp-block h2{font-size: 20px;}*/ .wine-page .specials-overview-section h2{text-align: center;display: block;} .wine-exp-block p{color: #321c00; } .wine-exp-block .left{max-width: 100%; margin-bottom: 10px;} .wine-exp-block .right{background: #a67b52; text-align: left; max-width: 410px; float: right; padding: 20px; margin-bottom: 30px; margin-left: 20px;} .wine-exp-block .right h4{color: #fff; text-align: center; margin-bottom: 0; line-height: 34px;} .wine-exp-block .right ul{margin: 0;} .wine-exp-block .right ul li{list-style: none; padding-left: 18px; font-size: 16px; color: #fff; font-family: 'Gotham'; font-weight: 300;} .wine-exp-block .right ul li:before{display: none;} .wine-exp-block .right ul li:after{content: ""; position: absolute; top: 9px; left: 0; width: 8px; height: 8px; transform: rotate(135deg); -webkit-transform: rotate(135deg); border: 1px solid #fff; border-bottom: 0; border-right: 0;} .wine-exp-block .restaurant-img{display: block; width: 100%; overflow: hidden;} .wine-exp-block .restaurant-img .block{max-width: 360px; float: left; margin-right: 15px; width: 100%; position: relative;} .wine-exp-block .restaurant-img .block:last-child{margin-right: 0;} .wine-exp-block .restaurant-img .block:after{position: absolute; content: ""; background: url(/application/themes/grootbos/images/caption-shadow.png) no-repeat; left: 0; bottom: 0; width: 100%; height: 100%; background-size: cover; z-index: 1} .wine-exp-block .restaurant-img .block .caption{position: absolute; left: 18px; bottom: 10px; font-size: 22px; color: #fff; font-family: 'Trajan Pro'; display: block; width: 90%; z-index: 2;} .wine-exp-block.wine-collection{background: #a67b52;} .wine-exp-block.wine-collection .left h3, .wine-exp-block.wine-collection .left h4, .wine-exp-block.wine-collection .left h2, .wine-exp-block.wine-collection .left .sub-title-h3, .wine-exp-block.wine-collection .left p{color: #fff;} .wine-exp-block.wine-collection .right{background: #faf0e4;} .wine-exp-block.wine-collection .right h4{color: #a67b52;} .wine-exp-block.wine-collection .btn-dining{max-width: 160px; background: #336531 url(/application/themes/grootbos/images/icon_download.png) 90% 50% no-repeat; width: 100%; padding: 0 34px 0 20px; font-size: 14px; margin-bottom: 5px; text-transform: uppercase; text-align: left; display: block; clear: both; margin-left: 0;} .wine-exp-block.wine-collection .btn-dining:hover{background: #fff url(/application/themes/grootbos/images/icon_download_hvr.png) 90% 50% no-repeat;} .wine-page .specials-overview-section{border: 0; padding: 0; overflow: inherit;} .our-brand{width: 100%; margin-top: 30px;} .our-brand h3{text-align: center; display: block;} .our-brand .highlight-suites-slider{max-width: 100%;} .wine-page .staff-row{width: 100%; display: block; overflow: hidden; clear: both;} .wine-page .staff-row .iteam{max-width: 268px; width: 100%; float: left; margin-right: 12px;} .wine-page .staff-row .iteam:last-child{margin-right: 0;} .wine-page .staff-row .text-caption{width: 100%; padding: 15px; background: #fff;} .wine-page .staff-row .text-caption h4{font-size: 18px; margin-bottom: 5px;} .wine-page .staff-row .text-caption p{font-size: 14px; color: #534741; margin-bottom: 10px;} .wine-page .wine-exp-block.pd0 .block{max-width: 370px; margin-right: 30px;} .wine-page .wine-exp-block.pd0 .block:last-child{margin-right: 0;} /*---------------experience-page---------------*/ .experience-page .heading-caption{padding: 40px 0 0;} .features-block{width: 100%; display: block; margin-bottom: 40px;} .features-block .block{max-width: calc(50% - 15px); margin-right: 30px; float: left; border-radius: 2px; margin-bottom: 30px;} .features-block .block:nth-child(2n){margin-right: 0;} .features-block .block figure{position: relative; width: 100%; overflow: hidden;} .features-block .block figure:after{position: absolute; content: ""; width: 100%; height: 100%; background: url(/application/themes/grootbos/images/feature-shadow.png); top: 0; left: 0; right: 0; background-size: cover;} .features-block .block .title{position: absolute; top: 0; left: 0; padding: 20px; text-align: center; font-size: 28px; color: #fff; font-family: 'Trajan Pro'; z-index: 99; width: 100%;} .features-block .block .title h2{font-size: 28px; color: #fff; font-family: 'Trajan Pro';} .features-block .block .text-caption{width: 100%; height: auto; background: url(/application/themes/grootbos/images/pattern-feature.jpg) repeat; padding: 18px 20px;} .features-block .block .text-caption p{font-size: 14px; color: #321c00; font-family: 'Gotham Book';} .features-block .block .text-caption .btn-feature{display: table; text-transform: uppercase; padding: 0 20px; line-height: 42px;} /*-----------shark-cage-diving-page--------------*/ .inner-banner{position: relative;} .inner-banner .iteam:after{position: absolute; content: ""; top: 0; left: 0; right: 0; background: url('/application/themes/grootbos/images/inner-banner-shadow.png'); background-size: cover; width: 100%; height: 100%;} .inner-banner .caption{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);} /* .inner-banner .caption .play-video {width: 100px; margin: 0 auto; display: inline-block; vertical-align: top; text-decoration: none; } */ .inner-banner .caption .play-video:not(.pulse-wave) span {display: block; border: 3px solid #fff; border-radius: 100%; text-align: center; height: 84px; width: 84px; font-size: 50px; color: #fff; margin: 0 auto 14px; } .inner-banner .caption .play-video:not(.pulse-wave) span:before{line-height: 1.5; margin-left: 6px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .inner-banner .caption .play-video:not(.pulse-wave) i {display: block; font-style: normal; font-family: 'Gotham Book'; font-size: 12px; line-height: 1; color: #fff; } .inner-banner .caption .play-video:not(.pulse-wave):hover {transform: scale(1.1, 1.1); } .shark-cage-diving-page .heading-caption{padding: 40px 0 0;} .tick-block{background: #faf0e4; padding: 30px; margin-bottom: 50px;} .shark-cage-diving-page h2{font-size: 34px; color: #321c00; display: inline-block;} /*.shark-cage-diving-page .activity-count .tick-block h2{font-size: 22px;}*/ .shark-cage-diving-page .testimonials-section h2{font-size: 22px; color: #fff;} .shark-cage-diving-page .gallery-section h2{font-size: 22px; color: #321c00;display: block;} .shark-cage-diving-page .suggested-interaries h2{font-size: 22px; color: #321c00;} .shark-cage-diving-page .sub-title-h3{ font-size: 34px;} .tick-block p{color: #534741;} .tick-block .right{background: #a67b52; text-align: left; max-width: 410px; float: right; padding: 20px; margin-bottom: 30px; margin-left: 40px;} .tick-block .right h4{color: #fff; text-align: center; margin-bottom: 0; line-height: 34px;} .tick-block .right ul{margin: 0;} .tick-block .right ul li{list-style: none; padding-left: 18px; font-size: 16px; color: #fff; font-family: 'Gotham'; font-weight: 300;} .tick-block .right ul li:before{display: none;} .tick-block .right ul li:after{content: ""; position: absolute; top: 9px; left: 0; width: 8px; height: 8px; transform: rotate(135deg); -webkit-transform: rotate(135deg); border: 1px solid #fff; border-bottom: 0; border-right: 0;} .expert{width: 100%; display: block; background: #a67b52; padding: 30px;} .expert figure{float: left; max-width: 264px; width: 100%; margin-right: 30px; border-radius: 3px; position: relative;} .expert figure .title{position: absolute; font-size: 18px; font-family: 'Gotham'; font-weight: 300; color: #fff; right: 15px; bottom: 15px; background: rgba(0, 0, 0, 0.75); padding: 2px 6px;} .expert h2{font-size: 28px; color: #fff; margin-bottom: 30px; display: inline-block;} .expert span{display: block; font-size: 38px; color: #fff; font-family: 'Gotham'; font-weight: 300; line-height: 52px;} .suggested-interaries{margin-top: 60px; text-align: center; margin-bottom: 70px;} .suggested-interaries .suggested-slider{max-width: 1008px; width: 100%; margin-bottom: 30px;} .suggested-interaries .suggested-slider .iteam{position: relative; width: 100%; margin: 0 10px; text-align: left;} .suggested-interaries .suggested-slider .iteam a{display: block;} .suggested-interaries .suggested-slider .iteam:after{position: absolute; content: ""; bottom: 0; left: 0; width: 100%; height: 100%; background: url(/application/themes/grootbos/images/suggested-shadow.png); background-size: cover; pointer-events: none;} .suggested-interaries .suggested-slider .iteam .days{position: absolute; top: 10px; right: 10px; padding: 10px 15px; background: #a67b52; display: inline-block; font-size: 14px; color: #fff; font-family: 'Gotham'; font-weight: 300;} .suggested-interaries .suggested-slider .iteam .caption{width: 100%; bottom: 0; left: 0; padding: 10px 20px; position: absolute; z-index: 99;} .suggested-interaries .suggested-slider .iteam .caption h4{color: #fff; text-align: left; margin-bottom: 7px;} .suggested-interaries .suggested-slider .iteam .caption span{display: block; font-size: 14px; color: #fff; font-family: 'Gotham'; font-weight: 300;} .suggested-slider .slick-prev{left: -60px;} .suggested-slider .slick-next{right: -60px;} .suggested-slider .slick-prev:before, .suggested-slider .slick-next:before{color: #a67b52;} .suggested-interaries .btn-suggest{margin: 0 auto;} .exp-slider-block.experiences-section .top-caption{max-width: 100%;} .exp-slider-block.experiences-section .experience-grids{max-width: 100%;} .exp-slider-block.experiences-section .experience-grids img{width: 100%;} .exp-slider{margin-bottom: 75px;} .exp-slider .slick-next{right: -55px;} .exp-slider .slick-prev{left: -55px;} .exp-slider .slick-dots{bottom: -45px;} .exp-slider .slick-dots li button{border: 0; background: #fff;} .exp-slider .slick-dots li.slick-active button, .exp-slider .slick-dots li:hover button{background: #a0410d;} .typed-blow {width: 100%; display: block; clear: both; padding: 0 30px 30px 30px;} .typed-blow .block{max-width: 352px; margin-right: 27px; float: left; position: relative;} .typed-blow .block:last-child{margin-right: 0;} .typed-blow .block figure{width: 100%; margin-bottom: 15px; overflow: hidden; border-radius: 3px; position: relative;} .typed-blow .block figure:after{position: absolute; content: ""; bottom: 0; left: 0; width: 100%; height: 100%; background: url(/application/themes/grootbos/images/typed-shadow.png); background-size: cover;} .typed-blow .block figure .caption{position: absolute; width: 100%; top: 0; left: 0; padding: 15px; font-family: 'Trajan Pro'; color: #fff; font-size: 24px; z-index: 99;} .typed-blow .block p{color: #534741;} .tick-block{margin-bottom: 0;} .typed-block .expert{margin-bottom: 50px;} .typed-block .expert h2{margin-bottom: 20px;} .typed-block .expert span{margin-bottom: 10px;} .typed-block .expert p{color: #fff;} .whale-type{width: 100%; display: block; clear: both; padding: 0 30px 30px 30px;} .whale-type .block{max-width: 210px; margin-right: 15px; float: left; position: relative; border-radius: 3px;} .whale-type .block:last-child{margin-right: 0;} .whale-type .block:after{position: absolute; content: ""; bottom: 0; left: 0; width: 100%; height: 100%; background: url(/application/themes/grootbos/images/whale-shadow.png); background-size: cover;} .whale-type .title{position: absolute; width: 100%; bottom: 0; left: 0; padding: 15px; font-family: 'Trajan Pro'; color: #fff; font-size: 18px; z-index: 99;} /*-----------beauty-saloon-page-----------------*/ .wine-page .faq-block h3{display: block;} .treatment-block{width: 100%; display: block; margin-top: 30px; overflow: hidden;} .treatment-block .block{max-width: 360px; width: 100%; float: left; margin-right: 15px; margin-bottom: 15px; border-radius: 3px; position: relative;} .treatment-block .block:nth-child(3n){margin-right: 0;} .treatment-block .block:after{position: absolute; content: ""; bottom: -1px; left: 0; width: 100%; height: 142px; background: url(/application/themes/grootbos/images/whale-shadow.png); background-position: bottom; background-size: cover; z-index: 9;} .treatment-block .block figure{display: block; overflow: hidden; width: 100%; border-radius: 3px;} .treatment-block .block figure img{width: 100%;} .treatment-block .caption{position: absolute; width: 100%; bottom: 0; left: 0; padding: 15px; z-index: 99;} .treatment-block .caption h4{font-size: 22px; color: #fff; margin-bottom: 0;} .treatment-block .caption p{font-size: 14px; color: #fff; margin-bottom: 0;} /*-------------suggested-page---------------*/ .suggested-page .heading-caption{padding: 40px 0 0;} .suggested-bar .clear-filter{display: none;} aside.left-aside.suggested-bar ul li a{padding: 0;} aside.left-aside.suggested-bar ul li a:hover label{background: #f5e2c9; color: #856242;} aside.left-aside.suggested-bar ul li.is-checked label{background: #f5e2c9; color: #856242;} aside.left-aside.suggested-bar ul li.is-checked label:after {opacity: 1;} .right-content.interaries .iteam{position: relative; max-width: 290px; width: 100%; margin: 0 5px; text-align: left; float: left; margin-bottom: 10px;} .right-content.interaries .iteam > a{display: block;} .right-content.interaries .iteam:after{position: absolute; content: ""; bottom: 0; left: 0; width: 100%; height: 100%; background: url(/application/themes/grootbos/images/suggested-shadow.png); background-size: cover; pointer-events: none;} .right-content.interaries .iteam figure img{width: 100%;} .right-content.interaries .iteam .days{position: absolute; top: 10px; right: 10px; padding: 10px 15px; background: #a67b52; display: inline-block; font-size: 14px; color: #fff; font-family: 'Gotham'; font-weight: 300;} .right-content.interaries .iteam .caption{width: 100%; bottom: 0; left: 0; padding: 10px 20px; position: absolute; z-index: 99;} .right-content.interaries .iteam .caption h4{color: #fff; text-align: left; margin-bottom: 7px;} .right-content.interaries .iteam .caption span{display: block; font-size: 14px; color: #fff; font-family: 'Gotham'; font-weight: 300;} .suggested-bar [type="checkbox"]:not(:checked), .suggested-bar [type="checkbox"]:checked {position: absolute; left: -9999px;} .suggested-bar [type="checkbox"]:not(:checked) + label, .suggested-bar [type="checkbox"]:checked + label {position: relative; padding: 16px 20px; padding-left: 44px; cursor: pointer; font-family: 'Gotham'; font-weight: 500; font-size: 14px; color: #e2be9c; display: block; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .suggested-bar [type="checkbox"]:checked + label{background: #f5e2c9; color: #856242;} .suggested-bar [type="checkbox"]:not(:checked) + label:before, .suggested-bar [type="checkbox"]:checked + label:before {content: ''; position: absolute; left:20px; top: 50%; width: 15px; height: 15px; border: 2px solid #fff; background: #fff; transform: translateY(-50%); -webkit-transform: translateY(-50%);} .suggested-bar [type="checkbox"]:not(:checked) + label:after, .suggested-bar [type="checkbox"]:checked + label:after {content: ''; position: absolute; top: 50%; left: 20px; border: 2px solid #a67b52; width: 15px; height: 15px; background: url(/application/themes/grootbos/images/icon_right.png) no-repeat center center; transform: translateY(-50%); -webkit-transform: translateY(-50%); background-size: 9px;} .suggested-bar [type="checkbox"]:not(:checked) + label:after {opacity: 0;} .suggested-bar [type="checkbox"]:checked + label:after {opacity: 1;} .suggested-page .specials-overview-section{border: 0;} aside.left-aside.suggested-bar .clear-filter{display: none; width: 65px; height: 30px; margin-right: 0; text-align: center; position: relative; float: right; padding: 0; font-size: 11px; color: #fff; padding: 3px 5px; border-radius: 3px; background: #a67b52; line-height: 12px; top: 7px; right: 7px; font-family: 'Gotham'; font-weight: 500; } aside.left-aside.suggested-bar .clear-filter:hover{text-decoration: none;} /*---------------decadent-dining-page---------------*/ .decadent-dining-page .heading-caption{padding: 40px 0 0;} .decadent-dining-page .heading-caption .date{font-family: 'Gotham'; font-weight: 300; font-size: 16px; color: #fff; padding: 5px 15px; text-transform: uppercase; background: #a67b52; display: inline-block; margin-bottom: 10px;} .decadent-dining-page h2, .decadent-dining-page .sub-title-h3{font-size: 34px; color: #321c00;} .decadent-dining-page .suggested-interaries h2{font-size: 18px;} .the-exp-block{width: 100%; display: block; overflow: hidden; padding: 20px; background: #faf0e4; margin-bottom: 70px;} .the-exp-block h2{display: inline-block;} .the-exp-block figure{max-width: 369px; width: 100%; float: right; margin-left: 50px;} .decadent-dining-page .stay-block{padding: 40px 0; background: #f5e2c9; margin-bottom: 70px;} .decadent-dining-page .stay-block h2{text-align: center;} .decadent-dining-page .our-rates-section{margin-bottom: 60px;} .decadent-dining-page .suggested-interaries{background: #faf0e4; padding: 65px 0;} .sneak-preview-block{margin-top: 55px;} .days-tabbing{width: 100%; margin-bottom: 40px;} .days-slider{background: #a67b52; border-radius: 2px; width: calc(100% - 100px);} .days-slider .slick-track{margin-left: 0;} .days-slider .days{padding:13px; background:#b58f63; color: #fff; font-family: 'Trajan Pro'; font-size: 16px; text-transform: uppercase; text-align: center; border-right: 1px solid #ccae7c; position: relative;} .days-slider .days:after{position: absolute; content: ""; right: -5px; top: 50%; transform: translateY(-50%) rotate(-135deg); -webkit-transform: translateY(-50%) rotate(-135deg); width: 9px; height: 9px; border: 1px solid #ccae7c; border-right: 0; border-top: 0; background: #b58f63; z-index: 9;} .days-slider .days:hover{text-decoration: none;} .days-slider .days.active{background: #d8be89; border-color: #d8be89; color: #a67b52; z-index: 99;} .days-slider .days.active:after{background: #d8be89; border-color: #d8be89;} .days-slider .slick-current{z-index: 99;} .days-slider .slick-list{border-radius: 2px;} .days-slider .slick-arrow{width: 50px; height: 50px; background: #8c5827;} .days-slider .slick-prev{left: -50px; border-radius: 2px; border-top-right-radius: 0; border-bottom-right-radius: 0;} .days-slider .slick-prev:before{ content: ""; background: #8c5827 url(/application/themes/grootbos/images/prev_icon.png) 50% 50% no-repeat; width: 18px; height: 18px; display: block; margin: 0 auto;} .days-slider .slick-next{right: -50px; border-radius: 2px; border-top-left-radius: 0; border-bottom-left-radius: 0;} .days-slider .slick-next:before{ content: ""; background: #8c5827 url(/application/themes/grootbos/images/next_icon.png) 50% 50% no-repeat; width: 18px; height: 18px; display: block; margin: 0 auto;} .days-slider .slick-arrow.slick-disabled{display: block !important; pointer-events: none; cursor: pointer;} .days-activity{display:none; width: 100%; height: 100%; padding: 20px 0;} .days-activity h3, .days-activity .sub-title-h4{font-size: 30px; color: #321c00; margin-bottom: 15px;font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro'; font-style: normal;} .days-activity .img-block{width: 100%; overflow: hidden; display: block;} .days-activity .img-block .left{max-width: calc(50% - 5px); float: left; margin-right: 10px;} .days-activity .img-block .right{max-width: calc(50% - 5px); float: right;} .days-activity .img-block figure{width: 100%; margin-bottom: 10px;position: relative;} .days-activity .img-block figure .fig-caption {position: absolute;bottom: 0 ;left: 0;width: 100%;z-index: 99;padding: 12px 20px; background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%,rgba(0, 0, 0, 0.47) 1%,rgba(0,0,0,1) 100%);} .days-activity .img-block figure .fig-caption p {margin-bottom: 0;color: #fff;} .days-activity .img-block figure img{width: 100%;} .days-activity.active{display:block} /*------------press-page---------------*/ .press-page .heading-caption{padding: 40px 0 0;} .press-page h3{font-size: 34px;} .download-content{display: block; width: 100%;} .download-content .block{max-width: calc(50% - 10px); margin-right: 20px; float: left; width: 100%; margin-bottom: 20px; padding: 20px; background: #f5e2c9;} .download-content .block:nth-child(2n){margin-right: 0;} .download-content .block h4{display: inline-block; font-size: 22px; color: #321c00; margin-bottom: 5px; max-width: calc(100% - 185px);} .download-content .block p{font-size: 14px; line-height: 22px; color: #000; margin-bottom: 10px;} .download-content .block figure{float: left; max-width: 170px; width: 100%; margin-right: 15px;} .download-content .block .btn-dining{background: #336531 url(/application/themes/grootbos/images/icon_download.png) 90% 50% no-repeat; padding: 0 54px 0 20px; font-size: 13px; text-transform: uppercase; text-align: left; float: right; line-height: 36px;} .download-content .block .btn-dining:hover{background: #fff url(/application/themes/grootbos/images/icon_download_hvr.png) 90% 50% no-repeat;} .press-contact{width: 100%; display: block; background: #a67b51; padding: 30px;} .press-contact h3{color: #fff;} .press-contact .block{max-width: 33.33%; padding-right: 100px; float: left;} .press-contact .block .title{color: #fff; font-family: 'Gotham'; font-weight: 300; font-size: 20px;} .press-contact .block p{color: #fff;} .press-contact .block p strong{display: block; font-weight: 400;} .in-the-press{width: 100%; display: block;} .in-the-press .year{display: block; font-family: 'Gotham'; font-weight: 500; font-size: 24px; color: #a0410d; margin-bottom: 15px;} .in-the-press p{font-size: 18px; color: #000; margin-bottom: 20px;} .in-the-press p em{font-style: normal; color: #a0410d; font-family: 'Trajan Pro';} .press-page .btn-load-more{display: none;} .fancybox-active .fancybox-detail .fancybox-close-small{background: url(/application/themes/grootbos/images/close_black.png) no-repeat; position: absolute; top: 5px; right:5px; width: 28px; height: 28px; background-size: 27px;color: transparent;padding: 0;} #detail-popup{width: 100%; height: auto; display: none;} #detail-popup form .input-field{width: 100%; margin-bottom: 20px;} #detail-popup form .input-field input{width: 100%; height: 45px; border: 1px solid #e9e9e9; font-family: "Gotham Book"; color: #868686; font-size: 14px; border-radius: 0; padding: 8px 13px;} #detail-popup form .input-field input::-webkit-input-placeholder {color: #868686; } #detail-popup form .input-field input::-moz-placeholder {color: #868686; } #detail-popup form .input-field input::-ms-input-placeholder {color: #868686; } #detail-popup form .input-field .btn-submit{float: right; background: #336531; color: #fff; text-transform: uppercase; font-size: 13px; border: 1px solid #336531; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; border-radius: 3px; font-family: 'Gotham'; font-weight: 500; width: 124px; height: 43px; padding: 0; line-height: 43px;} #detail-popup form .input-field .btn-submit:hover{color: #336531; background: #fff; opacity: 1;} .blog-page .heading-caption{padding: 40px 0 0;} .blog-type-block{width: 100%; background: #856242; padding: 8px 11px; margin-bottom: 30px;} .blog-type-block .input-field{max-width: 239px; float: left; margin-right: 10px; width: 100%;} .blog-type-block .input-field .customSelect{background: #f5e2c9 url(/application/themes/grootbos/images/icon_down-arrow.png) no-repeat 95% 50%; padding: 0 35px 0 23px; height: 44px; line-height: 44px; font-size: 14px; color: #856242; font-family: "Gotham"; font-weight: 500; text-transform: uppercase;} .blog-type-block .input-field .customSelectInner{text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} .blog-type-block .input-field.category{max-width: 401px;} .blog-type-block .input-field.search{float: right; margin-right: 0;} .blog-type-block .input-field.search input{width: 100%; height: 44px; border: 0; border-radius: 0; font-size: 16px; padding: 0 35px 0 20px; line-height: 44px; font-family: 'Gotham Book'; background: #fff url(/application/themes/grootbos/images/icon_search.png) no-repeat 95% 50%;} .blog-type-block .input-field.search input::-webkit-input-placeholder {color: #856242; } .blog-type-block .input-field.search input::-moz-placeholder {color: #856242; } .blog-type-block .input-field.search input::-ms-input-placeholder {color: #856242; } .blog-post{width: calc(100% + 14px); display: block; margin-left: -7px; margin-bottom: 30px;} .blog-post .block{max-width: 380px; width: 100%; display: inline-block; vertical-align: top; margin: 0 5px; margin-bottom: 14px; position: relative;} .blog-post .block figure{width: 100%; border-radius: 3px; height: auto; overflow: hidden;} .blog-post .block figure img{width: 100%; transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} .blog-post .block:hover img{transform: scale(1.1); -webkit-transform: scale(1.05);} .blog-post .block .date{position: absolute; top: 10px; right: 10px; background: #fff; padding: 4px 10px; text-align: center; font-size: 12px; font-family: 'Gotham'; font-weight: 500; color: #000; line-height: 1;} .blog-post .block .date strong{font-size: 30px; font-weight: 500; display: block; line-height: 30px;} .blog-post .block .caption{width: 100%; padding: 10px 0;} .blog-post .block .caption h4{font-size: 22px; color: #262626; margin-bottom: 4px;} .blog-post .block .caption a{color: #337ab7;} .blog-post .block .caption p{font-size: 14px; color: #262626; margin-bottom: 5px;} .blog-post .block.full{max-width: 775px; float: left;} .blog-post .block.full .caption{position: absolute; background: #a67b52; bottom: 18px; left: 0; max-width: 341px; padding: 18px;} .blog-post .block.full .caption h4{color: #fff; margin-bottom: 4px;} .blog-post .block.full .caption a{color: #fff;} .blog-post .block.full .caption p{color: #fff; margin-bottom: 8px;} .blog-post .block.full .caption .btn-read-more{font-size: 14px; color: #fff; text-transform: uppercase; font-family: 'Trajan Pro'; padding-right: 15px; position: relative; display: inline-block;} .blog-post .block.full .caption .btn-read-more:hover{text-decoration: none; opacity: 0.8;} .blog-post .block.full .caption .btn-read-more:after{position: absolute; content: ""; width: 0; height: 0; border-style: solid; border-width: 4px 0 4px 6px; border-color: transparent transparent transparent #ffffff; right: 0; top: 5px;} .blog-post .block.half{margin: 0 9px; margin-bottom: 10px; float: left;} .blog-post .block.half:nth-child(3){margin-bottom: 15px;} .blog-post .block.half .caption{position: absolute; bottom: 0; left: 0; background: rgba(0,0,0,.67); padding: 13px 20px; border-radius: 3px; border-top-left-radius: 0; border-top-right-radius: 0;} .blog-post .block.half .caption a{color: #fff;} .blog-post .block.half .caption h4{color: #fff; margin-bottom: 6px;} .blog-post .block.half .caption p{color: #fff;} /* paginetion part */ .paginetion-blk{display: block; width: 100%; margin: 0 auto; text-align: center; float: none; padding:0 10px; margin-bottom: 50px;} .paginetion-blk a.to-next-page, .paginetion-blk a.to-prev-page{display: inline-block; vertical-align: middle; text-transform: uppercase; padding: 8px 13px; background: #486538; font-family: 'Gotham Book'; font-size: 14px; color: #fff; border-radius: 2px; line-height: 18px;} .paginetion-blk ul{display: block; margin: 0 auto; display: inline-block; vertical-align: middle; width:calc(100% - 200px);} .paginetion-blk ul li{display: inline-block; vertical-align: middle; margin: 0 auto; padding: 0;} .paginetion-blk ul li:before{display: none} .paginetion-blk ul li a{display: inline-block; padding: 8px 13px; background: #fff; font-family: 'Gotham Book'; font-size: 14px; color: #2a2a2a; border: 1px solid #000; border-radius: 2px; line-height: 18px;} .paginetion-blk ul li.active a,.paginetion-blk ul li:hover a{background-color: #9a7a55; color: #fff; border-color: #9a7a55;} /*------------blog-detail-page----------------*/ .blog-detail-page .inner-banner .iteam{height: 500px; background-size: cover; background-position: center;} .blog-detail-wrap{width: 100%; margin-top: 20px; margin-bottom: 70px;} .blog-detail-wrap h1 {font-size: 34px; color: #321c00;} .blog-detail-wrap h2{font-size: 22px; color: #321c00;} .blog-detail-wrap h3{font-size: 20px; color: #321c00;} .blog-detail-wrap ul, .blog-detail-wrap ol{margin-bottom: 20px;} .blog-detail-wrap ul ul, .blog-detail-wrap ol ol, .blog-detail-wrap ol ul{ margin-bottom: 0;} .blog-detail-wrap ul li, .blog-detail-wrap ol li{padding: 0 0 0 22px;margin: 10px 0;} .blog-detail-wrap ul li:before{background-color: #a57b52;top: 9px;} .blog-detail-wrap ol li:before{color:#a57b52 ;font-weight: 700;} .blog-detail-wrap p{color: #534741; margin-bottom: 20px;} .blog-detail-wrap blockquote{background-color: #fbf1e5;border-left: 5px solid #a57b52;font-size: 18px;color: #534741;font-family: 'Trajan Pro';padding: 30px;} .blog-detail-wrap .quote{position: relative;padding-left: 65px;} .blog-detail-wrap .quote:before{content: '';position: absolute;top: 25px;left: 20px;background-image: url(../images/quote.png);width: 29px;height: 25px;} .inn-wrap .align-right{float: right; margin-left: 20px;} .inn-wrap .blog-tag{width: 100%; border: 1px solid #e1e1e1; border-left: 0; border-right: 0; padding: 8px 10px; margin-bottom: 15px;} .inn-wrap .blog-tag .status{float: left;} .inn-wrap .blog-tag .status .tag{font-size: 14px; color: #999999; font-family: 'Gotham'; font-weight: 500; display: inline-block; margin-right: 20px;} .inn-wrap .blog-tag .status .tag img{margin-right: 10px; margin-top: 3px;} .inn-wrap .blog-tag .social-icon{float: right;} .inn-wrap .blog-tag .social-icon a{display: inline-block; margin-left: 25px;} .inn-wrap .blog-tag .social-icon a:hover{opacity: .6;} .inn-wrap .blog-tag .social-icon a img{vertical-align: middle;} .blog-detail-wrap .inn-wrap{max-width: 1000px; margin: 0 auto;padding-left: 100px;padding-right: 100px; width: 100%; position: relative; margin-bottom: 15px} .blog-detail-wrap .inn-wrap.no-padding{padding-left: 0;padding-right: 0;} .blog-detail-wrap .full-block h3:before{position: absolute; content: ""; background: url(/application/themes/grootbos/images/icon_quote.png); width: 46px; height: 40px; left: 0; top: -15px;} .blog-detail-wrap .cta{text-align: center;padding: 70px;background-size: cover;background-repeat: no-repeat;margin-bottom: 30px;} .blog-detail-wrap .cta-text{font-size: 30px;color: #ffffff;display: block; font-family: 'Trajan Pro';margin-bottom: 20px;} .blog-detail-wrap .color-panel{background-color: #a57b52;padding: 30px;margin-bottom: 30px;} .blog-detail-wrap .color-panel * {color: #ffffff;} .blog-detail-wrap .color-panel p:last-child{margin-bottom: 0;} .blog-detail-wrap .inn-wrap .fig-caption{position: relative; margin-bottom: 30px;} .blog-detail-wrap .inn-wrap .fig-caption img{box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.1);width: 100%;} .blog-detail-wrap .caption{width: 100%; padding: 10px 20px;text-align: center;} .blog-detail-wrap .embbed-caption{text-align: center;padding-bottom: 30px;} .blog-detail-wrap .embbed-caption .responsive-embbed{margin-bottom: 0; box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.1);} .blog-detail-wrap .caption p{margin-bottom: 0; color: #000;font-size: 14px;} .blog-detail-wrap .inn-wrap .inn-left{max-width: calc(50% - 15px); width: 100%; margin-right: 30px; float: left;} .blog-detail-wrap .inn-wrap .inn-right{max-width: calc(50% - 15px); width: 100%; float: right;} .blog-detail-wrap .inn-wrap .author{position: absolute; max-width: 70px; width: 100%; left: 0; top: 0;} .blog-detail-wrap .inn-wrap .author h3{font-size: 12px; color: #321c00; font-family: 'Gotham'; font-weight: 500; text-transform: uppercase; text-align: center; padding-top: 10px;} .blog-detail-wrap .btn-back{float: left; margin-top: 20px;} .blog-detail-wrap .btn-next{float: right; margin-top: 20px;} .blog-detail-wrap .responsive-embbed {padding-top: 54.56%;} .blog-detail-wrap .videowrap{position: relative;} .blog-detail-wrap .video-icon{position: absolute;background-image: url(../images/videoplay.png);width: 84px;height: 84px;display: block;top: 50%;left: 50%;transform: translate(-50%, -50%);} .blog-detail-wrap .resposnive-table{overflow: auto;} .blog-detail-wrap table{width: 100%;margin-bottom: 30px;min-width: 800px;} .blog-detail-wrap table th{background-color: #a1400d;color: #fff;text-transform: uppercase;text-align: left;padding: 12px 15px;border: 1px solid #fff;font-weight: 400;} .blog-detail-wrap table td{text-align: left;padding: 12px 15px;border: 1px solid #fff;font-weight: 300;background-color: #ebebea;} .blog-detail-wrap table tr:nth-child(odd) td{background-color: #f5f5f5;} .blog-detail-wrap .responsive-embbed video{display: block;position: absolute;width: 100%;height: 100%;object-fit: cover;left: 50%;top: 50%;transform: translate( -50%, -50% );} .blog-gallery {margin-bottom: 30px;} .blog-gallery .row{display: flex;flex-wrap: wrap;} .blog-gallery .cell-4{width: 33.33%;} .blog-gallery .cell-8{width: 66.66%;} .blog-gallery .half{height: 50%;position: relative;} .blog-gallery .full{height: 100%;position: relative;} .blog-gallery .magnifying{position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;background-color: rgba(0, 0, 0, 0.50);cursor: pointer;align-items: center;justify-content: center;flex-wrap: wrap;opacity: 0;transition: ease all 0.3s;} .blog-gallery .magnifying:before{ content: "g";font-family: "grootbos";font-style: normal;font-variant: normal;font-weight: normal;line-height: 1;text-transform: none;color: #fff;font-size: 30px;} .blog-gallery .half:hover .magnifying, .blog-gallery .full:hover .magnifying{opacity: 1;} .blog-gallery img{width: 100%;height: 100%;object-fit: cover;display: block;} .grid-2{ display: grid;grid-template-columns: repeat(auto-fit, minmax(256px, 1fr));grid-gap: 20px;} .more-stories{width: 100%; display: block; background: #f7f1e3; padding: 40px 0; margin-bottom: 70px;} .more-stories h3{font-size: 34px; color: #000; text-align: center;} .more-stories .btn-more-stories{display: table; margin: 30px auto 0; text-transform: uppercase;} .more-stories .block{max-width: 270px; width: 100%; float: left; margin-right: 30px;} .more-stories .block:last-child{margin-right: 0;} .more-stories .block figure img{width: 100%;} .more-stories .text-caption{width: 100%; padding: 16px; background: #fff;} .more-stories .text-caption h4{font-size: 20px; color: #321c00; margin-bottom: 8px;} .more-stories .text-caption p{font-size: 14px; color: #534741; margin-bottom: 0px;} /*----------our-story-page-------------*/ .our-story-banner{height: 600px; width: 100%; background-size: cover; position: relative; background-position: center;} .our-story-banner .caption{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); max-width: 910px; text-align: center; width: 100%;} .our-story-banner .caption h2, .our-story-banner .caption .h2{font-size: 34px; color: #fff; margin-bottom: 20px; position: relative;font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro';} .our-story-banner .caption .btn-who-we-are{display: inline-block; padding-right: 50px; background: url(/application/themes/grootbos/images/icon_download-file.png) 100% 50% no-repeat; font-family: 'Gotham Book'; font-size: 20px; color: #fff; text-transform: uppercase; line-height: 34px; position: relative;} .our-story-banner .caption .btn-arrow-right{display: inline-block; padding-right: 50px; background: url(/application/themes/grootbos/images/icon_arrow_circle_right.png) 100% 50% no-repeat; font-family: 'Gotham Book'; font-size: 20px; color: #fff; text-transform: uppercase; line-height: 34px; position: relative;} .natural-beauty{padding: 70px 0;} .natural-beauty figure{max-width: 500px; float: left; margin-right: 30px;} .natural-beauty figure img{width: 100%;} .natural-beauty .text-caption{float: right; max-width: calc(100% - 530px); width: 100%;} .travel-exp{width: 100%; display: block; overflow: hidden;} .travel-exp .left{width: 46%; float: left; background: #a0410d; padding-left: calc((100% - 1170px)/2); padding-right: 56px; text-align: center;} .travel-exp .left h4{font-size: 24px; color: #fff; line-height: 36px; margin-bottom: 0;} .travel-exp .right{width: 54%; float: right; padding: 100px 0; padding-right: calc((100% - 1170px)/2); padding-left: 65px;} .travel-exp .right p{margin-bottom: 0;} .sponsers{width: 100%; background: #f2f2f2; text-align: center; padding: 30px 0;} .belive-block{width: 100%; display: block; overflow: hidden;} .belive-block .left{width: 54%; float: left; padding: 60px 0; padding-left: calc((100% - 1170px)/2); padding-right: 44px;} .belive-block .left h3{font-size: 34px; color: #000;} .belive-block .left p{margin-bottom: 30px;} .belive-block .right{width: 46%; float: right; background: #a0410d; padding-right: calc((100% - 1170px)/2); padding-left: 55px; text-align: center;} .belive-block .right h4{font-size: 24px; color: #fff; line-height: 36px; margin-bottom: 0;} .meet-them-block{width: 100%; display: block; margin: 35px 0 65px;} .meet-them-block .container{max-width: 1190px;} .meet-them-block .block.width01{max-width: calc(25% - 10px);} .meet-them-block .block.width02{max-width: calc(50% - 10px);} .meet-them-block .block{float: left; margin: 5px; background-size: cover; background-position: center; min-height: 270px; width: 100%; border-radius: 3px;} .meet-them-block .block.text{background: #a67b51; padding: 20px 18px;} .meet-them-block .block.text h4{font-size: 22px; color: #fff;} .meet-them-block .block.text p{font-size: 14px; color: #fff; line-height: 22px;} /*-----------award-page-------------*/ .awards-side-bar .awards-iteam .block{width: 100%; padding: 20px 0; border-bottom: 1px solid #ebebeb; display: block; overflow: hidden;} .awards-side-bar .awards-iteam .block:first-child{padding-top: 0;} .awards-side-bar .awards-iteam .block:last-child{border-bottom: 0;} .awards-side-bar .awards-iteam .block figure{max-width: 283px; width: 100%; margin-right: 20px; border-radius: 2px; position: relative; float: left;} .awards-side-bar .awards-iteam .block figure img{width: 100%;} .awards-side-bar .awards-iteam .block figure .year{position: absolute; padding: 4px 20px; background: #fff; top: 10px; right: 10px; font-family: 'Gotham'; font-weight: 300; font-size: 14px; color: #000;} .awards-side-bar .awards-iteam .block .text-caption{max-width: calc(100% - 303px); width: 100%; float: right; padding-top: 5px;} .awards-side-bar .awards-iteam .block .text-caption h4{font-size: 22px; color: #321c00; margin-bottom: 5px;} .awards-side-bar .awards-iteam .block .text-caption p{color: #534741; font-size: 14px; margin-bottom: 0;} /*------------work-mwith-us-page----------------*/ .work-with-us-page .heading-caption{padding: 40px 0 0;} .work-with-us-page .heading-caption h3{font-size: 24px;} .work-culture{padding: 30px; background: #faf0e4; margin-bottom: 65px;} .work-culture h3{display: inline-block; font-size: 34px; color: #321c00;} .work-culture figure.right{float: right; margin-left: 25px;} .work-culture figure.left{float: left; margin-right: 25px;} .current-opportunity-block{width: 100%; display: block; overflow: hidden; margin-bottom: 70px;} .current-opportunity-block h3{font-size: 34px; text-align: center; margin-bottom: 20px;} .current-opportunity-block .block{max-width: calc(33.33% - 20px); margin-right: 30px; float: left;} .current-opportunity-block .block:last-child{margin-right: 0;} .current-opportunity-block .block h4{font-size: 28px; color: #fff; margin-bottom: 0; display: block; padding: 14px 0; text-align: center; background: #856242;} .current-opportunity-block .block .exp{color: #321c00; font-size: 20px; font-family: 'Gotham Book'; padding: 9px 28px; background: #f1f1f1; border-bottom: 1px solid #fff;} .current-opportunity-block .block .caption{padding: 11px 28px; background: #f1f1f1; text-align: center;} .current-opportunity-block .block .caption p{color: #321c00; text-align: left;} .current-opportunity-block .block .caption .btn-enquiery{text-transform: uppercase; margin: 10px 0;} .staff-say-block{width: 100%; background-size: cover; background-position: center; padding: 30px 0; margin-bottom: 70px;} .staff-say-block h4{color: #fff;} .staff-stay-slider{max-width: 1000px; width: 100%;} .staff-stay-slider .staff-detail{float: left; max-width: 180px; margin-right: 30px;} .staff-stay-slider .staff-detail figure{width: 100%;} .staff-stay-slider .staff-detail .caption{display: block; text-align: center;} .staff-stay-slider .staff-detail .caption .name{font-size: 16px; color: #fff; font-family: 'Gotham Book'; } .staff-stay-slider .staff-detail .caption .designation{font-size: 13px; color: #fff; font-family: 'Gotham Book';} .staff-stay-slider .description{max-width: calc(100% - 210px); width: 100%; float: right; padding-top: 20px; padding-bottom: 50px;} .staff-stay-slider .description p{font-size: 18px; font-family: 'Gotham Book'; color: #fff;} .staff-stay-slider .slick-dots { margin: 0; position: absolute; bottom: 20px;} .staff-stay-slider .slick-arrow {margin-top: -40px;} .staff-stay-slider .slick-prev{left: -98px;} .staff-stay-slider .slick-next{right: -98px;} /*---------foundation-page------------*/ .foundation-page .animal-block{padding: 64px 0;} .foundation-page h3, .foundation-description h1{font-size: 34px; text-align: center;} .foundation-description{padding: 40px 0 0;} .our-project-block{background: #faf0e4; padding: 30px; margin-bottom: 70px;} .our-project-block h2{color: #321c00; display: inline-block; font-size: 34px;text-align: center;} .our-project-block p{color: #534741;} .our-project-block .right{background: #a67b52; text-align: left; max-width: 410px; float: right; padding: 20px; margin-bottom: 30px; margin-left: 40px;} .our-project-block .right h4{color: #fff; text-align: center; margin-bottom: 0; line-height: 34px;} .shark-cage-diving-page h4{font-size: 22px;} .our-project-block .right ul{margin: 0;} .our-project-block .right ul li{list-style: none; padding-left: 18px; font-size: 16px; color: #fff; font-family: 'Gotham'; font-weight: 300;} .our-project-block .right ul li:before{display: none;} .our-project-block .right ul li:after{content: ""; position: absolute; top: 9px; left: 0; width: 8px; height: 8px; transform: rotate(135deg); -webkit-transform: rotate(135deg); border: 1px solid #fff; border-bottom: 0; border-right: 0;} .project-slider{max-width: 1112px; width: 100%; margin-bottom: 50px;} .project-slider .iteam{margin: 0 10px;} .project-slider .iteam figure{width: 100%;} .project-slider .iteam figure img{width: 100%;} .project-slider .iteam .description{width: 100%; background: #fff; padding: 18px;} .project-slider .iteam .description h3{font-size: 20px; color: #000; margin-bottom: 10px;} .project-slider .iteam .description p{font-size: 14px; color: #534741;} .project-slider .slick-arrow{top: 25%;} .project-slider .slick-prev:before, .project-slider .slick-next:before{color: #a67b52;} .project-slider .slick-prev{left: -30px;} .project-slider .slick-next{right: -30px;} .project-slider .slick-dots{bottom: -30px;} .project-slider .slick-dots li button{border-color: #a67b52;} .project-slider .slick-dots li.slick-active button, .project-slider .slick-dots li:hover button{background: #a67b52;} .our-project-block .btn-see-all{text-transform: uppercase; display: table; margin: 10px auto;} .foundation-page .our-culinary-block{margin-bottom: 70px;} .foundation-page .staff-say-block{margin-bottom: 20px;} .foundation-page .staff-say-block h2 {color: #fff;} .activity-count{width: 100%; display: block; margin-bottom: 70px; overflow: hidden;} .activity-count .block{width: 25%; float: left; height: 250px; position: relative; background-size: cover; background-position: center;} .activity-count .block .count{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); max-width: 75%; width: 100%; text-align: center;} .activity-count .block .count p{font-size: 22px; color: #fff; font-family: 'Trajan Pro'; margin-bottom: 0;} .activity-count .block .count p strong{display: block; font-size: 60px; font-family: 'Gotham'; font-weight: 500;} .get-involved{width: 100%; display: block; padding: 70px 0;} .get-involved h3{display: inline-block;} .get-involved h4{font-size: 22px;} .get-involved .right{max-width: 394px; width: 100%; float: right; margin-left: 30px; background: #a67b52; padding: 20px; text-align: center;} .get-involved h2{ color: #321c00;display: inline-block;font-size: 34px;text-align: center;} .sub-title-h3 {color: #321c00;font-size: 22px;margin-bottom: 15px;font-weight: 400;line-height: 1.2;font-family: 'Trajan Pro';display: block;font-style: normal;} .get-involved .right h4{color: #fff; margin-bottom: 0; line-height: 34px;} .get-involved .all-detail{width: 100%; display: block; margin-top: 30px;} .get-involved .all-detail .block{max-width: 460px; width: 100%; float: left; padding-right: 80px;} .get-involved .all-detail .block:nth-child(2){max-width: 545px;} .get-involved .all-detail .block:nth-child(3){max-width: 165px; padding: 0;} .get-involved .all-detail .block h5{font-size: 22px; color: #321c00;} .get-involved .all-detail .block .row{display: block; padding-bottom: 2px;} .get-involved .all-detail .block .row span{display: inline-block; margin: 0 2px;} .get-involved .all-detail .block .row .category{display: inline-block; font-size: 14px; font-family: 'Gotham Book'; color: #534741; width: 39%; vertical-align: top;} .get-involved .all-detail .block .row .answer{display: inline-block; font-size: 14px; font-family: 'Gotham'; font-weight: 300; color: #534741; width: 58%; vertical-align: top;} .get-involved .all-detail .block .social-icon{width: 100%; display: block;} .get-involved .all-detail .block .social-icon a{float: left; margin-right: 8px;} .get-involved .all-detail .block .social-icon a:hover{opacity: 0.7;} /*--------------contact-page-----------------*/ .contact-page .heading-caption{padding: 40px 0 0;} .contact-page .hospitality-section.animal-block{box-shadow: none; -webkit-box-shadow: none;} .contact-page #map{width: 100%; height: 426px; overflow: hidden !important;} .contact-us-block{width: 100%; box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1); margin-top: -66px; position: relative; z-index: 99; margin-bottom: 70px;} .contact-us-block .left{max-width: 670px; width: 100%; float: left; padding: 30px; background: #fff;} .contact-us-block .left h3{font-size: 34px; color: #262626; position: relative; padding-right: 80px; margin-bottom: 30px;} .contact-us-block .left h3:after{position: absolute; content: ""; background: url(/application/themes/grootbos/images/icon_massage.png); width: 73px; height: 50px; right: 0; top: 0;} .contact-us-block .left form{display: block; width: 100%; overflow: hidden;} .contact-us-block .left form .row{width: 100%; margin-bottom: 20px;} .contact-us-block form label{display: block;} .contact-us-block form label.in-line{display: inline; color: #000; font-size: 18px;} .contact-us-block form input{padding: 0 13px; width: 100%; border: 1px solid #e9e9e9; font-size: 14px; color: #868686; font-family: 'Gotham Book'; height: 45px; line-height: 45px; border-radius: 0; background: #fff;} .contact-us-block .left form .row textarea{padding: 15px 13px; width: 100%; border: 1px solid #e9e9e9; font-size: 14px; color: #868686; font-family: 'Gotham Book'; height: 134px; border-radius: 0; background: #fff;} .contact-us-block .left form .row .btn-submit{float: right; text-transform: uppercase; background: #336531; border: 1px solid #336531; width: 144px; height: 43px; line-height: 43px; color: #fff; border-radius: 3px; font-size: 13px; font-family: 'Gotham'; font-weight: 500; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;} .contact-us-block .left form .row .btn-submit:hover{background: #fff; color: #336531;} .contact-us-block .left form ::-webkit-input-placeholder {opacity: 1 !important; color: #868686; } .contact-us-block .left form ::-moz-placeholder {opacity: 1 !important; color: #868686; } .contact-us-block .left form ::-ms-input-placeholder {opacity: 1 !important; color: #868686; } .contact-us-block .left form .customSelectWrap{width: 100% !important;} .contact-us-block .left form .customSelectWrap .customSelect{/*max-width: 345px; */width: 100%; border: 1px solid #a1a1a1; height: 47px; background: rgba(255,255,255,1); font-size: 14px; color: #575757; line-height: 45px; text-transform: uppercase; padding: 0 20px; font-family: 'Gotham Book'; overflow: clip;} .contact-us-block .left form .customSelectWrap .customSelect:after{background: url(/application/themes/grootbos/images/down-arrow_fill.png); width: 10px; height: 8px; top: 19px; right: 20px; position: absolute; content: "";} .contact-us-block .left form .ccm-input-date-wrapper input{padding: 0 13px; width: 60%; border: 1px solid #e9e9e9; font-size: 14px; color: #868686; font-family: 'Gotham Book'; height: 45px; line-height: 45px; border-radius: 0; background: #fff;} .contact-us-block .left form .ccm-input-time-wrapper {margin-left: 10px;} .contact-us-block .left form .ccm-input-time-wrapper .separator {color: #000000;} .contact-us-block .left form .ccm-input-time-wrapper select{/*max-width: 345px; */width: 12%; border: 1px solid #a1a1a1; height: 47px; background: rgba(255,255,255,1); font-size: 12px; color: #575757; line-height: 45px; text-transform: uppercase; padding: 0 20px; font-family: 'Gotham Book';} .contact-us-block .left form .ccm-input-time-wrapper select:after{background: url(/application/themes/grootbos/images/down-arrow_fill.png); width: 10px; height: 8px; top: 19px; right: 20px; position: absolute; content: "";} .contact-us-block .left form input[type="checkbox"]{height: 30px;} .contact-us-block .left form .round-radio input[type="checkbox"]{height: 30px; width: 30px; margin:0} .contact-us-block .left form .round-radio {display: flex; justify-content: flex-start; align-items: center;} .contact-us-block .left form .round-radio .round-radio-label{color: #868686; font-size: 16px; width:100%; margin-left: 10px;} .contact-us-block .left form .field-checkboxlist ul.rc-button label{text-align: center; max-width: 250px;} .contact-us-block .left form .field-checkboxlist ul.rc-button li{margin-bottom: 15px;} .contact-us-block .right{max-width: 500px; width: 100%; float: right; background: #f5e2c9;} .contact-us-block .right h2, .application-form-popup .right h3{display: block; background: #a67b52; position: relative; padding: 15px 80px 15px 30px; font-size: 34px; color: #fff; margin-bottom: 0;} .contact-us-block .right h2:after, .application-form-popup .right h3:after{position: absolute; content: ""; background: url(/application/themes/grootbos/images/icon_contact.png); width: 53px; height: 54px; right: 25px; top: 9px;} .contact-us-block .right .detail{width: 100%; padding: 0 30px;} .contact-us-block .right .detail .block{width: 100%; padding: 19px 0; border-top: 1px solid #f0d3ae; border-bottom: 1px solid #fff;} .contact-us-block .right .detail .block:first-child{border-top: 0;} .contact-us-block .right .detail .block:last-child{border: 0;} .contact-us-block .right .detail .block figure{float: left; margin-right: 16px;} .contact-us-block .right .detail .block .description{float: right; max-width: calc(100% - 61px); width: 100%; padding-top: 7px;} .application-form-popup .right .detail .block .description{float: left} .contact-us-block .right .detail .block .description h4{font-size: 20px; color: #000; margin-bottom: 5px;} .contact-us-block .right .detail .block .description p{font-size: 16px; margin-bottom: 0; color: #000;} .contact-us-block .right .detail .block .description a{font-size: 16px; margin-bottom: 0; color: #000; display: inline-block;} .responsive-embbed{display: block; width:100%; padding-top:56.65%; height:0; position:relative; margin-bottom:20px;} .responsive-embbed iframe{position:absolute; width:100%; height:100%; object-fit:cover; left:50%; top:50%; transform:translate( -50%, -50% ); -webkit-transform:translate( -50%, -50% );} /*--------------CC-25-10-2017-----------------*/ /*.survey-page .landing-section.inner-banner{ height:900px;}*/ .survey-page .landing-section.inner-banner h1{ margin-bottom:30px;} .survey-page .landing-section.inner-banner h1, .landing-section.inner-banner .h1{ font-size:30px} .survey-page .heading-caption h1{ margin-bottom:30px;} .landing-section.inner-banner .h1 {font-size: 34px;} .survey-page .heading-caption p{ font-size:15px; text-align: left; font-family:'Gotham'; letter-spacing:0.5px; margin-bottom:30px; line-height:1.6;} .survey-block { width: 100%; display: block; padding-top: 42px; padding-bottom: 75px;} .survey-block .heading-caption{ margin-bottom:65px;} .survey-content-block .single-block{ margin-bottom:22px;} .survey-content-block .questions-block{ margin-bottom:28px;} .survey-content-block .questions-block h3{ font-size:28px; letter-spacing:0.5px; color:#321c00; margin-bottom:10px;} .survey-content-block .questions-block p{ font-family:'Gotham Book'; font-style:italic; font-size:15px; color:#534741;} .survey-content-block .answer-block{ margin:0 -18px;} .survey-content-block .answer-block .single-answer{ padding:0 18px; width:calc(50% - 3px); display:inline-block; vertical-align:top; margin-bottom:22px;} .survey-content-block .answer-block .single-answer a{border:1px solid #d2bda8; padding:27px 27px 26px;display:inline-block; width:100%; color:#321c00; font-size:24px; font-family:'Trajan Pro'; font-weight:400; line-height:1;} .survey-content-block .answer-block .single-answer a.active{ background-color:#336531; border-color:#336531; color:#fff;} .survey-content-block .answer-block .single-answer .radio-btn{ border:1px solid #d2bda8; padding:27px 27px 26px; display:inline-block; width:100%; cursor:pointer; position:relative;} .survey-content-block .answer-block .single-answer .radio-btn input[type="radio"]{ position:absolute; left:0; top:0; width:100%; height:100%; visibility:hidden; margin:0;} .survey-content-block .answer-block .single-answer .radio-btn label{width:100%; color:#321c00; font-size:24px; font-family:'Trajan Pro'; font-weight:400; line-height:1; cursor:pointer;} .survey-content-block .answer-block .single-answer .radio-btn.active{ background-color:#336531; border-color:#336531;} .survey-content-block .answer-block .single-answer .radio-btn.active label{color:#fff;} .survey-content-block .answer-block .single-answer .radio-btn:hover{ background-color:#336531; border-color:#336531;} .survey-content-block .answer-block .single-answer .radio-btn:hover label{color:#fff;} .survey-content-block .submit-btn{float: none; margin:0 auto; text-align: center;} .survey-content-block .submit-btn .btn-submit{text-transform: uppercase; background: #336531; border: 1px solid #336531; width: 266px; height: 48px; line-height: 46px; color: #fff; border-radius: 3px; font-size: 15px; font-family: 'Gotham'; font-weight: 500; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; max-width:266px; letter-spacing:0.5px;} .survey-content-block .submit-btn .btn-submit:hover{ background-color: transparent; color:#336531;} .fancybox-confirm .fancybox-skin{ background-image:none; background-color:#ffffff;} .fancybox-confirm.fancybox-opened .fancybox-skin{ box-shadow:0 0px 8px rgba(0, 0, 0, 0.5); -moz-box-shadow:0 0px 8px rgba(0, 0, 0, 0.5); -webkit-box-shadow:0 0px 8px rgba(0, 0, 0, 0.5);} .fancybox-active.fancybox-confirm{ max-width:1014px;} .confirm-form{ text-align:center;} .confirm-form h2{ font-size:40px; color:#321c00;} .confirm-form p{ font-size:24px; color:#534741; margin-bottom:35px;} .confirm-form .frm_element{ padding:0 15px; margin-bottom:48px;} .confirm-form input[type="text"], .confirm-form input[type="password"], .confirm-form input[type="email"], .confirm-form input[type="tel"], .confirm-form input[type="search"], .confirm-form textarea{ width:100%; border:1px solid #b7b7b7; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; height:58px; line-height:58px; color:#b7b7b7; font-weight:300;} .confirm-form input::-webkit-input-placeholder {color: #b7b7b7;} .confirm-form input::-moz-placeholder { color: #b7b7b7;} .confirm-form input:-ms-input-placeholder { color: #b7b7b7;} .confirm-form input:-moz-placeholder { color: #b7b7b7;} .confirm-form input[type="submit"]{text-transform: uppercase; background: #336531; border: 1px solid #336531; width: 146px; height: 48px; line-height: 46px; color: #fff; border-radius: 3px; font-size: 15px; font-family: 'Gotham'; font-weight: 500; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; max-width:146px; letter-spacing:0.5px; padding:0;} .confirm-form input[type="submit"]:hover{ background-color:transparent; color:#336531;} .confirm-form.screen2 .btn-process, .confirm-form.screen3 .btn-process{text-transform: uppercase; background: #336531; border: 1px solid #336531; width: 213px; height: 48px; line-height: 46px; color: #fff; border-radius: 3px; font-size: 15px; font-family: 'Gotham'; font-weight: 500; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; max-width:213px; letter-spacing:0.5px; padding:0; display:inline-block;} .confirm-form.screen2 .btn-process:hover, .confirm-form.screen3 .btn-process:hover{ background-color:transparent; color:#336531;} .fancybox-active.fancybox-confirm .fancybox-close{ background:url(/application/themes/grootbos/images/close-icon.png) no-repeat; height:33px; width:33px; background-repeat:no-repeat; background-size:cover;} /*.enquiry-fixed{ position:fixed; bottom:100px; right:-57px; z-index:999; background-color:#fff; padding:2px; transform:rotate(90deg);}*/ .enquiry-fixed{ position:fixed; bottom:50px; right:8px; z-index:999; background-color:#fff; padding:2px; } .enquiry-fixed .btn{font-size: 13px; line-height: 32px; padding: 0 20px;} .make-inquiry{ margin-bottom:0;} .inquiry-form{ text-align:center;} .inquiry-form p{ text-align:left;} .inquiry-form .frm_element{ text-align:left;} .inquiry-form .frm_action .submit{ margin-bottom:0;} .book-now{font-size: 13px; line-height: 32px; padding: 0 20px; text-transform:uppercase; max-width:160px; width:160px;} span.or{ font-family:'Trajan Pro'; font-size:24px; margin:15px 0; display:block;} .survey-menu .top-menu{ display:none;} .survey-menu .bottom-header{ display:none;} .survey-menu #content-area{ margin-top:70px;} .landing-section .content-block{ background-repeat:no-repeat; background-position:center center; background-size:cover;} /*--------------CC-6-11-2017-----------------*/ .inquiry-form h2{ font-size: 30px; color: #321c00; text-transform: uppercase; line-height: 42px; margin-bottom: 30px; font-weight: 600;} .inquiry-form h3 { font-size: 30px; color: #321c00; text-transform: uppercase; line-height: 30px; margin-bottom: 20px;} .inquiry-form .booknow-btn{ font-size: 24px; color: #321c00; text-transform: uppercase; line-height: 38px; font-family: 'Trajan Pro';} .inquiry-form .booknow-btn .book-now{ margin-left: 22px;} .inquiry-form h3{ font-size: 24px;} /* 4. Link ------------------------------------------------------------------------------*/ a.text-link, a.text-link:link, a.text-link:visited { color: #002400; text-decoration: underline; } a.text-link:hover, a.text-link:active { color: #a0410d; } /*CUSTOM*/ .staff-designation {font-style:italic;} .staff-name{margin-bottom: 8px;} .inn-wrap .align-left{float: left; margin-right: 20px;} .blog-detail-wrap .blog-row-wrap {margin-bottom: 15px;} .uppercase {text-transform: uppercase;} a.navlink {color: #fff; padding-bottom: 4px; position: relative; text-decoration: none; font-size: 10px; font-family: 'Gotham Book'; line-height: 1; text-transform: uppercase; } .persona-list{width: 100%; display: block;} .persona-list .block{max-width: 270px; width: 100%; float: left; margin: 0 22px 30px 0; position: relative;} .persona-list .block:nth-child(4n){margin-right: 0;} .persona-list .block figure{width: 100%; height: auto; overflow: hidden;} .persona-list .block figure img{display: block;} .persona-list .block .caption{position: absolute; left: 22px; bottom: 18px; display: block; font-size: 22px; color: #fff; font-family: 'Trajan Pro'; width: 60%;} .contact-us-block .right .detail .block .description a{font-size: 16px; margin-bottom: 0; color: #000; display: inline-block;} .fancybox-nav { width: 15%; height: 70%; } .fancybox-nav span { top: 70%; } .awards-iteam .btn-feature{float: right; margin-top: 10px;} /* updated header drop-down menu */ header.main-header .bottom-header .main-menu ul ul.drop-down li{max-width: 181px;} header.main-header .bottom-header .main-menu ul ul.drop-down.has-buttons li{max-width: 210px;} header.main-header .bottom-header .main-menu ul ul.drop-down{text-align: left;} header.main-header .bottom-header .main-menu ul ul.drop-down li a figure img, header.main-header .bottom-header .main-menu ul ul.drop-down li a figure{min-height: inherit} header.main-header .bottom-header .main-menu ul li:hover ul.drop-down:after{content:"";position:absolute;width: calc(100% + 300px);height:150px;top :0;left:0;z-index: -1;} @media (min-width: 1024px) and (max-width: 1200px){ header.main-header .bottom-header .main-menu ul ul.drop-down.has-buttons li {max-width: 271px;width: 100%;} header.main-header .bottom-header .main-menu ul ul.drop-down li {width: 100% !important;max-width: 190px;} } @media (min-width: 768px) and (max-width: 1023px){ header.main-header .bottom-header .main-menu ul ul.drop-down li {max-width: 177px;width: 100% !important;} header.main-header .bottom-header .main-menu ul ul.drop-down.has-buttons li {max-width: 239px;width: 100%;} header.main-header .bottom-header .main-menu ul li a {padding-left: 4px !important;} header.main-header .bottom-header .main-menu ul li.has-submenu > a{padding-right: 14px !important;} } /*Added styling for notes*/ .table-note {font-size: 0.75em; clear: both; margin-bottom: 0;} /* added offset for food wine menu 26/11 */ header.main-header .bottom-header .main-menu ul ul.drop-down.food-wine-menu {left: 334px;} /*Custom styles for SA ID Popup form*/ .inquiry-form .frm_action .submit.center {float: unset} .inquiry-form .frm_element input{width: 100%; font-size: 14px; color: #575757; background: rgba(255,255,255,1); padding: 20px; border: 1px solid #a1a1a1; border-radius: 0; font-family: 'Gotham Book';} /*Zealous 2019/01/17 - Checkbox and radio button styling*/ .rc-button {padding-top: 0;margin-bottom: 0;} .rc-button label, .application-form-popup .rc-button label{ font-size: 16px;color: #262626;line-height: 24px;font-family: 'Gotham Book';display: inline-block;vertical-align: middle;} .rc-button li{list-style: none;padding: 0;padding-bottom: 8px;width: 49%;display: inline-block;vertical-align: top;} .rc-button.radio li{width: auto;padding-right: 20px;} .rc-button.radio li:last-child{padding-right: 0;} .rc-button li:before{display: none;} .rc-button input, .application-form-popup .rc-button input{ background: rgba(255,255,255,1);border: 1px solid #a1a1a1;width: 20px;height: 20px;display: inline-block;vertical-align: middle;margin-right: 10px;} .rc-label, .field-checkboxlist > label{color: #321c00;line-height: 30px;font-size: 17px;font-weight: 500;} .inquiry-form select{ padding: 0 19px;font-size: 14px;color: #575757;width: 100%;height: 47px;border: 1px solid #a1a1a1;border-radius: 0;font-family: 'Gotham Book';text-transform: uppercase;} .inquiry-form input[type="file"], .inquiry-form .frm_element .column input[type="file"]{ font-size: 14px;color: #575757;width: 100%;border: 1px solid #a1a1a1;border-radius: 0;font-family: 'Gotham Book';padding: 12px 14px;background: #fff;} /*Zealous 2019/02/06 - SA Campaign Fixes*/ .contact-us-block.application-form-popup{margin-top: 0;margin-bottom: 0;} .contact-us-block.application-form-popup .left form .row .btn-submit{width: auto;} .application-form-popup .customSelectWrap{width: 100% !important;} .application-form-popup .customSelectWrap select{font-size: 15px !important;} .application-form-popup .customSelectWrap .customSelect{/*max-width: 345px; */width: 100%; border: 1px solid #a1a1a1; height: 47px; background: rgba(255,255,255,1); font-size: 14px; color: #575757; line-height: 45px; text-transform: uppercase; padding: 0 20px; font-family: 'Gotham Book';} .application-form-popup .customSelectWrap .customSelect:after{background: url(/application/themes/grootbos/images/down-arrow_fill.png); width: 10px; height: 8px; top: 19px; right: 20px; position: absolute; content: "";} .application-form-popup .customSelectWrap .customSelectInner{ overflow: hidden;white-space: nowrap;text-overflow: ellipsis;} .application-form-popup .left form{ position: relative;padding-top: 38px;overflow: initial;} .application-form-popup .alert{ position: absolute;top: -28px;font-size: 15px;line-height: 1.3;} .application-form-popup.contact-us-block .left h3{padding-right: 0;} /**Zealous 2019/04/02---------------proposed-page---------------*/ .proposed-page .landing-section.inner-banner-thin {height: calc(100vh - 330px);} .proposed-page .landing-section.inner-banner-thin .caption {top:0; right: 0; left: 0; margin: 0 auto; transform: none;} .proposed-page .caption h1, .proposed-page .caption .h1{margin-bottom: 15px;} .proposed-page .caption h2, .proposed-page .caption .h2 {line-height: 1.2;font-family: 'Trajan Pro';font-size: 22px;color: #fff;margin: 0 0 26px;} .proposed-page .inner-banne-bg{position: relative;} .proposed-page .inner-banne-bg .iteam h1, .proposed-page .inner-banne-bg .iteam .h1 {position: absolute; width: 100%;text-align: center; top:20%; right: 0; font-size: 34px;} .proposed-page .accomodation-block {padding-top:73px;padding-bottom: 35px;} .proposed-page .accomodation-block h2, .proposed-page .experience-page h2{font-size: 34px;color: #321c00;font-family: 'Trajan Pro';font-weight: 400;line-height: 1.4;margin: 0 0 10px;} .proposed-page .inner-banne-bg .iteam {height: 650px;} .stand-chance{position: relative; background-color: #a67b52;} .opacity-bg-img{position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0.2; width: 100%;height: 100%; object-fit: cover;} .stand-chance .container{padding:100px 15px; position: relative;} .stand-chance h2 {font-size: 34px;color: #fff;} .stand-chance p {color: #fff;} .stand-chance p a{color: #fff; text-decoration: underline;} .proposed-page .row{display: flex; flex-wrap: wrap;} .stand-chance .col-5{width: 45%;} .stand-chance .col-7{width: 55%;} .proposed-page .share-vid{background-color: #f9f0e3; padding:35px 0} .proposed-page .social-block a{margin: 2px;} .proposed-page .social-block a:hover{opacity: 0.7;} .proposed-page .share-vid-title{font-weight: 400; margin-bottom: 10px;} .proposed-page .col-3{max-width: 333px;} .proposed-page .col-9{max-width: 800px;} .proposed-page .share-vid p{margin-bottom: 0;} /*.proposed-page .shark-cage-diving-page h2{margin-bottom: 0;}*/ .inline-title {padding: 40px 0 0;} .proposed-page .inline-title h2{font-size: 34px; color: #321c00; display: inline-block; margin-bottom: 0;} .proposed-page .experience-page .heading-caption {padding: 10px 0 30px;} .amazing-diving{margin: 40px 0;} .amazing-diving .col-5{width: 43%; padding:25px 31px 50px 30px; background-color: #f5e2c9; border-bottom: 5px solid #b08f4f;} .amazing-diving .col-7{width: 57%;} .amazing-diving .days-till{font-size: 24px; margin-bottom:30px; text-transform: uppercase;font-family: 'Trajan Pro';} .amazing-diving h3, .amazing-diving .h3{font-size:30px; margin-bottom: 10px;} .amazing-diving .col-5 p{font-size:16px; margin-bottom: 20px;} .amazing-diving .col-5 .social-block{max-width:200px;margin:30px auto 0;} .amazing-diving .caption .play-video:not(.pulse-wave) i{margin-bottom:20px; font-size: 20px; font-weight: 600; text-transform: uppercase;} .amazing-diving .caption .play-video{width: 200px; text-align: center;} .amazing-diving .inner-banne-bg {height: 100%;} .amazing-diving .inner-banne-bg .iteam {height: 100%;} .amazing-diving .inner-banner .iteam:after {background-color: rgba(0,0,0, 0.3);} .amazing-diving .row{display: flex; flex-wrap: wrap;} .proposed-page .features-block .play-video:not(.pulse-wave) span{margin: 0 auto;} .proposed-page .features-block .inner-banner .caption{z-index: 999;position: static;transform: none;} .proposed-page .share-explore{display: flex; flex-wrap: wrap; align-content:space-between; align-items: flex-end; margin-bottom: 20px;} .proposed-page .share-explore .social-block{margin: 0;} .proposed-page .share-explore .btn-feature{margin-right: 0;} .proposed-page .block.coming .btn-red-border{line-height:38px; padding: 0 16px;} .proposed-page .btn-red-border{line-height:46px; background-color: transparent; border: 2px solid #a0410e; color: #a0410e;} .proposed-page .btn-red-border:hover{background-color:#a0410e; color:#fff;} .proposed-page .block.coming figure{background-color: #000;} .proposed-page .block.coming figure img{opacity: 0.3;} .proposed-page .block .text-caption{height: 100%;} .proposed-page .coming-soon-text{ border: 2px solid #fff;padding: 20px;width: 65%;text-align: center;} .proposed-page .coming-soon-text p{color:#fff;margin-bottom: 0;font-size: 19px;font-family: 'Gotham Book';} .proposed-page .features-block .container{display: flex; flex-wrap: wrap;} .proposed-page .features-block .block{float: none; overflow: hidden;} /* content list - video list b template */ .proposed-page .features-block .video-list-b{min-width: 48.5%} .proposed-page .features-block .video-list-b-center-button{display: flex;} @media (max-width: 640px){ .proposed-page .features-block .video-list-b{min-width: 100%} } /* aj changes */ .proposed-page .features-block figcaption {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 9;} .proposed-page .features-block .block .title {position: static;padding: 20px 20px 27px} .proposed-page .features-block .inner-banner .caption .play-video {display: block;} .proposed-page .coming-soon-text {max-width: 194px;width: 100%;margin: 0 auto;} .proposed-page .block.coming figure img {width: 100%;} .explore-and-win{margin: 40px 0;} .explore-and-win h3 {font-size: 34px;} .explore-and-win .col-12{background-color: #f9f0e3;} .explore-and-win .col-6{width: 50%;} .explore-and-win .col-6.theme-bg{background-color: #f5e2c9;} .explore-and-win .col-6.green-bg{background-color: #336531;} .explore-and-win .row > div{padding:35px;} .explore-and-win .green-bg h3 {color: #f5e2c9; margin-bottom: 20px;} .explore-and-win .theme-bg p{font-weight: 400; margin-bottom:30px; font-size: 15px;} .explore-and-win ol{margin: 0 0 15px 15px;} .explore-and-win ol li{font-weight: 400; margin-bottom: 10px; padding: 0 0 8px 20px;} .newsletter-form input {padding: 0 19px;font-size: 16px;color: #575757;width: 100%;height:55px;border-radius: 0;font-family: 'Gotham Book'; margin-bottom: 20px;} .newsletter-form input::placeholder {color: #534741;} .explore-and-win .col-6 .alignright {margin: 0;} .cb{ display: flex;flex-wrap: wrap;justify-content: space-between; margin-bottom:22px; margin-top: 7px;} .cb label {font-size: 14px; margin: 7px 0px;} .cb label input {display: none;} .cb label span {margin:0 10px -5px 0; height:18px;width:18px; display: inline-block;position: relative !important; background: #fbfcf9; border-radius:2px;position: absolute;top: -2px;left: 0;} .cb [type=checkbox]:checked + span:before {content: ''; position: absolute; width:16px; height:16px; top: 50%;left: 50%;transform: translate(-50%, -50%); background-image: url(/application/themes/grootbos/images/tick.png); background-repeat: no-repeat; background-position: center; background-size: 75%;} .proposed-page .btn-theme-border{line-height:46px; padding: 0 62px; background-color: #336531; border: 2px solid #f5e2c9; color: #f5e2c9; cursor: pointer; transition: 0.3s;} .proposed-page .btn-theme-border:hover{background-color:#f5e2c9; color:#336531;} .find-more-section{margin-top:30px; margin-bottom: 35px;} .find-content{background-position: center center;background-repeat: no-repeat;background-size: cover; text-align: center;padding: 50px 0;-webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.23);-moz-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.23);box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.23);margin: 0 0 26px;position: relative;} .find-more-section .top-caption, .find-more-section .make-buttons{z-index: 9;position: relative;} .find-more-section .top-caption h4, .find-more-section .top-caption .h4 {font-size: 38px;color: #fff;margin-bottom: 15px;font-weight: 400;line-height: 1.2;} .find-content:before {content: "";display: block;position: absolute;top: 0;bottom: 0;left: 0;right: 0;background: rgba(51,101,49, 0.7);} .proposed-page .hospitality-section:before{display: none;} .proposed-page .hospitality-section .h4{color: #0a0401;} .proposed-page .features-block{margin-bottom: 0;} @media (max-width: 1023px) and (min-width: 768px){ .proposed-page .caption h1, .proposed-page .caption .h1, .proposed-page .accomodation-block h2, .stand-chance h2, .proposed-page .experience-page h2, .proposed-page .inner-banne-bg .iteam h1, .proposed-page .inner-banne-bg .iteam .h1, .explore-and-win h3, .explore-and-win .green-bg h3, .find-more-section .top-caption h4, .find-more-section .top-caption .h4 {font-size: 28px !important;} .stand-chance .container {padding: 60px 15px;} /*.proposed-page .shark-cage-diving-page .inner-banne-bg .iteam {height: 400px;}*/ .proposed-page .inner-banne-bg .bheight1 {height: 400px;} .inline-title {padding: 50px 0 0;} .proposed-page .col-9 {max-width: 518px;margin-left: 30px;} .amazing-diving .days-till {font-size: 16px; margin-bottom: 10px;} .amazing-diving h3, .amazing-diving .h3 {font-size: 25px;} .amazing-diving .col-5 p {margin-bottom: 10px;} .amazing-diving .col-5 {padding: 25px;} .amazing-diving .col-5 .social-block {margin: 20px auto 0;} .proposed-page .block h2{font-size: 21px !important; line-height: 1;} .proposed-page .features-block .caption{top: 60%;} .proposed-page .inner-banner .play-video:not(.pulse-wave) span{width: 65px !important;height: 65px !important; font-size: 37px;} .proposed-page .inner-banner .play-video:not(.pulse-wave) span:before {font-size:35px !important; line-height:60px !important;} .proposed-page .share-explore .social-block {margin: 0px auto; text-align: center;} .proposed-page .share-explore .btn-feature {margin: 17px auto 0;} .proposed-page .coming-soon-text {padding: 10px;width: 100%;} .proposed-page .block.coming .btn-red-border {line-height: 30px;} .explore-and-win .row > div {padding: 22px;} .explore-and-win .green-bg h3 br{display: none;} .newsletter-form input{height: 45px;} .explore-and-win ol li {margin-bottom: 0;} .explore-and-win .theme-bg p {margin-bottom: 18px;} .proposed-page .btn-red-border, .proposed-page .btn-theme-border {line-height: 41px;} } @media (max-width: 767px) and (min-width: 641px){ .proposed-page .caption h1, .proposed-page .caption .h1, .proposed-page .accomodation-block h2, .stand-chance h2, .proposed-page .experience-page h2, .proposed-page .inner-banne-bg .iteam h1, .proposed-page .inner-banne-bg .iteam .h1, .explore-and-win h3, .explore-and-win .green-bg h3, .find-more-section .top-caption h4, .find-more-section .top-caption .h4, .award-section .top-caption h2, .explore-and-win .top-caption h2 {font-size: 22px !important;} .stand-chance .container {padding: 45px 15px;} /*.proposed-page .shark-cage-diving-page .inner-banne-bg .iteam {height: 400px;}*/ .proposed-page .inner-banne-bg .bheight1 {height: 400px;} .proposed-page .col-9 {max-width: 518px;margin-left: 30px;} .amazing-diving .days-till {font-size: 16px; margin-bottom: 10px;} .amazing-diving h3, .amazing-diving .h3 {font-size: 22px;} .amazing-diving .col-5 p {margin-bottom: 10px;} .amazing-diving .col-5 {padding: 25px;} .amazing-diving .col-5 .social-block {margin: 20px auto 0;} .proposed-page .block h2{font-size: 21px !important; line-height: 1;} .proposed-page .features-block .caption{top: 60%;} .proposed-page .inner-banner .play-video:not(.pulse-wave) span{width: 65px !important;height: 65px !important; font-size: 37px;} .proposed-page .inner-banner .play-video:not(.pulse-wave) span:before {font-size:35px !important; line-height:60px !important;} .proposed-page .share-explore .social-block {margin: 0px auto; text-align: center;} .proposed-page .share-explore .btn-feature {margin: 15px auto 0;} .proposed-page .coming-soon-text {padding:5px 10px;width: 100%;} .proposed-page .block.coming .btn-red-border {line-height: 30px;} .explore-and-win .row > div {padding:30px 20px;} .explore-and-win .green-bg h3 br{display: none;} .newsletter-form input{height: 40px; margin-bottom: 10px;} .explore-and-win ol li {margin-bottom: 0;} .explore-and-win .theme-bg p {margin-bottom: 18px;} .proposed-page .btn-red-border, .proposed-page .btn-theme-border {line-height: 41px;} .proposed-page .accomodation-block {padding-top: 45px;padding-bottom: 30px;} .stand-chance .col-5, .stand-chance .col-7, .amazing-diving .col-5, .amazing-diving .col-7 {width: 100%;text-align: center;} /*.proposed-page .shark-cage-diving-page h2 {font-size: 22px;}*/ .proposed-page .inline-title h2 {font-size: 22px;} .proposed-page .col-3 {width: 100%;text-align: center; margin-bottom: 15px;} .proposed-page .col-9 {max-width:100%;text-align: center; margin-left: 0;} .amazing-diving .inner-banne-bg .iteam {height:380px;} .proposed-page .block .text-caption .btn-feature {text-align: center;} .explore-and-win .col-6 {width: 100%;} .explore-and-win .col-6 .alignright {display: flex; justify-content: center; float: none;} .newsletter-form .cb{margin-bottom: 30px;margin-top: 0;} .explore-and-win h3, .explore-and-win h3{text-align: center;} .amazing-diving .caption .play-video:not(.pulse-wave) i{font-size: 16px;} .proposed-page .caption h2, .proposed-page .caption .h2 {font-size: 18px;} .side-logo-banner {max-width: 90px;} } @media (max-width: 640px) { .proposed-page .caption h1, .proposed-page .caption .h1, .proposed-page .accomodation-block h2, .stand-chance h2, .proposed-page .experience-page h2, .proposed-page .inner-banne-bg .iteam h1, .proposed-page .inner-banne-bg .iteam .h1, .explore-and-win h3, .explore-and-win .green-bg h3, .find-more-section .top-caption h4, .find-more-section .top-caption .h4, .award-section .top-caption h2, .explore-and-win .top-caption h2 {font-size: 22px !important;} .stand-chance .container {padding: 45px 15px;} /*.proposed-page .shark-cage-diving-page .inner-banne-bg .iteam {height: 400px;}*/ .proposed-page .inner-banne-bg .bheight1 {height: 400px;} .proposed-page .col-9 {max-width: 518px;margin-left: 30px;} .amazing-diving .days-till {font-size: 16px; margin-bottom: 10px;} .amazing-diving h3, .amazing-diving .h3 {font-size: 22px;} .amazing-diving .col-5 p {margin-bottom: 10px;} .amazing-diving .col-5 {padding: 25px;} .amazing-diving .col-5 .social-block {margin: 20px auto 0;} .proposed-page .block h2{font-size: 19px !important; line-height: 1;} .proposed-page .features-block .caption{top: 60%;} .proposed-page .inner-banner:not(.landing-section) .play-video:not(.pulse-wave) span{width: 65px !important;height: 65px !important; font-size: 37px;} .proposed-page .inner-banner:not(.landing-section) .play-video:not(.pulse-wave) span:before {font-size:35px !important; line-height:60px !important;} .proposed-page .share-explore .social-block {margin: 0px auto; text-align: center;display: block;width: 100%;} .proposed-page .share-explore .btn-feature {margin: 17px auto 0;} .proposed-page .coming-soon-text {padding:5px 10px;width: 100%;} .proposed-page .block.coming .btn-red-border {line-height: 30px;} .explore-and-win .row > div {padding:30px 20px;} .explore-and-win .green-bg h3 br{display: none;} .newsletter-form input{height: 40px; margin-bottom: 10px;} .explore-and-win ol li {margin-bottom: 0;} .explore-and-win .theme-bg p {margin-bottom: 18px;} .proposed-page .btn-red-border, .proposed-page .btn-theme-border {line-height: 41px;} .proposed-page .accomodation-block {padding-top: 45px;padding-bottom: 30px;} .stand-chance .col-5, .stand-chance .col-7, .amazing-diving .col-5, .amazing-diving .col-7 {width: 100%;text-align: center;} /*.proposed-page .shark-cage-diving-page h2 {font-size: 22px;}*/ .proposed-page .inline-title h2 {font-size: 22px;} .proposed-page .col-3 {width: 100%;text-align: center; margin-bottom: 15px;} .proposed-page .col-9 {max-width:100%;text-align: center; margin-left: 0;} .amazing-diving .inner-banne-bg .iteam {height:380px;} .proposed-page .block .text-caption .btn-feature {text-align: center;} .explore-and-win .col-6 {width: 100%;} .explore-and-win .col-6 .alignright {display: flex; justify-content: center; float: none;} .newsletter-form .cb{margin-bottom: 30px;margin-top: 0;} .explore-and-win h3, .explore-and-win h3{text-align: center;} .amazing-diving .caption .play-video:not(.pulse-wave) i{font-size: 16px;} .proposed-page .caption h2, .proposed-page .caption .h2 {font-size: 18px;} .proposed-page .landing-section.inner-banner-thin {height: 400px;} .proposed-page .block .title {padding-top:22px !important;} .proposed-page .features-block .block {max-width: 100%;} .side-logo-banner {max-width: 90px;} } /* fancybox upgrade css */ .fancybox-active {height: auto;overflow: hidden !important;width: auto;} .fancybox-active .fancybox-is-open .fancybox-bg {opacity: .8;} .fancybox-active .fancybox-button--zoom, .fancybox-active .fancybox-button--play, .fancybox-active .fancybox-button--thumbs {display: none !important;} .fancybox-detail #detail-popup {position: relative;background: #f9f9f9;color: #444;text-shadow: none;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;max-width: 470px;padding: 40px 30px 30px;} .fancybox-confirm .fancybox-stage .open-popup {background-image: none;background-color: #ffffff;height: auto;max-width: 1015px;width: 100%;padding: 65px 110px;} .fancybox-success.fancybox-confirm .fancybox-close-small {background: url(../images/close-icon.png) no-repeat;height: 33px;width: 33px;background-repeat: no-repeat;background-size: cover;} .inquiry-form {padding-bottom: 20px;} .inquiry-form .frm_element label {width: 100%;} .inquiry-form form .square-radio input[type=checkbox] {width: 18px; height: 18px;} .inquiry-form form .square-radio .round-radio {display: flex; justify-content: flex-start; align-items: center;} .inquiry-form form .square-radio .round-radio-label {font-size: 17px; width: 100%; margin-left: 10px} div.iti--container {z-index: 99999;} /* Sticky CTA*/ .sticky-explorer{position: fixed; bottom: 0; z-index: 9999; width: 100%; background-color: #F5E2C9; text-align: center; box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.15); border-top: 1px solid #A67C52; padding: 6px 0; } .sticky-explorer-inner{display: flex; justify-content: space-between; align-items: center; max-width: 960px; } .sticky-explorer p{display: inline-block; vertical-align: middle; font-size: 14px; color: #2A1A00; font-weight: 500; margin: 0 15px 0 0; letter-spacing: 1.2px; background: #ffffff } .close-btn span{width: 26px; height: 26px; display: inline-flex; justify-content: center; align-items: center; margin: 0; border-radius: 100%; border: 1px solid #2A1A00; text-align: center; letter-spacing: 0; line-height: 1; font-size: 14px; margin-right: 17px; transition: border-color 0.3s; } .close-btn:hover span{border-color: #b5da9a; } .sticky-explorer .btn{vertical-align: middle; margin: 0 15px 0 0; padding: 3px 10px; border-radius: 2px; background-color: #A67C52; border-color:#F5E2C9; line-height: 33px;} .close-btn{margin: 0; display: inline-block; vertical-align: middle; color: #2A1A00;} /* FGM Sticky CTA*/ .container-sm { width: 100%; max-width: 61.26rem; margin-left: auto; margin-right: auto; padding-left: 0.94rem; padding-right: 0.94rem; } .fg-sticky-explorer{position: fixed; bottom: 0; left: 0; z-index: 9999; width: 100%; background-color: #59755de1; box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.15); padding: 6px 0; } .fg-sticky-explorer.pink{ background-color: #ce5868e1; } .fg-sticky-explorer.brown{ background-color: #9f7c5ee1; } .fg-sticky-explorer h2{vertical-align: middle; color: #fff; font-size: 1.75rem; font-weight: 500; margin: 45px 0 15px 0;; letter-spacing: 1.2px; } .fg-sticky-explorer p{vertical-align: middle; font-size: 18px; color: #fff; margin: 15px 0 15px 0; letter-spacing: 1.2px; } .fg-sticky-close-btn span{width: 26px; height: 26px; display: inline-flex; justify-content: center; align-items: center; margin: 0; border-radius: 100%; border: 1px solid #fff; text-align: center; letter-spacing: 0; line-height: 1; font-size: 14px; transition: border-color 0.3s; } .fg-sticky-close-btn:hover span{border-color: #000; } .fg-sticky-explorer .btn{ margin-bottom: 15px; display: inline-block; padding: 0.82rem 1.88rem; vertical-align: top; color: #ffffff; font-size: 1rem; line-height: 1.5; text-align: center; text-transform: uppercase; text-decoration: none; border: 1px solid #ffffff; border-radius: 0px; font-weight: 100; background-color: transparent; transition: background-color 0.3s ease 0s, color 0.3s ease 0s; } .fg-sticky-close-btn{position: absolute; top: 5px; right: 5px; margin: 0; display: inline-block; vertical-align: middle; color: #fff !important;} @media (max-width: 640px) { .fg-sticky-close-btn{ right: 50px; } .fg-sticky-explorer-inner { padding-right: 25px; } .fg-sticky-explorer .btn{ margin-top: 1rem; line-height: 1rem; font-size: 14px; } } /* Villa USP Module*/ /* alignment-classes */ .img-block {background-size: cover;background-repeat: no-repeat;background-position: center center;} .single-culinary.right-img .inner-content {right: 8.33%;} .single-culinary.left-img .inner-content {left: 8.33%;order: 1;} .single-culinary.left-img .img-block {order: 2;} /* culinary-bottom */ .culinary-bottom {padding-top: 70px;} .culinary-bottom .top-caption {margin-bottom: 60px;} .culinary-bottom h2 {margin-bottom: 10px;} .culinary-bottom h6 {margin-bottom: 0;font-size: 14px;font-family: 'Gotham Book';font-weight: 700;color: #000000;margin-bottom: 15px;text-transform: uppercase;} .culinary-bottom .single-culinary {display: flex;flex-wrap: wrap;} .culinary-bottom .single-culinary .img-block {width: 50%;min-height: 410px;position: relative;} .culinary-bottom .single-culinary .content-block {width: 50%;padding: 55px 0 75px;} .culinary-bottom .single-culinary .content-block p {margin-bottom: 26px;} .culinary-bottom .single-culinary.left-img .content-block {padding-right: 45px;} .culinary-bottom .single-culinary.right-img .content-block {padding-left: 45px;} .typed-block {background-color: #faf0e4;} .tick-block {display: flex;flex-wrap: wrap;align-items: flex-start;} .tick-block .left {width: calc(62% - 30px);margin: 0 30px 0 0;} .tick-block .right {width: 38%; margin: 0; max-width: none;} .tick-block .right ul li {padding-bottom: 15px;} .activity-type {display: flex;flex-wrap: wrap;padding: 0 15px;} .activity-type .activity-list {width: 33.33%;padding: 0 15px 33px;} .activity-type .activity-list figure {border-radius: 3px;overflow: hidden;position: relative;margin-bottom: 14px;} .activity-type .activity-list figure img {width: 100%;} .activity-type .activity-list figure:before {position: absolute;content: "";height: 100%;width: 100%;left: 0;top: 0;background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 35%, rgba(0,0,0,0) 100%);background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 35%,rgba(0,0,0,0) 100%);background: linear-gradient(to bottom, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 35%,rgba(0,0,0,0) 100%);pointer-events: none;} .activity-type .activity-list figcaption {position: absolute;top: 20px;left: 20px;font-size: 24px;color: #fff;font-family: 'Trajan Pro';font-weight: 500;} .activity-type .activity-list p {font-size: 14px;} .activity-type .activity-list p:last-child {margin-bottom: 0;} /* our logo panel 21-11-19 */ .text-left{text-align: left;} .our-logo-panel{padding: 50px 0;/*margin: 0 0 26px;*/} .our-logo-panel .left-part{width: 40%; display: inline-block;vertical-align: top; padding-right: 70px;} .our-logo-panel .left-part .top-caption{margin-bottom: 15px;} .our-logo-panel .right-part{width: 59%;display: inline-flex;vertical-align: top; flex-wrap: wrap;} .our-logo-panel .logo-box{display: inline-flex; flex-wrap: wrap; flex: 1 0 33.33%;padding-right: 5px;} .our-logo-panel .logo-box img{width: 150px;margin: auto;} .our-logo-panel .logo-box:last-child{padding-right: 0;} .our-logo-panel .logo-box figure{padding: 20px; display: flex; align-items: center; justify-content: center; width: 100%; border: 2px solid #f6f3f1; position: relative;} .our-logo-panel .logo-box:not(:last-child) figure::after{content: ""; width: 1px; background-color: #f2f1f0; position: absolute; right: -5px; top: -2px; bottom: -2px;} .our-logo-panel .logo-box .logo-title{text-align: center; margin-top: 12px; color: #000000; font-weight: 400; max-width: 230px;font-size: 14px; text-decoration: underline;} .our-logo-panel .logo-box a:hover, .our-logo-panel a.logo-box:hover .logo-title{color:#a66c23;} /* custom 10-02-2020*/ .our-story-banner .bottom-logo {position: absolute; top: 80%; left: 50%; margin: auto; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); max-width: 910px; text-align: center; width: 100%;} /* custom 04-03-2020*/ .garder-lodge-block.no-space, .lodge-block-content.no-space, .lodge-block-content.no-space, .lodge-block-content.no-space .overview.suits, .lodge-block-content.no-space .overview{ padding-top: 0; padding-bottom: 0; margin-bottom: 0; margin-top: 0; } /* offer-popup 2020/09/28 */ .offer-popup { display: none; } .fancybox-content.offer-popup { /*background: url(/application/themes/grootbos/images/popup.png);*/ border-radius: 3px; width: 100%; max-width: 800px; margin: auto; max-height: calc(100% - 40px); background-color: transparent; padding: 50px 30px; text-align: center; background-size: cover; } .offer-popup-logo { padding-bottom: 20px; max-width: 250px; margin: auto; } .offer-popup .btn { margin-left: 5px; margin-right: 5px; margin-bottom: 15px; min-width: 192px; } .offer-popup .smalltext { text-align: center; font-family: 'Gotham Book'; margin-bottom: 25px; } .fancybox-offer .fancybox-close-small { background: url(/application/themes/grootbos/images/close_black.png) no-repeat; position: absolute; top: 12px !important; right: 12px !important; width: 28px; height: 28px; background-size: 27px; font-size: 0; color: transparent; } @media (min-width: 768px) { .offer-popup .largetext { font-size: 27px; } } @media (max-width: 768px) { .offer-popup .smalltext .span{ display: block; } .fancybox-content.offer-popup{padding:50px 20px 30px 20px;} .offer-popup-logo{min-width: 200px;} } .floating-right { position: fixed; top: 30%; right: 22px; transform: rotate(-90deg); transform-origin: right; z-index: 999; background-color: #fff; padding: 2px; border-radius: 3px; } @media (max-width: 640px) { .floating-right { right: 19px; } .floating-right .btn { padding: 2px 20px; line-height: 32px; } } /* notice bar 20210525*/ .bg-primary { background: #002400; } .bg-secondary { background: #a0410d; } .bg-golden { background: #b08f4f; } .bg-green { background: #336531; } .noticebar { text-align: center; padding: 40px 0; } .noticebar p { margin-bottom: 0; } .noticebar .container { max-width: 768px; } .noticebar * { color: #ffffff; } .text-animate { animation: fadeInUp 0.5s linear infinite; opacity: 0.20; } @keyframes fadeInUp { 0% { opacity: 0.20; } 25% { opacity: 0.40; } 50% { opacity: 0.60; } 75% { opacity: 0.80; } 100% { opacity: 1; } } /* Villa Style - 20220318 */ .item-wrapper {display: flex;flex-wrap: wrap;margin: 0 -15px;} .item-wrapper .iteam {width: 33.33%;padding: 0 15px;margin-bottom: 30px;} .item-wrapper .item-shadow {box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.1);height: 100%;} .item-wrapper .iteam figure img {width: 100%;} .item-wrapper .description {text-align: center;padding: 15px;} /* ----- 2. Tablet ≥768px and ≤1023 ----- */ @media (min-width:768px) and (max-width:1023px) { .item-wrapper {margin: 0px -10px;} .item-wrapper .iteam {padding: 0px 10px;} .item-wrapper .description {padding: 10px;} } /* ----- 3. Medium devices ≤767px ----- */ @media (max-width:767px) { .item-wrapper {margin: 0px -10px;} .item-wrapper .iteam {padding: 0px 10px;width: 50%;} .item-wrapper .description {padding: 10px;} } /* ----- 4. Small devices ≤640px ----- */ @media (max-width:640px) { .item-wrapper {margin: 0;} .item-wrapper .iteam {padding: 0px;width: 100%;max-width: 320px;} } /* Villa Style - 20230228 */ /* culinary-top */ .culinary-top .top-caption {padding: 50px 0 24px;margin-bottom: 0;} .culinary-top .top-caption h1 {margin-bottom: 0;font-size: 34px;} .culinary-top .single-culinary {display: flex;background-color: #fbf1e4;} .culinary-top .single-culinary .img-block {min-height: 700px;width: 72%;margin: 0;} .culinary-top .single-culinary .inner-content {width: 28%;text-align: left;margin: 0;position: relative;display: flex;align-items: center;} .culinary-top .single-culinary .content-block {background-color: #fff;padding: 50px 30px;} .culinary-top .single-culinary .content-block h6 {margin-bottom: 0;font-size: 14px;font-family: 'Gotham Book';font-weight: 700;color: #000000;margin-bottom: 15px;text-transform: uppercase;} .culinary-top .single-culinary .content-block h2 {font-size: 22px;color: #000;margin-bottom: 7px;} .culinary-top .single-culinary .content-block p {color: #534741;font-size: 16px;line-height: 1.5;} .culinary-top .single-culinary .content-block p:last-child {margin-bottom: 0;} /* alignment-classes */ .img-block {background-size: cover;background-repeat: no-repeat;background-position: center center;} .single-culinary.right-img .inner-content {right: 8.33%;} .single-culinary.left-img .inner-content {left: 8.33%;order: 1;} .single-culinary.left-img .img-block {order: 2;} .culinary-top .single-culinary .img-block {position: relative;} .culinary-top .single-culinary .content-block {position: relative;z-index: 99;} /* ----- 2. Tablet ≥768px and ≤1023 ----- */ @media (min-width:768px) and (max-width:1023px) { /*--------- culinary-and-wine-experience page ---------*/ #content-area {margin-top: 0;} .culinary-top .top-caption {padding: 30px 0 24px;} .culinary-top .top-caption h1 {font-size: 28px;} .culinary-top .single-culinary .img-block {min-height: 450px;width: 60%;} .culinary-top .single-culinary .inner-content {width: 40%;} .culinary-bottom .top-caption {margin-bottom: 30px;} .single-culinary.right-img .inner-content {right: 5%;} .culinary-top .single-culinary .content-block {padding: 30px 20px;} } /* ----- 3. Medium devices ≤767px ----- */ @media (max-width:767px) { /*--------- culinary-and-wine-experience page ---------*/ #content-area {margin-top: 0;} #wrapper {padding-top: 48px;} .culinary-top .top-caption {padding: 30px 0 24px;} .culinary-top .top-caption h1 {font-size: 24px;} .culinary-top .single-culinary {flex-wrap: wrap;} .culinary-top .single-culinary .img-block {min-height: 300px;width: 100%;} .culinary-top .single-culinary .inner-content {width: 100%;} .single-culinary.right-img .inner-content {right: 0%;} .single-culinary.left-img .inner-content {left: 0%;order: 2;} .culinary-top .single-culinary .content-block {padding: 30px 15px;} .culinary-top .single-culinary .content-block h2 {font-size: 18px;} .culinary-bottom {padding-top: 30px;} .culinary-bottom .top-caption {margin-bottom: 30px;} .culinary-bottom .top-caption h2 {font-size: 24px;} .culinary-bottom .single-culinary .img-block {width: 100%;min-height: 300px;} .culinary-bottom .single-culinary .content-block {width: 100%;padding: 30px 0;} .single-culinary.left-img .content-block {order: 2;} .culinary-bottom .single-culinary.left-img .content-block {padding-right: 0;} .culinary-bottom .single-culinary.right-img .content-block {padding-left: 0;} .culinary-bottom .single-culinary .content-block p {margin-bottom: 15px;} } .mb-0-i{ margin-bottom: 0 !important; }