File manager

File manager - Edit - /home/asiatechinc/public_html/asiatech-websites/hotelsanctuaryresort.com/system/css/global.css

Back
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,700,800\|Poly:400,400italic); * { margin:0; padding:0; text-decoration:none; list-style:none; outline:none; } html, body { width:100%; height:100%; } #container { padding-top:110px; position:relative; background:#FFF; } .centre { max-width:1200px; margin:auto; padding:0 50px; position:relative; } a img { border:none; } .box img{ width: 100%; } /****************** 1.0 - Navigation *****************/ .usp { margin:45px 0; } .usp .box1 img{ width:100%; } .usp .box1 { width:100%; padding:15px 0; } .usp .box1 i { width:70px; height:70px; font-size:22px; line-height:66px; text-align:center; border:2px solid; border-radius:100px; box-sizing:border-box; margin:0 30px 0 0; float:left; } .usp .box1 p { margin:0; } .usp h3 { margin-bottom:3px; font:700 16px/22px 'Open Sans', sans-serif; letter-spacing:.5px; text-transform:none; } .usp .box1:after, .usp:after { content:""; display:block; clear:both; } .fullwidth .usp { margin:45px 0 0; } .fullwidth .usp .box1 { width:24.33%; padding:0 15px; float:left; box-sizing:border-box; } .fullwidth .usp .box1:first-child { padding:0 35px 0 0; } .fullwidth .usp .box1:last-child { padding:0 0 0 35px; } .fullwidth .usp .box1 i { margin:0 0 20px; float:none; } #nav { width:100%; height:110px; position:fixed; background:#FFF; box-shadow:0 0 1px rgba(0,0,0,.2),0 0 15px rgba(0,0,0,.15); z-index:100; -webkit-transform:translateZ(0); } #nav .centre { height:100%; } #nav .logo { position:absolute; top:50%; left:50px; transform:translate(0,-50%); -webkit-transform:translate(0,-50%); -ms-transform:translate(0,-50%); } #nav nav { position:absolute; top:50%; right:240px; margin-top:-20px; } #nav nav li { float:left; position:relative; } #nav nav li.mobile { display:none; } #nav nav li a { height: 40px; padding: 0 10px; font: 13px / 40px 'Open Sans', sans-serif; font-weight: 600; color: #000; letter-spacing: .8px; text-transform: uppercase; display: block; position: relative; } #nav nav li a:after { content:""; width:calc(100% - 24px); height:2px; position:absolute; bottom:7px; left:12px; } #nav nav li.active a { font-weight:800; opacity:1; } #pull { width:25px; font-size:25px; position:absolute; top:7px; right:236px; display:none; cursor:pointer; } .hover #nav .logo:hover { opacity:.5; } .hover #nav nav li:hover a:after { background:rgba(0,0,0,.1); } / 1.1 - Drop Downs / #nav nav li ul { position:absolute; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,.1); display:none; } #nav nav li ul li { float:none; } #nav nav li ul li a { min-width:150px; height:44px; padding:0 14px; font-size:16px; line-height:44px; color:#FFF; font-weight:600 !important; white-space:nowrap; text-transform:none; background:#555; border-bottom:1px solid #424242; cursor:pointer; } #nav nav li ul li a i { font-size:11px; position:absolute; top:50%; right:12px; margin-top:-5px; color:rgba(255,255,255,.2); } #nav nav li ul li:last-of-type a { border:none; } #nav nav li ul li a:after { display:none; } #nav nav li ul li ul { top:0; left:100%; } #nav nav li ul li ul li a { background:#484848; border-bottom:1px solid #383838 !important; } #nav nav li ul li ul li:last-of-type a { border:none !important; } #nav nav li ul li.active a, .hover #nav nav li ul li:hover a { background:#484848; } #nav nav li ul li ul li.active a { background:#404040 !important; } .hover #nav nav li ul li ul li a:hover { background:#404040; } / 1.2 - Languages / #language { max-height:30px; margin-top:-15px; position:absolute; top:50%; right:240px; border-radius:4px; box-shadow:1px 1px 0 rgba(0,0,0,.12); overflow:hidden; } #language li a { width:22px; height:20px; padding:10px 0 0 32px; font:bold 10px/10px 'Open Sans', sans-serif; color:#000; letter-spacing:1px; display:block; background:#EEE; border-top:1px solid #D5D5D5; } #language li:first-child a { background:#EEE !important; border:none; box-shadow:1px 1px 0 rgba(0,0,0,.12); cursor:default; } #language li a:before { content:""; width:14px; height:11px; position:absolute; left:10px; } #language li.en a:before { background:url(../images/flag-en.png); } #language li.cn a:before { background:url(../images/flag-cn.png); } #language li.fr a:before { background:url(../images/flag-fr.png); } #language li.de a:before { background:url(../images/flag-de.png); } #language li.it a:before { background:url(../images/flag-it.png); } #language.langdrop { max-height:200px !important; } #language:hover { max-height:200px; } .hover #language li a:hover { background:#DDD; } / 1.3 - Book Button / #nav .book { width:160px; height:50px; font:800 12px/46px 'Open Sans', sans-serif; letter-spacing:1px; text-transform:uppercase; display:block; border-radius:5px; box-sizing:border-box; position:absolute; top:50%; right:50px; margin-top:-25px; overflow:hidden; border:2px solid } #nav .book span { width:100%; text-indent:15px; position:relative; display:inline-block; } #nav .book span:before { color:#FFF; position:absolute; left:0; top:100%; content:attr(data-hover); } #nav .book i { font-size:16px; position:absolute; top:15px; right:15px; } .hover #nav .book:hover span { transform:translateY(-100%); -webkit-transform:translateY(-100%); -ms-transform:translateY(-100%); } .hover #nav .book:hover i { color:#FFF; } / 1.4 - Fixed Navigation / #container.scroll { padding-top:80px; } #nav.scroll { height:80px; } /***************** 2.0 - Global Styling & Interface *****************/ .ui-tooltip { height:30px; padding:0 10px; font:bold 12px/30px 'Open Sans'; color:#333; letter-spacing:.2px; box-shadow:1px 1px 0 rgba(0,0,0,.15); background:#FFF; position:absolute; z-index:999999; border-radius:4px; } / 2.1 - Header / #header { width:100%; background:url(../images/banner.jpg) top center; background-size:100%; position:relative; } #header:before { content:""; width:100%; height:100%; position:absolute; top:0; opacity:.9; } #header .h1 { width:100%; padding:57px 0 122px; text-align:center; position:relative; } #header h1 { font:italic 40px/45px 'Poly', georgia; color:#FFF; display:inline-block; } #header .h1 span { padding:0 50px 7px; display:block; } #header .h1 .tagline { padding:10px 50px 0; font:800 12px/18px 'Open Sans', sans-serif; letter-spacing:1.5px; text-transform:uppercase; border-top:1px solid rgba(255,255,255,.25); } / 2.2 - Slideshow / #slideshow { margin:0 0 62px; position:relative; } #slideshow:before { content:""; width:calc(100% + 10px); height:calc(100% + 10px); background:#FFF; border:1px solid #E5E5E5; position:absolute; top:-6px; left:-6px; } #slideshow .caroufredsel_wrapper { background:#666; } #slideshow .item { position:relative; } #slideshow .item span { padding:8px 12px 10px; font:bold 12px/16px 'Open Sans', sans-serif; color:#FFF; letter-spacing:.7px; background:rgba(40,40,40,.8); border-radius:5px; position:absolute; bottom:20px; left:20px; } #slideshow img { width:100%; height:auto; display:block; position:relative; } #slideshow .nav { height:40px; width:65px; background:#FFF; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,.1); position:absolute; bottom:40px; right:50px; opacity:0; z-index:2; } #slideshow .nav a { width:50%; height:100%; font-size:15px; line-height:40px; color:#000; text-align:center; float:left; display:block; cursor:pointer; opacity:.4; } #content #slideshow { margin:33px 0 38px; } .hover #slideshow:hover .nav { opacity:1; bottom:50px; } .hover #slideshow .nav a:hover { opacity:1; } / 2.3 - Buttons / .button, form button { height:50px; padding:0 25px; font:800 12px/50px 'Open Sans', sans-serif; color:#FFF; letter-spacing:1.2px; text-align:center; text-transform:uppercase; display:inline-block; border-radius:5px; overflow:hidden; } .button span, form button span { position:relative; display:inline-block; } .button span:before, form button span:before { position:absolute; top:100%; content:attr(data-hover); } form button { padding:0; cursor:pointer; border:none; } .hover .button:hover, .hover form button:hover { background:#000; } .hover .button:hover span, .hover form button:hover span { transform:translateY(-100%); -webkit-transform:translateY(-100%); -ms-transform:translateY(-100%); } / 2.4 - List Items (Rooms & Specials) / .list { margin-bottom:70px; position:relative; } .list .item { position:relative; } .list .item a { width:100%; height:100%; padding:40px; color:#FFF; display:block; position:absolute; top:0; left:0; box-sizing:border-box; } .list .item .details { width:400px; height:100%; font:15px/25px 'Open Sans', sans-serif; text-align:center; letter-spacing:.4px; position:absolute; top:0; right:0; z-index:1; } .list .item .details { position:relative; z-index:1; } .list .item .details .title { margin-bottom:15px; font:bold 22px/30px 'Open Sans', sans-serif; text-transform:none; letter-spacing:0; } .list .item .details .title span { margin-top:2px; font:bold 14px/22px 'Open Sans', sans-serif; letter-spacing:1px; text-transform:uppercase; display:block; } .list .item .details:before { content:""; width:100%; height:100%; position:absolute; top:0; right:0; opacity:.9; } .list .item .details .button { width:150px; padding:0; box-sizing:border-box; position:absolute; bottom:50px; left:50%; margin-left:-75px; } .list .item img { width:100%; /height:auto;/ display:block; position:relative; } .hover .list .item .details:hover .button { background-color:#FFF; } .hover .list .item .details:hover .button span, .hover #rooms.list.grid .item .container:hover .button span { transform:translateY(-100%); -webkit-transform:translateY(-100%); -ms-transform:translateY(-100%); } .hover .list .item.listhover:hover img { transform:scale(1.04); } /* 2.5 - Check Rates Banner / #check { width:100%; height:55px; margin-top:-55px; position:relative; z-index:10; } #check .centre { height:100%; padding:0; background:#000; border-radius:5px 8px 0 0; } #check .field { width:17%; height:55px; border-right:1px solid #333; box-sizing:border-box; float:left; position:relative; } #check .field input, #check .field select { width:100%; height:55px; font:11px/55px 'Open Sans', sans-serif; color:#FFF; text-indent:20px; text-transform:uppercase; letter-spacing:1px; border:none; background:none; cursor:pointer; position:relative; z-index:2; } #check .field select { text-indent:15px; } #check .field select option { color:#000; } #check ::-webkit-input-placeholder { color:#FFF; } #check .field i { font-size:16px; color:#666; position:absolute; margin-top:20px; right:20px; z-index:1; } #check .field:last-of-type { border:none; } #check .field select { display:none; } #check button { width:15%; height:55px; line-height:55px; background:#333; border-radius:0 5px 0 0; } .hover #check .field:hover i { color:#FFF; } .hover #check button:hover { box-shadow:1px -1px 0 rgba(0,0,0,.1); } / 2.6 - Select Boxes / .selectboxit-container { width:100%; position:relative; display:inline-block; vertical-align:top; height:100%; float:left; z-index:2; } .selectboxit-container { font:12px 'Open Sans', sans-serif; -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:-moz-none; -ms-user-select:none; -o-user-select:none; user-select:none; outline:none; white-space:nowrap; } .selectboxit-container span i { display:none; } .selectboxit-container .selectboxit { width:100% !important; height:100%; cursor:pointer; display:block; overflow:hidden; position:relative; } .selectboxit-container span, .selectboxit-container .selectboxit-options a { height:40px; line-height:40px; display:block; } .selectboxit-container span { height:100%; font:11px/55px 'Open Sans', sans-serif; color:#FFF; text-transform:uppercase; letter-spacing:1px; } .selectboxit-option { border-bottom:1px solid #DDD; } .selectboxit-option-last { border:none; } .selectboxit-container .selectboxit:focus { outline:0; } .selectboxit-text { text-indent:20px; } .selectboxit-container .selectboxit-options { -moz-box-sizing:border-box; box-sizing:border-box; min-width:100% !important; width:100% !important; margin:0; padding: 0; list-style:none; position:absolute; overflow-x:hidden; overflow-y:auto; cursor:pointer; display:none; z-index:999999; text-align:left; border:none; border-top:1px solid #E5E5E5; background:#EEE; letter-spacing:.4px; } .selectboxit-option .selectboxit-option-anchor { padding:0 20px; } .selectboxit-option-icon-container { float:left; } .selectboxit-list { box-shadow:1px 1px 0 rgba(0,0,0,.12); } .selectboxit-list > .selectboxit-focus > .selectboxit-option-anchor { background:#DDD; } / 2.7 - Date Picker / .ui-datepicker { background:#EEE; width:800px !important; font:14px/20px 'Open Sans', sans-serif; float:left; display:none; z-index:999999 !important; } .ui-datepicker { position:relative; z-index:2; } .ui-datepicker-group { width:50%; float:left; } .ui-datepicker-header { position:relative; background:#333; height:55px; } .ui-datepicker-title { font:bold 16px/53px 'Open Sans', georgia !important; color:#FFF; letter-spacing:.5px; } .ui-datepicker-group-first .ui-datepicker-header { border-right:1px solid #222; } .ui-datepicker .ui-datepicker-title { font-size:16px; font-weight:bold; line-height:28px; text-align:center; } .ui-datepicker table { width:100%; margin:0; padding:15px 28px 28px 28px; } .ui-datepicker-group-first table { border-right:1px solid #DDD; } .ui-datepicker th { width:25px; padding:5px 5px 20px; font-size:12px; letter-spacing:1px; text-transform:uppercase; color:#666; } .ui-datepicker td span, .ui-datepicker td a { display:block; padding:13px 5px; text-decoration:none; } .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { font-size:14px; background:#FFF; color:#666; text-align:center; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { font-size:18px; color:#FFF; font-weight:bold; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.2); } .ui-widget-header .ui-state-hover { opacity:0.25; cursor:pointer; } .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity:0.25; cursor:default; } .ui-icon { text-indent:-9999px; display:block; } .ui-datepicker .ui-datepicker-prev .ui-icon:before { content:"\f190"; width:100%; height:100%; font-size:20px; font-weight:normal; color:#FFF; text-indent:0; font-family:FontAwesome; position:absolute; top:0; left:0; } .ui-datepicker .ui-datepicker-next .ui-icon:before { content:"\f18e"; width:100%; height:100%; font-size:20px; font-weight:normal; color:#FFF; text-indent:0; font-family:FontAwesome; position:absolute; top:0; left:0; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top:17px !important; } .ui-datepicker .ui-datepicker-prev { left:15px; z-index:3; } .ui-datepicker .ui-datepicker-next { right:30px; z-index:3; } @media only screen and (min-width:1200px) { .ui-datepicker { margin-top:-195px !important; margin-left:-400px !important; box-shadow:1px 1px 0 rgba(0,0,0,.12), 0 0 0 1000px rgba(30,30,30,.6); position:fixed !important; top:50% !important; left:50% !important; } } /****************** 3.0 - Content *****************/ main { font:15px/25px 'Open Sans', sans-serif; color:#000; letter-spacing:.4px; background:top left repeat-x; } main .centre { padding:50px 50px; } main .centre:after { content:""; clear:both; display:block; } main h1, main h2 { margin-bottom:15px; font:600 22px/30px 'Open Sans', sans-serif; text-transform:uppercase; letter-spacing:1.2px; position:relative; } main h1 strong, main h2 strong { font-weight:800; } main h3 { margin-bottom:28px; font:700 16px/26px 'Open Sans', sans-serif; text-transform:uppercase; letter-spacing:1px; } main p { margin:0 0 15px; } main p.fine { font-size:12px; } main p a, main p a i, main ul a { font-weight:bold; border-bottom:1px solid #E5E5E5; } main p.credit { margin:-20px 0 38px; padding:7px 12px 8px; background:#EEE; border-radius:5px; display:inline-block; box-shadow:1px 1px 0 rgba(0,0,0,.12); } main p.credit a { border-color:#DDD; } main p.credit i { margin-right:2px; font-size:16px; position:relative; top:2px; } main hr { margin-bottom:30px; border:1px solid #FFF; border-bottom:1px solid #E5E5E5; } main ul { margin-bottom:10px; } main ul li { list-style:circle; } main ul ul { margin-left:18px; } main table { max-width:100%; margin:15px 0; background:#F5F5F5; box-shadow:1px 1px 0 rgba(0,0,0,.12); border-radius:5px; overflow:hidden; border-collapse:collapse; position:relative; } main table:before { content:""; width:100%; height:5px; position:absolute; top:0; left:0; z-index:1; } main table td, main table th { padding:12px 30px; background:#F5F5F5; } main table th { border: 1px solid #ec1c247a;padding:22px 30px 17px; font:800 14px/20px 'Open Sans', sans-serif; letter-spacing:1.2px; text-transform:uppercase; background:#FFF; position:relative; } main table th:before { content:""; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.2; } main table tr:nth-child(odd) td {border: 1px solid #ec1c247a; background:#EEE; } main blockquote { width:40%; margin:0 25px 25px -30px; font:bold 25px/30px 'Open Sans', sans-serif; float:left; } #content { margin:0 0 -38px; } #content .button { margin-top:5px; margin-bottom:30px; } .fullwidth main { text-align:center; } .fullwidth main h1 { margin-top:-8px; } .fullwidth main table { margin-left:auto; margin-right:auto; } .hover main p a:hover, .hover main p a:hover i, .hover main ul a:hover { color:#000; } .hover main ul.sitemap a:hover { color:#000; } / 3.1 - USP Boxes / .usp { margin:45px 0; } .usp .box { width:100%; padding:15px 0; } .usp .box i { width:70px; height:70px; font-size:22px; line-height:66px; text-align:center; border:2px solid; border-radius:100px; box-sizing:border-box; margin:0 30px 0 0; float:left; } .usp .box p { margin:0; } .usp h3 { margin-bottom:3px; font:700 16px/22px 'Open Sans', sans-serif; letter-spacing:.5px; text-transform:none; } .usp .box:after, .usp:after { content:""; display:block; clear:both; } .fullwidth .usp { margin:45px 0 0; } .fullwidth .usp .box { width:50%; padding:0 15px; float:left; box-sizing:border-box; } .fullwidth .usp .box .rooms{ border: 1px solid #000; padding: 20px; background-color: #8c390b; margin-bottom:20px; } .fullwidth .usp .box .rooms h3{ color:#fff; } .fullwidth .usp .box .rooms p{ color:#fff; } /.fullwidth .usp .box:first-child { padding:0 35px 0 0; } .fullwidth .usp .box:last-child { padding:0 0 0 35px; } .fullwidth .usp .box i { margin:0 0 20px; float:none; }/ / 3.2 - Feature List / #featurelist p{ font-family: 'Open Sans'; text-align: center; margin-bottom: 25px; } #featurelist { width:100%; text-align:left; background:#EEE url(../images/fadeback.jpg); background-size:100% 100%; position:relative; box-shadow:0 1px 0 rgba(0,0,0,.07),inset 0 1px 0 0 rgba(0,0,0,0.05),inset 0 20px 10px -17px rgba(0,0,0,0.05); z-index:1; } #featurelist .centre { z-index:1; } #featurelist h2 { padding-top:15px;margin:5px 0 15px; font:italic 40px/45px 'Poly', georgia; text-align:center; letter-spacing:-.3px; text-transform:none; } #featurelist #slideshow:before { background:rgba(255,255,255,.2); border-color:rgba(0,0,0,.12); } .featurelist { box-shadow:1px 1px 0 rgba(0,0,0,.1); border-radius:5px; overflow:hidden; } .feature { width:100%; margin-bottom:1px; padding:40px 30px 10px; background:rgba(255,255,255,.5); border-top:1px solid rgba(255,255,255,.6); box-sizing:border-box; } .feature:last-child { margin:0; } .feature .thumb { margin-top:-10px; margin-bottom:20px; border-radius:60px; float:left; border:5px solid #FFF; box-sizing:border-box; box-shadow:1px 1px 0 rgba(0,0,0,.12); } .feature .details { width:310px; padding:0 40px; line-height:20px; float:left; box-sizing:border-box; } .feature .details h3 { margin-bottom:3px; font:800 16px/22px 'Open Sans', sans-serif; letter-spacing:1.5px; text-transform:uppercase; } .feature .details a { padding:10px 10px 10px 0; font:800 12px/20px 'Open Sans', sans-serif; letter-spacing:1.5px; text-transform:uppercase; border:none; } .feature .details a i { margin-right:3px; font-size:14px; position:relative; bottom:-1px; } .feature .copy { width:calc(100% - 430px); float:left; } .feature:after { content:""; display:block; clear:both; } .hover .feature .details a:hover, .hover .feature .details a:hover i { color:#000; } .hover .feature:hover { background:#FFF; } .hover .feature:hover .thumb { transform:scale(1.2); border-radius:5px; border:none; box-shadow:none; } / 3.3 - Pagination / .pagination { margin:20px 0 -10px; background:#EEE; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,.12); display:inline-block; } .pagination:after { content:""; display:block; clear:both; } .pagination li { font-weight:800; font-size:12px; color:#BBB; float:left; border-right:1px solid #D5D5D5; list-style:none; } .pagination li:last-child { margin:0; border:none; } .pagination li a { padding:10px 17px; display:block; } .pagination li span { padding:10px 17px; display:block; } .hover .pagination li a:hover { color:#000; } /***************** 4.0 - Home *****************/ / 4.1 - Featured Slider / #featured { width:100%; position:relative; background:#999; } #featured .item { float:left; position:relative; } #featured .item .details { width:100%; text-align:center; position:absolute; top:50%; margin-top:-82px; } #featured .item .title { margin-bottom:22px; display:block; } #featured .item .title span { padding:5px 17px 10px; font:italic 40px/45px 'Poly', georgia; letter-spacing:-.5px; background:rgba(255,255,255,.85); box-shadow:1px 1px 0 rgba(0,0,0,.1); border-radius:5px; } #featured .item .button { display:inline-block; box-shadow:1px 1px 0 rgba(0,0,0,.2); } #featured .item img { width:100%; height:auto; min-height:275px; display:block; } #featured .nav { height:40px; width:65px; background:#FFF; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,.1); position:absolute; bottom:95px; right:50px; opacity:0; z-index:2; } #featured .nav a { width:50%; height:100%; font-size:15px; line-height:40px; color:#000; text-align:center; float:left; display:block; cursor:pointer; opacity:.4; } .hover #featured:hover .nav { opacity:1; bottom:105px; } .hover #featured .nav a:hover { opacity:1; } / 4.2 - Home 2 / .home2 #container { padding:0; } .home2 #nav { background:none; box-shadow:none; } .home2 #language li:first-child a { background:rgba(255,255,255,.3) !important; } .home2 header { height:100%; } .home2 header:before { content:""; width:100%; height:200px; background:linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); position:absolute; top:0; left:0; z-index:50; } .home2 #featured, .home2 #featured .caroufredsel_wrapper, .home2 #featured .slider, .home2 #featured .item { height:100% !important; } .home2 #featured .item { background-position:center; background-size:cover; } .home2 #featured .item .details { margin-top:-55px; } .home2 #check { margin:0; position:absolute; bottom:0; } .home2 #nav.scroll { background:#FFF; box-shadow:0 0 1px rgba(0,0,0,.2),0 0 15px rgba(0,0,0,.15); } .home2 #nav.scroll #language li:first-child a { background:#EEE !important; } / 4.3 - Home 3 / .home3 main { color:#FFF; } .home3 main p { color:rgba(255,255,255,.7); } .home3 .usp .box i { color:rgba(0,0,0,.35); border-color:rgba(0,0,0,.35); } .home3 #galleryslider .button { background:rgba(0,0,0,.35); color:#FFF; } .home3 #galleryslider .button span:before { color:#000; } .hover .home3 #galleryslider .button:hover { background:#FFF; } / 4.4 - Gallery Slider / #galleryslider { padding-bottom:150px; position:relative; } #galleryslider .caroufredsel_wrapper { background:#EEE; } #galleryslider .slider { width:999999px; height:450px; } #galleryslider img { width:auto; height:450px; float:left; display:block; } #galleryslider .nav { height:40px; width:65px; background:#FFF; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,.1); position:absolute; bottom:40px; right:50px; opacity:0; z-index:1; } #galleryslider .nav a { width:50%; height:100%; font-size:15px; line-height:40px; color:#000; text-align:center; float:left; display:block; cursor:pointer; opacity:.4; } #galleryslider .button { width:200px; margin-left:-100px; padding:0; position:absolute; bottom:70px; left:50%; } .hover #galleryslider .nav a:hover { opacity:1; } .hover #galleryslider .slidecontainer:hover .nav { opacity:1; bottom:50px; } /***************** 5.0 - Accommodation *****************/ / 5.1 - List Items (Rooms) / #rooms.list { margin:0 0 62px; } #rooms.list .item { margin-bottom:30px; } #rooms.list .item:before { content:""; width:calc(100% + 10px); height:calc(100% + 10px); border:1px solid #E5E5E5; background:#FFF; position:absolute; top:-6px; left:-6px; } #rooms.list .item a { color:#000; } #rooms.list .item .details:before { background:#EEE; } #rooms.list .item .imgcontainer { width:100%; height:100%; position:relative; overflow:hidden; } #rooms.list.grid { margin:0 -15px 32px; } #rooms.list.grid .item { width:33.33%; padding:0 15px; float:left; position:relative; box-sizing:border-box; } #rooms.list.grid .item a { padding:13px 30px; } #rooms.list.grid .item .container { width:100%; height:100%; position:relative; } #rooms.list.grid .item img { cursor:pointer; } #rooms.list.grid .item .details { width:100%; height:80px; top:auto; bottom:0; overflow:hidden; } #rooms.list.grid .item .details .title span { margin-top:0; font-size:12px; opacity:.5; } #rooms.list.grid .item .details p { opacity:0; } #rooms.list.grid .item .details .button { bottom:20px; opacity:0; } #rooms.list.grid:after { content:""; display:block; clear:both; } #rooms.list.grid .item:before { display:none; } #rooms.list.grid .item .container:before { content:""; width:calc(100% + 10px); height:calc(100% + 10px); border:1px solid #E5E5E5; background:#FFF; position:absolute; top:-6px; left:-6px; } .hover #rooms.list .item .details:hover .button { background-color:#000; } .hover #rooms.list.grid .item .container:hover .details { height:100%; } .hover #rooms.list.grid .item .container:hover .details a { padding:30px; } .hover #rooms.list.grid .item .container:hover .details .title span { margin-top:2px; font-size:14px; opacity:1; } .hover #rooms.list.grid .item .container:hover .details p { opacity:1; } .hover #rooms.list.grid .item .container:hover img { transform:scale(1.1); } .hover #rooms.list.grid .item .container:hover .button { bottom:40px; opacity:1; } / 5.2 - Video / #video { margin-top:70px; position:relative; } .embed-container { position:relative; padding-bottom:56.25%; height:0; max-width:100%; height:auto; } .embed-container iframe, .embed-container object, .embed-container embed { position:absolute; top:0; left:0; width:100%; height:100%; border:none; } .embed-container:before { content:""; width:calc(100% + 10px); height:calc(100% + 10px); border:1px solid #E5E5E5; position:absolute; top:-6px; left:-6px; } / 5.3 - Room Detail / #left { width:calc(100% - 430px); float:left; } .tags { margin:40px 0 30px; } .tags:after { content:""; clear:both; display:block; } .tags li { margin:0 7px 10px 0; padding:12px 13px; font:bold 15px/16px 'Open Sans', sans-serif; letter-spacing:.2px; border-radius:4px; background:#EEE; box-shadow:1px 1px 0 rgba(0,0,0,.12); display:inline-block; list-style:none; } .floorplan { margin:60px 0 40px; } .floorplan img { width:100%; height:auto; display:block; } /***************** 6.0 - Specials *****************/ / 6.1 - List Items (Specials Slider) / #specials.list .back { position:relative; } #specials.list .back:before { content:""; width:calc(100% + 10px); height:calc(100% + 10px); background:#F5F5F5; border:1px solid #DDD; position:absolute; top:-6px; left:-6px; } #specials.list .item .details .title { font:italic 30px/32px 'Poly', georgia; } #specials.list .item .details .title span { font-weight:800; } #specials.list .item .details .button { line-height:46px; border:2px solid #FFF; background:none; } #specials.list .nav { width:100px; margin-right:140px; text-align:center; position:absolute; bottom:0; right:0; z-index:2; } #specials.list .nav a { width:18px; height:32px; padding-top:10px; display:inline-block; } #specials.list .nav a span { width:8px; height:8px; border:1px solid #FFF; border-radius:100px; cursor:pointer; display:inline-block; text-indent:-999999px !important; } #specials.list .nav a.selected span { background:#FFF !important; } .hover #specials.list .item .details:hover .button { background:#FFF; } .hover #specials.list .nav a:hover span { background:rgba(255,255,255,.3); } / 6.2 - Specials Page / .special { margin-bottom:32px; } .special:last-child { margin-bottom:-38px; } .special .img { width:calc(100% - 430px); float:left; position:relative; } .special .imgcontainer { width:100%; height:100%; overflow:hidden; } .special .img img { width:100%; height:auto; position:relative; display:block; } .special .img:before { content:""; width:calc(100% + 10px); height:calc(100% + 10px); border:1px solid rgba(0,0,0,.1); position:absolute; top:-6px; left:-6px; background:#FFF; } .special .details { width:380px; padding-left:50px; float:left; } .special .details h2 { margin:0px 0 10px; font:bold 25px/26px 'Open Sans', sans-serif; letter-spacing:0; text-transform:none; } .special .details h2 span { margin-top:2px; font:bold 14px/22px 'Open Sans', sans-serif; letter-spacing:1.2px; text-transform:uppercase; display:block; } .special .details .price { margin-bottom:10px; font-size:16px; } .special .button { margin-bottom:30px; } .special .details .terms { font:11px/19px 'Open Sans', sans-serif; color:#777; } .special:after { content:""; display:block; clear:both; } /***************** 7.0 - About Hotel *****************/ / 7.1 - Stats / #stats { margin:60px 0 40px; padding:50px; color:#FFF; background:top left repeat-x; border-radius:5px; overflow:hidden; } #stats h3 { margin:0; padding-bottom:47px; font-weight:800; border-bottom:1px solid rgba(255,255,255,.2); } #stats figure { width:25%; padding-top:30px; float:left; position:relative; } #stats figure strong { font:italic 70px/75px 'Poly', georgia; letter-spacing:1px; text-shadow:2px 2px 0 rgba(0,0,0,.1); } #stats figure span { font:13px/20px 'Open Sans', sans-serif; letter-spacing:1px; text-transform:uppercase; } #stats figure:before { content:""; width:10px; height:10px; margin-left:-7px; border:2px solid #FFF; border-radius:10px; position:absolute; top:-7px; left:50%; } / 7.2 - Instagram / #instagram { width:100%; margin:-10px 0 63px; border-radius:5px; overflow:hidden; } #instagram p { text-transform:uppercase; } #instagram p a { margin-left:15px; color:#000; font-weight:800; } #instagram img { width:16.66%; height:auto; display:block; float:left; } #instagram #feed { margin:60px 0 30px; } #instagram #feed:after { content:""; clear:both; display:block; } /***************** 8.0 - Location ****************/ #map { width:100%; position:relative; background:#E5E3DF; } #map .spacer { width:100%; min-height:300px; height:auto; display:block; } #googlemap { width:100%; height:100%; position:absolute; top:0; left:0; } main #map { min-height:400px; } /**************** 9.0 - Restaurant Menu *****************/ #menu { margin:60px 0 38px; padding:0 50px 50px; border:1px solid #E2E2E2; box-shadow:0 0 12px rgba(0,0,0,.1); border-radius:5px; position:relative; overflow:hidden; } #menu h3 { height:50px; margin:50px 0 0; font:800 14px/50px 'Open Sans', sans-serif; color:#FFF; letter-spacing:1.5px; text-align:center; text-transform:uppercase; background:#888; border-radius:5px; text-shadow:1px 1px 0 rgba(0,0,0,.2); } #menu h3 i { margin-right:5px; } #menu h4 { padding:55px 0 15px; font:bold 25px/26px 'Open Sans', sans-serif; letter-spacing:0; border-bottom:5px solid; position:relative; overflow:hidden; } #menu h4 span { margin-left:5px; font:bold 12px/20px 'Open Sans', sans-serif; color:#888; letter-spacing:1px; text-transform:uppercase; } #menu h4 img { width:120px; height:120px; position:absolute; bottom:-35px; right:0; border-radius:60px 60px 0; } #menu ul { margin:0; } #menu li { min-height:23px; padding:22px 0; position:relative; border-bottom:1px solid #E5E5E5; list-style:none; } #menu li { position:relative; } #menu li h5 { padding-right:100px; line-height:20px; font-size:14px; } #menu li h5 .tag { height:22px; margin-left:2px; padding:0 7px; font-size:10px; line-height:22px; text-align:center; font-weight:800; color:rgba(0,0,0,.5); background:rgba(0,0,0,.07); border-radius:100px; display:inline-block; position:relative; top:-1px; cursor:default; text-transform:uppercase; } #menu li p { margin:0; padding-right:100px; font-size:12px; line-height:20px; } #menu li .price { font:italic 22px/22px 'Poly', georgia; text-align:right; letter-spacing:-.3px; position:absolute; top:17px; right:0; } #menu li .price span { font:10px/20px 'Open Sans', sans-serif; color:#888; letter-spacing:.5px; text-transform:uppercase; } #menu li.featured, .hover #menu li:hover { margin:0 -20px; padding:22px 20px; background:#F5F5F5; border-radius:5px; } #menu li.featured { background:none; border-radius:5px; } #menu li.featured .price, .hover #menu li:hover .price { right:20px; } #menu li.featured:before { content:""; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.12; border-radius:5px; } #menu li.featured .tag { background:#FFF; box-shadow:1px 1px 0 rgba(0,0,0,.1); } .hover #menu li.featured:hover { background:none; } /****************** 10.0 - Photo Gallery *****************/ #gallerycontainer { margin:0; padding:60px 60px; display:block; } #gallery { max-width:1680px; margin:auto; } #gallery figure { box-sizing:border-box; border:10px solid transparent; position:relative; } #gallery figure a { width:100%; height:100%; position:absolute; overflow:hidden; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,.1); background:#F5F5F5; transition:.2s ease; transition-property:box-shadow; } #gallery figure img { width:100%; height:auto; display:block; transition-timing-function:ease; } #gallery span { width:100%; padding:25px 18px 18px; font:bold 14px/18px 'Open Sans'; letter-spacing:.3px; color:#FFF; text-shadow:1px 1px 0 rgba(0,0,0,.1); position:absolute; bottom:-20px; left:0; border-radius:0 4px 0 0; box-sizing:border-box; background:-webkit-gradient( linear, left bottom, left top, from(rgba(0,0,0,0.6)), to(rgba(0,0,0,0)) ); background:-moz-linear-gradient(bottom, rgba(0,0,0,0.6), rgba(0,0,0,0) ); background:linear-gradient(to top, rgba(0,0,0,0.5), rgba(0,0,0,0) ); opacity:0; z-index:10; transition:.2s ease-out; } #gallery figure a:hover { box-shadow:1px 1px 0 rgba(0,0,0,.1),0 0 7px rgba(0,0,0,.3); } #gallery figure a:hover span { bottom:0; opacity:1; } #gallery.scroll { margin-top:90px; } / 10.1 - Colorbox / #colorbox, #cboxOverlay, #cboxWrapper { position:absolute; top:0; left:0; z-index:999999; } #cboxWrapper { max-width:none; overflow:visible; } #cboxOverlay { position:fixed; width:100%; height:100%; } #cboxMiddleLeft, #cboxBottomLeft { clear:left; } #cboxContent { position:relative; } #cboxLoadedContent { -webkit-overflow-scrolling:touch; } #cboxTitle { margin:0; } #cboxLoadingOverlay, #cboxLoadingGraphic { position:absolute; top:0; left:0; width:100%; height:100%; } .cboxPhoto { float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic; } .cboxIframe { width:100%; height:100%; display:block; border:0; } #colorbox, #cboxContent, #cboxLoadedContent { box-sizing:content-box; } #cboxOverlay { background:#111; } #colorbox { outline:0; } #cboxContent { margin-top:40px; } .cboxIframe { background:#FFF; } #cboxLoadedContent { border:none; background:#000; } #cboxTitle { width:100%; position:absolute; top:-31px; left:0; font:16px/18px 'Open Sans'; letter-spacing:.6px; color:#FFF; } #cboxTitle strong { font-size:14px; letter-spacing:.3px; text-transform:none; } #cboxLoadingGraphic { display:none; } #cboxPrevious, #cboxNext { width:50px; height:60px; margin-top:-30px; background:none; text-indent:9999px; position:fixed; top:50%; border:none; cursor:pointer; } #cboxPrevious:before, #cboxNext:before { font-family:FontAwesome; width:100%; height:100%; font-size:28px; line-height:63px; color:#FFF; text-indent:0; position:absolute; top:0; left:0; opacity:.25; } #cboxPrevious { left:0; border-radius:0 6px 6px 0; } #cboxNext { background-position:bottom; right:0; border-radius:6px 0 0 6px; } #cboxPrevious:before { content:"\f053"; } #cboxNext:before { content:"\f054"; } #cboxPrevious:hover:before, #cboxNext:hover:before { opacity:1; } #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active { outline:0; } #cboxClose { width:50px; height:50px; text-indent:9999px; background:rgba(255,255,255,.15); position:fixed; top:0; right:0; border:none; border-radius:0 0 0 5px; cursor:pointer; } #cboxClose:before { font-family:FontAwesome; content:"\f00d"; width:100%; height:100%; font-size:23px; line-height:50px; color:#FFF; text-indent:0; position:absolute; top:0; left:0; } #cboxClose:hover { background-color:rgba(255,255,255,.3); } #cboxNext:hover, #cboxPrevious:hover { background-color:rgba(255,255,255,.15); } #colorbox.formpopper #cboxClose { display:none; } #colorbox.formpopper #cboxContent { margin-top:20px; } .pinit { width:70px; height:30px; background:#C82828 url(../images/pinit.png) top center no-repeat; position:absolute; top:-9px; right:0; border-radius:5px; display:none; cursor:pointer; } .pinit:hover { background-color:#FFF; background-position:bottom; } /***************** 11.0 - Blog *****************/ #container.post #header .h1 div { font:italic 40px/45px 'Poly', georgia; color:#FFF; display:inline-block; } #container.post #header h1 { padding:0 50px 7px; display:block; } #container.post #header .h1 .tagline { font-weight:normal; } #container.post hr { margin-top:30px; } / 11.1 - Post List / article { margin-bottom:65px; } article:after { content:""; display:block; clear:both; } article:last-of-type { margin-bottom:30px; } article .img { overflow:hidden; position:relative; } article img { width:100%; height:auto; display:block; } article .main { margin-bottom:30px; position:relative; } article .main:before { content:""; width:calc(100% + 10px); height:calc(100% + 10px); background:#FFF; border:1px solid rgba(0,0,0,.1); position:absolute; top:-6px; left:-6px; } article .details { padding:25px 20px; background:#EEE; position:relative; } article .details .date { position:absolute; top:25px; left:20px; } article .details h2 { margin:0 0 5px 65px; font:bold 25px/26px 'Open Sans', sans-serif; letter-spacing:0; text-transform:none; } article .details p { margin:0 0 0 65px; font-size:12px; line-height:18px; } article .details p a { color:#000; font-weight:normal; border-bottom:1px solid #EEE; } article .details p span { margin:0 3px; color:#CCC; } article p.intro { margin:0 0 20px; } article .button { margin:7px 30px 10px 0; float:left; } .hover article .details a:hover { border-color:#CCC; } .hover article .img a:hover img { transform:scale(1.05); } / 11.2 - Comments / #comments { margin:0; clear:both; } #comments li { margin-bottom:2px; padding:30px 30px 22px; position:relative; overflow:hidden; } #comments li:first-child { border-radius:5px 5px 0 0; } #comments li:last-child { margin-bottom:0; border-radius:0 0 5px 5px; } #comments li:before { content:""; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.15; } #comments li { position:relative; } #comments ol.children { margin:0; padding-left:20px; border-radius:0; overflow:visible; } #comments ol.children li { margin-bottom:2px; border-radius:0; overflow:visible; } #comments ol.children li:before { display:none; } #comments li.parent li { margin-bottom:0; padding:30px 0 0 35px; } #comments li .quote { margin-bottom:20px; padding:15px 18px 1px; font:13px/22px 'Open Sans'; background:#FFF; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,0.1); position:relative; } #comments li .quote p { margin-bottom:15px; } #comments li .quote:after { content:""; border-style: solid; border-width:0 16px 16px 0; border-color:transparent #FFF transparent transparent; position:absolute; bottom:-16px; left:20px; box-shadow:1px 0 0 rgba(0,0,0,0.1); } #comments li .comment-author { font:800 12px/16px 'Open Sans', georgia; text-transform:uppercase; } #comments li .comment-author span { font:10px/13px 'Open Sans'; } #comments li .comment-reply-link { padding:3px 0 3px 5px; font:bold 12px/18px 'Open Sans'; float:right; z-index:3; } #container.post #left .button { height:40px; margin-top:-7px; padding:0 15px; line-height:40px; float:right; z-index:1; position:relative; } .hover #comments li .comment-reply-link:hover { color:#000; } /* 11.3 - Sidebar / .tags.blogtags { margin:0 0 40px; } .tags.blogtags li { padding:0; box-shadow:none; } .tags.blogtags li a { padding:12px 13px; display:block; color:#000; border-radius:4px; box-shadow:1px 1px 0 rgba(0,0,0,.12); } .hover .tags.blogtags li a:hover { background:#DDD; box-shadow:1px 1px 0 rgba(0,0,0,.18) } /***************** 12.0 - Guest Book *****************/ #guestbook { margin:0; padding:60px 55px 0; display:block; background:#EEE url(../images/fadeback.jpg) !important; background-size:100% 100% !important; position:relative; box-shadow:0 1px 0 rgba(0,0,0,.07); z-index:1; } #guestbook .centre { width:100%; padding-left:0; padding-right:0; max-width:none; display:inline-block; text-align:center; } #guestbook .button { line-height:46px; border:2px solid #FFF; box-sizing:border-box; } #guestbook .pagination { margin-top:-20px; } #pop.popform { width:100%; height:100%; position:relative; top:auto; left:auto; transform:none; -webkit-transform:none; -ms-transform:none; box-shadow:none; outline:none; display:block !important; } #pop.popform form { margin-bottom:5px; } #pop.popform input { text-align:left; } #pop.popform form textarea { width:100%; height:120px; margin-bottom:7px; padding:12px 15px; font:14px/20px 'Open Sans', sans-serif; letter-spacing:.4px; border:none; box-sizing:border-box; border-radius:3px; box-shadow:1px 1px 0 rgba(0,0,0,.1); position:relative; display:block; } #pop.popform .alert { width:100%; font:13px/17px 'Open Sans', sans-serif; z-index:999; position:fixed; box-sizing:border-box; } #pop.popform .alert i { margin-top:0; } .hover #guestbook .button:hover { background:#FFF; } / 12.1 - Testimonials / #testimonials { max-width:1680px; margin:auto; } #testimonials:after { content:""; clear:both; display:block; } #testimonials figure { width:33.33%; box-sizing:border-box; border-width:10px 15px 25px; border-style:solid; border-color:transparent; position:relative; float:left; } #testimonials figure .testimonial { padding:40px 40px 5px; text-align:center; background:#FFF; position:relative; border-radius:5px; box-shadow:0 1px 1px rgba(0,0,0,0.15), 0 12px 0 -5px #E5E5E5, 0 12px 1px -4px rgba(0,0,0,0.1), 0 0 1px rgba(0,0,0,0.2), 0 0 10px rgba(0,0,0,0.1); } #testimonials figure i { font-size:38px; color:#EEE; position:absolute; top:37px; left:37px; } #testimonials figure h2 { padding:0 40px; font:bold 25px/27px 'Open Sans', sans-serif; text-transform:none; letter-spacing:0; } #testimonials figure .name { margin-top:-5px; font-size:12px; line-height:17px; font-style:normal; text-transform:uppercase; } #testimonials figure .name span { font-size:10px; } #testimonials figure:before, #testimonials figure:after { position:absolute; width:40%; height:10px; content:""; left:12px; bottom:2px; background:transparent; transform:skew(-5deg) rotate(-5deg); box-shadow:0 6px 12px rgba(0,0,0,.2); z-index:-1; } #testimonials figure:after { left:auto; right:12px; transform:skew(5deg) rotate(5deg); } / 12.2 - Testimonials Cover / #testimonials figure.cover .testimonial { padding:0; box-shadow:0 0 1px rgba(0,0,0,0.2), 0 0 10px rgba(0,0,0,0.1); } #testimonials figure.cover .testimonial img { width:100%; height:auto; display:block; border-radius:5px 5px 0 0; } #testimonials figure.cover .testimonial .details { padding:40px; background:top left repeat-x; } #testimonials figure.cover .testimonial h2, #testimonials figure.cover .testimonial p { padding:0; color:#FFF; } #testimonials figure.cover:before, #testimonials figure.cover:after { display:none; } /***************** 13.0 - FAQs *****************/ #faqs { margin:0; text-align:center; border-radius:5px; overflow:hidden; background:#FFF; box-shadow:1px 1px 0 rgba(0,0,0,.12); position:relative; } #faqs:before { content:""; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.2 !important; } #faqs li { background:#EEE; border-top:1px solid #FFF; border-bottom:1px solid rgba(0,0,0,.1); position:relative; list-style:none; } #faqs li { position:relative; z-index:1; } #faqs li img { width:100%; max-width:500px; height:auto; padding:5px; border:1px solid rgba(0,0,0,0.12); box-sizing:border-box; } #faqs li p { width:100% !important; padding:0 30px; display:none; box-sizing:border-box; } #faqs li p:after { content:""; display:block; clear:both; } #faqs li.reveal { padding-top:10px; background:none !important; border-bottom:1px solid #CCC; border-top:5px solid !important; } #faqs li h2 { margin:0; padding:20px 45px; font:bold 16px/22px 'Open Sans', sans-serif; letter-spacing:.5px; text-transform:none; display:block; cursor:pointer; } #faqs li h2:after { content:"\f055"; font-size:20px; font-family:FontAwesome; color:#AAA; position:absolute; top:20px; right:20px; } #faqs li.reveal h2 { margin-bottom:5px; font-size:20px; font-weight:800; } #faqs li.reveal h2:after { content:"\f056"; } #faqs li:first-child { border-top-color:transparent; } #faqs li:last-child { padding-bottom:1px; border-bottom:none; } .hover #faqs li:hover { background:#E5E5E5; border-top-color:#F5F5F5; } /****************** 14.0 - Contact *****************/ #contact { margin-top:-125px; margin-bottom:70px; border-radius:5px; overflow:hidden; position:relative; background:#FFF; box-shadow:0 0 1px rgba(0,0,0,.2),0 0 10px rgba(0,0,0,.15); } #contact:before { content:""; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.2 !important; } #contact:after { content:""; clear:both; display:block; } #contact { position:relative;/* z-index:1; /} #contact img { max-width:100%; height:auto; display:block; box-shadow:0 1px 0 rgba(0,0,0,.1); border-radius:5px 5px 0 0; position:relative; z-index:10; } #contact form { padding:20px; } #contact .col { width:100%; /padding:20px;/ text-align:left; float:left; box-sizing:border-box; } #contact .field { width:100%; margin-bottom:15px; background:#FFF; border-radius:3px; box-shadow:1px 1px 0 rgba(0,0,0,.1); } #contact .field.mandatory:before { content:"\f069"; font-family:FontAwesome; font-size:10px; color:#999; position:absolute; top:10px; left:10px; opacity:.7; } #contact .field.mandatory input { padding-left:28px; } #contact input, #contact textarea, #contact select { width:100%; height:45px; padding:0 15px; font:14px/20px 'Open Sans', sans-serif; letter-spacing:.4px; border:none; box-sizing:border-box; background:none; z-index:2; position:relative; } #contact select { margin-bottom: 15px;width:31.33%; padding:0 10px; margin-right:2%; background:#FFF; border-radius:3px; box-shadow:1px 1px 0 rgba(0,0,0,.1); float:left; } #contact select:last-child { width:33.33%; margin:0; } #contact textarea { height:149px; padding:12px 15px; display:block; } #contact .field.calendar input { cursor:pointer; } #contact .field i { font-size:16px; color:#CCC; position:absolute; margin-top:14px; right:15px; z-index:1; } #contact button { width:30%; margin:10px 0 20px; font-size:14px; border-radius:3px; } #contact .honeypot { display:none; } .alert { padding:20px; line-height:20px; text-align:left; } .alert i { font-size:25px; float:left; margin:-2px 15px 0 0; } .alert.success { background:#E9F7E0; border-color:#CAE4C7; } .alert.success i { color:#4A8E53; } .alert.error { background:#FDECEB; } .alert.error i { color:#A3505A; } .alert.validate { background:#FFFADC; } .alert.validate i { color:#C6AE4F; } /***************** 15.0 - Sitemap *****************/ main ul.sitemap { max-width:800px; margin:0 auto; text-align:center; border-radius:5px; overflow:hidden; box-shadow:1px 1px 0 rgba(0,0,0,.12); position:relative; } main ul.sitemap { position:relative; z-index:1; } main ul.sitemap:before { content:""; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.25; } main ul.sitemap li { list-style:none; } main ul.sitemap a { padding:15px; font-size:20px; font-weight:800; display:block; background:none; border:none; } main ul.sitemap ul { margin:0; } main ul.sitemap ul a { padding:10px; font-size:14px; font-weight:normal; color:#000; background:#EEE; border-bottom:1px solid #D5D5D5; cursor:pointer; } main ul.sitemap li:last-child a { border-bottom:none; } .hover main ul.sitemap a:hover { color:#FFF; } .hover main ul.sitemap ul a:hover { background:#E5E5E5; color:#000; } /****************** 16.0 - Sidebar *****************/ #scroll, #scroll.relative { width:380px; position:relative; } #scroll.fixed { position:fixed; top:130px; } #scroll.absolute { position:absolute; top:auto !important; bottom:70px; } aside { width:380px; padding-left:50px; float:left; } aside.layout2 { margin-top:8px; } aside #block { margin-bottom:50px; box-shadow:1px 1px 0 rgba(0,0,0,.12); } aside #block.categories { border-top:5px solid; } aside .blocktitle { width:100%; height:100px; font:bold 12px/100px 'Open Sans', sans-serif; letter-spacing:.8px; text-align:center; text-transform:uppercase; position:relative; } aside .blocktitle { z-index:1; } aside .blocktitle a { width:100%; height:100%; color:rgba(255,255,255,.5); display:block; position:absolute; top:0; left:0; z-index:1; } aside .blocktitle span { margin:0 3px; font:italic 40px/50px 'Poly', georgia; letter-spacing:-.3px; color:#FFF; text-transform:none; display:inline-block; position:relative; bottom:-4px; } aside .blocktitle:before { content:""; width:100%; height:100%; background:top left; position:absolute; top:0; left:0; opacity:.05; } aside .blocktitle:after { content:""; width:calc(100% - 12px); height:calc(100% - 12px); border:1px solid rgba(255,255,255,.2); position:absolute; top:5px; left:5px; } aside .nav li { list-style:none; } aside .nav li a { width:100%; height:50px; border-bottom:1px solid #D8D8D8; font:800 12px/50px 'Open Sans', sans-serif; color:#000; letter-spacing:.8px; text-align:center; text-transform:uppercase; background:#EEE; display:block; } aside .nav li:last-child a { border:none; } .hover aside .nav li a:hover { background:#DDD; } .hover aside .blocktitle a:hover { background:rgba(0,0,0,.12); } /* 16.1 - Reservations Form / aside #block.form .blocktitle { line-height:103px; } #reservations { padding:30px; background:#EEE; } #reservations p { margin:-5px 0 25px; text-align:center; line-height:20px; } #reservations p a { color:#000; font-weight:normal; border-bottom:1px solid #D5D5D5; } #reservations p strong { font-weight:800; font-size:16px; letter-spacing:1.5px; } #reservations .fieldgroup { margin-bottom:15px; border-radius:5px; box-shadow:1px 1px 0 rgba(0,0,0,.1); background:#FFF; overflow:hidden; } #reservations .field { width:100%; border-bottom:1px solid #E5E5E5; position:relative; } #reservations .field.calendar input { cursor:pointer; } #reservations .field:last-child { border:none; } #reservations input { width:100%; height:42px; font:14px/42px 'Open Sans', sans-serif; letter-spacing:.4px; text-indent:12px; border:none; z-index:2; position:relative; background:none; } #reservations .field i { font-size:16px; color:#AAA; position:absolute; top:13px; right:12px; z-index:1; } #reservations button { width:100%; } #block .alert { font-size:13px; line-height:17px; } #block .alert i { margin-top:0; } .hover #reservations p a:hover { border-bottom:2px solid #C5C5C5; } .hover #reservations .field.calendar:hover i { color:#000; } / 16.2 - Search / #search { margin-top:50px; } #search input, #search button { height:40px; float:left; border:none; } #search input { width:calc(100% - 50px); font:14px/40px 'Open Sans', sans-serif; letter-spacing:.4px; text-indent:12px; background:#F5F5F5; box-shadow:inset 1px 1px 0 rgba(0,0,0,.1); border-radius:5px 0 0 5px; } #search button { width:50px; font-size:14px; line-height:40px; border-radius:0 5px 5px 0; background:#E9E9E9; box-shadow:inset 0 1px 0 rgba(0,0,0,.1); } #search:after { content:""; display:block; clear:both; } .hover #search button:hover { box-shadow:none; } .hover #search button:hover i { color:#FFF; } / 16.3 - List Items (Specials Slider) / aside #specials.list { height:250px; margin:0; overflow:hidden; } aside #specials.list .item a { padding:30px; } aside #specials.list .item img { width:380px; height:250px; } aside #specials.list .details { text-shadow:1px 1px 0 rgba(0,0,0,.2),0 0 10px rgba(0,0,0,.2); } aside #specials.list .details p { display:none; } aside #specials.list .details .button span:before { text-shadow:none; } aside #specials.list .details:before { background:#666; opacity:.4; } aside #specials.list .details:after { content:""; width:calc(100% - 12px); height:calc(100% - 12px); background:none; border:1px solid rgba(255,255,255,.3); position:absolute; top:5px; left:5px; } .hover aside #specials.list .item:hover img { transform:scale(1.1); } .hover aside #specials.list .details:hover .button { box-shadow:1px 1px 0 rgba(0,0,0,.1),0 0 10px rgba(0,0,0,.2); } .hover aside #specials.list .details:hover:before { opacity:.6; } /***************** 17.0 - Sitewide Extras *****************/ #extras { padding:70px 0; background:#F5F5F5 top left repeat-x; box-shadow:inset 0 1px 0 0 rgba(0,0,0,0.05),inset 0 20px 10px -17px rgba(0,0,0,0.05); position:relative; } #extras:after { content:""; display:block; clear:both; } / 17.1 - Footer Testimonials / .footertestimonial { /padding-right:430px;/ position:relative; } .footertestimonial p.title { margin:-7px 0 20px; font:bold 25px/26px 'Open Sans', sans-serif; letter-spacing:0; } .footertestimonial p { margin-bottom:27px; font:14px/25px 'Open Sans', sans-serif; letter-spacing:.4px; } .footertestimonial i { font-size:38px; color:#E5E5E5; position:absolute; top:-3px; left:-50px; } .footertestimonial .author { margin-top:11px; font:12px/18px 'Open Sans', sans-serif; letter-spacing:.4px; text-transform:uppercase; float:right; } .footertestimonial .author strong { margin:0 2px; font-weight:800; } .footertestimonial .author span { font-size:10px; } .footertestimonial .button { height:40px; margin-bottom:-9px; padding:0 15px; line-height:40px; color:#000; background:#E5E5E5; box-shadow:1px 1px 0 rgba(0,0,0,.15); } .footertestimonial .button span:before { color:#FFF; } .hover .footertestimonial .button:hover { box-shadow:none; } / 17.2 - Recent Blog Posts / .recent { width:380px; font:12px/19px 'Open Sans', sans-serif; letter-spacing:.4px; float:right; box-shadow:1px 1px 0 rgba(0,0,0,.15); } .recent a { min-height:50px; padding:17px 20px; color:#000; background:#E5E5E5; display:block; position:relative; z-index:1; } .recent a .title { font:bold 14px/20px 'Open Sans', sans-serif; } .recent a p { padding-left:65px; } .recent a:first-child { border-bottom:1px solid #CCC; } .date { width:45px; height:45px; margin:4px 20px 0 0; background:#FFF; box-shadow:1px 1px 0 rgba(0,0,0,.1); border-radius:5px; float:left; overflow:hidden; } .date .month { height:18px; font:800 10px/18px 'Open Sans', sans-serif; letter-spacing:1px; text-align:center; color:#FFF; text-transform:uppercase; display:block; } .date .day { height:27px; font:italic 23px/22px 'Poly', georgia; text-align:center; display:block; } .hover .recent a:hover { background:#D5D5D5; } /***************** 18.0 - Promo Popup ****************/ #pop { width:450px; background:#FFF; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); box-shadow:0 0 1px rgba(0,0,0,.3),0 0 30px rgba(0,0,0,.3); outline:9999px solid rgba(30,30,30,.6); display:none; z-index:999999; } #pop:before { content:""; width:100%; height:100%; position:absolute; top:0; left:0; opacity:.2; } #pop .container { padding:40px; } #pop form { margin-bottom:25px; } #pop form input { width:100%; height:45px; margin-bottom:7px; padding:0 15px; font:14px/20px 'Open Sans', sans-serif; text-align:center; letter-spacing:.4px; border:none; box-sizing:border-box; border-radius:3px; box-shadow:1px 1px 0 rgba(0,0,0,.1); position:relative; } #pop form button { width:100%; height:45px; line-height:45px; border-radius:3px; position:relative; } #pop p { margin-bottom:30px; font:14px/22px 'Open Sans', sans-serif; text-align:center; letter-spacing:.4px; position:relative; } #pop p.title { margin-bottom:22px; font:600 22px/28px 'Open Sans', sans-serif; text-transform:uppercase; letter-spacing:1.2px; position:relative; } #pop p.title strong { font-weight:800; } #pop p.close { margin:0; font-size:12px; font-weight:bold; } #pop p.close a { cursor:pointer; border-bottom:1px solid rgba(0,0,0,.1); } #pop img { width:100%; height:auto; display:block; position:relative; } #pop i.fa-close { padding:10px 12px; font-size:25px; color:#FFF; background:rgba(30,30,30,.5); position:absolute; top:0; right:0; border-radius:0 0 0 5px; z-index:1; cursor:pointer; } .hover #pop i.fa-close:hover { background:#333; } .hover #pop p.close a:hover { color:rgba(0,0,0,.5); } /**************** 19.0 - Footer *****************/ footer { width:100%; background:#444; } #footer { position:relative; overflow:hidden; } #footer .centre { height:100%; } #footer .centre:after { content:""; display:block; clear:both; } #footer .dark { width:1430px; height:500px; margin-right:-1000px; background:#333; position:absolute; top:0; right:0; z-index:1; } #footer:before { content:""; width:100%; height:100%; background:top left; position:absolute; top:0; left:0; opacity:.06; z-index:2; } / 19.1 - Subscribe / Social / #footer .news { width:calc(100% - 480px); margin-top:-20px; position:absolute; top:50%; display:table; z-index:3; } #footer .news .title { /width:247px;/ padding-top:3px; font:italic 30px/30px 'Poly', georgia; color:#FFF; display:table-cell; vertical-align:top; } #footer .news .title span { vertical-align:top; } #footer .news .title:before { content:""; width:43px; height:41px; margin:-4px 12px 0 0; background:url(../images/envelope.png); display:inline-block; } #footer .news .subscribe { padding-right:50px; display:table-cell; } #footer .news form { width:100%; float:left; } #footer .news form input { width:70%; height:40px; font:14px/40px 'Open Sans', sans-serif; color:#000; letter-spacing:.4px; text-indent:12px; border-radius:5px 0 0 5px; border:none; float:left; } #footer .news form button { width:30%; height:40px; line-height:40px; border-radius:0 5px 5px 0; float:left; } #footer .news .social { display:table-cell; } #footer .news .social a { width:30px; height:30px; margin:0 7px 5px 0; color:#444; line-height:32px; text-align:center; background:#FFF; display:block; float:left; border-radius:100px; } #footer .news .social a:last-child { margin-right:0; } .hover #footer .news .social a:hover i { color:#FFF; } / 19.2 - Contact Details / #footer .contact { width:380px; height:100%; padding:50px 0 50px 50px; font:14px/25px 'Open Sans', sans-serif; color:#FFF; letter-spacing:.4px; float:right; box-sizing:border-box; position:relative; z-index:2; } #footer .contact .phone { font-weight:800; font-size:16px; letter-spacing:1.5px; } #footer .contact a { color:#FFF; border-bottom:1px solid #555; } #footer .contact i { margin-right:3px; font-size:18px; } .hover #footer .contact a:hover { border-color:#999; border-width:2px; } / 19.3 - Footer Links / #footerlinks { width:100%; height:70px; font:10px/70px 'Open Sans', sans-serif; color:#FFF; letter-spacing:1.5px; text-align:center; text-transform:uppercase; background:#000; clear:both; } #footerlinks strong { margin-right:12px; font-weight:800; } #footerlinks a { padding:10px 12px; color:#FFF; } #footerlinks a:last-child { padding-right:0; } .hover #footerlinks a:hover { color:#999; } /***************** 20.0 - Single Page ****************/ .singlepage #container { padding:0; } .singlepage #nav { height:200px; position:absolute; background:none; box-shadow:none; } .singlepage #nav .centre { max-width:none; background:linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); } .singlepage #nav .logo { top:50px; left:50%; transform:translate(-50%,0); -webkit-transform:translate(-50%,0); -ms-transform:translate(-50%,0); opacity:1 !important; } .singlepage #nav .shadow { display:none; } .singlepage #featured .item .details { margin-top:-55px; } .singlepage #galleryslider { padding-bottom:0; } .singlepage #galleryslider .centre { padding-top:0; padding-bottom:0; } .singlepage #contact { margin-top:0; box-shadow:none; } .singlepage #footer .news { width:100%; max-width:850px; margin:90px auto; position:relative; } /**************** 21.0 - Transitions ****************/ a, input, button, i, #container, #nav, #nav nav li a:after, #featured .nav, .list .item .button, #galleryslider .nav, .list a span, #featured .nav, aside #specials.list .details:before, #slideshow .nav, .feature, #menu li, #menu li .price, #menu li.featured:before, .feature .thumb, #rooms.list.grid .item .details .title span, #faqs li, #faqs li h2:after { transition:.2s ease; } .button span, button span, #nav .book span, #language, #rooms.list.grid .item .details, #rooms.list.grid .item .details p, #rooms.list.grid .item a, .pinit, #faqs li:before, #faqs li:after, #faqs li h2 { transition:.4s ease !important; } #rooms.list.grid .item .container img, aside #specials.list .item img, .list .item img, .special .img img, article img { transition:1.2s ease; } /**************** 22.0 - Responsive *****************/ @media only screen and (max-width:767px) { a img { border: none; width: 70%; } .pack-grid { padding: 0px 10px!important; } .fullwidth .usp .box1 { width: 100%; } .fullwidth .usp .box1:first-child { padding: 0px; } .fullwidth .usp .box1:last-child { padding: 0px; } #rooms .imgcontainer img{ height: auto; } } @media only screen and (max-height:800px) { #nav { position:absolute; } #scroll.fixed { position:fixed; top:50px; } #scroll.absolute { position:absolute; top:auto; bottom:70px; } } @media only screen and (max-width:1500px) { #header { background-size:cover; } #galleryslider, #galleryslider .caroufredsel_wrapper, #galleryslider img { height:350px !important; } #instagram img { width:20%; } #instagram img:nth-child(6) { display:none; } .footertestimonial i { display:none; } } @media only screen and (max-width:1300px) { #check { width:auto; padding:0 50px; } #check .centre { max-width:none; } .home2 #check { width:calc(100% - 100px); padding:0 50px; } #gallerycontainer { padding:40px !important; } #guestbook { padding:40px 35px 0 !important; } #footer .news { margin-top:-45px; } #footer .news .social { width:100%; text-align:center; position:absolute; right:0; top:77px; } #footer .news .social a { margin:0 4px 5px 0; display:inline-block; float:none; } .singlepage #footer .news { margin:55px auto 110px; } } @media only screen and (max-width:1200px) { #left { width:calc(100% - 350px); } #scroll, #scroll.relative, aside, aside #specials.list .details { width:300px; } aside #specials.list .nav { margin-right:100px; } #menu { padding:0 50px; border-left-color:#E5E5E5; } #menu:before, #menu:after { display:none; } #testimonials figure { width:50%; } #instagram img { width:25%; } #instagram img:nth-child(5) { display:none; } .ui-datepicker { width:100% !important; width:calc(100% - 40px) !important; margin-left:20px !important; margin-right:20px !important; left:0 !important; } } @media only screen and (max-width:1024px) { #nav { position:absolute; } #nav nav { width:100%; right:auto; left:0; } #nav nav ul { width:100%; position:absolute; top:60px; left:0; display:none; } #nav nav li { width:100%; float:none; } #nav nav li a { width:100%; height:50px; padding:0; font-weight:800; line-height:50px; text-align:center; color:#FFF; display:block; background:#555; border-bottom:1px solid #424242; } #nav nav li ul li a i { display:none; } #nav nav li:last-child a { border:none; } #nav nav li a:after { display:none; } #nav nav li ul { display:block !important; position:relative; top:auto; border-radius:0; } #nav nav li ul li a, #nav nav li ul li ul li.active a, #nav nav li ul li ul li:last-of-type a { padding:0 !important; background:#484848 !important; border-bottom:1px solid #383838 !important; } #nav nav li ul li ul { left:0; } #pull { display:block; } #language { right:290px; } #featured .nav { opacity:1; bottom:105px; } #check .field select { display:block; } #check .field.select i { display:none; } .list .item .details p { display:none; } #rooms.list.grid .item a { padding:20px !important; } #rooms.list.grid .item img { cursor:default; } #rooms.list.grid .item .details { height:auto !important; position:relative; } #rooms.list.grid .item .details p { display:none; } #rooms.list.grid .item .details .button { margin-left:0; position:relative; bottom:auto !important; left:0; opacity:1; } #rooms.list.grid .item .details .title { font-size:18px; line-height:25px; } #rooms.list.grid .item .details .title span { margin-top:2px; font-size:14px; opacity:1; } #rooms.list.grid .item .details { width:100%; position:relative; background:#EEE; } #rooms.list.grid .item .details:before { opacity:1; background:top left; opacity:.035; } #galleryslider .nav, #slideshow .nav { opacity:1; bottom:50px; } #gallery span { display:none; } #footer .news .title span { display:none; } #footer .news .title { width:70px; } } @media only screen and (max-width:900px) { .centre { padding:0 20px; } #container { padding-top:80px; } #nav { height:80px; } #nav .logo { left:20px; } #nav .book { right:20px; } #pull { right:200px; } #language { right:249px; } #header .h1 { padding:57px 0 65px; } #header h1 { font-size:30px; line-height:35px; } #header h1 .tagline { padding:10px 30px; } #featured .item .details { margin-top:-57px; } #featured .item .title { margin-bottom:15px; } #featured .item .title span { font-size:30px; } #featured .nav, #slideshow .nav { right:20px; bottom:20px !important; } #check { margin:0; padding:0 !important; } #check .centre { border-radius:0; } #check button { font-size:11px; border-radius:0; } .home2 #check { width:100%; } main .centre { padding:30px 20px 35px; } main h1, main h2 { margin-bottom:18px; } main p { margin:0 0 20px; } main hr { margin-bottom:20px; } main p.credit { margin:0 0 28px; } main table { width:100%; margin:25px 0; font-size:12px; line-height:16px; } main table td, main table th { padding:12px 3px; } main table th { padding:22px 5px 17px; font-size:11px; line-height:15px; } #rooms.list { margin:0 0 30px; } #rooms.list.grid { margin:0 -15px 0; } #content { margin:0 0 -30px; } .usp { margin:0; } .usp .box { padding:10px 0; } .fullwidth .usp { margin:20px 0 -10px; } .fullwidth .usp .box { padding:0 10px; } .fullwidth .usp .box:first-child { padding:0 20px 0 0; } .fullwidth .usp .box:last-child { padding:0 0 0 20px; } .fullwidth #content .button { margin-bottom:20px; } #galleryslider, #galleryslider .caroufredsel_wrapper, #galleryslider img { height:300px !important; } #galleryslider .nav { bottom:20px !important; right:20px; } #galleryslider { padding-bottom:110px; } #galleryslider .button { bottom:30px; } #video { margin-bottom:30px; } #extras { padding:30px 0; } .list { margin-bottom:30px; } .list .nav { right:20px; } #left { width:calc(100% - 330px); } #slideshow { margin-bottom:30px; } #content #slideshow { margin:5px 0 28px; } .tags { margin:30px 0 10px; } .floorplan { margin:20px 0 30px; } aside { padding-left:30px; } aside #block { margin-bottom:30px; } aside .blocktitle span { font-size:30px; letter-spacing:0; } #featurelist h2 { margin:-10px 0 25px; font:italic 30px/32px 'Poly', georgia; letter-spacing:0; } .feature .thumb { width:100px; height:100px; margin-right:20px; } .feature .details { width:auto; padding:0; float:none; } .feature .copy { width:100%; } .special { margin-bottom:20px; } .special:last-child { margin-bottom:-28px; } .special .img { width:calc(100% - 410px); } .special .details { padding-left:30px; } .special .details h2 { margin-bottom:18px; } .special .details .price { margin-bottom:25px; } .special .button { margin-bottom:20px; } #menu { margin:-20px 0 28px; padding:0; border:none; box-shadow:none; } #menu h3 { margin:28px 0 0; } #menu h4 { padding:38px 0 10px; font-size:22px; } #menu h4 img { width:100px; height:100px; } #menu li { padding:15px 0; } #menu li .price { font:italic 20px/20px 'Poly', georgia; letter-spacing:0; top:13px; } #menu li.featured, .hover #menu li:hover { padding:15px 20px; border-radius:0; } #menu li.featured, #menu li.featured:before { border-radius:0; } #gallerycontainer { padding:10px !important; } #guestbook { padding:10px 10px 0 !important; } #guestbook .centre { max-width:none; padding-top:45px; } #testimonials figure { border-width:10px 10px 15px; } #stats { margin:20px 0 30px; padding:30px; } #stats h3 { padding-bottom:32px; } #stats figure { padding-top:15px; } #instagram { margin-bottom:25px; } article { margin-bottom:30px; } article .main { margin-bottom:25px; } article .details h2 { font-size:22px; line-height:25px; } main blockquote { margin-left:0; } .tags.blogtags { margin-bottom:20px; } #contact { margin:0 0 30px; } #contact form { padding:27px 0; } #contact h2 { margin:15px 10px 0; } #contact p { padding:0 30px; } #contact .col { width:100%; padding:0 30px; } #contact textarea { margin-top:7px; } #contact button { width:calc(100% - 60px); margin-bottom:0; } .footertestimonial { padding-right:400px; } .footertestimonial p.title { margin-top:-5px; } .footertestimonial .button { margin:0; } #footer .news { width:calc(100% - 400px); } #footer .news .social { top:67px; } #footer .dark { margin-right:-1030px; } #footer .contact { width:380px; height:100%; padding:30px 0 30px 30px; font:14px/25px 'Open Sans', sans-serif; color:#FFF; letter-spacing:.4px; float:right; box-sizing:border-box; position:relative; z-index:2; } #search { margin-top:30px; } .singlepage #footer .news { margin:40px auto 90px; } #instagram #feed { margin-top:30px; } } @media only screen and (max-width:800px) { #check .field input { text-indent:15px; } #check .field select { text-indent:10px; } #check .field i { right:15px; } .list .item a { padding:20px; } #rooms.list .item .details { width:100%; position:relative; background:#EEE; } #rooms.list .item .details:before { opacity:1; background:top left; opacity:.035; } #rooms.list .item .details .button { position:relative; bottom:auto; margin-left:0; left:0; } #rooms.list.grid .item { width:50%; } #specials.list .item .details { width:100%; height:220px; } #specials.list .item img { width:660px; min-width:100%; height:220px; } #specials.list .nav { width:100%; margin:0 !important; right:0; } #stats figure strong { font-size:50px; line-height:55px; } #stats figure span { font-size:11px; } .footertestimonial { padding:0; } .footertestimonial p.title { font-size:22px; line-height:25px !important; } .footertestimonial .author { margin-bottom:30px; float:none; } .recent { width:100%; margin-bottom:30px; float:none; } #left { width:100%; } #scroll, #scroll.relative { width:70%; padding:0 15%; } aside, aside #specials.list .details { width:100%; } aside { padding:30px 0 0; } aside.layout2 { margin-top:0; } aside #specials.list { margin:0; } aside #specials.list .item .details { height:250px; } aside #specials.list .nav { width:100%; margin:0; right:0; } .special { margin-bottom:15px; text-align:center; } .special .img { width:100%; margin-bottom:35px; } .special .details { width:100%; padding:0; } #testimonials figure { width:100%; } #footer .centre { padding:0 20px; } #footer .dark { display:none; } #footer .news { width:100%; margin:30px 0 80px; position:relative; top:0; } #footer .news .title { width:218px; font-size:25px; line-height:32px; } #footer .news .title span { display:inline; } #footer .news .subscribe { padding:0; } #footer .news .social { top:70px; } #footer .contact { width:100%; height:auto; padding:5px 0 30px; text-align:center; float:none; } } @media only screen and (max-width:700px) { #check { display:none; } #instagram img { width:50%; } .fullwidth .usp .box { width:100%; margin-bottom:30px; padding:0 !important; display:block; } .fullwidth .usp .box:last-child { margin:0; } #footerlinks span { display:none; } #pop, .promopopup { display:none !important; } } @media only screen and (max-width:630px) { #featured .item .details { margin-top:-25px !important; } #featured .item img { width:618px; min-width:100%; } #featured .item .title { display:none !important; } #rooms.list.grid .item { width:100%; } #stats figure { width:100%; } #stats figure:not(:first-of-type):before { display:none; } } @media only screen and (max-width:500px) { #nav .book { display:none; } #nav nav li.mobile { display:block; } #language { width:34px; text-indent:-9999px; right:65px; } #pull { right:17px; } #header h1 .tagline { padding:10px; } main, .footertestimonial p { line-height:21px; } main h1, main h2 { margin-bottom:18px; line-height:26px; } main h3 { margin-bottom:18px; line-height:23px; } main p { margin:0 0 20px; } .special .details h2 { font-size:25px; line-height:30px; } .special .details .terms { line-height:17px; } .footertestimonial p.title { line-height:27px; } #slideshow .item span { display:none; } #galleryslider, #galleryslider .caroufredsel_wrapper, #galleryslider img { height:220px !important; } .feature { padding-top:30px; } /.feature .thumb { display:none; }/ .feature .details h3 { margin-bottom: 3px; font: 700 11px/20px 'Open Sans', sans-serif; letter-spacing: 1.5px; text-transform: uppercase; } #menu h4 span { display:none; } #menu li p { line-height:18px; } #gallerycontainer { padding:5px !important; } #gallery figure { border-width:5px; } #testimonials figure i { display:none; } #testimonials figure h2 { padding:0; font-size:25px; line-height:25px; } #cboxTitle, #cboxPrevious, #cboxNext { display:none !important; } article .details { padding:20px; } article .details .date {top:20px; } article .details .date { top:-70px; } article .details h2, article .details p { margin-left:0; } article p.intro { font-size:14px; } article .button { width:100%; margin-right:0; text-align:center; box-sizing:border-box; } #container.post #left .button { width:100%; margin:10px 0; padding:0; float:none; } main blockquote { display:none; } #comments li { padding:20px 20px 12px; } #comments ol.children { padding-left:0; } #comments li .quote { line-height:19px; } #comments li .comment-reply-link { float:none; } #testimonials figure .testimonial { padding:30px 30px 5px; } #testimonials figure.cover .testimonial .details { padding:30px; } #faqs { text-align:left; } #faqs li.reveal { padding-top:0 !important; } #faqs li h2 { padding:15px 50px 15px 20px !important; line-height:19px; } #faqs li h2:after { top:15px !important; } #faqs li p { padding:0 20px !important; } #contact select { width:100% !important; margin:0 0 7px; } #contact button { font-size:12px; } #scroll, #scroll.relative { width:100%; padding:0; } .recent, .recent a .title { line-height:18px; } #footer .news .title { display:none; } #footer .news form input { width:68%; } #footer .news form button { width:32%; } } .package{ padding:60px 0px; } .pack img{ width:100%; } .pack-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap: 20px; padding: 0px 60px; } .pack { width: 100%; overflow: hidden; border-radius: 10px; } .pack img { width: 100%; height: auto; display: block; border-radius: 10px; } .sanctuary-section { background: #f7f7f7; padding: 40px; border-radius: 18px; border: 1px solid #e5e5e5; margin-top: 30px; } .sanctuary-title { font-size: 32px; font-weight: 800; margin-bottom: 25px; color: #2d2d2d; } .sanctuary-list { list-style: none; padding: 0; margin: 0; } .sanctuary-list li { background: #fff; padding: 18px 20px; margin-bottom: 18px; border-radius: 14px; box-shadow: 0 4px 12px rgba(0,0,0,0.06); font-size: 17px; line-height: 1.6; list-style:none; } .inner-points { margin: 8px 0 10px 18px; padding: 0; } .inner-points li { margin-bottom: 6px; font-size: 16px; color: #444; position: relative; } .inner-points li::before { content: "•"; color: #c59d5f; / Golden bullet */ font-weight: bold; margin-right: 6px; } .sanctuary-sub { font-size: 19px; font-weight: 700; color: #222; margin-bottom: 6px; } .tariff-booking{ background-color: #000; color: #fff; font-size: 20px; line-height: 35px; text-transform: none; font-weight: 800; }

| ver. 1.4 | Github | . | PHP 7.4.33 | Generation time: 0.04 | proxy | phpinfo | Settings