body,
html{
    width: 100%;
    height: 100%;
    min-height: 100%;
    font-smooth: always;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    box-sizing: border-box;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%
}

* {
    background: transparent;
    font-size: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    text-decoration: none;
    vertical-align: baseline
}

*,
:after,
:before {
    box-sizing: inherit
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block
}

section {
    position: relative;
    width: 100%;
    clear: both;
    display: inline-block
}

img {
    box-sizing: content-box;
    display: block
}

input {
    line-height: normal
}

input,
select {
    vertical-align: middle
}

input[type=checkbox],
input[type=radio] {
    box-sizing: border-box
}

button,
input[type=button],
input[type=submit] {
    cursor: pointer;
    -webkit-appearance: none
}

textarea {
    overflow: auto
}

hr {
   border:         none;
    border-left:    2px solid black;
    height:         40vh;
    width:          2px;  
    color: white;     
}

del {
    text-decoration: line-through
}

b,
strong {
    font-weight: bolder
}

a.tel {
    cursor: default!important;
    color: currentColor;
    background: transparent none repeat 0 0/auto auto padding-box border-box scroll;
    background: initial
}

a.anchor {
    position: relative;
    top: 0;
    visibility: hidden;
    display: table
}

.clear,
a.anchor {
    clear: both
}

.clearfix:after,
.clearfix:before {
    content: " ";
    display: table
}

.hidden,
.hidden0,
.hide,
.hide0,
.mobile {
    display: none!important
}

.centre {
    height: auto;
    margin: auto
}

.question {
    cursor: pointer
}

.answer {
    display: none
}

.content ul.pagination {
    margin-top: 50px
}

.content .pagination li.pag-current {
    font-weight: 700;
    color: #fff;
    margin: -5px 5px 0 0;
    padding: 6px 9px
}

.anime {
    position: relative;
    transform: translateZ(0)
}

.anime.s2 {
    transition: all .2s ease-out
}

.anime.s2.d2 {
    transition: all .2s ease-out .2s
}

.anime.s2.d4 {
    transition: all .2s ease-out .4s
}

.anime.s2.d6 {
    transition: all .2s ease-out .6s
}

.anime.s2.d8 {
    transition: all .2s ease-out .8s
}

.anime.s2.d1x {
    transition: all .2s ease-out 1s
}

.anime.s4 {
    transition: all .4s ease-out
}

.anime.s4.d2 {
    transition: all .4s ease-out .2s
}

.anime.s4.d4 {
    transition: all .4s ease-out .4s
}

.anime.s4.d6 {
    transition: all .4s ease-out .6s
}

.anime.s4.d8 {
    transition: all .4s ease-out .8s
}

.anime.s4.d1x {
    transition: all .4s ease-out 1s
}

.anime.s6 {
    transition: all .6s ease-out
}

.anime.s6.d2 {
    transition: all .6s ease-out .2s
}

.anime.s6.d4 {
    transition: all .6s ease-out .4s
}

.anime.s6.d6 {
    transition: all .6s ease-out .6s
}

.anime.s6.d8 {
    transition: all .6s ease-out .8s
}

.anime.s6.d1x {
    transition: all .6s ease-out 1s
}

.anime.s8 {
    transition: all .8s ease-out
}

.anime.s8.d2 {
    transition: all .8s ease-out .2s
}

.anime.s8.d3 {
    transition: all .8s ease-out .3s
}

.anime.s8.d4 {
    transition: all .8s ease-out .4s
}

.anime.s8.d6 {
    transition: all .8s ease-out .6s
}

.anime.s8.d8 {
    transition: all .8s ease-out .8s
}

.anime.s8.d1x {
    transition: all .8s ease-out 1s
}

.anime.s1x {
    transition: all 1s ease-out
}

.anime.s1x.d2 {
    transition: all 1s ease-out .2s
}

.anime.s1x.d4 {
    transition: all 1s ease-out .4s
}

.anime.s1x.d6 {
    transition: all 1s ease-out .6s
}

.anime.s1x.d8 {
    transition: all 1s ease-out .8s
}

.anime.s1x.d1x {
    transition: all 1s ease-out 1s
}

.anime.s2x {
    transition: all 2s ease-out
}

.anime.s2x.d2 {
    transition: all 2s ease-out .2s
}

.anime.s2x.d4 {
    transition: all 2s ease-out .4s
}

.anime.s2x.d6 {
    transition: all 2s ease-out .6s
}

.anime.s2x.d8 {
    transition: all 2s ease-out .8s
}

.anime.s2x.d1x {
    transition: all 2s ease-out 2s
}

.anime.fade-in,
.anime.fade-out {
    opacity: 0
}

.anime.fade-in.viewport,
.anime.fade-out.viewport {
    opacity: 1
}

.anime.slide-top {
    transform: translate3d(0, -50%, 0)
}

.anime.slide-top.viewport {
    opacity: 1;
    transform: translateZ(0)
}

.anime.slide-right {
    transform: translate3d(50%, 0, 0)
}

.anime.slide-right.viewport {
    opacity: 1;
    transform: translateZ(0)
}

.anime.slide-bottom {
    transform: translate3d(0, 50%, 0)
}

.anime.slide-bottom.viewport {
    opacity: 1;
    transform: translateZ(0)
}

.anime.slide-left {
    transform: translate3d(-50%, 0, 0)
}

.anime.slide-left.viewport {
    opacity: 1;
    transform: translateZ(0)
}

#load {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 9999999;
    background: #fff
}

#load img {
    position: absolute;
    width: 100px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
}

.content .pagination {
    margin: 50px 0 0;
    background: none;
    width: 100%;
    height: auto;
    padding: 25px 0 0;
    border: none;
    display: block;
    clear: both
}

.content .pagination li {
    margin: 0 5px 0 0;
    padding: 0;
    display: inline-block
}

.content .pagination li.page-current {
    font-weight: 700;
    color: #fff;
    margin: -5px 5px 0 0;
    padding: 6px 9px
}

.content .pagination li:before {
    display: none
}

.content .pagination li a {
    color: #fff;
    padding: 4px 8px
}

.admin-bar header {
    top: 32px
}

div#wpadminbar li#wp-admin-bar-wp-logo {
    display: none
}

[class*=" icon-"],
[class^=icon-] {
    font-family: pebblefonts!important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    -webkit-font-feature-settings: normal;
    font-feature-settings: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-arrow-bold-down:before {
    content: "\E900"
}

.icon-arrow-bold-left:before {
    content: "\E901"
}

.icon-arrow-bold-right:before {
    content: "\E902"
}

.icon-arrow-bold-up:before {
    content: "\E903"
}

.icon-arrow-double-down:before {
    content: "\E904"
}

.icon-arrow-double-left:before {
    content: "\E905"
}

.icon-arrow-double-right:before {
    content: "\E906"
}

.icon-arrow-double-up:before {
    content: "\E907"
}

.icon-arrow-left-full:before {
    content: "\E929"
}

.icon-arrow-right-full:before {
    content: "\E92A"
}

.icon-arrow-down:before {
    content: "\E908"
}

.icon-arrow-left:before {
    content: "\E909"
}

.icon-arrow-right:before {
    content: "\E90A"
}

.icon-arrow-up:before {
    content: "\E90B"
}

.icon-calendar-o:before {
    content: "\E90C"
}

.icon-calendar-tick:before {
    content: "\E90D"
}

.icon-calendar:before {
    content: "\E90E"
}

.icon-circle-o:before {
    content: "\E90F"
}

.icon-circle:before {
    content: "\E910"
}

.icon-cross:before {
    content: "\E911"
}

.icon-cursor:before {
    content: "\E912"
}

.icon-download:before {
    content: "\E913"
}

.icon-envelope-o:before {
    content: "\E914"
}

.icon-envelope:before {
    content: "\E915"
}

.icon-facebook:before {
    content: "\E916"
}

.icon-fax:before {
    content: "\E927"
}

.icon-google-plus:before {
    content: "\E917"
}

.icon-heart-o:before {
    content: "\E918"
}

.icon-heart:before {
    content: "\E919"
}

.icon-instagram:before {
    content: "\E91A"
}

.icon-linkedin:before {
    content: "\E92B"
}

.icon-map-marker:before {
    content: "\E91B"
}

.icon-navigation:before {
    content: "\E926"
}

.icon-phone-mobile:before {
    content: "\E91C"
}

.icon-phone:before {
    content: "\E91D"
}

.icon-pinterest:before {
    content: "\E91E"
}

.icon-play:before {
    content: "\E91F"
}

.icon-plus:before {
    content: "\E928"
}

.icon-star:before {
    content: "\E920"
}

.icon-tick:before {
    content: "\E921"
}

.icon-trip-advisor:before {
    content: "\E922"
}

.icon-twitter:before {
    content: "\E923"
}

.icon-youtube-play:before {
    content: "\E924"
}

.icon-youtube:before {
    content: "\E925"
}

form.wpcf7-form .ajax-loader {
    background-image: url("https://thebespokecorner.com/wp-content/themes/BespokeCornerTailors/css/img/system/ajax-loader.gif");
    background-size: cover;
    width: 30px;
    height: 30px;
    margin: 20px;
    position: absolute
}

form.wpcf7-form br {
    display: none!important
}

form.wpcf7-form span.wpcf7-not-valid-tip {
    position: absolute;
    left: 0;
    top: -17px;
    display: inline-block;
    background: #e23434;
    width: 379.5px;
    height: 2px;
    color: transparent
}

form.wpcf7-form div.wpcf7-response-output {
    font: 300 15px/1.5em Brown, sans-serif;
    color: #6f6f6f
}

form.wpcf7-form input.wpcf7-not-valid::-moz-placeholder,
form.wpcf7-form input.wpcf7-not-valid::-ms-input-placeholder,
form.wpcf7-form input.wpcf7-not-valid::-webkit-input-placeholder {
    line-height: 1.56em;
    opacity: 1;
    color: #d9534f;
    font: 300 15px/1.5em Brown, sans-serif
}

form.wpcf7-form textarea.wpcf7-not-valid::-moz-placeholder,
form.wpcf7-form textarea.wpcf7-not-valid::-ms-input-placeholder,
form.wpcf7-form textarea.wpcf7-not-valid::-webkit-input-placeholder {
    line-height: 1.56em;
    opacity: 1;
    color: #d9534f
}

form.wpcf7-form .wpcf7-recaptcha {
    position: relative!important;
    top: 0;
    z-index: 99!important
}

form.wpcf7-form .wpcf7-mail-sent-ng,
form.wpcf7-form .wpcf7-spam-blocked,
form.wpcf7-form .wpcf7-validation-errors {
    color: #e23434!important
}

form.wpcf7-form .wpcf7-mail-sent-ng,
form.wpcf7-form .wpcf7-mail-sent-ok,
form.wpcf7-form .wpcf7-spam-blocked,
form.wpcf7-form .wpcf7-validation-errors {
    background: #eee!important;
    width: 100%!important;
    font: 300 15px/1.5em Brown, sans-serif;
    margin: 5px 0 30px!important;
    padding: 10px 20px!important;
    border: none!important;
    text-align: center
}

form.wpcf7-form .wpcf7-mail-sent-ok {
    color: #357d52!important
}

.form div {
    width: 100%;
    float: left
}

.form .nice-select,
.form input[type=email],
.form input[type=text],
.form textarea {
    background: none;
    color: #333;
    border: none;
    border-bottom: 2px solid #eee;
    width: 48%;
    float: left;
    font: 300 15px/1em Brown, sans-serif;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0
}

.form textarea {
    border: 2px solid #eee;
    padding: 10px 15px
}

.form .nice-select,
.form input[type=email],
.form input[type=text] {
    height: 40px
}

.form input[type=submit] {
    cursor: pointer;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0
}

.form .nice-select.right,
.form input.right {
    float: right
}

.form .nice-select:focus,
.form input[type=text]:focus,
.form textarea:focus {
    border-color: #ccc
}

.form input::-webkit-input-placeholder {
    line-height: 1.56em;
    opacity: 1;
    color: #222223;
    font: 300 15px/1.2em Brown, sans-serif
}

.form input:-moz-placeholder,
.form input::-moz-placeholder {
    line-height: 1.56em;
    opacity: 1;
    color: #222223;
    font: 300 15px/1.2em Brown, sans-serif
}

.form input:-ms-input-placeholder {
    line-height: 1.56em;
    opacity: 1;
    color: #222223;
    font: 300 15px/1.2em Brown, sans-serif
}

.form textarea {
    width: 100%;
    height: auto;
    resize: vertical
}

.form textarea::-webkit-input-placeholder {
    line-height: 1.56em;
    opacity: 1;
    color: #222223
}

.form textarea:-moz-placeholder,
.form textarea::-moz-placeholder {
    line-height: 1.56em;
    opacity: 1;
    color: #222223
}

.form textarea:-ms-input-placeholder {
    line-height: 1.56em;
    opacity: 1;
    color: #222223
}

.form input[type=submit],
.form input[type=text],
.form textarea {
    border-radius: 0;
    -webkit-border-radius: 0;
    -webkit-appearance: none
}

.form input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 30px #f4f4f2 inset
}

.form input.error {
    border-color: #e23434
}

.nice-select {
    -webkit-tap-highlight-color: transparent;
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    outline: none;
    position: relative;
    text-align: left!important;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap
}

.nice-select span.current {
    position: absolute;
    top: 30%
}

.nice-select:hover {
    border-color: #dbdbdb
}

.nice-select.open,
.nice-select:active,
.nice-select:focus {
    border-color: #999
}

.nice-select:after {
    border-bottom: 2px solid #ccc;
    border-right: 2px solid #ccc;
    content: "";
    display: block;
    height: 12px;
    margin-top: -4px;
    pointer-events: none;
    position: absolute;
    right: 12px;
    top: 50%;
    transform-origin: 66% 66%;
    transform: rotate(45deg);
    transition: all .15s ease-in-out;
    width: 12px
}

.nice-select.open:after {
    transform: rotate(-135deg)
}

.nice-select.open .list {
    opacity: 1;
    pointer-events: auto;
    transform: scale(1) translateY(0)
}

.nice-select.disabled {
    border-color: #ededed;
    color: #999;
    pointer-events: none
}

.nice-select.disabled:after {
    border-color: #ccc
}

.nice-select.right .list {
    left: auto;
    right: 0
}

.nice-select .list {
    background-color: #fafafa;
    width: 100%;
    box-shadow: 0 0 2px 1px rgba(68, 68, 68, .11);
    box-sizing: border-box;
    opacity: 0;
    overflow: hidden;
    padding: 0;
    pointer-events: none;
    position: absolute;
    top: 100%;
    left: 0;
    transform-origin: 50% 0;
    transform: scale(.75) translateY(-21px);
    transition: all .2s cubic-bezier(.5, 0, 0, 1.25), opacity .15s ease-out;
    z-index: 9
}

.nice-select .list:hover .option:not(:hover) {
    background-color: transparent!important
}

.nice-select .option {
    cursor: pointer;
    line-height: 40px;
    list-style: none;
    min-height: 40px;
    outline: none;
    padding-left: 13px;
    padding-right: 29px;
    text-align: left;
    border-bottom: 1px solid #ececec;
    transition: all .2s
}

.nice-select .option:hover {
    background-color: #454545;
    color: #fff
}

.nice-select .option.disabled {
    background-color: transparent;
    color: #999;
    cursor: default
}

.booking-panel .booking .btn.adults,
.booking-panel .booking .btn.children {
    width: 48%;
    position: relative
}

.booking-panel .booking .btn.children {
    float: right
}

.booking-panel .booking .btn.adults input,
.booking-panel .booking .btn.children input {
    width: 100%
}

.booking-panel .booking .btn.adults label,
.booking-panel .booking .btn.children label {
    pointer-events: none;
    position: absolute;
    bottom: 13px;
    left: 18px;
    font: 300 15px/1em Brown, sans-serif
}

.booking-panel .booking .btn.adults ul,
.booking-panel .booking .btn.children ul {
    position: absolute;
    top: 55px;
    left: 0;
    width: 70px;
    height: auto;
    overflow: hidden;
    display: none;
    z-index: 10;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, .07);
    transition: all .4s ease
}

.booking-panel .booking .btn.adults ul li,
.booking-panel .booking .btn.children ul li {
    background: #fff;
    width: 100%;
    font: 300 15px/1em Brown, sans-serif;
    color: #9b9b9b;
    padding: 7px 0 5px;
    text-align: center;
    cursor: pointer;
    list-style: none;
    margin: 0
}

.booking-panel .booking .btn.adults ul li.selected,
.booking-panel .booking .btn.children ul li.selected {
    background: #c7996c;
    color: #fff
}

.enquire-event-popup-underlay {
    z-index: 999991;
    position: fixed;
    background: hsla(0, 0%, 95%, .84);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none
}

.enquire-event-popup {
    top: 1%;
    width: 90%;
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 999992;
    display: none;
    max-width: 950px;
    padding: 40px 80px
}

.enquire-event-popup .close {
    position: absolute;
    top: 10px;
    right: 30px;
    left: auto;
    cursor: pointer
}

.enquire-event-popup h1 {
    margin: 0 0 .2em
}

.enquire-event-popup h3 {
    margin: 2em 0 0
}

.enquire-event-popup h3.call-title {
    margin: 2em 0 .7em
}

.enquire-event-popup .required-descriptor {
    font-size: 13px;
    color: #9b9b9b;
    line-height: 2.5
}

.enquire-event-popup .form .nice-select,
.enquire-event-popup .form input,
.enquire-event-popup .form textarea {
    margin-top: 12px
}

.enquire-event-popup .form .radio-right {
    margin-top: 25px;
    margin-bottom: 15px
}

.enquire-event-popup .form .radio-right span.wpcf7-list-item {
    margin: 0
}

.enquire-event-popup .form .radio-right .last {
    float: none
}

.enquire-event-popup .form input[type=radio] {
    margin-top: 0;
    margin-left: 40px;
    margin-right: 10px
}

.enquire-event-popup .form .radio-right .first input[type=radio] {
    margin-left: 0
}

.enquire-event-popup .form label {
    font: 300 15px/1em Brown, sans-serif;
    width: 48%;
    float: left;
    margin-top: 25px;
    margin-bottom: 15px
}

.enquire-event-popup .form input.fullwidth {
    float: none;
    width: 100%
}

.enquire-event-popup .form input.city,
.form input.country {
    width: 35%
}

.enquire-event-popup .form input.state {
    width: 26%;
    margin-left: 2%
}

.enquire-event-popup .form .radio-right {
    font: 300 15px/1em Brown, sans-serif;
    width: 48%;
    float: right
}

.enquire-event-popup .form textarea {
    height: 100px
}

.enquire-wedding-popup-underlay {
    z-index: 999991;
    position: fixed;
    background: hsla(0, 0%, 95%, .84);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none
}

.enquire-wedding-popup {
    top: 1%;
    width: 90%;
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 999992;
    display: none;
    max-width: 950px;
    padding: 40px 80px
}

.enquire-wedding-popup .close {
    position: absolute;
    top: 10px;
    right: 30px;
    left: auto;
    cursor: pointer
}

.enquire-wedding-popup h1 {
    margin: 0 0 .2em
}

.enquire-wedding-popup h3 {
    margin: 2em 0 0
}

.enquire-wedding-popup h3.call-title {
    margin: 2em 0 .7em
}

.enquire-wedding-popup .required-descriptor {
    font-size: 13px;
    color: #9b9b9b;
    line-height: 2.5
}

.enquire-wedding-popup .form .nice-select,
.enquire-wedding-popup .form input,
.enquire-wedding-popup .form textarea {
    margin-top: 12px
}

.enquire-wedding-popup .form .radio-right {
    margin-top: 25px;
    margin-bottom: 15px
}

.enquire-wedding-popup .form .radio-right span.wpcf7-list-item {
    margin: 0
}

.enquire-wedding-popup .form .radio-right .last {
    float: none
}

.enquire-wedding-popup .form input[type=radio] {
    margin-top: 0;
    margin-left: 40px;
    margin-right: 10px
}

.enquire-wedding-popup .form .radio-right .first input[type=radio] {
    margin-left: 0
}

.enquire-wedding-popup .form label {
    font: 300 15px/1em Brown, sans-serif;
    width: 48%;
    float: left;
    margin-top: 25px;
    margin-bottom: 15px
}

.enquire-wedding-popup .form input .fullwidth {
    float: none;
    width: 100%
}

.enquire-wedding-popup .form .radio-right {
    font: 300 15px/1em Brown, sans-serif;
    width: 48%;
    float: right
}

.enquire-wedding-popup .form textarea {
    height: 100px
}

.enquire-wedding-popup .nice-select.wpcf7-form-control.wpcf7-select.fullwidth {
    width: 100%
}

@keyframes bounce {
    0% {
        transform: translateY(0)
    }
    50% {
        transform: translateY(-15px)
    }
    to {
        transform: translateY(0)
    }
}

@keyframes rotating {
    0% {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(1turn)
    }
}

.rotating {
    animation: rotating 18s linear infinite
}

.animate-up {
    opacity: 0;
    transition: all 1.2s ease-out;
    transform: translateY(150px);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.animate-up.in-view {
    opacity: 1;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    transition-delay: .2s;
    -webkit-transition-delay: .2;
    position: relative;
}

.animate-up.exit-view {
    opacity: 0;
    transform: translate3d(0, -150px, 0);
    transition-delay: .2s
}

.animate-down {
    opacity: 0;
    transition: all .5s ease-out;
    transform: translateY(-30px);
    -webkit-transform: translateY(-30px);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.animate-down.show {
    opacity: 1;
    transform: translateY(0)
}

#booking-overlay .address,
#booking-overlay .booking,
#booking-overlay .contact,
#booking-overlay .subscribe,
#menu-overlay .address,
#menu-overlay .contact,
#menu nav ul li,
.footer-read-more ul li {
    position: relative
}

.booking-panel .booking .btn.adults ul li,
.booking-panel .booking .btn.children ul li,
.button,
.fade .slick-dots li,
.form .nice-select,
.form input,
.form input[type=submit],
.form input[type=text],
.form textarea,
.image a img,
.nice-select .option,
.rooms-list .room-listing a .image,
.scroll-top,
.toggle-text .question,
a,
button,
footer .pd img,
p.signup,
ul.sub-menu {
    transition: all .4s ease
}

ul.sub-menu2 {
    transition: all .4s ease
}


ul.sub-menu1 {
    transition: all .4s ease
}

hr {
    border-top: 1px solid #ddd
}

body::selection {
    background: #c59b69;
    color: #fff
}

body::-moz-selection {
    background: #c59b69;
    color: #fff
}

::-webkit-scrollbar-corner {
    background: transparent;
    display: none
}

::-webkit-scrollbar {
    width: 0px
}

::-webkit-scrollbar-track {
    background: #dfdfdf
}

::-webkit-scrollbar-thumb {
    background: #bbb
}

#tooltip {
    background: #333;
    position: absolute;
    width: auto;
    max-width: 400px;
    color: #fff;
    padding: 10px 15px;
    text-transform: uppercase;
    z-index: 9999;
    font: 700 16px/1em Lato, arial
}

body.preload * {
    transition: none!important
}

#container,
#wrapper {
    max-width: none
}

#container,
#wrapper,
.centre {
    margin: 0 auto;
    position: relative
}

.centre {
    max-width: 95%;
    width: 250%
}

main {
    background: #fff;
    padding: 55px 0 0
}

.home main {
    background: #fff;
    
}

.grey-bg {
    background: #f4f4f2
}

.white-bg {
    background: #fff
}

.mobile-view {
    display: none
}

.h2,
h1,
h2,
h3,
h4,
h5 {
    padding: 0;
    color: #000;
}


.h6,
h6 {
    padding: 0;
    color: #fff;
    font: 300 20px/1.3em din-2014, sans-serif;
}


h1 {
    font: 300 32px/1.3em din-2014, sans-serif;
    margin: 0 0 .8em
}

.h2,
h2 {
   font: 600 25px/1.3em din-2014, sans-serif;
}

.h2,
h2,
h3 {
    margin: 1em 0 .8em
}

h3 {
    font: 400 20px/1.3em din-2014, sans-serif;
    text-transform: uppercase;
    letter-spacing: .043em
}

.home h3 {
    letter-spacing: 0;
    text-transform: none
}

h4 {
    font: 400 14px/1.3em Brown, sans-serif;
    letter-spacing: .043em
}

h4,
h5 {
    text-transform: uppercase;
    margin: .8em 0 .5em
}

h5 {
    font: 400 13px/1.3em Brown, sans-serif;
    letter-spacing: .05em
}

.feature {
    position: relative;
    display: inline-block
}

.features li:nth-child(n+5) {
    display: none
}

.feature:after{
  top:50%;
  width:500px;
  display:block;
  margin-top:-1px;
  position:absolute;
  left:calc(100% + 15px);
}

.feature:after,
.features:before {
  content: "";
  /*border-bottom:1px dashed #000;*/
  height:2px;
  background-position:bottom;
  background-size:10px 2px;
  background-repeat:repeat-x;
  background-image:linear-gradient(to right, black 33%, rgba(255,255,255,1) 0%);
}

.features:before {
    width: 50px;
    margin-bottom: 4px;
    margin-left: 20px;
    margin-right: 20px;
    display: inline-block
}

body,
p {
    font: 300 15px/1.5em Brown, sans-serif;
    margin-bottom: .7em;
    color: #222223
}

p.small {
    font-size: 13px
}

.home-intro .text p,
p.intro {
   text-align: left;
}

p a {
    color: #000;
    font-weight: 400
}

.line-break {
    display: block
}

.footer-read-more,
.overlay-read-more,
.read-more {
    display: none
}

.internal main h1,
.internal main h2 {
    font: 400 18px/1.5em Brown, sans-serif;
    text-transform: uppercase;
    letter-spacing: .05em
}

main ul {
    list-style-type: none
}

main ul li {
    font: 300 15px/1.5em Brown, sans-serif;
    margin-bottom: .2em;
    color: #222223
}

i {
    font-style: italic
}

table {
    font: 400 15px/1.4em Brown, sans-serif;
    color: #222
}

table a {
    color: #00aeef;
    font-weight: 700
}

table.tabledefault td {
    padding: 5px
}

table.tabledefault td strong {
    margin: 0 0 5px;
    display: inline-block
}

table.tabledefault td#customfields {
    padding: 0
}

.toggle-content .answer.short {
    display: block
}

.toggle-content .answer.short.active,
.toggle-content .answerfull {
    display: none
}

.image img {
    width: 100%;
    max-width: 100%;
    height: auto;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.columns {
    display: -ms-flexbox;
    display: flex
}

.columns .text {
    position: relative
}

.vert-centre {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%)
}

.scroller {
    position: absolute;
    bottom: 50px;
    right: 30px
}

.scroller a {
    display: block;
    padding: 10px;
    animation: bounce 2s ease infinite
}

.arrow-down {
    width: 0;
    height: 0;
    border-left: 22px solid transparent;
    border-right: 22px solid transparent;
    border-top: 22px solid #d8d8d8
}

.scroll-top {
    display: none;
    opacity: 0;
    position: fixed;
    bottom: 50px;
    right: 30px;
    z-index: 99
}

.scroll-top a {
    display: block;
    padding: 10px
}

.arrow-up {
    width: 0;
    height: 0;
    /*border-left: 22px solid transparent;
    border-right: 22px solid transparent;
    border-bottom: 22px solid #d8d8d8*/
}

body.scroll .scroll-top {
    display: block;
    opacity: 1
}

.home #scroll {
    display: block;
    position: relative;
    top: -270px;
    visibility: hidden
}

.sticky-curate {
    position: fixed;
    bottom: 50px;
    right: 110px;
    z-index: 9998;
}

.one-col {
    width: 5.801104972%
}

.two-col {
    width: 14.364640883%
}

.three-col {
    width: 22.928176794%
}

.four-col {
    width: 43.491712705%
}

.five-col {
    width: 40.055248616%
}

.six-col {
    width: 48.618784527%
}

.seven-col {
    width: 57.182320438000005%
}

.eight-col {
    width: 65.74585634900001%
}

.nine-col {
    width: 74.30939226%
}

.ten-col {
    width: 82.87292817100001%
}

.eleven-col {
    width: 91.436464082%
}

.twelve-col {
    width: 99.999999993%
}

.eight-col,
.eleven-col,
.five-col,
.four-col,
.nine-col,
.one-col,
.seven-col,
.six-col,
.ten-col,
.three-col,
.twelve-col,
.two-col {
    position: relative;
    float: left;
    margin-left: 2.762430939%
}

body.internal .eight-col img,
body.internal .eleven-col img,
body.internal .five-col img,
body.internal .four-col img,
body.internal .nine-col img,
body.internal .one-col img,
body.internal .seven-col img,
body.internal .six-col img,
body.internal .ten-col img,
body.internal .three-col img,
body.internal .twelve-col img,
body.internal .two-col img {
    width: 100%;
    max-width: 100%;
    height: auto
}

.first {
    margin-left: 0
}

.last {
    float: right
}

.clearfix:before {
    content: "";
    display: table
}

.clearfix:after {
    clear: both
}

@media screen and (max-width:767px) {
    .w20,
    .w25,
    .w30,
    .w33,
    .w50,
    .w70,
    .w75,
    .w80 {
        width: 100%;
        float: none
    }
}

header {
    z-index: 9;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    background: transparent;
    width: 100%;
    display: block
}

.menu-wrap .centre,
header .centre {
    position: relative;
    max-width: none;
    width: calc(100% - 160px)
}

header,
header .centre {
    height: 0
}

header .logo {
    width: 280px;
    margin: auto;
    opacity: 1;
    transition: all .8s ease;
}

header .logo img {
    width: 280px;
	height:auto;
    margin:auto;
}

header .checkavailability {
    position: absolute;
    right: 30px;
    top: 10px;
    transition: none
}

header.fixed .checkavailability,
header.fixed .menu-wrap {
    position: fixed!important
}

header.fixed .checkavailability {
    right: 110px
}

.menu-wrap {
    position: absolute;
    top: 0;
    left: 0;
    background: transparent;
    width: 100%;
    z-index: 99999
}

.toggle-close,
.toggle-menu {
    position: absolute;
    top: 10px;
    left: 0;
    transform: rotate(0deg);
    cursor: pointer;
    padding-top: 20px;
    padding-bottom: 20px
}

.toggle-close {
    left: auto;
    right: 80px
}

a#pull,
a#pull-close,
a#sub-close {
    position: relative;
    display: block;
    width: 42px;
    height: 12px
}

a#pull-close span,
a#pull span,
a#sub-close span {
    position: absolute;
    height: 3px;
    width: 100%;
    background: #fff;
    border-radius: 0;
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: .25s ease-in-out
}

a#pull-close span:first-child,
a#pull span:first-child,
a#sub-close span:first-child {
    top: 0;
    transform-origin: left center
}

a#pull-close span:nth-child(2),
a#pull span:nth-child(2),
a#sub-close span:nth-child(2) {
    top: 8px;
    transform-origin: left center
}

.toggle-menu.active {
    position: fixed;
    left: 80px;
	top : 10px;
}

.subscribe-popup .toggle-close a#pull-close span:first-child,
.toggle-close.active a#pull-close span:first-child,
.toggle-menu.active a#pull span:first-child {
    transform: rotate(45deg);
    top: -11px;
    left: 5px
}

.subscribe-popup .toggle-close a#pull-close span:nth-child(2),
.toggle-close.active a#pull-close span:nth-child(2),
.toggle-menu.active a#pull span:nth-child(2) {
    transform: rotate(-45deg);
    top: 19px;
    left: 5px
}

@media only screen and (min-width:1060px) {
    body.scroll-down header,
    body.scroll-up header {
        position: fixed
    }
    body.scroll-down header.fixed .logo {
        transform: translateY(-200%)
    }
    body.scroll-up header.fixed .logo {
        transform: tranlateY(0)
    }
    body.subscribe-bar-active.scroll-down header,
    body.subscribe-bar-active.scroll-up header {
        position: absolute
    }
    body.subscribe-bar-active.scroll-down header.fixed,
    body.subscribe-bar-active.scroll-up header.fixed {
        position: fixed
    }
}

#menu-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 50%;
    padding: 175px 250px 0;
    height: 100%;
    z-index: 9999;
    opacity: 0.5;
    background-size: cover;
    text-align: left
}

#menu nav ul {
    padding: 0;
    margin: 0;
    list-style: none
}

#menu nav ul li {
    margin: 0 0 15px
}

#menu nav ul li a {
    font: 300 21px/1.35em din-2014, sans-serif;
    color: #F2F2F2;
    display: block;
    opacity:1 !important;
}


#menu nav ul li ul.sub-menu {
    opacity: 0;
    z-index: 1000;
    position: fixed;
    left: 368px;
    top: 294px;
    transform: translateY(10px);

    }


#menu nav ul li ul.sub-menu2 {
    opacity: 0;
    z-index: 1000;
    position: fixed;
    left: 538px;
    top: 314px;
    border:         none;
    border-left:    2px solid white;
    height:         10vh;
    width:          1px;  
       
}





#menu nav ul li ul.sub-menu2 li {
    margin: 0
}

#menu nav ul li ul.sub-menu2 li a {
    font-size: 15px;
    display: block;
    padding: 3px 0 4px
}



#menu nav ul li ul.sub-menu2:before {
    content: "";
    position: absolute;
    left: -30px;
    top: 3px;
    width: 12px;
    height: 16px;
    background: url("img/system/arrow-right.png") 100% 0 no-repeat;
    pointer-events: none
}

#menu nav ul li ul.sub-menu2 li {
    margin: 0
}

#menu nav ul li ul.sub-menu2 li a {
    font-size: 15px;
    display: block;
    padding: 3px 0 4px

}








#menu nav ul li ul.sub-menu2 li {
    margin: 0
}

#menu nav ul li ul.sub-menu2 li a {
    font-size: 15px;
    display: block;
    padding: 3px 0 4px
}



#menu nav ul li ul.sub-menu:before {
    content: "";
    position: absolute;
    left: -30px;
    top: 3px;
    width: 12px;
    height: 16px;
    background: url("img/system/arrow-right.png") 100% 0 no-repeat;
    pointer-events: none
}

#menu nav ul li ul.sub-menu li {
    margin: 0
}

#menu nav ul li ul.sub-menu li a {
    font-size: 15px;
    display: block;
    padding: 3px 0 4px

}


#menu nav ul li ul.sub-menu1 {
    opacity: 0;
    z-index: 1000;
    position: fixed;
    left: 569px;
    top: 293px;
    transform: translateY(10px)
}

#menu nav ul li ul.sub-menu1:before {
    content: "";
    position: absolute;
    left: -30px;
    top: 3px;
    width: 12px;
    height: 16px;
    background: url("img/system/arrow-right.png") 100% 0 no-repeat;
    pointer-events: none
}

#menu nav ul li ul.sub-menu1 li {
    margin: 0
}

#menu nav ul li ul.sub-menu1 li a {
    font-size: 15px;
    display: block;
    padding: 3px 0 4px
}




#booking-overlay .address p,
#booking-overlay .contact p,
#menu-overlay .address p,
#menu-overlay .contact p {
    font-size: 13px
}

#booking-overlay .address p a,
#booking-overlay .contact p a:not(.tel),
#menu-overlay .address p a,
#menu-overlay .contact p a:not(.tel) {
    color: #222223;
    font-weight: 400
}

#booking-overlay .address,
#menu-overlay .address {
    margin-top: 100px
}

#booking-overlay .contact,
#menu-overlay .contact {
    margin-top: 40px
}

.booking-col {
    width: 50%;
    float: left;
    height: 100%
}

#booking-overlay {
    display: none;
    position: fixed;
    height: 100%;
    width: 60%;
    top: 0;
    left: 50%;
    z-index: 9998;
    background: #transparent;
    background-size: cover;
    overflow-x: hidden;
    text-align: left
}

.booking-panel {
    padding: 100px 50px 0
}

.booking-panel .form input {
    margin-top: 20px
}

.booking-panel button {
    float: right;
    margin-top: 25px
}

.booking-panel .booking h2 {
    margin: 0
}

.booking-panel .booking {
    z-index: 1
}

.booking-panel .booking .form {
    display: inline-block;
    padding: 40px 0 110px
}

.booking-panel .booking .form .calendar,
.booking-panel .booking .form .guests {
    position: relative;
    padding-left: 45px
}

.booking-panel .booking .form .calendar:before,
.booking-panel .booking .form .guests:before {
    content: "";
    width: 25px;
    height: 25px;
    position: absolute;
    left: 0;
    bottom: 8px
}

.booking-panel .booking .form .calendar:before {
    background: url("https://thebespokecorner.com/wp-content/themes/BespokeCornerTailors/css/img/system/icon-calendar.png") no-repeat top;
    background-size: cover
}

.booking-panel .booking .form .guests:before {
    background: url("https://thebespokecorner.com/wp-content/themes/BespokeCornerTailors/css/img/system/icon-guests.png") no-repeat top;
    background-size: cover
}

.booking-panel .subscribe {
    margin: 0
}

.booking-panel .subscribe .form input[type=email] {
    width: calc(100% - 160px)
}

.booking-panel .subscribe button {
    position: absolute;
    right: 0;
    bottom: 33px
}

.booking-panel .subscribe .line-break {
    margin-top: 2px
}

.booking-panel .subscribe p.small {
    margin-top: 15px
}

body.menu-active #booking-overlay .toggle-close {
    display: none
}

body.booking-active #booking-overlay .toggle-close {
    display: block!important
}

body.booking-active .logo,
body.scroll.booking-active .scroll-top,
body.scroll.menu-active .scroll-top {
    opacity: 0
}

.page-id-714 .booking-panel {
    padding: 350px 200px 0
}

.hero,
.slideshow {
    position: relative;
    overflow: hidden;
    max-height: 100vh;
    height: 100%
}

.hero img,
.slideshow .fade .slick-slide img {
    min-height: 100%;
    width: auto;
    height:100vh;
    min-width: 100%;
    max-width: none
}

.home-intro .greeting {
    width: calc(50% - 40px)
}

.home-intro .greeting .h2 {

    margin: 0 0 .8em;
    text-align: left
}

.home-intro .greeting .fade a.nav {
    display: none!important
}

.home-intro .text {
  /*margin-left: -40px;
  width: calc(50% + 40px);*/
}

.home-intro .text p.intro {
    margin: 0
}

.accommodation .text .inner,
.dining .text .vert-centre,
.facilities .text .inner,
.nightfall .text .vert-centre {
    max-width: 400px
}

.accommodation .text {
    width: calc(50% - 40px);
    margin-top: 20%
}

.accommodation .text img {
    width: 460px;
    max-width: 100%;
    margin-top: 120px;
    height: auto
}

.accommodation .image.six-col {
    width: calc(50% + 40px);
    margin-left: -40px
}

.facilities .text .inner {
    padding-top: 17%
}

.facilities .image.last {
    padding-left: 20px
}

.facilities .image.last img {
    max-width: 450px
}

.facilities .image.first {
    width: calc(50% + 60px);
    margin-top: -70px;
	background-color:#fff;
}

.facilities .image.last.illustration {
    width: calc(50% - 60px);
    padding-top: 120px;
    margin-left: 0;
    padding-left: 70px
}

.facilities .image.last.illustration img {
    max-width: 350px
}

.dining {
    padding: 20px 0 0
}

.dining .vert-centre {
    top: 100px
}

.nightfall {
    padding: 0 0 115px
}

.nightfall .text .vert-centre {
    top: 65%
}

.nightfall .image {
    margin-left: -30px;
    margin-top: -40px
}

.apartments {
    padding: 115px 0
}

.apartments .text .vert-centre {
    max-width: 440px
}

.apartments .feature{
  color:#fff;
}

.apartments .feature::after{
  width:100%;
  border-color:#fff;
}

.grecaptcha-badge {
    display: none!important
}

.content-nav {
    font: 300 15px/1.5em Brown, sans-serif
}

.internal .row {
    padding: 60px 0 70px
}

.internal p.cta {
    margin-top: 40px
}

.content-nav {
    display: inline-block;
    margin-left: 80px
}

.content-nav a {
    color: #9b9b9b;
    border-bottom: 2px solid #fff;
    margin: 0 10px;
    padding: 6px;
    cursor: pointer
}

.content-nav a.active {
    border-bottom: 2px solid #9b9b9b
}

.internal #instaboxes ul li img {
    margin-top: 0;
    margin-bottom: 0
}

.rooms h1 {
    margin-bottom: 50px
}

.rooms .rooms-list .room-listing p {
    font-size: 14px
}

.rooms-list {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.rooms-list .room-listing {
    margin-bottom: 32px
}

.rooms-list .room-listing h3 {
    margin-top: 22px;
    margin-bottom: 8px
}

.rooms-list .room-listing:nth-child(3n) {
    float: right
}

.rooms-list .room-listing:first-child,
.rooms-list .room-listing:nth-child(3n+4) {
    margin-left: 0
}

.rooms-list .pagination {
    display: none
}

.accomm-detail {
    padding: 35px 0 0
}

.single-room {
    padding-bottom: 70px
}

.single-room .button {
    margin-top: 15px
}

.single-room .features .hidden-content,
.single-room .five-col.first.clearfix.features:before {
    display: none
}

.single-room .toggle-content {
    color: #9b9b9b;
    cursor: pointer
}

.more-rooms {
    padding: 70px 0
}

.more-rooms h2 {
    text-align: center;
    margin: 0 0 1.3em
}

.single-room .ten-col.image {
    margin-top: 60px
}

.single-room .cta {
    text-align: center
}

.single-room .magazine-style .image.nine-col {
    margin: -50px 0 25px
}

.single-room .magazine-style .text .vert-centre {
    max-width: 450px
}

.single-room .image.six-col.last {
    margin-top: -400px
}

.single-room .junior-suite .image.six-col.last {
    margin-top: -90px
}

.neighbourhood {
    padding: 80px 0
}

.internal .neighbourhood h1 {
    margin: 0
}

.neighbourhood .image.main {
    margin-top: 50px
}

.neighbourhood .cta {
    text-align: center
}

.architecture .image.six-col.last,
.corporate .image.six-col.last,
.events .image.six-col.first,
.neighbourhood .image.six-col.last,
.our-story .image.six-col.first,
.single-room .image.six-col.first,
.weddings .image.six-col.first,
.wellbeing .image.six-col.first {
    margin-top: 40px
}

.architecture .image.six-col.first,
.neighbourhood .image.six-col.first,
.our-story .image.six-col.last,
.wellbeing .image.six-col.last {
    margin-top: -115px
}

.architecture .image.ten-col,
.neighbourhood .image.ten-col {
    margin-top: 30px
}

.architecture .text,
.neighbourhood .text {
    padding: 0 80px
}

.our-story .text {
    padding: 0 80px 0 0
}

.our-story .text .vert-centre {
    max-width: 450px
}

.architecture .image.six-col.middle,
.our-story .image.six-col.middle {
    float: none;
    margin: 30px auto
}

.architecture {
    padding: 60px 0 95px
}

.meetings h1 {
    display: inline-block
}

.page-id-785 main,
.page-id-787 main {
    padding-top: 50px
}

.meetings .row.content-nav-wrap {
    padding-bottom: 0
}

.meetings .ten-col.image {
    margin-top: 40px
}

.meetings .corporate a.tel {
    color: #9b9b9b
}

.events .magazine-style .text .vert-centre,
.weddings .magazine-style .text .vert-centre {
    max-width: 450px
}

.corporate .nine-col,
.events .nine-col,
.weddings .nine-col {
    margin: 25px 0 0
}

.corporate .image.six-col.first,
.page-id-787 .events .image.six-col.first {
    margin-top: -500px
}

.corporate .image.six-col.first .row,
.events .image.six-col.first {
    padding: 60px 0 0
}

.meetings .corporate .magazine-style .ten-col.event.last {
    margin-top: -100px
}

.meetings .vert-centre {
    top: 35%
}

.meetings .seven-col .ten-col {
    margin-top: -300px;
    margin-bottom: 100px
}

.weddings .image.six-col.last {
    margin-top: -450px
}

.weddings .seven-col .ten-col {
    margin-top: 70px;
    margin-bottom: 100px
}

.weddings .vert-centre {
    top: 60%
}

.page-template-page-weddings .slideshow .slick-dots {
    visibility: hidden
}

.floorplan {
    margin-top: 20px;
    padding: 100px 0 140px
}

.floorplan h1 {
    margin-bottom: 80px
}

.floorplan .slider .item .six-col.last.text {
    padding-top: 80px
}

.floorplan .slider .item .image {
    width: 80%;
    margin: auto
}

.floorplan .slick-dots {
    float: left;
    z-index: 9;
    margin-top: -420px;
    position: absolute;
    cursor: pointer
}

.page-id-787 .floorplan .slick-dots {
    float: left;
    z-index: 9;
    margin-top: -540px;
    position: absolute;
    cursor: pointer
}

.floorplan .slick-dots h3 {
    position: relative;
    display: inline-block;
    cursor: pointer
}

.floorplan .slick-dots li h3 {
    color: rgba(184, 139, 95, .49)
}

.floorplan .slick-dots li h3:active,
.floorplan .slick-dots li h3:hover {
    color: #b88b5f
}

.floorplan li.slick-active a .feature:after {
    visibility: visible;
    width: 75px
}

.floorplan li.slick-active a h3 {
    color: #b88b5f
}

.floorplan .slider {
    overflow: visible!important
}

.floorplan li a .feature:after {
    visibility: hidden;
    width: 0;
    transition: all .3s ease
}

.floorplan li a .feature:hover:after {
    visibility: visible;
    width: 75px;
    transition: all .3s ease
}

.floorplan .seating-title {
    font-weight: 400
}

.floorplan table tr td {
    width: 300px;
    line-height: 2
}

.floorplan table {
    text-transform: uppercase;
    font: 300 14px/1.5em Brown, sans-serif;
    color: #222223
}

.floorplan hr {
    margin: 20px 0
}

.wellbeing {
    padding: 80px 0
}

.wellbeing .facility:nth-child(3n+1) {
    margin-left: 0
}

.wellbeing .facility .text {
    padding: 20px 0 35px
}

.wellbeing .facility .text .desc {
    margin: 0 0 30px;
    min-height: 185.5px
}

.wellbeing .facility .text .last {
    text-align: right
}

.wellbeing .facility .subtitle,
.wellbeing .facility .subtitle p,
.wellbeing .facility a:not(.button) {
    color: #9b9b9b;
    display: block
}

.wellbeing .magazine-style .text {
    margin: 110px 0 0
}

.wellbeing .magazine-style .image.eight-col.last {
    margin: 0 0 85px
}

.wellbeing .magazine-style .text .vert-centre {
    max-width: 450px
}

.promotions-page h1 {
    display: inline-block
}

.promotions-page h2 {
    margin-top: 0
}

.promotions-page .blurb p {
    max-width: 480px
}

.promotions-page .toggle-content {
    padding: 40px 0 80px
}

.promotions-page .promotion:nth-child(3n+1) {
    margin-left: 0
}

.promotions-page .promotion .text {
    padding: 10px 0 35px
}

.promotions-page .six-col {
    margin-left: 0
}

.promotions-page .promotion .text .button {
    margin: 10px 0 0
}

.promotions-page .toggle-text {
    margin-right: 20px
}

.promotions-page .ten-col {
    -ms-flex-direction: row;
    flex-direction: row
}

.promotions-page .ten-col,
body.friends_of_calile .filtr-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

body.friends_of_calile .filtr-container .filtr-item {
    width: 50%;
    height: 120px;
    margin: 0;
    padding: 0;
    float: left;
    display: block
}

body.friends_of_calile .filtr-container .filtr-item .table {
    width: 90%;
    min-width: 90%;
    max-width: 90%;
    height: 120px;
    margin: 0;
    padding: 0;
    display: table
}

body.friends_of_calile .filtr-container .filtr-item .toggle-text {
    margin: 0;
    padding: 0;
    color: #9b9b9b;
    vertical-align: middle;
    display: table-cell
}

body.friends_of_calile .filtr-container .filtr-item .toggle-text h3 {
    margin: 0 0 5px;
    padding: 0
}

body.friends_of_calile .filtr-container .filtr-item .toggle-text p {
    margin: 0;
    padding: 0
}

body.friends_of_calile .filtr-container .filtr-item .toggle-text p a {
    color: #9b9b9b;
    opacity: 1
}

body.friends_of_calile .filtr-container .filtr-item .toggle-text .question:after {
    top: 9px;
    right: 0
}

body.friends_of_calile .filtr-container .filtr-item .toggle-text .question:before {
    top: 0;
    right: 10px
}

body.friends_of_calile .filtr-container .filtr-item .toggle-text .answer {
    clear: both
}

body.friends_of_calile #lookforsymbol .features {
    margin-top: 40px
}

body.friends_of_calile #lookforsymbol h5 {
    text-transform: none
}

body.friends_of_calile #lookforsymbol {
    margin-top: 30px;
    display: inherit
}

body.friends_of_calile .footer-wrap {
    display: none
}

.friendsofcalilefooter {
    margin: 10px;
    margin-bottom: 10px;
    margin-top: 60px
}

.friendsofcalilefooter p {
    color: #9b9b9b;
    font-size: 12px
}

body.friends_of_calile .row.grey-bg.clearfix {
    margin-top: 20px
}

.friendsofcalilefooter .four-col.last {
    right: 75px
}

.promotions_slider .image {
    float: right!important
}

.promotions_slider .text {
    float: left!important;
    position: absolute;
    top: 20%
}

.promotions_slider .eight-col {
    float: none!important;
    margin: auto;
    padding-top: 50px;
    padding-bottom: 50px
}

.promotions_slider .six-col {
    margin-left: 0
}

.promotions_slider h1 {
    margin: 0
}

.promotions_slider .button.secondary {
    background: transparent;
    border: 1px solid #b88b5f;
    margin-top: 20px
}

.promotions_slider .button.secondary:hover {
    background: #b88b5f
}

.promotions_slider .slidergrey,
.promotions_slider .slidergreybook {
    text-transform: capitalize;
    color: #9b9b9b
}

.promotions_slider .tel {
    float: left;
    width: 100%;
    margin-top: 30px
}

.promotions_slider .slidergreyterms {
    color: #9b9b9b;
    margin-top: 30px;
    font-size: 12px!important
}

.promotions_slider .fade .slick-slide {
    overflow: visible
}

.promoslidercontent {
    margin-top: 40px;
    margin-bottom: 40px
}

.promotions_slider ul.slick-dots {
    display: none!important
}

.promotions_slider a.nav.prev {
    background: url(https://thebespokecorner.com/wp-content/themes/BespokeCornerTailors/css/img/system/sliderarrowleft.png)
}

.promotions_slider a.nav.next {
    background: url(https://thebespokecorner.com/wp-content/themes/BespokeCornerTailors/css/img/system/sliderarrowright.png)
}

.promotions_slider .fade.slick-initialized.slick-slider.slick-dotted {
    padding-right: 50px;
    padding-left: 50px
}

.retail-page h1 {
    display: inline-block
}

.retail-page .retail:nth-child(3n+1) {
    margin-left: 0
}

.retail-page .retail .text {
    padding: 10px 0 35px
}

.retail-page .retail .text h3 {
    display: inline-block
}

.retail-page .retail .text .desc {
    margin: 0 0 28px;
    min-height: 88px
}

.retail-page .retail .text .button {
    margin: 20px 0 0
}

.retail-page .retail .subcategory,
.retail-page .retail a:not(.button) {
    color: #9b9b9b;
    display: block
}

.retail-page .retail .subcategory {
    float: right;
    padding: 10px
}

.retail-page .ten-col {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.latest-news h1 {
    display: inline-block
}

.latest-news .footer-wrap {
    background: #f4f4f2
}

.latest-news .load {
    color: #9b9b9b;
    text-align: center;
    margin: 0 0 50px
}

.latest-news .articles {
    margin: 25px 0 50px -25px
}

.latest-news .articles:after,
.news-single .news-list:after {
    content: "";
    display: table;
    clear: both
}

.latest-news .articles .box,
.news-single .news-list .box {
    width: 33%;
    padding: 0 0 25px 25px;
    float: left
}

.latest-news .articles .box p,
.news-single .news-list .box p {
    min-height: 44px
}

.latest-news .articles .box .image,
.news-single .news-list .box .image {
    width: 100%;
    height: 365px;
    margin: 0 0 25px;
    overflow: hidden
}

.latest-news .articles .box .image img,
.news-single .news-list .box .image img {
    width: 100%;
    height: 100%;
    transition: all .5s ease-in-out;
    -webkit-backface-visibility: hidden;
    -o-object-fit: cover;
    object-fit: cover;
    display: block
}

.latest-news .articles .box h3 a,
.news-single .news-list .box h3 a {
    font-weight: 400;
    color: #b88b5f
}

.latest-news .articles .box p.date,
.news-single .news-list .box p.category,
.news-single .news-list .box p.date,
.news .articles .box p.category {
    color: #9b9b9b;
    margin: 0;
    float: left
}

.latest-news .articles .box p.category,
.news-single .news-list .box p.category {
    float: right
}

.latest-news .articles .box p.category {
    margin-top: -3px;
    font-size: 13px
}

.latest-news .articles .box,
.latest-news .articles .box:after,
.latest-news .articles .box:before,
.news-single .news-list .box,
.news-single .news-list .box:after,
.news-single .news-list .box:before {
    box-sizing: border-box
}

.latest-news .articles .box.prioritise .text {
    position: relative
}

.latest-news .articles .box.prioritise .text p.category {
    position: absolute;
    top: 0;
    right: 0
}

.latest-news .articles .box:nth-child(13n+6),
.latest-news .articles .box:nth-child(13n+7),
.latest-news .articles .box:nth-child(13n+11),
.latest-news .articles .box:nth-child(13n+13),
.news-single .news-list .box:nth-child(4),
.news-single .news-list .box:nth-child(5),
.news-single .news-list .box:nth-child(9),
.news-single .news-list .box:nth-child(11) {
    width: 25%
}

.news-single table a {
    color: #b88b5f
}

.latest-news .articles .box:nth-child(13n+8),
.latest-news .articles .box:nth-child(13n+12),
.news-single .news-list .box:nth-child(6),
.news-single .news-list .box:nth-child(10) {
    width: 50%
}

.latest-news .articles .box:nth-child(13n+1),
.latest-news .articles .box:nth-child(13n+10),
.news-single .news-list .box:nth-child(8) {
    width: 66.66%
}

.latest-news .articles .pagination {
    display: none
}

main.news-main {
    background: #f4f4f2
}

main.news-main h1 {
    font: 300 22px/1.3em Beausite Light, sans-serif;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 .2em
}

.news-single .release-date {
    color: #9b9b9b;
    margin-bottom: 1.7em
}

.news-single .category {
    color: #9b9b9b;
    margin-bottom: 1.5em
}

.news-single .seven-col {
    width: 55%
}

.news-single .footer-wrap {
    background: #f4f4f2
}

.news-single .related-news h2 {
    text-align: center
}

.news-single .related-news .news-list h3 {
    text-align: left
}

.news-single main .toggle-close {
    top: -20px;
    right: 0;
    padding-top: 10px;
    padding-bottom: 10px;
    left: auto
}

.news-single main a#sub-close {
    width: 32px;
    height: 32px
}

.news-single main a#sub-close span:first-child {
    transform: rotate(45deg);
    top: 0;
    left: 5px
}

.news-single main a#sub-close span:nth-child(2) {
    transform: rotate(-45deg);
    top: 23px;
    left: 5px
}

.news-single .news-list {
    margin: 40px 0 30px
}

.news-single .more {
    margin-top: 30px
}

.news-single .more a {
    color: #9b9b9b
}

.faqs {
    margin-bottom: 80px
}

.toggle-text .question {
    position: relative
}

.toggle-text .question:after {
    position: absolute;
    top: 50%;
    right: 20px;
    content: "";
    background: #979797;
    width: 20px;
    height: 1px
}

.toggle-text .question:before {
    opacity: 1;
    position: absolute;
    top:50%;
    right: 30px;
    content: "";
    background: #979797;
    width: 1px;
    height: 20px;
    transform-origin: left center;
    transform: rotate(0deg) translateY(-50%);
    transition: .25s ease-in-out
}

.toggle-text .question.active:before {
    transform: rotate(90deg);
    opacity: 0
}

.toggle-text .feature:after {
    width: 69px
}

.toggle-content {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    display: -ms-flexbox;
    display: flex
}

.toggle-text {
    padding: 25px 0;
    border-top: 1px solid #dbd9d6
}

.column {
    float: left;
    width: calc(50% - 15px);
    padding: 0 0 100px
}

.access {
    -ms-flex-pack: justify;
    justify-content: space-between
}

.access .image {
    padding: 20px 0 0;
    max-width: 100%
}

.access-posts .text {
    padding: 20px 0
}

.access-posts .toggle-text .question:before {
    top: 50%;
    transform: translateY(-50%)
}

.access-posts .feature {
    margin-right: 100px
}

.access-posts .feature:after {
    position: static;
    display: inline-block;
    margin: 0 0 5px 10px
}

.access-posts ul li {
    padding: 0 0 0 15px;
    position: relative
}

.access-posts ul li:before {
    content: "-";
    position: absolute;
    top: 10px;
    transform: translateY(-50%);
    left: 0
}

body.grey-footer .footer-wrap {
    background: #f4f4f2
}

body.single-pebble_accommodation .footer-wrap {
    background: #fff
}

.terms .text-blocks .text {
    padding: 15px 0 25px;
    border-top: 1px solid #dbd9d6
}

.terms .feature:after {
    width: 69px
}

.terms .footer-wrap {
    background: #f4f4f2
}

.subscribe-form h3 {
    text-transform: none;
    margin-top: 60px
}

.subscribe-form p {
    margin-bottom: 50px
}

.gymnasium {
    padding: 80px 0
}

.gymnasium table {
    max-width: 300px;
    width: 100%;
    margin-bottom: 20px
}

.gymnasium table tbody tr td {
    border-bottom: .5px solid #222223;
    font: 300 15px/2em Brown, sans-serif;
    margin-bottom: .7em;
    color: #222223
}

.gymnasium table tbody tr td:nth-child(2n) {
    text-align: right
}

.gymnasium .gym:nth-child(3n+1) {
    margin-left: 0!important
}

.gymnasium .gym a {
    color: #9b9b9b;
    display: block
}

.gymnasium .gym .text {
    padding: 10px 0 35px
}

.gymnasium .gym .text .desc {
    margin: 0 0 20px
}

.gymnasium .gym .text .trainers-extra {
    margin: 20px 0;
    color: #9b9b9b
}

.gymnasium .gym .text .trainers-extra .trainers-spec {
    margin: 10px 0 20px
}

.gymnasium .centre .trainers .ten-col {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.gymnasium .centre .trainers .ten-col .four-col {
    margin-left: 2.7%
}

.gymnasium .magazine-style .text {
    margin: 60px 0 0
}

.gymnasium .magazine-style .image.eight-col.last {
    margin: 0 0 85px
}

.gymnasium .magazine-style .text .vert-centre {
    max-width: 450px
}

.gymnasium .image.six-col.first {
    margin-top: 40px
}

.gymnasium .magazine-style .ten-col.last .five-col.last.image {
    margin-top: -140px
}

.button,
button {
    cursor: pointer;
    display: inline-block;
    font: 400 13px/13px Brown, sans-serif;
    color: #fff;
    background: #2c2c2c;
    text-transform: uppercase;
    padding: 18px 35px;
    letter-spacing: .09em
}

.button.info:after {
    content: "";
    background: url("https://thebespokecorner.com/wp-content/themes/BespokeCornerTailors/css/img/system/icon-download.svg");
    width: 11px;
    height: 13px;
    background-size: cover;
    background-repeat: no-repeat;
    float: right;
    margin-left: 10px
}

.button.secondary,
button.secondary {
    background: #fff;
    color: #2c2c2c;
    border:1px solid #d4d4d4
}

.footer-top {
    overflow: auto;
    padding: 35px 0;
}

.footer-top .centre {
    position: static
}

.footer-top .social {
  position:absolute;
  right:0;
  top:50%;
  width:48vw;
  transform:translateY(-50%);
}

.footer-top .social h5.feature{
  padding-left:66px;
  display:block;
}

.footer-top .social h5.feature a {
  color:#2c2c2c;
  font-weight:bold;
}

.footer-top .social h5.feature a span {
    font-weight: 700
}

.footer-top .social h5.feature:after {
    left: 0;
    margin-top: 0;
    width: 56px
}

.footer-top .space {
  height:21vh;
  clear:both
}

.footer-wrap {
    padding-bottom: 30px
}

footer {
    padding: 125px 0 0;
    position: relative
}

.footer-read-more,
.overlay-footer,
footer,
footer p {
    font: 300 13px/1.35em Brown, sans-serif;
    color: #fff
}

footer .subscribe p:not(.small) {
    font-size: 15px;
    margin-bottom: 0;
    line-height: 1.6em
}

footer .subscribe p.small {
    margin-top: 15px;
    margin-bottom: 115px
}

.booking-panel .subscribe p.small a,
.subscribe-popup .subscribe p.small a,
footer .subscribe p.small a {
    color: #9b9b9b;
    font-weight: 300
}

footer .subscribe .form {
    padding-top: 105px
}

footer .subscribe .form input[type=email] {
    margin-top: 20px;
    width: calc(100% - 160px)
}

footer .subscribe .form button {
    margin-top: 52px;
    position: absolute;
    right: 0
}

footer .contact a:not(.tel) {
    font-weight: 400;
    color: #fff;
}

footer .contact a.tel {
    font-weight: 300
}

footer .contact p {
    margin-bottom: 2.3em
}

footer .contact p:last-child {
    margin-bottom: 0
}

footer .feature::before, footer .feature::after{
  border-color:#fff;
  width:35px;
}

footer .footer-menu a{
  color:#fff;
  font-weight:500;
}

footer ul li{
  list-style:none;
}

footer .weather .weather-intro {
    margin-bottom: 0
}

footer .weather .weather-desc.feature {
    text-transform: capitalize
}

footer .weather .weather-desc.feature:after {
    width: 46px;
    background: #222223;
    margin-top: 2px;
    left: calc(100% + 10px)
}

footer .weather .temp {
    padding-left: 66px
}

.overlay-footer.credits-active .credits.mobile-view ul li,
.overlay-footer.credits-active .credits.mobile-view ul li a:not(.active),
footer.credits-active .credits ul li,
footer.credits-active .credits ul li a:not(.active) {
    color: #dadada
}

footer .credits {
    position: absolute;
    right: 0;
    top: auto;
    width: 30.5%
}

.overlay-footer .credits ul,
footer .credits ul {
    list-style: none;
    margin-top: 83px
}

.overlay-footer .credits ul li,
footer .credits ul li {
    display: inline-block;
    color: #9b9b9b;
    margin-right: 40px
}

.overlay-footer .credits ul li a,
footer .credits ul li a {
    color: #9b9b9b
}

.footer-read-more .centre {
    max-width: none;
    width: 100%
}

.footer-read-more .credits {
    width: 30.5%
}

.footer-read-more ul,
.overlay-read-more ul {
    list-style: none;
    margin-top: 20px
}

.footer-read-more ul li,
.footer-read-more ul li a,
.overlay-read-more .credits ul li,
.overlay-read-more .credits ul li a {
    display: block;
    width: 100%;
    margin: 0 0 8px;
    color: #9b9b9b
}

#instaboxes {
    margin: 13px 0 0;
    text-align: center
}

#instaboxes,
#instaboxes ul {
    width: 100%;
    list-style: none
}

#instaboxes ul {
    display: table
}

#instaboxes ul li {
    position: relative;
    width: calc(50% - 8.5px);
    height: auto;
    min-height: 230px;
    padding: 0;
    float: left;
    display: inline-block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    overflow: hidden;
    margin: 0 17px 0 0
}

#instaboxes ul a:nth-child(2) li {
    margin-right: 0!important
}

#instaboxes ul li img {
    width: 130%;
    margin-left: -15%;
    margin-top: -15%;
    margin-bottom: -15%;
    height: auto;
    display: block
}

.fade,
.slide,
.slider {
    transform: translateZ(0);
    position: relative;
    overflow: hidden
}

.fade .slick-slide,
.slide .slick-slide,
.slider .slick-slide {
    position: relative;
    width: 100%;
    float: left;
    overflow: hidden
}

.fade .slick-slide img,
.slide .slick-slide img,
.slider .slick-slide img {
    width: 100%;
    height: auto
}

.fade .slick-list,
.slide .slick-list,
.slider .slick-list {
    position: relative;
    z-index: 1;
    overflow: hidden
}

a.nav {
    position: absolute;
    width: 40px;
    height: 40px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 999
}

a.nav:before {
    content: none
}

a.nav.prev {
    left: 10px;
    /*background: url("img/system/arrow-left.png") 100% 0 no-repeat;*/
    background-size: cover
}

a.nav.next {
    right: 10px;
    /*background: url("img/system/arrow-right.png") 100% 0 no-repeat;*/
    background-size: cover
}

.slideshow a.nav {
    width: 50%;
    top: 100px;
    height: 80%;
    background: none;
    transform: none
}

.slideshow a.nav.prev {
    left: 0;
    cursor: url("img/system/arrow-left.png"), pointer
}

.slideshow a.nav.next {
    right: 0;
    cursor: url("img/system/arrow-right.png"), pointer
}

.slideshow .fade .slick-dots {
    top: 90vh;
    bottom: auto
}

.fade .slick-dots {
    background: transparent;
    margin: 0;
    padding: 0;
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    z-index: 1050;
    text-align: left;
}

.fade .slick-dots li {
  margin:8px;
  cursor:pointer;
  display:inline-block;
  width:12px;
  height:12px;
  background:hsla(0, 0%, 100%, .4);
  /*background-color:rgba(0,0,0,0.3);*/
  line-height:0;
  border-radius:50%;
}

.fade .slick-dots li button {
    display: none
}

.fade .slick-dots li.slick-active,
.fade .slick-dots li:hover {
  background: hsla(0, 0%, 100%, .8);
  /*background-color:rgba(0,0,0,0.6);*/
}

.fade .slick-dots li:before {
    content: none
}

.slider,
.slider .item {
    transform: translateZ(0)
}

.slider .item {
    position: relative;
    width: 100%;
    float: left;
    display: inline-block;
    overflow: hidden;
    outline: none
}

.slider .item .image {
    width: 100%;
    height: auto
}

.slider .item .image.opacity {
    opacity: .7
}

.map-iframe {
    margin: 10px 0 50px;
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    display: block
}

.map-iframe iframe {
    pointer-events: none
}

.map-iframe iframe.clicked {
    pointer-events: auto
}

.map-iframe embed,
.map-iframe iframe,
.map-iframe object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.google-map {
    position: relative;
    width: 100%;
    height: 700px;
    margin: 10px 0 80px
}

.google-map .map-height {
    position: absolute!important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.ui-datepicker {
    padding: 10px;
    background: #fff;
    font: 300 15px/20px ProximaNova, arial;
    width: 270px!important;
    margin: 10px 0 0;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, .07);
    float: left;
    display: none;
    z-index: 999999!important;
    overflow: hidden
}

.ui-datepicker-header {
    position: relative;
    background: #fff;
    width: 260px;
    height: 45px;
    margin: -5px 0 0 -5px;
    padding: 10px 0;
    color: #fff;
    font-weight: 300;
    text-transform: capitalize
}

.ui-datepicker-group-first .ui-datepicker-header {
    border-top-left-radius: 0
}

.ui-datepicker-group-last .ui-datepicker-header {
    border-top-right-radius: 0
}

.ui-datepicker .ui-datepicker-title {
    color: #b88b5f;
    font: 300 15px/15px Brown, sans-serif;
    line-height: 25px;
    text-align: center
}

.ui-datepicker .ui-datepicker-title select {
    font-size: 1em;
    margin: 1px 0
}

.ui-datepicker select.ui-datepicker-month-year {
    width: 100%
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
    width: 49%
}

.ui-datepicker table {
    width: 100%;
    border-collapse: collapse;
    margin: 0
}

.ui-datepicker th {
    width: 25px;
    padding: 5px;
    color: #696969;
    text-transform: lowercase
}

.ui-datepicker td a,
.ui-datepicker td span {
    display: block;
    padding: 8px 3px;
    text-align: right;
    text-decoration: none
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    font: 300 12px/12px Brown, sans-serif;
    background: #fff;
    font-size: 12px;
    line-height: 20px;
    color: #9b9b9b;
    text-align: center
}

.ui-datepicker thead {
    font: 300 8px/8px Brown, sans-serif;
    letter-spacing: .2em;
    text-transform: uppercase
}

.ui-datepicker thead span {
    color: #9b9b9b;
    text-transform: uppercase
}

.ui-state-active,
.ui-state-focus,
.ui-state-hover,
.ui-widget-content .ui-state-active,
.ui-widget-content .ui-state-focus,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-active,
.ui-widget-header .ui-state-focus {
    background: #b88b5f;
    color: #fff
}

.ui-widget-header .ui-state-hover {
    opacity: .5;
    filter: Alpha(Opacity=50);
    cursor: pointer
}

.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
    color: #fff;
    text-decoration: none
}

.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
    color: #fff
}

.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
    opacity: .5;
    filter: Alpha(Opacity=50);
    cursor: default
}

.ui-icon {
    width: 30px;
    height: 30px;
    text-indent: -99999px;
    overflow: hidden;
    display: block
}

.ui-datepicker .ui-datepicker-prev .ui-icon {
    background: url("https://thebespokecorner.com/wp-content/themes/BespokeCornerTailors/css/img/system/datepicker-arrows.png") 0 no-repeat;
    background-size: 180px
}

.ui-datepicker .ui-datepicker-next .ui-icon {
    background: url("https://thebespokecorner.com/wp-content/themes/BespokeCornerTailors/css/img/system/datepicker-arrows.png") 100% no-repeat;
    background-size: 180px
}

.ui-datepicker .ui-datepicker-next,
.ui-datepicker .ui-datepicker-prev {
    position: absolute;
    top: 7px;
    width: 30px;
    height: 30px
}

.ui-datepicker .ui-datepicker-next:hover,
.ui-datepicker .ui-datepicker-prev:hover {
    background: none
}

.ui-datepicker .ui-datepicker-prev {
    left: 5px
}

.ui-datepicker .ui-datepicker-next {
    right: 5px
}

.popup.video-popup {
    overflow: hidden;
    height: 500px
}

.popup-underlay {
    background: rgba(56, 56, 59, .7);
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 9999
}

.popup,
.popup-underlay {
    position: fixed;
    left: 0;
    display: none
}

.popup {
    background: #fff;
    top: 50%;
    right: 0;
    width: 90%;
    max-width: 900px;
    height: auto;
    max-height: 80%;
    margin: 0 auto;
    padding: 0;
    transform: translateY(-50%);
    overflow-y: scroll;
    z-index: 99999
}

.popup.callback-popup {
    overflow: hidden;
    background: transparent
}

.popup .image img {
    width: 100%;
    height: auto;
    display: block
}

.popup .text {
    padding: 5%
}

.popup .text,
.popup .text h1,
.popup .text h2,
.popup .text h3,
.popup .text h4,
.popup .text li,
.popup .text p {
    text-align: left
}

.popup .text h2 {
    color: #a89a6e;
    font-size: 3.5em
}

.popup .text h2 a {
    color: #a89a6e
}

.popup .text ul {
    margin: 30px 0 0
}

.popup .text li {
    list-style: none;
    padding-left: 20px;
    position: relative
}

.popup .text li:before {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    content: "\E902";
    font-family: Pebble Icons
}

.popup .close {
    background-color: #fff;
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 50px;
    border: none;
    text-align: center;
    -webkit-appearance: none;
    display: block
}

.popup .close:after,
.popup .close:before {
    content: "";
    position: absolute;
    width: 80%;
    height: 1px;
    background-color: #999;
    top: 50%;
    left: 50%
}

.popup .close:before {
    transform: translate(-50%, -50%) rotate(45deg)
}

.popup .close:after {
    transform: translate(-50%, -50%) rotate(-45deg)
}

.popup .close i {
    font-size: 30px;
    line-height: 50px;
    color: #fff;
    display: none
}

.popup .close:hover {
    background-color: #a89a6e
}

.popup .close:hover:after,
.popup .close:hover:before {
    background-color: #fff
}

.promotional-popup-overlay {
    position: fixed;
    background: rgba(56, 56, 59, .7);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    z-index: 99999
}

.promotional-popup {
    position: fixed;
    top: 50%;
    right: 0;
    left: 0;
    width: 100%;
    max-width: 900px;
    height: auto;
    max-height: 80%;
    margin: 0 auto;
    padding: 0;
    transform: translateY(-50%);
    overflow-y: scroll;
    z-index: 999999;
    display: none
}

.promotional-popup .image {
    background-color: #f4f2f1;
    position: relative
}

.promotional-popup .image,
.promotional-popup .image img {
    width: 100%;
    height: auto;
    display: block
}

.promotional-popup .text {
    background-color: #fff;
    padding: 7%;
    text-align: left
}

.promotional-popup .text * {
    transform: translateZ(0)
}

.promotional-popup .text h1,
.promotional-popup .text h2,
.promotional-popup .text h3,
.promotional-popup .text h4,
.promotional-popup .text li,
.promotional-popup .text p {
    text-align: left
}

.promotional-popup .text h2 {
    color: #a89a6e;
    margin: 0 0 30px
}

.promotional-popup .text h2 a {
    color: #a89a6e
}

.promotional-popup .text ul {
    margin: 30px 0 0
}

.promotional-popup .text li {
    list-style: none;
    padding-left: 20px;
    position: relative
}

.promotional-popup .text li:before {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    content: "\E902";
    font-family: Pebble Icons
}

.promotional-popup .text iframe {
    width: 100%;
    height: 0;
    margin: 0;
    padding: 0;
    border: none;
    overflow: hidden;
    display: block;
    clear: both
}

.promotional-popup .text.promotional-subscribe {
    background: url("https://thebespokecorner.com/wp-content/themes/BespokeCornerTailors/css/img/system/textured-bg.jpg");
    background-size: cover
}

.promotional-popup .text.promotional-subscribe h2,
.promotional-popup .text.promotional-subscribe p {
    margin: 0;
    text-align: center;
    color: #fff
}

.promotional-popup .text.promotional-subscribe p {
    margin: 10px 0 0
}

.promotional-popup .text.promotional-subscribe p.terms {
    font-size: 12px;
    margin: 0 0 0 15px;
    display: inline-block
}

.promotional-popup .text.promotional-subscribe p.terms a {
    color: #fff;
    font-weight: 700
}

.promotional-popup .text.promotional-subscribe p.terms a:hover {
    padding: 0;
    background-color: transparent;
    color: #a89a6e
}

.promotional-popup .text.promotional-subscribe form {
    margin: 20px 0 0;
    text-align: center
}

.promotional-popup .text.promotional-subscribe form input[type=email],
.promotional-popup .text.promotional-subscribe form input[type=text] {
    background-color: #fff;
    width: 100%;
    float: none;
    clear: both
}

.promotional-popup .text.promotional-subscribe form input[type=checkbox] {
    width: auto;
    height: auto;
    cursor: pointer
}

.promotional-popup .text.promotional-subscribe form label {
    position: relative;
    cursor: pointer
}

.promotional-popup .text.promotional-subscribe form label:before {
    background-color: transparent;
    position: relative;
    top: -4px;
    margin-right: 5px;
    padding: 8px;
    border: 1px solid #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    vertical-align: middle;
    content: "";
    cursor: pointer;
    display: inline-block
}

.promotional-popup .text.promotional-subscribe form label:hover:before {
    border: 1px solid #a89a6e
}

.promotional-popup .text.promotional-subscribe form input:checked+label:before {
    background-color: #a89a6e;
    border: 1px solid #a89a6e
}

.promotional-popup .text.promotional-subscribe form input:checked+label:after {
    position: absolute;
    top: -4px;
    left: 7px;
    width: 5px;
    height: 13px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    content: "";
    display: block
}

.promotional-popup .text.promotional-subscribe form button {
    margin: 30px 0 0;
    display: inline-block
}

.promotional-popup .close,
.promotional-popup .promotional-close {
    background-color: transparent;
    position: absolute;
    top: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    border: none;
    text-align: center;
    -webkit-appearance: none;
    display: block;
    transform: translateZ(0);
    z-index: 9999999
}

.promotional-popup .close:after,
.promotional-popup .close:before,
.promotional-popup .promotional-close:after,
.promotional-popup .promotional-close:before {
    content: "";
    position: absolute;
    width: 80%;
    height: 1px;
    background-color: #a89a6e;
    top: 50%;
    left: 50%
}

.promotional-popup .close:before,
.promotional-popup .promotional-close:before {
    transform: translate(-50%, -50%) rotate(45deg)
}

.promotional-popup .close:after,
.promotional-popup .promotional-close:after {
    transform: translate(-50%, -50%) rotate(-45deg)
}

.promotional-popup .close i,
.promotional-popup .promotional-close i {
    font-size: 30px;
    line-height: 50px;
    color: #fff;
    display: none
}

.promotional-popup .close:hover,
.promotional-popup .promotional-close:hover {
    opacity: .7
}

.promotional-popup.promotional-content-image .close:after,
.promotional-popup.promotional-content-image .close:before,
.promotional-popup.promotional-content-image .promotional-close:after,
.promotional-popup.promotional-content-image .promotional-close:before,
.promotional-popup.promotional-full .close:after,
.promotional-popup.promotional-full .close:before,
.promotional-popup.promotional-full .promotional-close:after,
.promotional-popup.promotional-full .promotional-close:before,
.promotional-popup.promotional-image-landscape .close:after,
.promotional-popup.promotional-image-landscape .close:before,
.promotional-popup.promotional-image-landscape .promotional-close:after,
.promotional-popup.promotional-image-landscape .promotional-close:before,
.promotional-popup.promotional-image-portrait .close:after,
.promotional-popup.promotional-image-portrait .close:before,
.promotional-popup.promotional-image-portrait .promotional-close:after,
.promotional-popup.promotional-image-portrait .promotional-close:before,
.promotional-popup.promotional-image-subscribe .close:after,
.promotional-popup.promotional-image-subscribe .close:before,
.promotional-popup.promotional-image-subscribe .promotional-close:after,
.promotional-popup.promotional-image-subscribe .promotional-close:before,
.promotional-popup.with-image .close:after,
.promotional-popup.with-image .close:before,
.promotional-popup.with-image .promotional-close:after,
.promotional-popup.with-image .promotional-close:before {
    height: 3px;
    background-color: #fff
}

.promotional-popup.promotional-content-subscribe,
.promotional-popup.promotional-full,
.promotional-popup.promotional-image-subscribe,
.promotional-popup.promotional-subscribe {
    background-color: #f4f2f1
}

.promotional-popup.promotional-image-landscape,
.promotional-popup.promotional-image-portrait {
    background-color: transparent;
    overflow: hidden
}

.promotional-popup.promotional-image-portrait {
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%
}

.promotional-popup.promotional-image-portrait .image {
    background-color: transparent;
    top: 50%;
    height: 100%;
    max-height: 750px;
    transform: translateY(-50%)
}

.promotional-popup.promotional-image-portrait .image img {
    width: auto;
    height: 100%;
    margin: 0 auto;
    display: block
}

.promotional-popup:-webkit-scrollbar-track {
    background-color: #a89a6e
}

::-webkit-scrollbar {
    width: 7px;
    height: 10px
}

::-webkit-scrollbar-track {
    background: #fff
}

::-webkit-scrollbar-thumb {
    background: #c3bfb8;
    box-shadow: none
}

::-webkit-scrollbar-thumb:hover {
    background: #283d5a
}

.promotional-sticky-button {
    position: fixed;
    top: auto;
    right: 0;
    bottom: 35%;
    left: auto;
    transform-origin: top right;
    transform: rotate(-270deg);
    -webkit-font-smoothing: antialiased;
    display: block;
    z-index: 9999
}

.promotional-sticky-button a {
    height: 50px!important;
    padding-top: 0!important;
    padding-bottom: 0!important;
    line-height: 50px!important;
    color: #fff!important;
    border: none!important
}

.promotional-sticky-button a,
.promotional-sticky-button a:after {
    background-color: #777!important
}

.promotional-sticky-button a:hover {
    color: #fff!important
}

.popup::-webkit-scrollbar-thumb,
.popup::-webkit-scrollbar-track {
    background-color: #a89a6e
}

.promotional-popup::-webkit-scrollbar-thumb,
.promotional-popup::-webkit-scrollbar-track {
    background-color: #a89a6e
}

@media only screen and (max-height:900px) {
    .popup,
    .promotional-popup {
        overflow-y: scroll;
        max-height: 100%;
        width: 94%
    }
    .popup .text,
    .promotional-popup .text {
        padding: 30px
    }
    .promotional-sticky-button {
        bottom: 35%
    }
    .promotional-sticky-button a {
        height: 38px!important;
        padding: 0 15px!important;
        font-size: 12px!important;
        line-height: 38px!important
    }
}

@media only screen and (max-width:600px) {
    .popup,
    .promotional-popup {
        width: 100%;
        height: 100%;
        max-height: 100%
    }
    .popup .text,
    .promotional-popup .text {
        padding: 15% 10% 10%
    }
    .popup .text h2 span,
    .promotional-popup .text h2 span {
        display: none
    }
    .popup.promotional-image-landscape .image,
    .promotional-popup.promotional-image-landscape .image {
        top: 50%;
        transform: translateY(-50%)
    }
    .popup.promotional-image-portrait,
    .promotional-popup.promotional-image-portrait {
        overflow: auto
    }
    .popup.promotional-image-portrait .image,
    .promotional-popup.promotional-image-portrait .image {
        height: 100%
    }
    .popup.promotional-image-portrait .image img,
    .promotional-popup.promotional-image-portrait .image img {
        width: 100%;
        height: auto;
        display: block
    }
}

.iframe,
.iframe body {
    background-color: #f2f5ff
}

.iframe body main,
.iframe body main .content {
    max-width: 100%;
    margin: 0;
    padding: 0
}

.iframe body main .content input:not(.button),
.iframe body main .content select:not(.button),
.iframe body main .content textarea:not(.button) {
    background-color: #fff;
    border: 1px solid #dadada
}

.iframe body main .content input:not(.button):focus,
.iframe body main .content input:not(.button):hover,
.iframe body main .content select:not(.button):focus,
.iframe body main .content select:not(.button):hover,
.iframe body main .content textarea:not(.button):focus,
.iframe body main .content textarea:not(.button):hover {
    background-color: #fff
}

@media only screen and (min-width:1060px) {
    .button:hover,
    button:hover {
        background: #3c3c3c;
        color: #fff;
        opacity: 1
    }
    .button.secondary:hover,
    button.secondary:hover {
        border-color: #2c2c2c;
    }
    p a:hover {
        opacity: .8;
        color: #565656;
    }
    .scroll-top a:hover,
    .scroller a:hover {
        opacity: .7
    }
    .toggle-menu:not(.active):hover #pull span:first-child {
        transform: translateY(-2px);
        transition: all .2s ease-in-out
    }
    .toggle-menu:not(.active):hover #pull span:nth-child(2) {
        transform: translateY(2px);
        transition: all .2s ease-in-out
    }
    #menu-overlay .address p a:hover,
    #menu-overlay .contact p a:not(.tel):hover,
    #menu nav ul li a:hover,
    .subscribe-bar a#sub-close:hover,
    .toggle-close.active:hover,
    .toggle-menu.active:hover {
        opacity: .7
    }
    .booking-panel .booking .btn.adults ul li:hover,
    .booking-panel .booking .btn.children ul li:hover {
        background: #b88b5f;
        color: #fff
    }
    .image a:hover img,
    .rooms-list .room-listing a:hover .image {
        opacity: .8
    }
    .content-nav a:hover {
        border-bottom: 2px solid #b88b5f
    }
    .toggle-text .question:hover {
        opacity: .8
    }
    .form .nice-select:hover,
    .form input[type=email]:hover,
    .form input[type=text]:hover,
    .form textarea:hover {
        border-color: #ccc
    }
    .enquire-event-popup a.tel:hover {
        color: #222223
    }
    .footer-read-more ul li a:hover,
    .subscribe-bar p.signup:hover,
    .subscribe-bar p.small a:hover,
    a.nav:hover,
    footer .contact a:not(.tel):hover,
    footer .credits ul li a:hover {
        opacity: .7
    }
    #instafeed a:hover {
        opacity: .8
    }
}

@media only screen and (max-width:1730px) {
    #menu-overlay {
        opacity: 0.5;
    }
    footer {
        padding:40px 0 0
    }
}

@media only screen and (max-width:1600px) {
    .architecture .text,
    .neighbourhood .text,
    .our-story .text {
        padding: 0 30px
    }
    .news-single .news-list .box .image,
    .news .articles .box .image {
        height: 300px
    }
    .news-single .news-list .text {
        height: 112px
    }
}

@media only screen and (max-width:1550px) {
    #menu-overlay {
        padding: 166px 170px 0 227px
    }
    #menu-overlay .address {
        margin-top: 70px
    }
    .booking-panel {
        padding: 70px 50px 0
    }
    .page-id-714 .booking-panel {
        padding: 50% 120px 0
    }
    .booking-panel .booking .form {
        padding: 30px 0 90px
    }
    .subscribe-bar .centre .seven-col {
        width: 68%
    }
    .nightfall .image {
        margin-left: -15px
    }

    .menu nav ul li ul.sub-menu {
    opacity: 0;
    z-index: 1000;
    position: fixed;
    left: 368px;
    top: 294px;
    transform: translateY(10px);

    }
}

@media only screen and (max-width:1500px) {
    .promotions_slider .text {
        top: 20%!important
    }
    .news .articles .text {
        height: 112px
    }
}

@media only screen and (min-width:1401px) {
    #menu.sub-menu-show nav ul li.menu-item-has-children a {
        opacity: 1

    }
    #menu.sub-menu-show nav ul li a {
        opacity: .4
    }
    #menu nav ul li.menu-item-has-children:hover>ul.sub-menu {
        opacity: 1;
        transform: translateY(0)
       
    }
    #menu nav ul li ul.sub-menu a:hover {
        opacity: .7
    }
}

@media only screen and (min-width:1401px) {
    #menu.sub-menu-show nav ul li.menu-item-has-children a {
        opacity: 1
    }
    #menu.sub-menu-show nav ul li a {
        opacity: .4
    }
    #menu nav ul li.menu-item-has-children:hover>ul.sub-menu2 {
        opacity: 1;
        transform: translateY(0)
    }
    #menu nav ul li ul.sub-menu2 a:hover {
        opacity: .7
    }
}

@media only screen and (min-width:1401px) {
    #menu.sub-menu-show nav ul li.menu-item-has-children a {
        opacity: 1
    }
    #menu.sub-menu-show nav ul li a {
        opacity: .4
    }
    #menu nav ul li.menu-item-has-children:hover>ul.sub-menu1 {
        opacity: 1;
        transform: translateY(0)
    }
    #menu nav ul li ul.sub-menu1 a:hover {
        opacity: .7
    }
}



@media only screen and (min-width:1060px) {
    #menu.sub-menu-show nav ul li.menu-item-has-children a {
        opacity: 1

    }
    #menu.sub-menu-show nav ul li a {
        opacity: .4
    }
    #menu nav ul li.menu-item-has-children:hover>ul.sub-menu {
        opacity: 1;
        transform: translateY(0)
       
    }
    #menu nav ul li ul.sub-menu a:hover {
        opacity: .7
    }
}

@media only screen and (min-width:1060px) {
    #menu.sub-menu-show nav ul li.menu-item-has-children a {
        opacity: 1
    }
    #menu.sub-menu-show nav ul li a {
        opacity: .4
    }
    #menu nav ul li.menu-item-has-children:hover>ul.sub-menu2 {
        opacity: 1;
        transform: translateY(0)
    }
    #menu nav ul li ul.sub-menu2 a:hover {
        opacity: .7
    }
}

@media only screen and (min-width:1060px) {
    #menu.sub-menu-show nav ul li.menu-item-has-children a {
        opacity: 1
    }
    #menu.sub-menu-show nav ul li a {
        opacity: .4
    }
    #menu nav ul li.menu-item-has-children:hover>ul.sub-menu1 {
        opacity: 1;
        transform: translateY(0)
    }
    #menu nav ul li ul.sub-menu1 a:hover {
        opacity: .7
    }
}













@media only screen and (max-width:1400px) {
    #menu-overlay {
        padding: 10% 207px 50
    }
    #menu-overlay .address {
        margin-top: 18%
    }
    .booking-panel {
        padding: 10% 100px 0
    }
    .page-id-714 .booking-panel {
        padding: 50% 100px 0
    }
    .booking-panel .booking .form {
        padding: 4% 0 12%
    }
    .subscribe .line-break {
        display: inline
    }
    .nightfall .image {
        margin-left: 70px
    }
    .promotions-page .promotion,
    .retail-page .retail,
    .wellbeing-page .facility {
        width: 48.618784527%;
        float: left;
        margin-left: 2.762430939%
    }
    .promotions-page .promotion:nth-child(3n+1),
    .retail-page .retail:nth-child(3n+1) {
        margin-left: 2.762430939%
    }
    .promotions-page .promotion:nth-child(odd),
    .retail-page .retail:nth-child(odd),
    .wellbeing-page .facility:nth-child(odd) {
        margin-left: 0
    }
    .retail-page .retail .text .desc {
        min-height: 66px
    }
    .wellbeing .facility .text .first,
    .wellbeing .facility .text .last {
        width: 100%;
        float: none;
        margin: 0
    }
    .wellbeing .facility .text .last {
        text-align: left;
        margin: 15px 0 0
    }
}

@media only screen and (max-width:1350px) {
    .corporate .image.six-col.first,
    .events .image.six-col.last,
    .single-room .image.six-col.last,
    .weddings .image.six-col.last {
        margin-top: -105px
    }
    .single-room .junior-suite .image.six-col.last {
        margin-top: 0
    }
    .footer-read-more .credits,
    footer .credits,
    footer .social {
        width: 38%
    }
    .promotions_slider .text {
        top: 10%!important
    }
    .promotions_slider .eight-col {
        width: 70%!important
    }
}

@media only screen and (max-width:1300px) {
    footer {
        padding: 125px 0 0
    }
    footer .subscribe {
        width: 45%
    }
    footer .subscribe p.small {
        margin-bottom: 85px
    }
    footer .subscribe .form {
        padding-top: 45px
    }
    .news-single .news-list .text {
        height: 130px
    }
    .wellbeing .facility .text .desc {
        min-height: 0
    }
}

@media only screen and (max-width:1240px) {
    .promotions_slider .eight-col {
        width: 100%
    }
    body.friends_of_calile main {
        padding: 170px 0 0
    }
    .promotions_slider .text {
        top: 15%!important
    }
    body.booking-active,
    body.menu-active {
        overflow: hidden
    }
    main {
        padding: 30px 0 0
    }
    .h2,
    h2 {
        font: 300 26px/1.3em din-2014, sans-serif;
        margin: 1em 0 .8em
    }
    p {
        font: 300 14px/1.4em din-2014, sans-serif;
    }
    .home-intro .text p,
    p.intro {
        font: 300 13px/1.4em din-2014, sans-serif
    }
    .feature:after {
        width: 88px
    }
    .menu-wrap .centre,
    header .centre {
        width: calc(100% - 80px)
    }
    header .logo {
        padding-top: 18px
    }
    header .logo img {
        width: 200px
    }
    header .checkavailability {
        right: 0
    }
    #menu-overlay {
        padding: 140px 120px 0
    }
    .booking-panel {
        padding: 100px 80px 0
    }
    #menu-overlay .address {
        margin-top: 70px
    }
    .booking-panel .booking .form {
        padding: 10px 0 80px
    }
    .toggle-menu.active {
        left: 40px
    }
    .scroller,
    header.fixed .checkavailability {
        right: 40px
    }
    .scroller {
        bottom: 20px
    }
    .scroll-top {
        right: 40px;
        bottom: 80px
    }
    .apartments .text .vert-centre {
        max-width: 400px
    }
    .accommodation .text .inner,
    .dining .text .vert-centre,
    .facilities .text .inner,
    .nightfall .text .vert-centre {
        max-width: 300px
    }
    .slideshow a.nav {
        top: 50%;
        width: 40px;
        height: 40px;
        transform: translateY(-50%);
        cursor: pointer
    }
    .slideshow a.nav.prev {
        left: 10px;
        background: url("img/system/arrow-left.png") 100% 0 no-repeat;
        background-size: cover
    }
    .slideshow a.nav.next {
        right: 10px;
        background: url("img/system/arrow-right.png") 100% 0 no-repeat;
        background-size: cover
    }
    .retail-page .retail .text .desc {
        min-height: 76px
    }
    footer .subscribe p:not(.small) {
        font-size: 13px
    }
    .subscribe-bar h3 {
        left: 40px;
        margin: 1.2em 0 0
    }
    .subscribe-bar .centre {
        margin-left: 200px
    }
}

@media only screen and (max-width:1170px) {
    footer .social h5.feature .mobile-break {
        display: block
    }
    footer .address {
        margin-right: -50px
    }
    footer .contact .first {
        width: 60%
    }
    footer .contact .last {
        width: 40%
    }
    .overlay-footer .credits ul li,
    footer .credits ul li {
        margin-right: 30px
    }
    .subscribe-bar .centre .seven-col {
        width: 78%
    }
    #lookforsymbol .features:before {
        width: 30px
    }
}

@media only screen and (max-width:1062px) {
    body.friends_of_calile .five-col {
        width: 50%
    }
    .page-id-787 .ten-col .seven-col .ten-col {
        margin-top: -250px
    }
}

@media only screen and (max-width:1059px) {
    #lookforsymbol .features {
        padding-left: 20px
    }
    .friends.centre.clearfix .two-col.first.clearfix.animate-up.in-view {
        width: 100%!important
    }
}

@media only screen and (max-width:1023px) {
    footer {
        padding: 52px 0 0
    }
    .footer-wrap {
        padding-bottom: 52px
    }
    .footer-top .space {
        display: none
    }
    .footer-read-more,
    .overlay-footer,
    footer,
    footer p {
        font: 300 11px/1.35em Brown, sans-serif
    }
    footer .subscribe {
        display: none
    }
    footer .contact {
        margin-left: 0;
        float: left;
        width: 100%
    }
    footer .contact p {
        margin-bottom: 0
    }
    footer .contact .weather {
        display: none
    }
    footer .contact .address p {
        margin-bottom: 30px
    }
    footer .contact .address p:first-child {
        margin-bottom: 0
    }
    footer .contact .subscribe-link {
        display: block;
        position: absolute;
        bottom: 0;
        right: 0
    }
    footer .contact .subscribe-link .feature {
        position: relative;
        padding-left: 30px
    }
    footer .contact .subscribe-link .feature:after {
        background: #222223;
        left: 0;
        margin-top: 1px;
        width: 25px
    }
    footer .social {
        position: relative;
        width: 100%;
        top: auto;
        right: auto;
        margin-bottom: 20px
    }
    footer .social h5.feature {
        padding-left: 0
    }
    footer .social h5.feature:after {
        left: calc(100% - 45px);
        top: 22px;
        width: 45px
    }
    footer .social h5.feature .mobile-break {
        display: block
    }
    footer .social #instaboxes {
        display: none
    }
    footer .address {
        margin-left: 0;
        float: none;
        width: 100%;
        margin-right: auto
    }
    footer .contact .first {
        width: 48.618784527%
    }
    footer .subscribe .form button {
        margin-top: 20px;
        position: relative
    }
    footer .credits {
        margin-left: 0;
        float: left;
        width: 100%;
        right: auto;
        position: relative
    }
    footer .credits ul {
        margin-right: 0
    }
    .overlay-footer .credits ul,
    footer .credits ul {
        margin-top: 30px
    }
    footer .credits ul li {
        width: auto;
        margin-right: 20px
    }
    .footer-read-more .centre {
        width: 80%
    }
    .footer-read-more .credits {
        width: 100%
    }
    .footer-read-more ul,
    footer .credits ul {
        margin-left: 0
    }
}

@media only screen and (max-width:980px) {
    .friends.centre.clearfix .ten-col.last.clearfix.animate-up.in-view {
        width: 100%!important
    }
    main {
        padding: 30px 0 0
    }
    .centre {
        width: 86%
    }
    .h2,
    h2 {
        font: 300 22px/1.3em din-2014, sans-serif;
        margin: 1em 0 .5em
    }
    body,
    p {
        font: 300 13px/1.4em din-2014, sans-serif;
    }
    main ul li {
        font-size: 13px
    }
    .feature:after {
        width: 70px
    }
    .internal main h1,
    .internal main h2 {
        font-size: 16px
    }
    .internal main h1 {
        margin: 0 0 1.9em
    }
    main.news-main h1 {
        font-size: 19px;
        margin: 0 0 .2em
    }
    .internal main h3,
    .rooms-list .room-listing h3 {
        font-size: 12px
    }
    .form input[type=email],
    .form input[type=text],
    .form select,
    .form textarea,
    .subscribe-bar .form input[type=email],
    .subscribe-bar .form input[type=text],
    .wpcf7-mail-sent-ng,
    .wpcf7-spam-blocked,
    .wpcf7-validation-errors,
    div.wpcf7-response-output,
    input.wpcf7-not-valid {
        font-size: 13px
    }
    p.small {
        font-size: 11px
    }
    .button,
    button {
        padding: 12px 22px
    }
    header {
        position: absolute
    }
    header,
    header .checkavailability {
        z-index: 99999
    }
    body.menu-active .menu-wrap,
    body.menu-active header {
        position: fixed
    }
    body.booking-active .logo,
    body.booking-active .menu-wrap .toggle-menu,
    body.booking-active header .checkavailability,
    body.menu-active .logo {
        display: none
    }
    .menu-wrap .centre,
    header .centre {
        width: 100%
    }
    header .logo img {
        width: 160px
    }
    header .checkavailability span {
        display: none
    }
    .toggle-close,
    .toggle-menu {
        top: -5px;
        left: 15px;
        right: auto
    }
    .toggle-menu.active {
        left: 15px
    }
    a#pull,
    a#pull-close,
    a#sub-close {
        width: 32px
    }
    .subscribe-popup .toggle-close a#pull-close span:first-child,
    .toggle-close.active a#pull-close span:first-child,
    .toggle-close a#sub-close span:first-child,
    .toggle-menu.active a#pull span:first-child {
        top: 0
    }
    .subscribe-popup .toggle-close a#pull-close span:nth-child(2),
    .toggle-close.active a#pull-close span:nth-child(2),
    .toggle-close a#sub-close span:nth-child(2),
    .toggle-menu.active a#pull span:nth-child(2) {
        top: 23px
    }
    #menu-overlay {
        padding: 70px 0 0;
        width: 100%
    }
    #menu-overlay #menu {
        width: 76%;
        margin: auto;
        padding-bottom: 40px
    }
    #menu nav ul li {
        margin: 0 0 6px
    }
    #menu-overlay #menu nav ul li a {
        font-size: 21px
    }
    #booking-overlay .address,
    #menu-overlay .address {
        margin-top: 40px
    }
    #booking-overlay .address p,
    #booking-overlay .contact p,
    #menu-overlay .address p,
    #menu-overlay .contact p {
        font-size: 11px
    }
    #booking-overlay .contact,
    #menu-overlay .contact {
        margin-top: 30px
    }
    #booking-overlay {
        width: 100%;
        left: 0;
        z-index: 9999
    }
    .booking-panel {
        padding: 115px 0 0
    }
    .page-id-714 .booking-panel {
        padding: 300px 0 0
    }
    .booking-panel .booking,
    .booking-panel .subscribe {
        width: 76%;
        margin: auto
    }
    .booking-panel .booking,
    .booking-panel .subscribe .line-break {
        display: block
    }
    .booking-panel .booking .form {
        padding: 40px 0 80px
    }
    header.fixed .checkavailability {
        right: 0
    }
    .overlay-footer {
        padding: 50px 0 22px
    }
    .overlay-footer .inner {
        margin: auto;
        width: 76%
    }
    .overlay-footer p {
        margin: 0
    }
    .overlay-footer .credits.mobile-view {
        position: relative
    }
    .overlay-read-more .credits ul {
        margin-top: 20px
    }
    .overlay-read-more .credits ul li:last-child {
        width: 100%;
        float: none
    }
    .overlay-footer .contact .subscribe-link {
        display: block;
        position: absolute;
        bottom: 0;
        right: 0
    }
    .overlay-footer .contact .subscribe-link .feature {
        position: relative;
        padding-left: 30px
    }
    .overlay-footer .contact .subscribe-link .feature:after {
        background: #222223;
        left: 0;
        margin-top: 1px;
        width: 25px
    }
    .scroller,
    body.scroll .scroll-top {
        display: none
    }
    .hero img {
        margin-left: -30%
    }
    .accommodation .text .inner,
    .dining .text .vert-centre,
    .facilities .text .inner,
    .nightfall .text .vert-centre {
        max-width: 245px
    }
    .content-nav,
    .meetings h1,
    .news h1 {
        display: block
    }
    .content-nav {
        margin-left: 0
    }
    .toggle-text .question:after {
        width: 16px
    }
    .toggle-text .question:before {
        top: 12px;
        right: 28px;
        height: 16px
    }
    .promotions-page .row h2,
    .retail-page .row h2,
    .wellbeing-page .row h2 {
        margin: 1em 0
    }
    .promotions-page .promotion .text .button span,
    .retail-page .retail .text .button span,
    .retail-page .retail .text .desc,
    .retail-page .retail .text .subcategory,
    .wellbeing-page .facility .text .desc {
        display: none
    }
    .footer-read-more .centre {
        width: 86%
    }
    .form input::-webkit-input-placeholder {
        font-size: 13px
    }
    .form input:-moz-placeholder,
    .form input::-moz-placeholder {
        font-size: 13px
    }
    .form input:-ms-input-placeholder {
        font-size: 13px
    }
    .enquire-event-popup .form .radio-right,
    .enquire-event-popup .form label {
        font-size: 13px
    }
    form.wpcf7-form .ajax-loader {
        margin: 15px 20px
    }
    .enquire-event-popup {
        padding: 30px 50px
    }
    .enquire-event-popup h3 {
        font-size: 12px
    }
    .enquire-event-popup h1 {
        font-size: 20px
    }
    .subscribe-form h3 {
        font-size: 16px!important
    }
}

@media only screen and (max-width:838px) {
    body.friends_of_calile .five-col {
        width: 55%
    }
    .floorplan .slider .item .image {
        width: 100%
    }
    .floorplan {
        padding: 100px 0
    }
    .page-id-787 .ten-col .seven-col .ten-col {
        margin-top: -200px
    }
}

@media only screen and (max-width:767px) {
    #lookforsymbol {
        display: -ms-inline-flexbox!important;
        display: inline-flex!important
    }
    #lookforsymbol .features:before {
        display: -ms-inline-flexbox;
        display: inline-flex;
        width: 30px
    }
    #lookforsymbol .features {
        padding-left: 0
    }
    body.friends_of_calile .five-col {
        width: 100%
    }
    body.friends_of_calile a.nav {
        visibility: visible
    }
    .friendsofcalilefooter .four-col.last {
        right: 0
    }
    .promotions_slider .text {
        position: relative;
        float: none!important;
        margin: auto;
        width: 80%
    }
    .promotions_slider .image {
        max-width: 80%;
        float: none!important;
        margin: auto
    }
    .home main {
        padding: 40px 0
    }
    .animate-up {
        opacity: 0;
        transition: all 1.2s ease-out;
        transform: translate3d(0, 50, 0);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }
    .feature:after {
        width: 80px
    }
    .eight-col,
    .eleven-col,
    .five-col,
    .four-col,
    .nine-col,
    .one-col,
    .seven-col,
    .six-col,
    .ten-col,
    .three-col,
    .twelve-col,
    .two-col {
        width: 100%;
        float: none;
        margin-left: 0
    }
    .columns {
        display: inline-block
    }
    .vert-centre {
        position: relative;
        top: auto;
        transform: none;
        -webkit-transform: none
    }
    .desktop-view {
        display: none
    }
    .mobile-break,
    .mobile-view {
        display: block
    }
    header .checkavailability {
        right: 0;
        padding: 12px 14px
    }
    #menu-overlay {
        padding: 60px 0 0
    }
    #menu-overlay .sticky-curate {
        position: absolute;
        top: 0;
        bottom: auto;
        right: 69px;
        z-index: 9998;
    }
    #menu-overlay .sticky-curate .button {
        padding: 12px 14px;
        border: none
    }
    #menu-overlay #menu {
        width: 86%;
        padding-bottom: 0
    }
    #booking-overlay .address,
    #menu-overlay .address {
        margin-top: 0
    }
    .booking-panel {
        padding: 105px 0 0
    }
    .overlay-footer {
        padding: 10px 0 35px;
        position: absolute;
        width: 100%;
        bottom: 0
    }
    .booking-panel .booking,
    .booking-panel .subscribe,
    .overlay-footer .inner {
        width: 86%
    }
    .booking-panel .booking .form {
        padding: 30px 0 0
    }
    .booking-panel .form input {
        margin-top: 10px
    }
    .booking-panel button {
        margin-top: 15px
    }
    .booking-panel .booking .btn.adults ul,
    .booking-panel .booking .btn.children ul {
        top: 45px
    }
    .hero img {
        margin-left: -50%
    }
    .home-intro .greeting {
        width: 100%
    }
    .home-intro .greeting .h2 {
        margin: 0 0 .25em
    }
    .home-intro .text {
        width: 100%;
        margin-left: 0
    }
    .accommodation .text .inner,
    .dining .text .vert-centre,
    .facilities .text .inner,
    .nightfall .text .vert-centre {
        max-width: 312px
    }
    .accommodation {
        padding: 0 0 140px
    }
    .accommodation .centre {
        width: 100%
    }
    .accommodation .text {
        margin: 20px auto 40px;
        width: 86%
    }
    .accommodation .text img {
        width: 200px;
        position: absolute;
        left: -74px;
        top: 463px
    }
    .accommodation .image.six-col {
        margin-left: auto;
        width: 60%;
        margin-right: 0
    }
    .facilities .centre {
        width: 100%
    }
    .facilities .text {
        margin: 0 auto 40px;
        width: 86%
    }
    .facilities .image.last:not(.illustration) {
        width: 50%;
        padding-left: 0;
        margin: 0 0 0 auto
    }
    .facilities .image.first {
        width: calc(50% + 30px);
        margin-top: -15px
    }
    .facilities .image.last.illustration {
        width: 50%;
        padding-top: 0;
        padding-left: 0;
        position: absolute;
        right: 0;
        bottom: -520px
    }
    .dining {
        padding: 50px 0 0
    }
    .dining .vert-centre {
        top: auto
    }
    .dining .centre {
        width: 100%
    }
    .dining .text {
        margin: 0 auto 185px;
        width: 86%
    }
    .dining .image.last {
        width: calc(56% + 10px)
    }
    .nightfall {
        padding: 50px 0 0
    }
    .nightfall .centre,
    .nightfall .columns {
        width: 100%
    }
    .nightfall .text {
        margin: 0 auto 40px;
        width: 86%
    }
    .nightfall .image {
        margin-top: 0;
        margin-left: 0;
        max-width: 50%;
        float: right
    }
    .apartments {
        padding: 40px 0 110px
    }
    .apartments .text .vert-centre {
        max-width: none
    }
    .apartments h2 {
        text-align: center;
        margin-bottom: 20px
    }
    .apartments .text p {
        display: none
    }
    .apartments .image img {
        margin: auto;
        max-width: 70%
    }
    .internal .row {
        padding: 20px 0 48px
    }
    .internal p.cta {
        margin-top: 20px
    }
    .content-nav {
        font-size: 13px
    }
    .content-nav a {
        margin: 0 2px
    }
    .internal .hero,
    .slideshow {
        max-height: 60vh;
        height: 60vh
    }
    .neighbourhood-page .hero {
        max-height: 80vh;
        height: 80vh
    }
    .internal .hero img {
        min-height: 0;
        margin-left: -800px
    }
    .neighbourhood-page .hero img {
        margin-top: -120px
    }
    .slideshow .fade .slick-slide img {
        height: 60vh
    }
    .rooms-list .room-listing h3 {
        margin-top: 18px
    }
    .accomm-detail {
        padding: 5px 0 30px
    }
    .accomm-detail .row {
        padding-bottom: 10px
    }
    .single-room {
        padding-bottom: 0
    }
    main .single-room h1 {
        margin: 0 0 .7em
    }
    .single-room .ten-col.image {
        margin-top: 0
    }
    .single-room .features {
        margin-bottom: 10px;
        margin-top: 0
    }
    .single-room .centre.magazine-style {
        width: 100%
    }
    .single-room .centre.magazine-style .seven-col {
        margin-bottom: 0
    }
    .single-room .image.six-col.last {
        margin-top: 3px;
        float: right;
        max-width: 60%
    }
    .single-room .image.six-col.first {
        margin-top: 20px;
        max-width: 55%
    }
    .single-room .image.nine-col {
        margin-top: 20px;
        float: right;
        max-width: 80%
    }
    .single-room .magazine-style .image.nine-col {
        margin: 0
    }
    .single-room .image.last-img {
        float: left;
        max-width: 80%
    }
    .single-room .magazine-style .image.main {
        float: right;
        max-width: 95%;
        margin: 0 0 20px
    }
    .single-room .btn1 {
        display: none
    }
    .more-rooms .room-listing {
        width: 47%;
        float: left
    }
    .rooms-list .room-listing:nth-child(3n) {
        float: left
    }
    .rooms-list .room-listing:nth-child(2n) {
        float: right
    }
    .more-rooms .rooms-list .room-listing {
        margin-bottom: 30px
    }
    .news .content-nav .nav-intro {
        display: block;
        margin-bottom: 1.2em
    }
    .news .content-nav a {
        margin: 0
    }
    .news-single .news-list .box,
    .news-single .news-list .box:nth-child(8),
    .news .articles .box,
    .news .articles .box:first-child,
    .news .articles .box:nth-child(10) {
        width: 100%
    }
    .latest-news .articles .box,
    .news-single .news-list .box {
        padding: 0 0 25px 25px!important
    }
    .latest-news .articles .box,
    .news-single .news-list .box p {
        min-height: 0
    }
    .news-single .news-list .box {
        padding: 0 0 25px
    }
    .latest-news .articles .box:nth-child(13n+1),
    .latest-news .articles .box:nth-child(13n+6),
    .latest-news .articles .box:nth-child(13n+7),
    .latest-news .articles .box:nth-child(13n+8),
    .latest-news .articles .box:nth-child(13n+10),
    .latest-news .articles .box:nth-child(13n+11),
    .latest-news .articles .box:nth-child(13n+12),
    .latest-news .articles .box:nth-child(13n+13),
    .news-single .news-list .box:nth-child(4),
    .news-single .news-list .box:nth-child(5),
    .news-single .news-list .box:nth-child(6),
    .news-single .news-list .box:nth-child(8),
    .news-single .news-list .box:nth-child(9),
    .news-single .news-list .box:nth-child(10),
    .news-single .news-list .box:nth-child(11) {
        width: 100%
    }
    .news-single .news-list .box .image,
    .news .articles .box .image {
        height: auto
    }
    .rooms-list .room-listing {
        margin-bottom: 25px
    }
    .news-single .news-list .text,
    .news .articles .text {
        height: auto
    }
    .news-single .seven-col {
        width: 100%;
        margin-bottom: 2.7em
    }
    .news-single .toggle-close {
        top: -10px
    }
    .meetings .ten-col.image {
        margin: 20px 0
    }
    .meetings .centre.magazine-style {
        width: 100%
    }
    .events .image.six-col.last,
    .weddings .image.six-col.last {
        margin-top: 20px;
        float: right;
        max-width: 60%
    }
    .events .image.six-col.first,
    .weddings .image.six-col.first {
        margin-top: 20px;
        max-width: 60%
    }
    .meetings .nine-col {
        margin-top: 20px
    }
    .meetings .nine-col .six-col.first {
        width: 48%;
        float: left
    }
    .meetings .nine-col .six-col.last {
        width: 48%;
        float: right
    }
    .corporate .image.six-col.last {
        float: right;
        max-width: 60%
    }
    .corporate .image.six-col.first {
        max-width: 60%;
        margin-top: 20px
    }
    .corporate .nine-col {
        float: right;
        width: 80%
    }
    .retail-page main h1 {
        margin: 0 0 20px
    }
    .retail-page .retail .text .button {
        font-size: 11px;
        padding: 12px;
        margin: 10px 0 5px!important
    }
    .promotions-page main h1 {
        margin: 0 0 20px
    }
    .promotions-page .row {
        padding: 20px 0 0
    }
    .promotions-page .text .button {
        font-size: 11px;
        padding: 12px;
        margin: 0 0 5px
    }
    .wellbeing {
        padding: 35px 0 0
    }
    .wellbeing .fade {
        padding: 15px 0 0
    }
    .wellbeing-page .wellbeing .row {
        padding: 20px 0 0
    }
    .wellbeing .centre.magazine-style {
        width: 100%
    }
    .wellbeing .image.six-col.last {
        margin-top: -40px;
        float: right;
        max-width: 60%
    }
    .wellbeing .image.six-col.first {
        margin-top: 20px;
        max-width: 55%
    }
    .wellbeing .image.nine-col {
        margin-top: 20px;
        float: right;
        max-width: 60%
    }
    .wellbeing .magazine-style .image.main {
        float: left;
        max-width: 95%
    }
    .wellbeing .magazine-style .image.eight-col.last {
        margin: 0 0 25px;
        max-width: 70%;
        float: right
    }
    .wellbeing .facility .text {
        padding: 5px 0 15px
    }
    .wellbeing .facility .text .desc {
        margin: 0 0 10px
    }
    .wellbeing .facility .text .button {
        font-size: 11px;
        padding: 12px;
        margin: 0 0 5px
    }
    .gymnasium {
        padding: 35px 0 0
    }
    .gymnasium .gym .text .desc {
        min-height: auto
    }
    .gymnasium .magazine-style .ten-col.last .five-col.last.image {
        margin: 0 0 50px;
        max-width: 70%;
        float: right
    }
    .gymnasium .image.six-col.first {
        margin-top: 20px;
        max-width: 55%
    }
    .gymnasium .magazine-style .text {
        display: none
    }
    .neighbourhood {
        padding: 35px 0
    }
    .internal .neighbourhood h1 {
        margin: 0 0 1em
    }
    .neighbourhood .centre.magazine-style {
        width: 100%
    }
    .architecture .text,
    .meetings .magazine-style .text,
    .neighbourhood .text,
    .our-story .text,
    .single-room .magazine-style .text,
    .wellbeing .magazine-style .text {
        display: none
    }
    .neighbourhood .image.main {
        margin: 20px auto 0;
        width: 86%
    }
    .neighbourhood .image.six-col.last {
        margin-top: 20px;
        float: right;
        max-width: 65%
    }
    .neighbourhood .image.six-col.first {
        margin-top: 20px;
        max-width: 65%
    }
    .neighbourhood .magazine-style .image.main {
        margin-top: 20px;
        float: right;
        max-width: 86%
    }
    .internal .our-story h1 {
        margin: 0
    }
    .architecture,
    .architecture .row,
    .our-story .row {
        padding: 10px 0 0
    }
    .architecture .centre.magazine-style,
    .our-story .centre.magazine-style {
        width: 100%
    }
    .our-story .image.main {
        margin: 20px 0 0 auto;
        width: 86%
    }
    .architecture .image.main {
        margin: 20px auto 0 0;
        width: 86%
    }
    .architecture .image.six-col.last,
    .our-story .image.six-col.last {
        margin-top: 20px;
        float: right;
        max-width: 60%
    }
    .architecture .image.six-col.first,
    .our-story .image.six-col.first {
        margin-top: 20px;
        max-width: 50%
    }
    .our-story .image.six-col.middle {
        margin: 20px auto 0 0;
        width: 86%
    }
    .architecture .image.six-col.middle {
        margin: 20px 0 0 auto;
        width: 86%
    }
    .faqs {
        margin-bottom: 40px
    }
    .column {
        float: unset;
        width: 100%;
        padding: 0
    }
    .toggle-content {
        display: block
    }
    .terms .feature:after,
    .toggle-text .feature:after {
        width: 44px
    }
    .toggle-content .six-col:nth-last-child(2) {
        border-bottom: none
    }
    a.nav {
        visibility: hidden
    }
    footer {
        padding: 47px 0 0
    }
    .footer-wrap {
        padding-bottom: 22px
    }
    .subscribe-popup {
        padding: 30px 30px 90px
    }
    .subscribe-popup .subscribe .form input,
    .subscribe-popup .subscribe .form input[type=email] {
        width: 100%;
        height: 30px
    }
    .subscribe-popup .subscribe button {
        bottom: -60px
    }
    .subscribe-popup .subscribe .form input {
        margin-top: 15px
    }
    .subscribe-bar .centre {
        margin-left: auto
    }
    .subscribe-bar .centre .seven-col {
        width: 100%
    }
    .subscribe-bar h3 {
        position: relative;
        left: 7%;
        margin: 0 0 1em
    }
    .subscribe-bar .form input[type=email] {
        margin: 10px 0
    }
    .subscribe-bar.thankyou p.text {
        padding-left: 0
    }
    .enquire-event-popup {
        padding: 30px 25px
    }
    .enquire-event-popup .form .nice-select,
    .enquire-event-popup .form input[type=email],
    .enquire-event-popup .form input[type=text] {
        width: 100%
    }
    .enquire-event-popup .form input.state {
        margin-left: 0;
        width: 27%
    }
    .enquire-event-popup .form input.country {
        margin-left: 3%;
        width: 70%
    }
    .enquire-event-popup .form input[type=radio] {
        margin-left: 20px;
        margin-right: 5px
    }
    .subscribe-bar .form button {
        margin: 5px 0 0;
        float: none
    }
    .fade .slick-dots {
        bottom: 0
    }
    .slideshow .fade .slick-dots {
        top: auto;
        bottom: 10px
    }
    .floorplan .slick-dots {
        margin-top: auto;
        top: 0;
        column-count: 3;
        right: 0;
        left: 0
    }
    .floorplan table {
        font: 300 13px/1.4em Brown, sans-serif
    }
    .floorplan .slider .item .image {
        margin-top: 180px
    }
    .floorplan .slider .item .six-col.last.text {
        padding-top: 50px
    }
    .page-id-787 .floorplan .slick-dots {
        margin-top: 0
    }
    .page-id-785 .ten-col .seven-col .six-col.first {
        width: 48%;
        float: left
    }
    .page-id-785 .ten-col .seven-col .six-col.last {
        width: 48%;
        float: right
    }
    .page-id-787 .ten-col .seven-col .six-col.first {
        width: 48%;
        float: left
    }
    .page-id-787 .ten-col .seven-col .six-col.last {
        width: 48%;
        float: right
    }
    .page-id-787 .ten-col .seven-col .ten-col {
        margin-top: 0
    }
    .page-id-787 .meetings .corporate .magazine-style .ten-col.event.last {
        margin-top: -70px
    }
}

@media only screen and (max-width:665px) {
    .floorplan .slick-dots {
        column-count: 2
    }
    .floorplan .slider .item .image {
        margin-top: 270px
    }
}

@media only screen and (max-width:582px) {
    .friends .content-nav a,
    .friends .content-nav a.active {
        border-bottom: 2px solid #fff
    }
}

@media only screen and (max-width:480px) {
    .hero .desktop-hero {
        display: none
    }
    .hero .mobile-hero {
        display: block!important;
        margin-left: -6%
    }

     .hero .mobile-hero1 {
        display: block!important;
        max-width: 102%;
    display: block;
    height: auto;
    }
    .internal .hero img {
        margin-left: -1050px
    }
    .neighbourhood-page .hero img {
        margin-left: -550px
    }
    footer .credits ul li {
        width: 30%;
        margin-right: 0
    }
    .overlay-footer .credits ul li:last-child,
    footer .credits ul li:last-child {
        width: auto;
        float: right
    }
}

@media only screen and (max-width:440px) {
    .floorplan .slick-dots {
        column-count: 1
    }
    .floorplan .slider .item .image {
        margin-top: 450px
    }
}

@media only screen and (max-width:396px) {
    #lookforsymbol .features:before {
        display: none
    }
    #lookforsymbol .features {
        text-align: center;
        margin: auto;
        display: -ms-inline-flexbox;
        display: inline-flex;
        margin-top: 20px!important
    }
    #lookforsymbol img {
        text-align: center;
        margin: auto
    }
    #lookforsymbol {
        display: -ms-grid!important;
        display: grid!important
    }
}

@media only screen and (max-height:515px) {
    #menu-overlay {
        overflow-y: scroll
    }
    .overlay-footer {
        position: relative
    }
}


@media only screen and (min-device-width: 375px) 
and (max-device-width: 667px){
#menu nav ul li ul.sub-menu {
    opacity: 30;
    z-index: 1000;
    position: initial;
    left: 12px;
    top: 280px;
    transform: translateY(10px)
    }

}

@media only screen and (min-device-width: 375px) 
and (max-device-width: 667px){
#menu nav ul li ul.sub-menu1 {
    opacity: 30;
    z-index: 1000;
   
    left: 230px;
    top: 175px;
    transform: translateY(10px)
    }
}

 @media only screen and (min-device-width: 375px) 
 and (max-device-width: 667px){ 
  #menu nav ul li ul.sub-menu2 {
    opacity: 30;
    z-index: 1000;
    position: fixed;
    left: 188px;
    top: 202px;
    border:         none;
    border-left:    2px solid white;
    height:         10vh;
    width:          1px;  
       
    }
}